/* ============================================
   DESIGN TOKENS
   ============================================ */
:root {
  --bg:      #0d1117;
  --bg-2:    #131921;
  --bg-card: #161d2b;
  --bg-el:   #1e2a3d;
  --bd:      #253047;
  --bd2:     #34465e;
  --green:   #4ade80;
  --g-soft:  rgba(74,222,128,.10);
  --g-glow:  rgba(74,222,128,.22);
  --cyan:    #38bdf8;
  --c-soft:  rgba(56,189,248,.10);
  --blue:    #60a5fa;
  --b-soft:  rgba(96,165,250,.10);
  --warn:    #fbbf24;
  --w-soft:  rgba(251,191,36,.10);
  --purple:  #a78bfa;
  --p-soft:  rgba(167,139,250,.10);
  --red:     #f87171;
  --r-soft:  rgba(248,113,113,.10);
  --text:    #edf2ff;
  --t2:      #b8d0e0;
  --t3:      #96b5c8;
  --inv:     #0d1117;
  --sans:    'DM Sans', system-ui, sans-serif;
  --mono:    'DM Mono', 'Courier New', monospace;
  --pixel:   'Press Start 2P', cursive;
  --r:       6px;
  --rl:      12px;
  --rxl:     18px;
  --spd:     .22s;
  --ease:    cubic-bezier(.22,1,.36,1);
  --sh-sm:   0 2px 8px rgba(0,0,0,.4);
  --sh-md:   0 6px 28px rgba(0,0,0,.5);
  --sh-lg:   0 12px 48px rgba(0,0,0,.6);
}

/* ============================================
   RESET
   ============================================ */
