/* ================================
   FASTOLUTION Global (front page scoped)
   ================================ */

/* ---- Design tokens (global, harmless on other pages) ---- */
:root{
  --fasto-bg-1:#050c16;
  --fasto-bg-2:#071522;
  --fasto-fg:#dff2ff;
  --fasto-muted:#a8c2d6;
  --fasto-accent:#3ad3ff;
  --fasto-accent-2:#7b5bff;
  --fasto-warn:#ffd45f;
  --fasto-card:rgba(255,255,255,.055);
  --fasto-border:rgba(255,255,255,.12);
  --fasto-glow:0 0 24px rgba(58,211,255,.25), 0 0 64px rgba(123,91,255,.18);
  --fasto-grid:rgba(255,255,255,.06);
}

/* ================= FRONT PAGE ONLY ================= */
body.home{
  background:#050b12; /* fallback under animated layer */
  color:#dfefff;
}

/* Make Divi sections transparent so our bg shows through */
body.home #page-container,
body.home .et_pb_section,
body.home .et_pb_row{ background-color:transparent !important; }

/* ---------- Full-page animated background layer ---------- */
body.home #fasto-bg{
  position:fixed; inset:0; z-index:0; pointer-events:none;
  background:
    radial-gradient(800px 600px at 12% 8%, rgba(58,211,255,.20), transparent 60%),
    radial-gradient(900px 700px at 85% 92%, rgba(123,91,255,.18), transparent 60%),
    radial-gradient(600px 500px at 50% 120%, rgba(255,212,95,.10), transparent 65%),
    #050b12;
  transform:translateZ(0);
}

/* ---------- Neo section preset ---------- */
body.home .fasto-neo{ position:relative; overflow:hidden; padding:clamp(56px,9vh,120px) 0; min-height:100svh; display:flex; align-items:center; }
body.home .fasto-neo::before{
  content:""; position:absolute; inset:-25%;
  background:
    radial-gradient(50% 40% at 20% 30%, rgba(58,211,255,.14), transparent 60%),
    radial-gradient(40% 30% at 80% 70%, rgba(123,91,255,.12), transparent 60%),
    conic-gradient(from 180deg at 50% 50%, rgba(255,255,255,.015), transparent 60%);
  filter:blur(28px); pointer-events:none;
  animation:neoFloat 16s ease-in-out infinite alternate;
}
@keyframes neoFloat{ 0%{transform:translate3d(-1%,-2%,0) scale(1)} 100%{transform:translate3d(2%,1%,0) scale(1.03)} }

body.home .fasto-container{ max-width:1100px; margin-inline:auto; padding:0 1.2rem; z-index:2; position:relative; }
body.home .fasto-card{
  background:linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.025));
  border:1px solid rgba(255,255,255,.14);
  border-radius:18px; box-shadow:0 10px 40px rgba(0,0,0,.45), 0 0 40px rgba(58,211,255,.12);
  padding:clamp(16px,3vw,28px); color:#e8f7ff;
}

