/* Homepage banner panels light up like the dashboard cards (teacher/student cohesion.css
 * .mission-card): a short accent stub on the top edge that sweeps across on hover/focus,
 * a tinted border, a coloured glow, a small lift and a short press. Colour is the
 * LinguaPro teal used by the header controls (#15b0d9 / #5ce1e6). Positions, sizes and
 * the panels' tilt are unchanged. Loaded after panels.css and left.css.
 * The Game Center panel is deliberately excluded and keeps its original behaviour. */
.lp-original-hero{--lp-panel-teal:#15b0d9;--lp-panel-teal-light:#5ce1e6}

.lp-original-hero .lp-header-panel:not(.lp-header-panel--games)::before,
.lp-original-hero .lp-left-teachers::before,
.lp-original-hero .lp-left-booking::before{content:"";position:absolute;top:0;inset-inline:0;height:4px;z-index:3;pointer-events:none;
  background:linear-gradient(90deg,var(--lp-panel-teal),var(--lp-panel-teal-light));
  transform:scaleX(.18);transform-origin:left;opacity:.9;transition:transform .32s cubic-bezier(.22,.8,.3,1),opacity .2s ease}
[dir=rtl] .lp-original-hero .lp-header-panel:not(.lp-header-panel--games)::before,
[dir=rtl] .lp-original-hero .lp-left-teachers::before,
[dir=rtl] .lp-original-hero .lp-left-booking::before{transform-origin:right;background:linear-gradient(270deg,var(--lp-panel-teal),var(--lp-panel-teal-light))}
.lp-original-hero .lp-header-panel:not(.lp-header-panel--games){transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease}
.lp-original-hero .lp-left-teachers,.lp-original-hero .lp-left-booking{transition:transform .22s ease,box-shadow .22s ease}

/* Lit: hover (mouse), keyboard focus, and while a finger is down. */
@media(hover:hover) and (pointer:fine){
 .lp-original-hero .lp-header-panel:not(.lp-header-panel--games):hover::before,
 .lp-original-hero .lp-left-teachers:hover::before,
 .lp-original-hero .lp-left-booking:hover::before{transform:scaleX(1);opacity:1}
 .lp-original-hero .lp-header-panel:not(.lp-header-panel--games):hover{border-color:color-mix(in srgb,var(--lp-panel-teal) 55%,#fff)!important;
   box-shadow:0 0 0 1px color-mix(in srgb,var(--lp-panel-teal) 35%,transparent),0 12px 26px -8px color-mix(in srgb,var(--lp-panel-teal) 70%,transparent)!important}
 .lp-original-hero .lp-left-teachers:hover,.lp-original-hero .lp-left-booking:hover{
   box-shadow:0 0 0 2px color-mix(in srgb,var(--lp-panel-teal) 55%,#fff),0 12px 26px -8px color-mix(in srgb,var(--lp-panel-teal) 70%,transparent)}
}
.lp-original-hero .lp-header-panel:not(.lp-header-panel--games):focus-visible::before,
.lp-original-hero .lp-left-teachers:focus-visible::before,
.lp-original-hero .lp-left-booking:focus-visible::before,
.lp-original-hero .lp-header-panel:not(.lp-header-panel--games):active::before,
.lp-original-hero .lp-left-teachers:active::before,.lp-original-hero .lp-left-teachers.is-touch-active::before,
.lp-original-hero .lp-left-booking:active::before,.lp-original-hero .lp-left-booking.is-touch-active::before{transform:scaleX(1);opacity:1}
.lp-original-hero .lp-header-panel:not(.lp-header-panel--games):focus-visible,.lp-original-hero .lp-header-panel:not(.lp-header-panel--games):active{border-color:color-mix(in srgb,var(--lp-panel-teal) 55%,#fff)!important}
.lp-original-hero .lp-left-teachers:focus-visible,.lp-original-hero .lp-left-booking:focus-visible{outline:3px solid var(--lp-panel-teal)}

/* Press: settle back down with a tighter teal shadow (dashboard :active travel). */
.lp-original-hero .lp-header-panel:not(.lp-header-panel--games):active{box-shadow:0 2px 6px color-mix(in srgb,var(--lp-panel-teal) 45%,transparent)!important;transition-duration:.06s}
.lp-original-hero .lp-left-teachers:active,.lp-original-hero .lp-left-teachers.is-touch-active,
.lp-original-hero .lp-left-booking:active,.lp-original-hero .lp-left-booking.is-touch-active{box-shadow:0 0 0 2px color-mix(in srgb,var(--lp-panel-teal) 55%,#fff),0 2px 6px color-mix(in srgb,var(--lp-panel-teal) 45%,transparent);transition-duration:.06s}

@media(prefers-reduced-motion:reduce){
 .lp-original-hero .lp-header-panel:not(.lp-header-panel--games)::before,.lp-original-hero .lp-left-teachers::before,.lp-original-hero .lp-left-booking::before{transition:none}
}