*, *::before, *::after { margin:0; padding:0; box-sizing:border-box }
html { font-size:16px; scroll-behavior:smooth; overflow-x:hidden }
body {
  font-family: var(--sans);
  background: var(--bg);
  color: var(--text);
  line-height: 1.7;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
  background-image: radial-gradient(ellipse 80% 30% at 50% -5%, rgba(74,222,128,.04) 0%, transparent 50%);
}
img { max-width:100%; height:auto; display:block }
a { color:var(--green); text-decoration:none }
a:hover { color:#a7f3c9 }
:focus-visible { outline:2px solid var(--green); outline-offset:3px; border-radius:var(--r) }
@media (prefers-reduced-motion:reduce) {
  *, *::before, *::after { animation-duration:.01ms !important; transition-duration:.01ms !important }
}

/* ============================================
   HEADER
   ============================================ */
.hdr {
  position: sticky; top:0; z-index:200;
  background: rgba(13,17,23,.93);
  backdrop-filter: blur(24px) saturate(1.5);
  -webkit-backdrop-filter: blur(24px) saturate(1.5);
  border-bottom: 1px solid var(--bd);
}
.hdr-inner {
  max-width: 1280px; margin:0 auto; padding:0 1.25rem;
  display: flex; align-items:center; justify-content:space-between;
  height: 68px; gap:1rem; position:relative;
}
.logo { display:flex; align-items:center; gap:.65rem; flex-shrink:0 }
.logo-img {
  width:34px; height:34px; border-radius:8px;
  border:1px solid var(--bd2);
  box-shadow: 0 0 12px rgba(74,222,128,.2);
  object-fit:cover; flex-shrink:0;
}
.logo-text {
  font-family: var(--pixel); font-size:.62rem;
  color: var(--green); letter-spacing:.1em;
  text-shadow: 0 0 20px rgba(74,222,128,.6);
}
.desk-nav { display:flex; align-items:center; gap:1.5rem; list-style:none }
.desk-nav a {
  font-size:.875rem; font-weight:500; color:var(--t2);
  letter-spacing:.02em; position:relative; padding-bottom:2px;
  transition: color var(--spd) var(--ease);
}
.desk-nav a::after {
  content:''; position:absolute; bottom:0; left:0;
  width:0; height:2px; background:var(--green); border-radius:1px;
  transition: width var(--spd) var(--ease);
}
.desk-nav a:hover { color:var(--text) }
.desk-nav a:hover::after { width:100% }
.desk-nav a.active { color:var(--green) }
.desk-nav a.active::after { width:100% }
.desk-nav .cta {
  background: linear-gradient(135deg,rgba(74,222,128,.15),rgba(74,222,128,.08));
  border: 1px solid rgba(74,222,128,.35); border-radius:999px;
  padding:.4rem 1.1rem; color:var(--green)!important;
  font-size:.82rem!important; font-weight:700;
}
.desk-nav .cta::after { display:none!important }
.desk-nav .cta:hover { background:rgba(74,222,128,.22); color:#c9fae3!important }

/* Hamburger */
.burger {
  display:none; flex-direction:column; gap:5px;
  background:none; border:none; cursor:pointer;
  padding:.5rem; border-radius:var(--r); flex-shrink:0;
}
.bl {
  display:block; width:22px; height:2px;
  background:var(--t2); border-radius:2px;
  transition: transform .25s var(--ease), opacity .2s;
}
.burger[aria-expanded="true"] .bl:nth-child(1) { transform:translateY(7px) rotate(45deg) }
.burger[aria-expanded="true"] .bl:nth-child(2) { opacity:0; transform:scaleX(0) }
.burger[aria-expanded="true"] .bl:nth-child(3) { transform:translateY(-7px) rotate(-45deg) }

/* Mobile nav drawer */
.mob-nav {
  display:none; position:absolute; top:100%; left:0; right:0;
  background: rgba(13,17,23,.98);
  backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px);
  border-bottom:1px solid var(--bd);
  box-shadow: 0 8px 32px rgba(0,0,0,.5);
  z-index:10;
}
.mob-nav.open { display:block }
.mob-nav ul { list-style:none; padding:.5rem 1.25rem 1.25rem }
.mob-nav ul li a {
  display:block; padding:.85rem .5rem; font-size:1rem; color:var(--t2);
  border-bottom:1px solid var(--bd); transition:color var(--spd);
}
.mob-nav ul li:last-child a { border-bottom:none; margin-top:.5rem; text-align:center }
.mob-nav ul li a:hover { color:var(--green) }

@media (max-width:768px) {
  .burger { display:flex }
  .desk-nav-wrap { display:none }
}

/* ============================================
   PAGE HERO
   ============================================ */
.page-hero {
  position:relative; overflow:hidden;
  padding: clamp(3rem,8vw,5.5rem) 1.25rem clamp(2.5rem,5vw,4rem);
  border-bottom:1px solid var(--bd); text-align:center;
}
.hero-glow {
  position:absolute; inset:0; pointer-events:none;
  background:
    radial-gradient(ellipse 100% 80% at 50% 0%, rgba(74,222,128,.12) 0%, transparent 65%),
    radial-gradient(ellipse 50% 50% at 80% 60%, rgba(56,189,248,.06) 0%, transparent 60%);
}
.hero-grid {
  position:absolute; inset:0; pointer-events:none;
  background-image:
    linear-gradient(rgba(255,255,255,.015) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.015) 1px, transparent 1px);
  background-size:40px 40px;
}
.hero-body { position:relative; z-index:1; max-width:760px; margin:0 auto }
.hero-badge {
  display:inline-flex; align-items:center; gap:.4rem;
  background:var(--g-soft); border:1px solid rgba(74,222,128,.3);
  color:var(--green); font-size:.68rem; font-weight:700;
  padding:.28rem .85rem; border-radius:999px;
  letter-spacing:.07em; text-transform:uppercase; margin-bottom:1.1rem;
}
.page-hero h1 {
  font-size: clamp(1.75rem,4.5vw,2.9rem);
  font-weight:800; line-height:1.2; color:var(--text);
  margin-bottom:1rem; letter-spacing:-.025em;
}
.page-hero h1 .g { color:var(--green) }
.hero-lead {
  font-size: clamp(.95rem,2vw,1.08rem);
  color:var(--t2); line-height:1.85;
  max-width:680px; margin:0 auto 1.5rem;
}
.hero-stats {
  display:flex; align-items:center; justify-content:center;
  flex-wrap:wrap; gap:.75rem;
}
.stat-chip {
  display:inline-flex; align-items:center; gap:.35rem;
  font-size:.78rem; color:var(--t3);
  background:var(--bg-card); border:1px solid var(--bd);
  padding:.28rem .75rem; border-radius:999px;
}

