/* =====================================================================
   TILA theme — shared fonts, animations & utility classes
   (page markup keeps its inline styles to match the originals exactly)
   ===================================================================== */

@font-face {
  font-family: 'Fredoka';
  src: url('../fonts/fredoka.woff2') format('woff2'),
       url('../fonts/fredoka-ext.woff2') format('woff2');
  font-weight: 300 700; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Nunito';
  src: url('../fonts/nunito.woff2') format('woff2'),
       url('../fonts/nunito-ext.woff2') format('woff2');
  font-weight: 200 900; font-style: normal; font-display: swap;
}

* { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { font-family: 'Nunito', sans-serif; color: #1e2444; -webkit-font-smoothing: antialiased; }
a { color: #1b3a8c; text-decoration: none; }
a:hover { color: #ff2e88; }
h1, h2, h3, h4 { font-family: 'Fredoka', sans-serif; font-weight: 600; line-height: 1.05; }
::selection { background: #ffc42e; color: #17255a; }
img { max-width: 100%; }

/* ---- keyframes (site + news) ---- */
@keyframes bobFloat { 0%,100%{ transform:translateY(0) rotate(-2deg); } 50%{ transform:translateY(-26px) rotate(2deg); } }
@keyframes swim { 0%{ transform:translateX(-4%) translateY(0) rotate(-3deg);} 50%{ transform:translateX(4%) translateY(-18px) rotate(3deg);} 100%{ transform:translateX(-4%) translateY(0) rotate(-3deg);} }
@keyframes rise { 0%{ transform:translateY(0) translateX(0); opacity:0;} 10%{opacity:.7;} 90%{opacity:.5;} 100%{ transform:translateY(-115vh) translateX(30px); opacity:0;} }
@keyframes waveMove { 0%{ transform:translateX(0);} 100%{ transform:translateX(-50%);} }
@keyframes spinSlow { from{transform:rotate(0);} to{transform:rotate(360deg);} }
@keyframes shimmer { 0%,100%{ background-position:0% 50%;} 50%{ background-position:100% 50%;} }
@keyframes pulseRing { 0%{ transform:scale(.9); opacity:.7;} 70%{ transform:scale(1.4); opacity:0;} 100%{opacity:0;} }
@keyframes floaty { 0%,100%{transform:translateY(0) rotate(-2deg);} 50%{transform:translateY(-10px) rotate(2deg);} }
@keyframes fadeUp { from{opacity:0; transform:translateY(14px);} to{opacity:1; transform:none;} }
@keyframes popIn { from{opacity:0; transform:scale(.96);} to{opacity:1; transform:none;} }
@keyframes ring { 0%{transform:scale(.8);opacity:.6;} 70%{transform:scale(1.5);opacity:0;} 100%{opacity:0;} }

/* ---- utility classes (site + news) ---- */
.reveal { opacity:0; transform:translateY(34px); transition:opacity .7s cubic-bezier(.16,1,.3,1), transform .7s cubic-bezier(.16,1,.3,1); }
.reveal.in { opacity:1; transform:none; }
.fancy-underline { background:linear-gradient(120deg,#ff2e88,#ffc42e,#4fd06a,#23c4e6,#8b5cf6); background-size:300% 100%; -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; animation:shimmer 8s ease infinite; }
.navlink { position:relative; }
.navlink::after { content:''; position:absolute; left:0; bottom:-4px; width:0; height:3px; border-radius:3px; background:linear-gradient(90deg,#ff2e88,#ffc42e); transition:width .3s; }
.navlink:hover::after { width:100%; }
.card-lift { transition:transform .4s cubic-bezier(.16,1,.3,1), box-shadow .4s; }
.card-lift:hover { transform:translateY(-10px); }

/* ---- portal utility classes ---- */
.scroll::-webkit-scrollbar { width:10px; }
.scroll::-webkit-scrollbar-thumb { background:#d6ddf0; border-radius:10px; border:3px solid #f2f5fc; }
.view { animation:fadeUp .5s cubic-bezier(.16,1,.3,1) both; }
.tile { animation:popIn .45s cubic-bezier(.16,1,.3,1) both; transition:transform .3s, box-shadow .3s; }
.tile:hover { transform:translateY(-4px); box-shadow:0 18px 40px rgba(23,37,90,.14); }
.navbtn { transition:background .2s, color .2s; }
.navbtn:hover { background:#eef3ff !important; }
.rowhover:hover { background:#f7f9ff; }

/* =====================================================================
   Inline CMS editor + admin bar
   ===================================================================== */
.cms-editable { transition: box-shadow .15s, background .15s; border-radius: 4px; }
body.cms-edit .cms-editable { outline: 1.5px dashed rgba(255,46,136,.55); outline-offset: 3px; cursor: text; }
body.cms-edit .cms-editable:hover { background: rgba(255,196,46,.16); }
body.cms-edit .cms-editable:focus { outline: 2px solid #ff2e88; background: #fff; box-shadow: 0 6px 22px rgba(255,46,136,.25); }
.cms-image .cms-image-btn { display:none; }
body.cms-edit .cms-image { outline: 2px dashed rgba(255,46,136,.6); outline-offset: 2px; cursor: pointer; }
body.cms-edit .cms-image .cms-image-btn {
  display:block; position:absolute; top:8px; left:8px; z-index:5;
  background:#ff2e88; color:#fff; font:800 12px/1 'Nunito',sans-serif;
  padding:7px 12px; border-radius:999px; box-shadow:0 6px 16px rgba(255,46,136,.4);
}

/* Admin bar (floats at top when an admin browses the public site) */
#tila-adminbar {
  position: fixed; top: 0; left: 0; right: 0; z-index: 4000;
  display: flex; align-items: center; gap: 14px;
  padding: 8px 18px; background: #0e1a44; color: #fff;
  font: 700 13.5px/1 'Nunito', sans-serif; box-shadow: 0 4px 18px rgba(0,0,0,.25);
}
#tila-adminbar .ab-brand { display:flex; align-items:center; gap:8px; font-weight:800; }
#tila-adminbar .ab-dot { width:9px;height:9px;border-radius:50%;background:#4fd06a; }
#tila-adminbar a { color:#cdd7f2; }
#tila-adminbar a:hover { color:#fff; }
#tila-adminbar .ab-spacer { flex:1; }
#tila-adminbar button {
  border:none; cursor:pointer; font:800 13px/1 'Nunito',sans-serif;
  padding:8px 16px; border-radius:999px;
}
#tila-adminbar .ab-toggle { background:#ff2e88; color:#fff; }
#tila-adminbar .ab-toggle.on { background:#4fd06a; color:#0d3b1e; }
#tila-adminbar .ab-save { background:#ffc42e; color:#17255a; }

/* Per-layout offset so the fixed admin bar never covers real content */
body.has-adminbar.page-news,
body.has-adminbar.page-admin,
body.has-adminbar.page-auth { padding-top: 44px; }
body.has-adminbar.page-home #nav { top: 44px; }
body.has-adminbar.page-news .news-nav { top: 44px; }
body.has-adminbar.page-portal .portal-shell { height: calc(100vh - 44px) !important; margin-top: 44px; }

.cms-toast {
  position: fixed; bottom: 22px; right: 22px; z-index: 5000;
  background:#17255a; color:#fff; padding:13px 20px; border-radius:14px;
  font:800 14px 'Nunito',sans-serif; box-shadow:0 16px 40px rgba(23,37,90,.3);
  opacity:0; transform:translateY(12px); transition:opacity .25s, transform .25s;
}
.cms-toast.show { opacity:1; transform:none; }
.cms-toast.err { background:#b00020; }