/* Treasure Academy motion policy: calm, useful and accessible.
   Only reveal opacity/position, the news carousel, counters, the chatbot's
   gentle attention cue and the announcement marquee may move. */
:root{--t-fast:150ms ease;--t-reveal:200ms ease}

/* Content is visible by default. The synchronous theme bootstrap adds .js
   before CSS paints, allowing reveals only when JavaScript can complete them. */
.clip,.clip-up{
  opacity:1;
  transform:none;
  transition:opacity var(--t-reveal),transform var(--t-reveal);
}
.js .clip,.js .clip-up{opacity:0;transform:translateY(12px)}
.js .clip.revealed,.js .clip-up.revealed{opacity:1;transform:none}

/* Hover feedback changes colour, never the target's position or size. */
a,button,.btn,.icon-action{
  transition:color var(--t-fast),background-color var(--t-fast),border-color var(--t-fast),box-shadow var(--t-fast);
}
.btn:hover,.btn:active,.theme-btn:hover,.icon-action:hover,
.card:hover,.prog:hover,.step:hover,.testi-card:hover,.track-card:hover,.yt-card:hover{
  transform:none;
}

/* Keyboard access remains immediate and clearly visible. */
a:focus-visible,button:focus-visible,input:focus-visible,
select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible{
  outline:2px solid var(--gold,#C9A227);
  outline-offset:3px;
}
a:focus:not(:focus-visible),button:focus:not(:focus-visible){outline:none}
.skip-link{
  position:absolute;left:8px;top:-60px;z-index:var(--z-toast,70);
  background:var(--green,#0E5A2E);color:#FFFFFF;padding:10px 16px;
  border-radius:var(--r-sm);font-weight:700;text-decoration:none;
}
.skip-link:focus{top:0}
#siteLoader{transition:opacity var(--t-reveal),visibility var(--t-reveal)}
#siteLoader.done{visibility:hidden}

img[width][height]{max-width:100%;height:auto}
.hero-figure img,.prog img,.card img,.testi-card img,.team-card img{height:auto}
.ico{display:inline-block;vertical-align:-.18em;margin-right:.4em;flex:none;color:var(--green,#0E5A2E)}

@media(max-width:760px){.clock-widget{display:none!important}}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
  .clip,.clip-up{opacity:1!important;transform:none!important}
  .ticker{overflow-x:auto;-webkit-overflow-scrolling:touch}
  .ticker-inner{animation:none!important}
}