/* ============================================
   EDITORIAL INTRO SECTION
   ============================================ */
.editorial {
  max-width:1200px; margin:0 auto;
  padding:3rem 1.25rem 0;
}
.editorial-inner {
  background:var(--bg-card); border:1px solid var(--bd);
  border-radius:var(--rxl); padding:2.25rem 2.5rem;
  border-left:4px solid var(--green);
}
.editorial-inner h2 {
  font-size:1.3rem; font-weight:800; color:var(--text);
  margin-bottom:1rem; letter-spacing:-.02em;
}
.editorial-inner p {
  font-size:.97rem; color:var(--t2); line-height:1.9;
  margin-bottom:1rem;
}
.editorial-inner p:last-child { margin-bottom:0 }
.editorial-inner strong { color:var(--text); font-weight:700 }

@media (max-width:600px) { .editorial-inner { padding:1.5rem 1.25rem } }

/* ============================================
   FILTER + SEARCH BAR
   ============================================ */
.filter-bar {
  max-width:1200px; margin:0 auto;
  padding:2rem 1.25rem 0;
  display:flex; align-items:center; justify-content:space-between;
  flex-wrap:wrap; gap:1rem;
}
.filter-left { display:flex; align-items:center; gap:.6rem; flex-wrap:wrap }
.filter-label {
  font-family:var(--pixel); font-size:.42rem;
  color:var(--t3); letter-spacing:.06em; margin-right:.25rem;
}
.filter-btn {
  display:inline-flex; align-items:center; gap:.4rem;
  padding:.42rem .95rem; border-radius:999px;
  font-size:.8rem; font-weight:600;
  background:var(--bg-card); border:1px solid var(--bd);
  color:var(--t3); cursor:pointer; font-family:var(--sans);
  transition: all var(--spd) var(--ease);
}
.filter-btn:hover { border-color:var(--bd2); color:var(--t2) }
.filter-btn.active {
  background:var(--g-soft); border-color:rgba(74,222,128,.4); color:var(--green);
}
.search-wrap { position:relative; flex-shrink:0 }
.search-wrap input {
  background:var(--bg-card); border:1px solid var(--bd);
  border-radius:999px; padding:.45rem 1rem .45rem 2.2rem;
  font-size:.84rem; color:var(--text); font-family:var(--sans);
  outline:none; width:220px;
  transition: border-color var(--spd) var(--ease), width var(--spd) var(--ease);
}
.search-wrap input::placeholder { color:var(--t3) }
.search-wrap input:focus { border-color:rgba(74,222,128,.5); width:260px }
.search-icon {
  position:absolute; left:.75rem; top:50%;
  transform:translateY(-50%); font-size:.85rem; pointer-events:none;
}
@media (max-width:560px) { .search-wrap { width:100% } .search-wrap input { width:100% } }

/* ============================================
   SECTION LABEL
   ============================================ */
.section-head {
  max-width:1200px; margin:0 auto;
  padding:2rem 1.25rem .25rem;
  display:flex; align-items:center; justify-content:space-between;
  flex-wrap:wrap; gap:.5rem;
}
.section-head h2 {
  font-family:var(--pixel); font-size:.5rem;
  color:var(--t3); letter-spacing:.08em;
}
.section-count { font-size:.8rem; color:var(--t3) }

/* ============================================
   BLOGS WRAPPER
   ============================================ */
.blogs-wrap { max-width:1200px; margin:0 auto; padding:0 1.25rem 0 }

/* ============================================
   FEATURED CARD
   ============================================ */
