/* JuChunDo WordPress theme — mirrors the React/Tailwind app design system
   App tokens: black bg, crimson primary, gold accent, Cinzel + Inter
   ─────────────────────────────────────────────────────────────── */
@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400;500;600;700;800;900&family=Inter:wght@300;400;500;600;700&display=swap');

:root{
  --bg:            hsl(0 0% 4%);
  --bg-2:          hsl(0 0% 2%);
  --card:          hsl(0 0% 7%);
  --fg:            hsl(40 15% 92%);
  --muted:         hsl(40 8% 50%);
  --muted-soft:    hsl(40 8% 50% / .5);
  --border:        hsl(0 0% 14%);
  --border-soft:   hsl(0 0% 14% / .5);
  --primary:       hsl(0 85% 42%);
  --primary-dark:  hsl(0 85% 28%);
  --gold:          hsl(43 85% 48%);
  --gold-light:    hsl(43 70% 62%);
  --gold-dark:     hsl(40 60% 32%);
  --radius:        .5rem;
}

*,*::before,*::after{ box-sizing:border-box; }
html,body{ margin:0; padding:0; }
body{
  background:var(--bg);
  color:var(--fg);
  font-family:'Inter',system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  font-size:16px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
img{ max-width:100%; height:auto; display:block; }
a{ color:inherit; text-decoration:none; }
::selection{ background:hsl(0 85% 42% / .3); color:hsl(40 15% 95%); }

h1,h2,h3,h4,h5,h6{ font-family:'Cinzel',serif; font-weight:600; line-height:1.15; margin:0; }
.text-crimson{ color:var(--primary); }
.text-gold{ color:var(--gold); }

.container{ width:100%; max-width:1200px; margin:0 auto; padding:0 1rem; }
@media(min-width:1024px){ .container{ padding:0 2rem; } }

/* ───── Header ───── */
.site-header{
  position:sticky; top:0; z-index:50;
  background:hsl(0 0% 4% / .85);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid var(--border);
}
.site-header-inner{
  display:flex; align-items:center; justify-content:space-between;
  height:72px;
}
.site-brand{ display:flex; align-items:center; gap:.75rem; }
.brand-seal{ height:36px; width:auto; }
.brand-wordmark{
  font-family:'Cinzel',serif; font-weight:700; font-size:1.25rem; letter-spacing:.02em;
  color:var(--fg);
}
.brand-accent{ color:var(--primary); }

.primary-nav{ display:none; align-items:center; gap:1.75rem; }
.primary-nav a{
  font-size:.8rem; font-weight:500; letter-spacing:.18em; text-transform:uppercase;
  color:var(--muted); transition:color .2s ease;
}
.primary-nav a:hover{ color:var(--gold); }
.primary-nav .nav-cta a{ color:var(--fg); letter-spacing:.1em; }
@media(min-width:960px){ .primary-nav{ display:flex; } .mobile-toggle{ display:none; } }

.mobile-toggle{ background:none; border:0; color:var(--fg); cursor:pointer; padding:.5rem; }
.mobile-menu{ display:none; padding:1rem; border-top:1px solid var(--border); background:var(--bg-2); }
.mobile-menu a{ display:block; padding:.6rem 0; color:var(--muted); letter-spacing:.18em; text-transform:uppercase; font-size:.8rem; }
.mobile-menu.is-open{ display:block; }

/* ───── Buttons (match app) ───── */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.5rem;
  border-radius:var(--radius); border:1px solid transparent;
  font-weight:600; cursor:pointer; transition:all .25s ease;
  font-family:'Inter',sans-serif;
}
.btn-sm{ padding:.5rem 1rem; font-size:.75rem; letter-spacing:.1em; text-transform:uppercase; }
.btn-lg{ padding:1rem 2.5rem; font-size:.8rem; letter-spacing:.12em; text-transform:uppercase; }
.btn-primary{
  background:var(--primary); color:hsl(40 20% 95%);
}
.btn-primary:hover{
  background:hsl(0 85% 38%);
  box-shadow:0 0 30px hsl(0 85% 42% / .3);
}
.btn-ghost-gold{
  background:transparent; color:var(--gold);
  border:1px solid hsl(43 85% 48% / .3);
}
.btn-ghost-gold:hover{
  background:hsl(43 85% 48% / .05);
  border-color:hsl(43 85% 48% / .5);
}

/* ───── Shared section bits ───── */
.jcd-section{ padding:6rem 0; position:relative; }
@media(min-width:1024px){ .jcd-section{ padding:8rem 0; } }