/* ---------- Typography & CTA ---------- */
body.home .fasto-title{ font-size:clamp(38px,6vw,74px); line-height:1.02; margin:0 0 .5rem; letter-spacing:.5px; }
body.home .fasto-sub{ font-size:clamp(16px,2.6vw,20px); color:var(--fasto-muted); margin:0 0 1rem; }
body.home .fasto-h2{ font-size:clamp(24px,4.2vw,38px); margin:0 0 .5rem; }
body.home a{ color:#86e1ff; } body.home a:hover{ color:#b1ecff; }

body.home .fasto-cta{
  display:inline-block; padding:.8rem 1.2rem; border-radius:14px;
  background:linear-gradient(135deg, var(--fasto-accent), var(--fasto-accent-2));
  color:#061018; font-weight:800; letter-spacing:.2px; text-decoration:none;
  box-shadow:0 10px 24px rgba(122,92,255,.28);
  transition:transform .18s ease, box-shadow .18s ease;
}
body.home .fasto-cta:hover{ transform:translateY(-1px); box-shadow:0 14px 30px rgba(122,92,255,.38); }

/* ---------- Reveal (fail-safe visible without JS) ---------- */
body.home .fasto-animate{ opacity:1; transform:none; }
body.home.js-anim .fasto-animate{ opacity:0; transform:translateY(24px); }
body.home.js-anim .fasto-animate.is-in{ opacity:1; transform:none; transition:opacity .6s ease, transform .6s ease; }

/* ---------- Shortcode skins (neo) ---------- */

/* TIMER */
body.home .fasto-timer{ --num:#e6fbff; --muted:#9fc4d9; }
body.home .fasto-timer .fasto-timer-label{ color:var(--muted); font-weight:700; letter-spacing:.5px; }
body.home .fasto-timer .fasto-timer-digits{
  font-family:ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size:clamp(24px,4.6vw,48px); line-height:1; font-variant-numeric:tabular-nums;
  color:#e8fbff; text-shadow:0 0 14px rgba(58,211,255,.35);
}
body.home .fasto-timer-status{ margin-top:.3rem; color:var(--muted); }

/* STATS */
body.home .fasto-stats-list{ display:grid; grid-template-columns:repeat(auto-fit, minmax(140px,1fr)); gap:12px; padding:0; margin:0; list-style:none; }
body.home .fasto-stat-item{ background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.12); border-radius:14px; padding:14px; text-align:center; }
body.home .fasto-stat-num{ display:block; font-size:clamp(18px,3.8vw,28px); font-weight:800; color:#eafaff; }
body.home .fasto-stat-label{ display:block; margin-top:4px; font-size:.9rem; color:#9fc4d9; }

/* CHART */
body.home .fasto-chart{
  --fasto-chart-line: rgba(58,211,255,1);
  --fasto-chart-fill: rgba(58,211,255,.18);
  --fasto-chart-grid: rgba(255,255,255,.08);
  --fasto-chart-text: #dfefff;
  --fasto-chart-target: rgba(255,132,171,.9);
}
body.home .fasto-chart-canvas{ display:block; width:100%; height:auto; filter:drop-shadow(0 8px 24px rgba(58,211,255,.12)); }

/* FASTGRID */
body.home .fasto-fastgrid .ffg-day{
  background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.12);
  border-radius:12px; padding:.45rem .25rem; font-size:.65rem; color:#dfefff;
}
body.home .fasto-fastgrid .ffg-bar{ background:rgba(58,211,255,.42); box-shadow: inset 0 0 18px rgba(58,211,255,.35); }
body.home .fasto-fastgrid .ffg-bar.current{ background:rgba(255,212,95,.8); box-shadow: inset 0 0 18px rgba(255,212,95,.45); }
body.home .fasto-fastgrid .ffg-line{ background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.12); }

/* MASTODON */
body.home .fasto-masto{ max-width:980px; margin:0 auto; }
body.home .fasto-masto-list .masto-item,
body.home .fasto-masto-updates .masto-card{
  background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.12);
  border-radius:14px; padding:12px 14px; margin:.75rem 0; color:#e8f7ff;
}
body.home .fasto-masto-list .masto-time,
body.home .fasto-masto-updates time{ color:#9fc4d9; }

/* Utility */
body.home .fasto-shortcodes > *{ margin-top: .9rem; }


/* ================= FRONT PAGE (scoped) ================= */
:root{
  --fasto-fg:#dff2ff; --fasto-muted:#a8c2d6;
  --fasto-accent:#3ad3ff; --fasto-accent-2:#7b5bff;
}
body.home{ background:#06111a; color:var(--fasto-fg); }
body.home #page-container, body.home .et_pb_section, body.home .et_pb_row{ background-color:transparent !important; }

/* Full-page background (canvas + soft glow) */
body.home #fasto-bg{ position:fixed; inset:0; z-index:0; pointer-events:none; overflow:hidden; }
body.home #fasto-canvas{ position:absolute; inset:0; width:100%; height:100%; display:block; }
body.home #fasto-bg::after{
  content:""; position:absolute; inset:-12%;
  background:
    radial-gradient(60% 50% at 18% 12%, rgba(58,211,255,.14), transparent 60%),
    radial-gradient(60% 50% at 82% 88%, rgba(123,91,255,.12), transparent 60%),
    radial-gradient(45% 35% at 50% 110%, rgba(255,212,95,.06), transparent 70%);
  filter: blur(22px); opacity:.9;
}
/* Edge glow when you hit top/bottom (opacity set by JS) */
body.home #fasto-edges{ position:absolute; inset:0; z-index:1; pointer-events:none;
  --top:0; --bot:0;
  background:
    linear-gradient(to bottom, rgba(138,217,255,.22), transparent 140px) top/100% 140px no-repeat,
    linear-gradient(to top, rgba(138,217,255,.20), transparent 140px) bottom/100% 140px no-repeat;
  mask-image:
    linear-gradient(to bottom, rgba(0,0,0,var(--top)), rgba(0,0,0,0) 140px),
    linear-gradient(to top, rgba(0,0,0,var(--bot)), rgba(0,0,0,0) 140px);
}