.featured-card {
  display:grid; grid-template-columns:1fr 1fr;
  background:var(--bg-card); border:1px solid var(--bd);
  border-radius:var(--rxl); overflow:hidden;
  margin-bottom:2rem; position:relative;
  transition: border-color var(--spd) var(--ease), box-shadow var(--spd) var(--ease);
}
.featured-card::before {
  content:''; position:absolute; inset:0; border-radius:var(--rxl);
  background:linear-gradient(135deg,rgba(74,222,128,.04) 0%,transparent 60%);
  pointer-events:none;
}
.featured-card:hover {
  border-color:rgba(74,222,128,.35);
  box-shadow: 0 0 0 1px rgba(74,222,128,.1), var(--sh-lg);
}
.featured-img { position:relative; overflow:hidden; min-height:320px }
.featured-img img {
  width:100%; height:100%; object-fit:cover;
  transition:transform .5s var(--ease);
}
.featured-card:hover .featured-img img { transform:scale(1.04) }
.featured-overlay {
  position:absolute; bottom:0; left:0; right:0; height:55%;
  pointer-events:none;
  background:linear-gradient(to top,rgba(22,29,43,.85),transparent);
}
.featured-body {
  padding:2.25rem 2rem;
  display:flex; flex-direction:column; justify-content:center;
}

/* Post tag pills */
.post-tag {
  display:inline-flex; align-items:center; gap:.35rem;
  font-size:.68rem; font-weight:700; letter-spacing:.07em;
  text-transform:uppercase; padding:.25rem .7rem; border-radius:999px;
  margin-bottom:1rem; width:fit-content;
}
.tag--green  { background:var(--g-soft); border:1px solid rgba(74,222,128,.3);  color:var(--green) }
.tag--cyan   { background:var(--c-soft); border:1px solid rgba(56,189,248,.3);  color:var(--cyan) }
.tag--warn   { background:var(--w-soft); border:1px solid rgba(251,191,36,.3);  color:var(--warn) }
.tag--blue   { background:var(--b-soft); border:1px solid rgba(96,165,250,.3);  color:var(--blue) }
.tag--purple { background:var(--p-soft); border:1px solid rgba(167,139,250,.3); color:var(--purple) }
.tag--red    { background:var(--r-soft); border:1px solid rgba(248,113,113,.3); color:var(--red) }

.featured-body h2 {
  font-size:clamp(1.2rem,2.5vw,1.6rem);
  font-weight:800; color:var(--text); line-height:1.25;
  margin-bottom:.7rem; letter-spacing:-.02em;
}
.featured-body h2 a { color:inherit; transition:color var(--spd) }
.featured-body h2 a:hover { color:var(--green) }

.post-meta {
  display:flex; align-items:center; flex-wrap:wrap;
  gap:.6rem; font-size:.78rem; color:var(--t3); margin-bottom:1rem;
}
.post-meta .dot { color:var(--bd2) }

/* Full excerpt (no clamp) for featured post */
.excerpt-full {
  font-size:.93rem; color:var(--t2); line-height:1.85; margin-bottom:1.25rem;
}

/* Short excerpt for grid cards (clamped) */
.excerpt-short {
  font-size:.83rem; color:var(--t2); line-height:1.75;
  margin-bottom:1rem; flex:1;
  display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden;
}

