/*
Theme Name: Flladi XEC
Theme URI: https://flladi.com
Author: Flladi Community
Description: A ready-made meme coin WordPress starter theme for Flladi on eCash/XEC. Includes Flladi story, growth levels, token info, Cashtab-ready section, meme wall and community sections.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.8
Requires PHP: 7.4
License: GPLv2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: flladi-xec
Tags: custom-logo, custom-colors, one-column, block-styles, entertainment
*/

:root {
  --flladi-bg: #06111f;
  --flladi-bg-2: #0b1d33;
  --flladi-card: rgba(255,255,255,.07);
  --flladi-card-2: rgba(255,255,255,.11);
  --flladi-text: #f7fbff;
  --flladi-muted: #b7c9dd;
  --flladi-cyan: #18d7ff;
  --flladi-orange: #ff9f1c;
  --flladi-yellow: #ffd166;
  --flladi-green: #3df28b;
  --flladi-red: #ff4d6d;
  --flladi-border: rgba(255,255,255,.15);
  --flladi-shadow: 0 22px 80px rgba(0,0,0,.38);
  --flladi-radius: 28px;
  --flladi-max: 1180px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  background:
    radial-gradient(circle at 20% 10%, rgba(24,215,255,.20), transparent 38%),
    radial-gradient(circle at 88% 22%, rgba(255,159,28,.18), transparent 30%),
    linear-gradient(180deg, var(--flladi-bg), #02070f 72%);
  color: var(--flladi-text);
  min-height: 100vh;
}
a { color: inherit; }
img { max-width: 100%; height: auto; }

.flladi-wrap { width: min(var(--flladi-max), calc(100% - 40px)); margin: 0 auto; }
.flladi-header {
  position: sticky;
  top: 0;
  z-index: 50;
  background: rgba(6,17,31,.78);
  backdrop-filter: blur(18px);
  border-bottom: 1px solid var(--flladi-border);
}
.flladi-nav {
  min-height: 78px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
}
.flladi-brand {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  text-decoration: none;
  font-weight: 900;
  letter-spacing: .04em;
}
.flladi-brand img { width: 48px; height: 48px; border-radius: 999px; object-fit: cover; box-shadow: 0 0 0 3px rgba(24,215,255,.22); }
.flladi-brand span { font-size: clamp(1.1rem, 2vw, 1.45rem); }
.flladi-menu { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }
.flladi-menu a {
  text-decoration: none;
  font-weight: 750;
  font-size: .94rem;
  color: var(--flladi-muted);
  padding: 10px 12px;
  border-radius: 999px;
}
.flladi-menu a:hover { color: #fff; background: rgba(255,255,255,.08); }

.flladi-btn,
.flladi-button,
button.flladi-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 48px;
  padding: 13px 20px;
  border: 0;
  border-radius: 999px;
  font-weight: 900;
  text-decoration: none;
  color: #06111f;
  background: linear-gradient(135deg, var(--flladi-yellow), var(--flladi-orange));
  box-shadow: 0 14px 34px rgba(255,159,28,.28);
  cursor: pointer;
}
.flladi-btn.secondary,
.flladi-button.secondary {
  color: var(--flladi-text);
  background: rgba(255,255,255,.10);
  border: 1px solid var(--flladi-border);
  box-shadow: none;
}
.flladi-btn:hover,
.flladi-button:hover { transform: translateY(-1px); }

.flladi-hero {
  padding: clamp(58px, 8vw, 110px) 0 52px;
  overflow: hidden;
}
.flladi-hero-grid {
  display: grid;
  grid-template-columns: 1.05fr .95fr;
  align-items: center;
  gap: clamp(28px, 5vw, 72px);
}
.flladi-kicker {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 9px 14px;
  border: 1px solid rgba(24,215,255,.34);
  background: rgba(24,215,255,.08);
  color: #baf4ff;
  border-radius: 999px;
  font-weight: 850;
  margin-bottom: 18px;
}
.flladi-title {
  margin: 0 0 18px;
  font-size: clamp(3.1rem, 8vw, 7rem);
  line-height: .88;
  letter-spacing: -.07em;
  text-transform: uppercase;
}
.flladi-title span {
  color: var(--flladi-orange);
  text-shadow: 0 0 40px rgba(255,159,28,.32);
}
.flladi-subtitle {
  margin: 0 0 26px;
  max-width: 690px;
  color: var(--flladi-muted);
  font-size: clamp(1.08rem, 2vw, 1.35rem);
  line-height: 1.62;
}
.flladi-actions { display: flex; gap: 12px; flex-wrap: wrap; align-items: center; }
.flladi-hero-card {
  position: relative;
  padding: clamp(22px, 4vw, 36px);
  border-radius: 38px;
  border: 1px solid var(--flladi-border);
  background:
    radial-gradient(circle at 35% 15%, rgba(255,255,255,.18), transparent 38%),
    rgba(255,255,255,.08);
  box-shadow: var(--flladi-shadow);
}
.flladi-hero-logo {
  display: block;
  width: min(420px, 86%);
  margin: 0 auto;
  filter: drop-shadow(0 30px 60px rgba(0,0,0,.45));
  animation: flladiFloat 5s ease-in-out infinite;
}
.flladi-stat-row {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  margin-top: 22px;
}
.flladi-stat {
  padding: 16px;
  border-radius: 20px;
  background: rgba(0,0,0,.22);
  border: 1px solid var(--flladi-border);
}
.flladi-stat strong { display: block; font-size: 1.2rem; }
.flladi-stat span { display: block; color: var(--flladi-muted); font-size: .82rem; margin-top: 4px; }
@keyframes flladiFloat { 0%, 100% { transform: translateY(0) rotate(-1deg); } 50% { transform: translateY(-12px) rotate(1deg); } }

.flladi-section { padding: 62px 0; }
.flladi-section h2 {
  margin: 0 0 14px;
  font-size: clamp(2rem, 5vw, 4rem);
  line-height: 1;
  letter-spacing: -.055em;
}
.flladi-lead { margin: 0 0 28px; max-width: 760px; color: var(--flladi-muted); font-size: 1.08rem; line-height: 1.7; }
.flladi-card {
  border: 1px solid var(--flladi-border);
  background: var(--flladi-card);
  border-radius: var(--flladi-radius);
  padding: clamp(20px, 3vw, 32px);
  box-shadow: 0 16px 50px rgba(0,0,0,.20);
}
.flladi-grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }
.flladi-grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }

