/* Beethoven Music School: additions on top of the SolMusic theme */
.hero-slider .hr-img img{max-width:100%}
.hs-item .hs-text .rating{display:inline-block;margin-top:6px;color:#fff;opacity:.75;font-size:13px;font-weight:500}
.hs-item .hs-text .rating i{color:#ffb000;margin-right:2px}
.intro-section .stats{margin-top:70px}
.stat{text-align:center;padding:10px 0 30px}
.stat .num{font-size:56px;font-weight:700;color:#d62227;line-height:1}
.stat p{margin:10px 0 0;font-weight:600;color:#262523}
.inst-card{background:#fff;border-radius:40px;padding:36px 28px;text-align:center;margin-top:35px;box-shadow:0 10px 40px rgba(10,24,61,.08);transition:transform .25s,box-shadow .25s;height:calc(100% - 35px)}
.inst-card:hover{transform:translateY(-8px);box-shadow:0 18px 50px rgba(214,34,39,.18)}
.inst-card .ic{width:110px;height:110px;border-radius:34px;background:#262523;margin:0 auto 24px;display:flex;align-items:center;justify-content:center}
.inst-card .ic svg{width:70px;height:70px;fill:none;stroke:#d62227;stroke-width:3.5;stroke-linecap:round;stroke-linejoin:round}
.inst-card h5{margin-bottom:10px}
.inst-card p{font-size:14px;margin-bottom:14px}
.inst-card a{color:#d62227;font-weight:600;font-size:14px}
.how-section .container{position:relative}
.sub-list li{display:flex;align-items:center}
.sub-list{padding-left:70px}
.why-item{text-align:center;padding-top:35px}
.why-item .wi{width:130px;height:130px;border-radius:50%;background:#f5f2ef;color:#d62227;font-size:48px;display:flex;align-items:center;justify-content:center;margin:0 auto 30px;transition:background .25s,color .25s}
.why-item:hover .wi{background:#d62227;color:#fff}
.why-item h4{margin-bottom:8px}
.why-item p{margin-bottom:0}
/* piano */
.piano-section{height:230vh;background:#262523;position:relative}
.piano-stick{position:sticky;top:0;height:100vh;display:flex;align-items:center}
.piano-stick h2{color:#fff;font-size:48px;line-height:1.1;margin-bottom:16px}
.piano-stick p{color:#fff;opacity:.65;max-width:560px;margin-bottom:34px}
.piano{position:relative;display:flex;height:min(240px,32vw);min-height:140px;user-select:none;touch-action:manipulation}
.piano .wk{flex:1;background:#fff;border:1px solid #b3aea8;border-radius:0 0 10px 10px;padding:0;cursor:pointer;transition:transform .12s,background .12s;transform-origin:top}
.piano .wk.on,.piano .wk:active{background:#d62227;transform:perspective(500px) rotateX(-4deg) translateY(3px)}
.piano .bk{position:absolute;top:0;width:5.2%;height:62%;background:#1e1d1c;border:0;border-radius:0 0 8px 8px;z-index:2;transform:translateX(-50%);padding:0;cursor:pointer;transition:transform .12s,background .12s}
.piano .bk.on,.piano .bk:active{background:#d62227;transform:translateX(-50%) translateY(4px)}
.p-bar{height:4px;max-width:420px;margin-top:26px;background:#363432;border-radius:2px}
.p-bar b{display:block;height:100%;width:0;background:#d62227;border-radius:2px}
.piano-hint{color:#fff;opacity:.5;font-size:13px;margin-top:14px;margin-bottom:0!important}
/* timings */
.hours-table{width:100%;border-collapse:collapse}
.hours-table td{padding:16px 10px;border-bottom:1px solid #e9e4df;font-weight:500;color:#262523}
.hours-table tr.today td{background:#fdeceb;color:#d62227;font-weight:700}
.hours-table td:last-child{text-align:right}
.open-badge{display:inline-block;padding:9px 20px;border-radius:50px;font-size:14px;font-weight:600;background:#ece8e4;color:#262523;margin-bottom:26px}
.open-badge.is-open{background:#dff7ea;color:#0b7a43}
.open-badge.is-open::before,.open-badge.is-closed::before{content:"";display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:9px;background:#14b866;vertical-align:1px}
.open-badge.is-closed::before{background:#d62227}
/* faq */
.faq .card{border:0;border-radius:26px!important;background:#f5f2ef;margin-bottom:14px;overflow:hidden}
.faq .card-header{background:transparent;border:0;padding:0}
.faq .btn-link{display:flex;justify-content:space-between;align-items:center;width:100%;padding:22px 32px;color:#262523;font-weight:600;font-size:16px;text-align:left;text-decoration:none!important;white-space:normal}
.faq .btn-link::after{content:"+";font-size:26px;color:#d62227;line-height:1;transition:transform .25s;margin-left:16px}
.faq .btn-link:not(.collapsed)::after{transform:rotate(45deg)}
.faq .card-body{padding:0 32px 26px;color:#6d6967;font-size:15px;line-height:1.8;font-weight:500}
/* visit */
.visit-map iframe{width:100%;height:100%;min-height:360px;border:0;border-radius:40px}
.visit-box p{margin-bottom:12px}
.visit-box .big-phone{font-size:28px;font-weight:700;color:#262523;display:block;margin:6px 0 26px}
/* contact */
.contact-from select{width:100%;height:57px;padding:0 38px;border:none;border-radius:20px;font-size:14px;font-weight:500;margin-bottom:14px;color:#6d6967;background:#f5f2ef}
.contact-from .form-note{font-size:13px;margin:-30px 0 30px}
.form-msg{padding:16px 22px;border-radius:20px;margin-bottom:24px;font-size:14px;font-weight:500}
.form-msg.ok{background:#dff7ea;color:#0b7a43}
.form-msg.err{background:#fde3e3;color:#9a1217}
.hp{position:absolute;left:-9999px}
.contact-warp ul li a{color:#262523}
.contact-warp ul li i{color:#d62227;width:22px}
/* footer */
.footer-widget ul li a:hover{color:#d62227}
.footer-widget p{color:#6d6967;font-size:14px;margin-bottom:6px}
.social-links a:hover{color:#d62227}
/* mobile call bar */
.mobile-cta{display:none}
@media(max-width:767px){
  .mobile-cta{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:999;background:#1e1d1c;box-shadow:0 -6px 24px rgba(0,0,0,.25)}
  .mobile-cta a{flex:1;text-align:center;color:#fff;font-weight:600;font-size:14px;padding:16px 8px}
  .mobile-cta a+a{background:#d62227}
  body{padding-bottom:54px}
  .piano-stick h2{font-size:32px}
  .stat .num{font-size:44px}
  .sub-list{padding-left:40px}
}
.site-btn{transition:transform .15s ease-out,background .2s}
.site-btn:hover{background:#b51a1f}
.site-btn.sb-c2:hover{background:#34322f}
@media (prefers-reduced-motion:reduce){.inst-card,.site-btn{transition:none}.piano .wk,.piano .bk{transition:none}}

/* ===== Logo palette: red #d62227, charcoal #262523, white ===== */
#preloder{background:#fff}
::selection{background:#d62227;color:#fff}

/* header: logo left, menu centre-right, phone + enquire right, all on one centre line */
.header-section{display:flex;align-items:center;flex-wrap:wrap;position:relative;z-index:50;padding:6px 55px;background:#fff;box-shadow:0 2px 18px rgba(0,0,0,.07)}
.header-section .site-logo{order:1;display:block;padding:6px 0}
.site-logo img{display:block;height:76px;width:auto;max-width:none}
.header-section .main-menu{order:2;float:none;margin-left:auto}
.header-section .header-right{order:3;float:none;padding:0;margin-left:44px}
.main-menu li a{padding:36px 10px}
@media(min-width:992px){
  .main-menu li a{color:#262523;font-weight:500;margin-left:36px}
  .main-menu li:first-child a{margin-left:0}
  .main-menu li a:hover{color:#d62227}
  .header-section .header-right{display:flex;align-items:center}
  .header-right .hr-btn{color:#6d6967}
  .header-right span{color:#cfc9c4;padding:0 14px}
  .header-right .user-panel{display:flex;align-items:center}
  .header-right .user-panel a.login{color:#262523;font-weight:600;margin:0}
  .header-right .user-panel a.register{background:#d62227;color:#fff;border-radius:50px;padding:11px 24px;font-size:14px;font-weight:600;margin:0 0 0 18px;transition:background .2s}
  .header-right .user-panel a.register:hover{background:#b51a1f}
}
@media(min-width:992px) and (max-width:1359px){
  .header-section{padding:6px 20px}
  .header-section .header-right{margin-left:24px}
  .header-right .hr-btn,.header-right span{display:none}
  .main-menu li a{margin-left:18px;font-size:15px}
  .main-menu li:first-child a{margin-left:0}
}
@media(max-width:991px){
  .header-section{padding:6px 15px}
  .site-logo img{height:60px}
  .header-section .slicknav_menu{order:5;flex:0 0 100%;margin:0;padding:0;background:transparent;position:static}
  .header-section .slicknav_btn{position:absolute;right:15px;top:16px;margin:0;float:none;background:#262523;border-radius:6px}
  .header-section .slicknav_nav{background:#262523;margin:0 -15px;width:calc(100% + 30px);padding-top:8px}
}

/* footer: logo sits on a white card so it stays readable on charcoal */
.footer-section .site-logo{display:inline-block;background:#fff;border-radius:24px;padding:12px 20px;margin-bottom:24px}
.footer-section .site-logo img{height:96px}
@media(max-width:991px){.footer-section .col-lg-5{margin-bottom:40px}}

/* alignment polish */
.section-title h2{line-height:1.1}
.intro-section .col-lg-6>p,.concept-section .col-lg-6>p,.premium-section .col-lg-6>p{padding-top:8px}
.concept-section .row,.premium-section .row{align-items:stretch}
.inst-card{display:flex;flex-direction:column;align-items:center}
.inst-card p{flex:1}
.how-item h4{margin-bottom:18px}
.hs-item .hs-text .site-btn{margin-bottom:16px}
.hs-item .hs-text .rating{display:block;margin-top:10px}
.sub-list li img{margin-right:24px;padding-right:0}
.visit-box .section-title{margin-bottom:30px}
.stat{padding-bottom:10px}
.gallery-drive-frame{display:block;width:100%;height:min(78vh,900px);min-height:500px;border:0;background:#fff}
@media(max-width:767px){
  .section-title{margin-bottom:34px}
  .section-title h2{font-size:38px}
  .hs-item h1,.hs-item h2{font-size:46px}
  .visit-map iframe{min-height:280px;border-radius:28px}
  .gallery-drive-frame{height:70vh;min-height:420px}
  .hours-table td{padding:14px 4px}
}

/* ===== Banner animations ===== */
.hs-item{position:relative;overflow:hidden}
.hs-item>.container{position:relative;z-index:2}
.hero-fx{position:absolute;left:0;right:0;top:0;bottom:0;z-index:1;pointer-events:none;overflow:hidden}
.hero-fx::before{content:"";position:absolute;right:-8%;top:6%;width:640px;height:640px;border-radius:50%;background:radial-gradient(circle,rgba(214,34,39,.4),transparent 68%);animation:glow 6s ease-in-out infinite}
@keyframes glow{0%,100%{transform:scale(.88);opacity:.55}50%{transform:scale(1.12);opacity:1}}
.hero-fx .n{position:absolute;bottom:-70px;left:var(--l);font-size:var(--s);color:#fff;opacity:0;animation:floatUp var(--t) linear var(--d) infinite}
.hero-fx .n.r{color:#d62227}
@keyframes floatUp{0%{transform:translateY(0) rotate(-12deg);opacity:0}10%{opacity:.4}90%{opacity:.28}100%{transform:translateY(-840px) rotate(16deg);opacity:0}}
.fx-staff{position:absolute;left:0;right:0;top:120px;height:74px;background:repeating-linear-gradient(to bottom,rgba(255,255,255,.11) 0 2px,transparent 2px 18px)}
.fx-staff::after{content:"";position:absolute;top:-14px;bottom:-14px;width:3px;background:#d62227;box-shadow:0 0 18px 4px rgba(214,34,39,.6);animation:playhead 7s linear infinite}
@keyframes playhead{from{left:-2%}to{left:102%}}
.eq{position:absolute;left:0;right:0;bottom:0;height:72px;display:flex;align-items:flex-end;gap:6px;padding:0 15px}
.eq i{flex:1;height:100%;background:linear-gradient(to top,rgba(214,34,39,.6),rgba(214,34,39,.05));border-radius:4px 4px 0 0;transform-origin:bottom;transform:scaleY(.2);animation:eq 1.2s ease-in-out infinite;animation-delay:calc(var(--i) * -.13s)}
.eq i:nth-child(3n){animation-duration:.9s}
.eq i:nth-child(3n+1){animation-duration:1.5s}
@keyframes eq{0%,100%{transform:scaleY(.15)}50%{transform:scaleY(1)}}
.hs-progress{position:absolute;left:0;bottom:0;height:4px;width:0;background:#d62227;z-index:3}
.owl-item.active .hs-progress{animation:prog 6s linear forwards}
@keyframes prog{to{width:100%}}
.owl-item.active .hr-img img{animation:bob 5s ease-in-out 1.2s infinite}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-14px)}}
.marquee{background:#d62227;color:#fff;overflow:hidden;white-space:nowrap;padding:16px 0;font-weight:600;font-size:15px;letter-spacing:1px;text-transform:uppercase}
.mq-track{display:inline-flex;animation:mq 34s linear infinite}
.mq-track span{padding:0 30px}
.marquee:hover .mq-track{animation-play-state:paused}
@keyframes mq{to{transform:translateX(-50%)}}
.subscription-section{position:relative;overflow:hidden}
.subscription-section>.container{position:relative;z-index:2}
.site-btn.pulse{animation:pulse 2.2s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(214,34,39,.6)}70%{box-shadow:0 0 0 20px rgba(214,34,39,0)}100%{box-shadow:0 0 0 0 rgba(214,34,39,0)}}
@media(max-width:767px){.hero-fx::before{width:360px;height:360px}.fx-staff{top:60px}.mq-track span{padding:0 20px}}
@media (prefers-reduced-motion:reduce){.hero-fx,.mq-track,.site-btn.pulse,.hs-progress,.owl-item.active .hr-img img{animation:none!important}.hero-fx{display:none}.mq-track{transform:none}}