/* Sections & cards */
body.home .fasto-neo{ min-height:100svh; display:flex; align-items:center; position:relative; padding:clamp(56px,9vh,120px) 0; }
body.home .fasto-container{ max-width:1100px; margin-inline:auto; padding:0 1.2rem; position:relative; z-index:2; }
body.home .fasto-card{
  background:linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.025));
  border:1px solid rgba(255,255,255,.14); border-radius:18px;
  box-shadow:0 10px 40px rgba(0,0,0,.45), 0 0 40px rgba(58,211,255,.12);
  padding:clamp(16px,3vw,28px); color:#e8f7ff; text-align:center;
}

/* Headings & CTA */
body.home .fasto-title{ font-size:clamp(38px,6vw,74px); line-height:1.02; margin:0 0 .6rem; color:#f2fbff; }
body.home .fasto-h2{ font-size:clamp(24px,4.2vw,38px); margin:0 0 .5rem; color:#eef8ff; }
body.home .fasto-sub{ font-size:clamp(16px,2.6vw,20px); color:var(--fasto-muted); margin:0 0 1rem; }
body.home a{ color:#86e1ff; } body.home a:hover{ color:#b1ecff; }
body.home .fasto-cta{ display:inline-block; padding:.8rem 1.2rem; border-radius:14px;
  background:linear-gradient(135deg, var(--fasto-accent), var(--fasto-accent-2));
  color:#061018; font-weight:800; text-decoration:none; box-shadow:0 10px 24px rgba(122,92,255,.28);
  transition:transform .18s ease, box-shadow .18s ease;
}
body.home .fasto-cta:hover{ transform:translateY(-1px); box-shadow:0 14px 30px rgba(122,92,255,.38); }

/* Reveal (safe fallback visible without JS) */
body.home .fasto-animate{ opacity:1; transform:none; }
body.home.js-anim .fasto-animate{ opacity:0; transform:translateY(22px); }
body.home.js-anim .fasto-animate.is-in{ opacity:1; transform:none; transition:opacity .6s ease, transform .6s ease; }

/* Title sweep + per-letter */
body.home .fasto-title.wrap{ position:relative; display:inline-block; }
body.home .fasto-title .fasto-sweep{
  position:absolute; inset:0; pointer-events:none; mix-blend-mode:screen;
  background:linear-gradient(120deg, transparent 0%, rgba(255,255,255,.28) 45%, transparent 70%);
  transform:translateX(-120%) skewX(-18deg); opacity:.9;
}
body.home .fasto-title span.char{ display:inline-block; filter:drop-shadow(0 2px 10px rgba(58,211,255,.12)); }

/* Timer + stats skin */
body.home .fasto-timer .fasto-timer-label{ color:#9fc4d9; font-weight:700; letter-spacing:.5px; }
body.home .fasto-timer .fasto-timer-digits{ display:inline-block; font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  font-size:clamp(24px,4.6vw,48px); line-height:1; color:#e8fbff; text-shadow:0 0 14px rgba(58,211,255,.35); }
body.home .fasto-timer.pulse .fasto-timer-digits{ animation:fastoPulse 2.2s ease-in-out 1; }
@keyframes fastoPulse{ 0%{transform:scale(.98)} 60%{transform:scale(1.01)} 100%{transform:scale(1)} }

body.home .fasto-stats-list{ display:grid; grid-template-columns:repeat(auto-fit,minmax(140px,1fr)); gap:12px; list-style:none; padding:0; margin:0; }
body.home .fasto-stat-item{ background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.12); border-radius:14px; padding:14px; }
body.home .fasto-stat-num{ display:block; font-size:clamp(18px,3.8vw,28px); font-weight:800; color:#eafaff; }
body.home .fasto-stat-label{ display:block; margin-top:4px; font-size:.9rem; color:#9fc4d9; }

/* Chart palette */
body.home .fasto-chart{ --fasto-chart-line:rgba(58,211,255,1); --fasto-chart-fill:rgba(58,211,255,.18);
  --fasto-chart-grid:rgba(255,255,255,.08); --fasto-chart-text:#dfefff; --fasto-chart-target:rgba(255,132,171,.9); }
body.home .fasto-chart-canvas{ display:block; width:100%; height:auto; filter:drop-shadow(0 8px 24px rgba(58,211,255,.12)); }

/* Fastgrid: fix dark labels & tile heights */
body.home .ffg-title, body.home .ffg-legend, body.home .ffg-list-title{ color:#cfe8fb!important; opacity:.95; }
body.home .fasto-fastgrid .ffg-day{ display:flex; align-items:center; justify-content:center;
  min-height:42px; line-height:1; box-sizing:border-box; background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.12); border-radius:12px; color:#dfefff; }
body.home .fasto-fastgrid .ffg-day.today{ box-shadow:0 0 0 1px rgba(255,255,255,.25) inset, 0 0 8px rgba(138,217,255,.25); border-color:rgba(255,255,255,.2); }
body.home .fasto-fastgrid .ffg-bar{ background:rgba(58,211,255,.42); box-shadow:inset 0 0 18px rgba(58,211,255,.35); }
body.home .fasto-fastgrid .ffg-bar.current{ background:rgba(255,212,95,.8); box-shadow:inset 0 0 18px rgba(255,212,95,.45); }

/* Mastodon cards */
body.home .fasto-masto{ max-width:980px; margin:0 auto; }
body.home .fasto-masto-list .masto-item, body.home .fasto-masto-updates .masto-card{
  background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.12); border-radius:14px; padding:12px 14px; margin:.75rem 0; color:#e8f7ff;
}


/* FRONT PAGE — fixed background layer */
body.home #fasto-bg{ position:fixed; inset:0; z-index:0; pointer-events:none; overflow:hidden; background:#06111a; }
body.home #fasto-canvas{ position:absolute; inset:0; width:100%; height:100%; display:block; }

/* Huge transparent DNA overlay */
body.home #fasto-dna{ position:absolute; inset:0; width:100%; height:100%; mix-blend-mode:screen; }

/* Section + headings (light & centered) */
body.home .fasto-neo{ min-height:100svh; display:flex; align-items:center; }
body.home .fasto-container{ max-width:1100px; margin-inline:auto; padding:0 1.2rem; }
body.home .fasto-title{ color:#f2fbff; }
body.home .fasto-h2{ color:#eef8ff; }

/* Reveal baseline */
body.home .fasto-animate{ opacity:1; transform:none; }
body.home.js-anim .fasto-animate{ opacity:0; transform:translateY(22px); }
body.home.js-anim .fasto-animate.is-in{ opacity:1; transform:none; transition:opacity .6s ease, transform .6s ease; }

/* Fastgrid fixes (same as before, concise) */
body.home .ffg-title, body.home .ffg-legend, body.home .ffg-list-title{ color:#cfe8fb!important; opacity:.95; }
body.home .fasto-fastgrid .ffg-day{ display:flex; align-items:center; justify-content:center; min-height:42px; line-height:1; box-sizing:border-box; }






/* use on a Section/Row/Module: class "edge" */
@media (max-width: 680px){
  .edge{ margin-left: calc(50% - 50vw) !important; margin-right: calc(50% - 50vw) !important; }
  .edge > .fasto-card{ border-radius: 0; }
}




/* Centered action under the feed */
.fasto-actions{ margin-top: 14px; display:flex; justify-content:center; }

/* Glassy button (dark-friendly) */
.fasto-btn{
  display:inline-flex; align-items:center; justify-content:center;
  padding: .72rem 1.15rem;
  border-radius: 999px;
  font-weight: 800; letter-spacing:.2px; text-decoration:none;
  color:#061018; background: linear-gradient(135deg, #3ad3ff, #7b5bff);
  box-shadow: 0 10px 24px rgba(122,92,255,.28), inset 0 0 0 1px rgba(255,255,255,.25);
  transition: transform .18s ease, box-shadow .18s ease, opacity .18s ease;
}
.fasto-btn:hover{ transform: translateY(-1px); box-shadow: 0 14px 30px rgba(122,92,255,.38), inset 0 0 0 1px rgba(255,255,255,.35); }
.fasto-btn:active{ transform: translateY(0); opacity:.9; }

/* On light pages, flip to neutral glass */
body:not(.fasto-dark).fasto-light .fasto-btn,
body.page-template-default .fasto-btn.solid-light{
  background: rgba(12,18,28,.9);
  color:#eaf7ff;
  box-shadow: 0 8px 24px rgba(0,0,0,.12), inset 0 0 0 1px rgba(255,255,255,.12);
}

/* Mobile: make it comfy */
@media (max-width:680px){
  .fasto-actions{ margin-top: 10px; }
  .fasto-btn{ width: 100%; max-width: 420px; }
}