.flladi-journey {
  display: grid;
  gap: 14px;
}
.flladi-level {
  display: grid;
  grid-template-columns: 74px 1fr auto;
  align-items: center;
  gap: 16px;
  padding: 18px;
  border-radius: 24px;
  border: 1px solid var(--flladi-border);
  background: rgba(255,255,255,.06);
}
.flladi-level.is-active {
  border-color: rgba(61,242,139,.65);
  background: linear-gradient(90deg, rgba(61,242,139,.14), rgba(24,215,255,.08));
}
.flladi-level-number {
  display: grid;
  place-items: center;
  width: 58px;
  height: 58px;
  border-radius: 18px;
  background: rgba(255,255,255,.10);
  color: var(--flladi-yellow);
  font-weight: 950;
  font-size: 1.35rem;
}
.flladi-level h3 { margin: 0 0 4px; font-size: 1.15rem; }
.flladi-level p { margin: 0; color: var(--flladi-muted); line-height: 1.5; }
.flladi-level small { color: var(--flladi-green); font-weight: 850; white-space: nowrap; }
.flladi-progress-wrap { margin-top: 22px; }
.flladi-progress-meta { display: flex; justify-content: space-between; gap: 12px; color: var(--flladi-muted); margin-bottom: 10px; font-weight: 800; }
.flladi-progress { height: 18px; overflow: hidden; border-radius: 999px; background: rgba(255,255,255,.09); border: 1px solid var(--flladi-border); }
.flladi-progress-bar { height: 100%; width: 0; border-radius: 999px; background: linear-gradient(90deg, var(--flladi-green), var(--flladi-cyan), var(--flladi-orange)); transition: width .8s ease; }

.flladi-token-list { display: grid; gap: 12px; }
.flladi-token-row {
  display: grid;
  grid-template-columns: 130px 1fr auto;
  gap: 12px;
  align-items: center;
  padding: 14px 16px;
  border-radius: 18px;
  background: rgba(0,0,0,.20);
  border: 1px solid var(--flladi-border);
}
.flladi-token-row span { color: var(--flladi-muted); font-weight: 800; }
.flladi-token-row code { color: #fff; overflow-wrap: anywhere; white-space: normal; }
.flladi-copy { min-height: 34px; padding: 7px 10px; border-radius: 999px; border: 1px solid var(--flladi-border); background: rgba(255,255,255,.08); color: #fff; cursor: pointer; font-weight: 800; }

.flladi-wallet-box { display: grid; gap: 14px; }
.flladi-address-input {
  width: 100%;
  min-height: 50px;
  border-radius: 16px;
  border: 1px solid var(--flladi-border);
  background: rgba(0,0,0,.25);
  color: #fff;
  padding: 0 14px;
}
.flladi-note { color: var(--flladi-muted); font-size: .95rem; line-height: 1.55; }
.flladi-status { padding: 14px 16px; border-radius: 18px; background: rgba(24,215,255,.08); border: 1px solid rgba(24,215,255,.22); color: #d8f8ff; }

.flladi-meme-wall { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.flladi-meme-tile {
  min-height: 160px;
  display: grid;
  place-items: center;
  text-align: center;
  padding: 18px;
  border-radius: 24px;
  border: 1px dashed rgba(255,255,255,.25);
  background: rgba(255,255,255,.06);
  color: var(--flladi-muted);
  font-weight: 850;
}
.flladi-socials { display: flex; gap: 12px; flex-wrap: wrap; }
.flladi-footer { padding: 46px 0; border-top: 1px solid var(--flladi-border); color: var(--flladi-muted); }
.flladi-footer-grid { display: flex; align-items: center; justify-content: space-between; gap: 18px; flex-wrap: wrap; }
.flladi-disclaimer { font-size: .9rem; line-height: 1.65; max-width: 860px; }

.entry-content, .wp-block-post-content { color: var(--flladi-text); }
.flladi-page { padding: 60px 0; }
.flladi-page h1 { font-size: clamp(2rem, 5vw, 4rem); line-height: 1; letter-spacing: -.05em; }

@media (max-width: 920px) {
  .flladi-hero-grid, .flladi-grid-2, .flladi-grid-3 { grid-template-columns: 1fr; }
  .flladi-menu { display: none; }
  .flladi-stat-row { grid-template-columns: 1fr; }
  .flladi-meme-wall { grid-template-columns: 1fr 1fr; }
  .flladi-level { grid-template-columns: 56px 1fr; }
  .flladi-level small { grid-column: 2; }
  .flladi-level-number { width: 48px; height: 48px; }
}
@media (max-width: 560px) {
  .flladi-wrap { width: min(var(--flladi-max), calc(100% - 24px)); }
  .flladi-actions, .flladi-btn, .flladi-button { width: 100%; }
  .flladi-token-row { grid-template-columns: 1fr; }
  .flladi-meme-wall { grid-template-columns: 1fr; }
}