.jcd-eyebrow{
  color:var(--gold); font-family:'Cinzel',serif;
  font-size:.7rem; letter-spacing:.4em; text-transform:uppercase;
  margin:0 0 .75rem;
}
.jcd-divider{
  width:64px; height:1px; margin:0 auto 1.5rem;
  background:linear-gradient(90deg, transparent, hsl(43 85% 48% / .4), transparent);
}
.jcd-divider-wide{
  width:100%; height:1px;
  background:linear-gradient(90deg, transparent, var(--border), transparent);
}
.jcd-section-head{ text-align:center; margin-bottom:4rem; }
.jcd-section-title{
  font-size:clamp(1.75rem, 4vw, 3rem); font-weight:700;
  color:var(--fg); margin-bottom:1.5rem;
}
.jcd-center-narrow{ max-width:48rem; margin:0 auto; text-align:center; }
.jcd-body{
  color:var(--muted); line-height:1.75; font-size:1rem; margin:0 0 1.5rem;
}
.jcd-quote{
  border-left:2px solid hsl(43 85% 48% / .3);
  padding-left:1.5rem; margin:2rem auto;
  color:var(--muted); font-style:italic; text-align:left; max-width:32rem;
}

/* ───── Hero ───── */
.jcd-hero{
  position:relative; overflow:hidden;
  min-height:90vh; display:flex; align-items:center;
}
.jcd-hero-bg{
  position:absolute; inset:0;
  background:linear-gradient(180deg,
    hsl(0 0% 2%) 0%,
    hsl(0 0% 5%) 40%,
    hsl(0 50% 6%) 100%);
}
.jcd-hero-rings{
  position:absolute; inset:0; opacity:.03; pointer-events:none;
}
.jcd-hero-rings .ring{
  position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
  border-radius:9999px;
}
.jcd-hero-rings .r1{ width:800px; height:800px; border:1px solid hsl(43 85% 48% / .2); }
.jcd-hero-rings .r2{ width:600px; height:600px; border:1px solid hsl(0 85% 42% / .3); }
.jcd-hero-rings .r3{ width:400px; height:400px; border:1px solid hsl(43 85% 48% / .1); }

.jcd-hero-rule{
  position:absolute; top:0; bottom:0; width:1px;
  background:linear-gradient(180deg, transparent, hsl(0 85% 42% / .1), transparent);
  display:none;
}
@media(min-width:1024px){ .jcd-hero-rule{ display:block; } }
.jcd-hero-rule.left{ left:2rem; }
.jcd-hero-rule.right{ right:2rem; background:linear-gradient(180deg, transparent, hsl(43 85% 48% / .1), transparent); }
.jcd-hero-rule.bottom{
  top:auto; bottom:0; left:0; right:0; width:auto; height:1px;
  background:linear-gradient(90deg, transparent, hsl(0 85% 42% / .2), transparent);
  display:block;
}

.jcd-hero-inner{
  position:relative; z-index:1;
  text-align:center; max-width:56rem; margin:0 auto;
  padding:6rem 1rem;
}
@media(min-width:1024px){ .jcd-hero-inner{ padding:8rem 2rem; } }
.jcd-hero-seal{
  height:160px; width:auto; margin:0 auto 2rem;
}
@media(min-width:768px){ .jcd-hero-seal{ height:208px; } }
.jcd-hero-title{
  font-size:clamp(3rem, 9vw, 8rem); font-weight:700; letter-spacing:-.02em;
  margin:0 0 1rem;
}
.jcd-hero-subtitle{
  color:var(--gold); font-family:'Cinzel',serif;
  font-size:clamp(1.125rem, 2vw, 1.5rem); margin:0 0 1rem; letter-spacing:.02em;
}
.jcd-hero-lead{
  color:var(--muted); max-width:36rem; margin:0 auto 3rem;
  font-size:.95rem; line-height:1.75;
}
.jcd-hero-cta{
  display:flex; flex-direction:column; gap:1rem; justify-content:center;
}
@media(min-width:640px){ .jcd-hero-cta{ flex-direction:row; } }

/* ───── Stats ───── */
.jcd-stats{
  padding:3rem 0; background:var(--card); border-bottom:1px solid var(--border);
}
.jcd-stats-grid{
  display:grid; grid-template-columns:repeat(2,1fr); gap:2rem;
}
@media(min-width:768px){ .jcd-stats-grid{ grid-template-columns:repeat(4,1fr); gap:1rem; } }
.jcd-stat{ text-align:center; }
.jcd-stat-number{
  font-family:'Cinzel',serif; font-weight:700;
  font-size:clamp(2rem, 4vw, 3rem);
  background:linear-gradient(180deg, var(--gold), var(--gold-dark));
  -webkit-background-clip:text; background-clip:text; color:transparent;
  margin:0;
}
.jcd-stat-label{
  font-size:.7rem; color:var(--muted);
  text-transform:uppercase; letter-spacing:.2em; margin:.5rem 0 0;
}

/* ───── Philosophy ───── */
.jcd-philosophy{ background:var(--bg); }