.read-more {
  display:inline-flex; align-items:center; gap:.4rem;
  font-size:.84rem; font-weight:700; color:var(--green);
  transition:gap var(--spd) var(--ease);
}
.read-more:hover { gap:.7rem; color:#a7f3c9 }
.read-more svg { width:14px; height:14px; stroke:currentColor; fill:none; stroke-width:2 }

@media (max-width:820px) {
  .featured-card { grid-template-columns:1fr }
  .featured-img { min-height:220px }
  .featured-body { padding:1.5rem 1.25rem }
}

/* ============================================
   BLOG GRID
   ============================================ */
.blog-grid {
  display:grid; grid-template-columns:repeat(3,1fr); gap:1.25rem;
}
@media (max-width:900px) { .blog-grid { grid-template-columns:repeat(2,1fr) } }
@media (max-width:560px) { .blog-grid { grid-template-columns:1fr } }

.blog-card {
  background:var(--bg-card); border:1px solid var(--bd);
  border-radius:var(--rxl); overflow:hidden;
  display:flex; flex-direction:column;
  transition: border-color var(--spd) var(--ease),
              box-shadow var(--spd) var(--ease),
              transform var(--spd) var(--ease);
}
.blog-card:hover {
  border-color:rgba(74,222,128,.3);
  box-shadow: 0 0 0 1px rgba(74,222,128,.08), var(--sh-md);
  transform:translateY(-3px);
}
.card-img { position:relative; overflow:hidden; aspect-ratio:16/9 }
.card-img img {
  width:100%; height:100%; object-fit:cover;
  transition:transform .5s var(--ease);
}
.blog-card:hover .card-img img { transform:scale(1.06) }
.card-img-overlay {
  position:absolute; bottom:0; left:0; right:0; height:40%;
  background:linear-gradient(to top,rgba(22,29,43,.7),transparent);
  pointer-events:none;
}
.card-body {
  padding:1.25rem 1.35rem 1.4rem;
  display:flex; flex-direction:column; flex:1;
}
.card-body .post-tag { margin-bottom:.75rem }
.card-body h3 {
  font-size:1rem; font-weight:800; color:var(--text);
  line-height:1.3; margin-bottom:.5rem; letter-spacing:-.015em;
}
.card-body h3 a { color:inherit; transition:color var(--spd) }
.card-body h3 a:hover { color:var(--green) }
.card-footer {
  display:flex; align-items:center; justify-content:space-between;
  border-top:1px solid var(--bd); padding-top:.9rem; margin-top:auto;
}
.card-meta { font-size:.75rem; color:var(--t3) }

/* No results */
.no-results {
  display:none; grid-column:1/-1; text-align:center; padding:3rem 1rem;
}
.no-results-icon { font-size:2.5rem; margin-bottom:1rem }
.no-results h3 {
  font-family:var(--pixel); font-size:.55rem;
  color:var(--t3); letter-spacing:.08em; margin-bottom:.75rem;
}
.no-results p { color:var(--t2); font-size:.9rem }

/* ============================================
   WHY READ SECTION
   ============================================ */
.why-section {
  max-width:1200px; margin:4rem auto 0; padding:0 1.25rem;
}
.why-section h2 {
  font-size:clamp(1.2rem,3vw,1.55rem);
  font-weight:800; color:var(--text);
  margin-bottom:.5rem; letter-spacing:-.02em;
}
.why-section .why-sub {
  font-size:.95rem; color:var(--t2); line-height:1.8;
  max-width:700px; margin-bottom:1.75rem;
}
.why-grid {
  display:grid; grid-template-columns:repeat(3,1fr); gap:1.1rem;
}
@media (max-width:760px) { .why-grid { grid-template-columns:1fr } }
.why-card {
  background:var(--bg-card); border:1px solid var(--bd);
  border-radius:var(--rl); padding:1.35rem 1.5rem;
}
.why-card .wc-icon { font-size:1.6rem; margin-bottom:.65rem; display:block }
.why-card h3 {
  font-size:.95rem; font-weight:700; color:var(--text); margin-bottom:.5rem;
}
.why-card p { font-size:.85rem; color:var(--t2); line-height:1.75; margin:0 }

/* ============================================
   TOPICS OVERVIEW
   ============================================ */
.topics-section {
  max-width:1200px; margin:3.5rem auto 0; padding:0 1.25rem;
}
.topics-section h2 {
  font-size:clamp(1.2rem,3vw,1.55rem);
  font-weight:800; color:var(--text);
  margin-bottom:.5rem; letter-spacing:-.02em;
}
.topics-section .topics-sub {
  font-size:.95rem; color:var(--t2); line-height:1.8;
  max-width:720px; margin-bottom:1.5rem;
}
.topics-grid {
  display:grid; grid-template-columns:repeat(2,1fr); gap:1rem;
}
@media (max-width:600px) { .topics-grid { grid-template-columns:1fr } }
.topic-card {
  background:var(--bg-card); border:1px solid var(--bd);
  border-radius:var(--rl); padding:1.2rem 1.4rem;
  display:flex; align-items:flex-start; gap:1rem;
}
.topic-icon {
  font-size:1.5rem; flex-shrink:0; margin-top:2px;
}
.topic-text h3 {
  font-size:.95rem; font-weight:700; color:var(--text); margin-bottom:.35rem;
}
.topic-text p { font-size:.84rem; color:var(--t2); line-height:1.7; margin:0 }

/* ============================================
   FAQ SECTION
   ============================================ */
.faq-section {
  max-width:1200px; margin:3.5rem auto 0; padding:0 1.25rem;
}
.faq-section h2 {
  font-size:clamp(1.2rem,3vw,1.55rem);
  font-weight:800; color:var(--text);
  margin-bottom:.5rem; letter-spacing:-.02em;
}
.faq-section .faq-sub {
  font-size:.95rem; color:var(--t2); line-height:1.8; margin-bottom:1.5rem;
}
.faq-list { display:flex; flex-direction:column; gap:.75rem }
.faq-item {
  background:var(--bg-card); border:1px solid var(--bd);
  border-radius:var(--rl); overflow:hidden;
}
.faq-q {
  width:100%; background:none; border:none; text-align:left;
  padding:1.1rem 1.35rem; cursor:pointer; font-family:var(--sans);
  display:flex; align-items:center; justify-content:space-between; gap:1rem;
}
.faq-q-text {
  font-size:.95rem; font-weight:700; color:var(--text); line-height:1.4;
}
.faq-arrow {
  font-size:.75rem; color:var(--green); flex-shrink:0;
  transition:transform var(--spd) var(--ease);
}
.faq-item.open .faq-arrow { transform:rotate(180deg) }
.faq-a {
  max-height:0; overflow:hidden;
  transition:max-height .35s var(--ease);
}
.faq-a-inner {
  padding:0 1.35rem 1.1rem;
  font-size:.9rem; color:var(--t2); line-height:1.85;
  border-top:1px solid var(--bd);
  padding-top:1rem;
}
.faq-a-inner a { color:var(--green) }
.faq-item.open .faq-a { max-height:500px }

/* ============================================
   NEWSLETTER BANNER
   ============================================ */
.nl-banner {
  max-width:1200px; margin:3.5rem auto 0; padding:0 1.25rem;
}
.nl-inner {
  background:linear-gradient(135deg,rgba(74,222,128,.1),rgba(56,189,248,.05));
  border:1px solid rgba(74,222,128,.22);
  border-radius:var(--rxl); padding:2.25rem 2rem;
  display:flex; align-items:center; justify-content:space-between;
  gap:1.5rem; flex-wrap:wrap; position:relative; overflow:hidden;
}
.nl-inner::before {
  content:''; position:absolute; right:-40px; top:-40px;
  width:200px; height:200px;
  background:radial-gradient(circle,rgba(74,222,128,.1),transparent 70%);
  pointer-events:none;
}
.nl-text h3 {
  font-family:var(--pixel); font-size:.58rem;
  color:var(--green); letter-spacing:.1em; margin-bottom:.6rem;
}
.nl-text p { font-size:.92rem; color:var(--t2); line-height:1.7 }
.nl-form { display:flex; gap:.6rem; flex-wrap:wrap; flex-shrink:0 }
.nl-input {
  background:var(--bg-el); border:1px solid var(--bd2);
  border-radius:999px; padding:.6rem 1.1rem;
  font-size:.86rem; color:var(--text); font-family:var(--sans);
  outline:none; width:220px; transition:border-color var(--spd) var(--ease);
}
.nl-input::placeholder { color:var(--t3) }
.nl-input:focus { border-color:rgba(74,222,128,.5) }
.nl-input.error { border-color:rgba(239,68,68,.6) }
.nl-btn {
  background:var(--green); color:var(--inv);
  border:none; border-radius:999px; padding:.6rem 1.35rem;
  font-size:.86rem; font-weight:700; font-family:var(--sans); cursor:pointer;
  box-shadow:0 0 20px rgba(74,222,128,.3);
  transition:background var(--spd), box-shadow var(--spd);
}
.nl-btn:hover { background:#5af090; box-shadow:0 0 28px rgba(74,222,128,.5) }
.nl-btn.success { background:#22c55e }
@media (max-width:640px) {
  .nl-inner { flex-direction:column }
  .nl-input { width:100% }
  .nl-form { width:100% }
}

/* ============================================
   ABOUT / EDITORIAL STANDARDS
   ============================================ */
.about-section {
  max-width:1200px; margin:3.5rem auto 0; padding:0 1.25rem;
}
.about-inner {
  background:var(--bg-card); border:1px solid var(--bd);
  border-radius:var(--rxl); padding:2rem 2.5rem;
  display:grid; grid-template-columns:1fr 1fr; gap:2rem;
}
@media (max-width:700px) {
  .about-inner { grid-template-columns:1fr }
  .about-inner { padding:1.5rem 1.25rem }
}
.about-block h2 {
  font-size:1.1rem; font-weight:800; color:var(--text);
  margin-bottom:.75rem; letter-spacing:-.015em;
}
.about-block p {
  font-size:.88rem; color:var(--t2); line-height:1.85; margin-bottom:.85rem;
}
.about-block p:last-child { margin-bottom:0 }
.about-block strong { color:var(--text) }
.standards-list { list-style:none; display:flex; flex-direction:column; gap:.55rem }
.standards-list li {
  display:flex; align-items:flex-start; gap:.6rem;
  font-size:.88rem; color:var(--t2); line-height:1.7;
}
.standards-list li::before {
  content:'✓'; color:var(--green); font-weight:700;
  flex-shrink:0; margin-top:1px;
}

/* ============================================
   FOOTER
   ============================================ */
.ftr {
  background:var(--bg-2); border-top:1px solid var(--bd);
  margin-top:4rem;
}
.ftr-grid {
  max-width:1280px; margin:0 auto;
  padding:3rem 1.25rem 2.5rem;
  display:grid; grid-template-columns:1fr; gap:2rem;
}
@media (min-width:640px) { .ftr-grid { grid-template-columns:repeat(2,1fr) } }
@media (min-width:960px) { .ftr-grid { grid-template-columns:2fr 1fr 1fr } }
.fb { display:flex; flex-direction:column; gap:.7rem }
.f-logo { font-family:var(--pixel); font-size:.62rem; color:var(--green); letter-spacing:.1em }
.fb p { font-size:.86rem; color:var(--t3); line-height:1.7 }
.fcol h4 {
  font-family:var(--pixel); font-size:.46rem;
  color:var(--t2); letter-spacing:.08em; margin-bottom:.9rem;
}
.fcol ul { list-style:none; display:flex; flex-direction:column; gap:.45rem }
.fcol ul li a { font-size:.86rem; color:var(--t3); transition:color var(--spd) }
.fcol ul li a:hover { color:var(--green) }
.fbar { border-top:1px solid var(--bd); padding:1.2rem 0 }
.fbar-in {
  max-width:1280px; margin:0 auto; padding:0 1.25rem;
  display:flex; align-items:center;
  justify-content:space-between; flex-wrap:wrap; gap:.5rem;
}
.fbar-in small { font-size:.76rem; color:var(--t3) }
.fbar-in small a { color:var(--t3) }
.fbar-in small a:hover { color:var(--green) }
.totop {
  display:inline-flex; align-items:center; justify-content:center;
  width:30px; height:30px; border-radius:50%;
  background:var(--bg-el); border:1px solid var(--bd);
  color:var(--t3); font-size:.85rem;
  transition:all var(--spd) var(--ease); text-decoration:none;
}
.totop:hover { border-color:var(--green); color:var(--green) }