/* ───── Features grid ───── */
.jcd-features{ background:var(--card); }
.jcd-feature-grid{
  display:grid; grid-template-columns:1fr; gap:1.5rem;
}
@media(min-width:768px){ .jcd-feature-grid{ grid-template-columns:repeat(2,1fr); } }
@media(min-width:1024px){ .jcd-feature-grid{ grid-template-columns:repeat(3,1fr); gap:2rem; } }
.jcd-feature-card{
  position:relative; display:block; padding:2rem;
  background:var(--bg); border:1px solid var(--border); border-radius:var(--radius);
  overflow:hidden;
  transition:border-color .3s ease, box-shadow .3s ease, transform .3s ease;
}
.jcd-feature-card:hover{
  border-color:hsl(0 85% 42% / .25);
  box-shadow:0 0 40px hsl(0 85% 42% / .1);
}
.jcd-feature-rule{
  position:absolute; top:0; left:0; right:0; height:1px;
  background:linear-gradient(90deg, transparent, hsl(0 85% 42% / .2), transparent);
  opacity:0; transition:opacity .3s ease;
}
.jcd-feature-card:hover .jcd-feature-rule{ opacity:1; }
.jcd-feature-icon{
  display:inline-flex; color:var(--primary); margin-bottom:1.25rem;
  transition:color .3s ease;
}
.jcd-feature-card:hover .jcd-feature-icon{ color:var(--gold); }
.jcd-feature-title{
  font-size:1.125rem; font-weight:600; color:var(--fg);
  margin:0 0 .75rem; transition:color .3s ease;
}
.jcd-feature-card:hover .jcd-feature-title{ color:var(--gold); }
.jcd-feature-desc{
  font-size:.875rem; color:var(--muted); line-height:1.65; margin:0 0 1rem;
}
.jcd-feature-link{
  font-size:.75rem; color:hsl(43 85% 48% / .6);
  display:inline-flex; align-items:center; gap:.25rem;
  transition:color .3s ease;
}
.jcd-feature-card:hover .jcd-feature-link{ color:var(--gold); }

/* ───── Founder quote ───── */
.jcd-founder{
  padding:5rem 0; background:var(--card);
  border-top:1px solid var(--border); border-bottom:1px solid var(--border);
}
.jcd-quote-mark{
  font-family:'Cinzel',serif; font-size:3rem;
  color:hsl(0 85% 42% / .2); margin-bottom:1rem; line-height:1;
}
.jcd-founder-quote{
  font-size:clamp(1.125rem, 1.5vw, 1.25rem);
  color:hsl(40 15% 92% / .8); font-style:italic; line-height:1.65;
  margin:0 0 1.5rem;
}
.jcd-founder-attribution{
  color:var(--gold); font-family:'Cinzel',serif;
  font-size:.7rem; letter-spacing:.3em; text-transform:uppercase; margin:0;
}

/* ───── CTA ───── */
.jcd-cta{ position:relative; overflow:hidden; }
.jcd-cta .jcd-hero-bg{ position:absolute; inset:0; }
.jcd-cta .container{ position:relative; z-index:1; }

/* ───── Footer ───── */
.site-footer{
  background:var(--card); border-top:1px solid var(--border);
  padding:4rem 0 2rem; position:relative;
}
.site-footer::before{
  content:""; position:absolute; top:0; left:0; right:0; height:1px;
  background:linear-gradient(90deg, transparent, hsl(0 85% 42% / .15), transparent);
}
.footer-grid{
  display:grid; grid-template-columns:1fr; gap:3rem;
}
@media(min-width:768px){ .footer-grid{ grid-template-columns:repeat(2,1fr); } }
@media(min-width:1024px){ .footer-grid{ grid-template-columns:repeat(4,1fr); } }
.footer-col h4{
  font-family:'Inter',sans-serif; font-size:.625rem; color:var(--gold);
  letter-spacing:.3em; text-transform:uppercase; margin:0 0 1.25rem;
}
.footer-col ul{ list-style:none; padding:0; margin:0; }
.footer-col li + li{ margin-top:.75rem; }
.footer-col a{ font-size:.875rem; color:var(--muted); transition:color .2s; }
.footer-col a:hover{ color:var(--fg); }
.footer-brand-text{ font-size:.875rem; color:var(--muted); line-height:1.65; margin:.75rem 0 1.5rem; }
.footer-bottom{
  margin-top:3rem; padding-top:2rem; border-top:1px solid var(--border-soft);
  display:flex; flex-direction:column; gap:1rem; align-items:center; justify-content:space-between;
}
@media(min-width:768px){ .footer-bottom{ flex-direction:row; } }
.footer-bottom p{ font-size:.7rem; color:hsl(40 8% 50% / .5); margin:0; }
.footer-kanji{ font-family:'Cinzel',serif; letter-spacing:.3em; }

/* Skip link */
.skip-link{ position:absolute; left:-9999px; }
.skip-link:focus{ left:1rem; top:1rem; background:var(--card); padding:.5rem 1rem; z-index:100; }

/* ───── Single / archive content ───── */
.site-main{ min-height:50vh; }
.entry-content{ max-width:48rem; margin:0 auto; padding:4rem 1rem; }
.entry-content p{ color:var(--muted); margin:0 0 1.25rem; line-height:1.8; }
.entry-content h2,.entry-content h3{ color:var(--fg); margin:2rem 0 1rem; }
.entry-title{ font-size:clamp(2rem, 4vw, 3rem); color:var(--fg); margin-bottom:1rem; }