/* ============================================================
   CannBus home / landing page styles (redesign v2, 2026-07)
   Loaded only by core/templates/core/landing.html
   Scoped under .cb-landing so nothing leaks to other pages.
   Brand: yellow #FFB703 / green #0F6E55 / purple #6A4C93
   Section backgrounds alternate: white / cream #FDFBF3 / band #FFF4D7
   ============================================================ */
.cb-landing { --cb-yellow:#FFB703; --cb-green:#0F6E55; --cb-purple:#6A4C93;
              --cb-cream:#FDFBF3; --cb-band:#FFF4D7; --cb-ink:#1A1A1A; --cb-muted:#55635C;
              --cb-line:#E7EFE9; --cb-green-soft:#EAF4F0;
              font-family:'Inter',system-ui,Arial,sans-serif; color:var(--cb-ink); }
.cb-landing .cb-serif { font-family:'EB Garamond',Georgia,'Times New Roman',serif; }

/* ---- Buttons ---- */
.cb-btn { display:inline-block; padding:12px 26px; border-radius:8px; font-weight:600; font-size:.98rem;
          text-decoration:none; transition:all .2s ease; border:1.5px solid transparent; }
.cb-btn-primary { background:var(--cb-yellow); color:var(--cb-ink); }
.cb-btn-primary:hover { background:#E6A502; color:var(--cb-ink); transform:translateY(-1px); box-shadow:0 6px 16px rgba(255,183,3,.35); }
.cb-btn-outline { border-color:var(--cb-green); color:var(--cb-green); background:transparent; }
.cb-btn-outline:hover { background:var(--cb-green); color:#fff; }

/* ---- 1. HERO (white) ---- */
.cb-hero { background:linear-gradient(180deg,#FFFFFF 0%, var(--cb-cream) 55%, var(--cb-cream) 100%); padding:56px 0 48px; }
.cb-eyebrow { display:inline-flex; align-items:center; gap:10px; color:var(--cb-green);
              font-size:.78rem; font-weight:600; letter-spacing:.14em; text-transform:uppercase; margin-bottom:14px; }
.cb-eyebrow::before { content:""; width:18px; height:2px; background:var(--cb-green); display:inline-block; }
.cb-h1 { font-weight:700; font-size:clamp(2.2rem, 4.6vw, 3.4rem); line-height:1.1; margin-bottom:16px; color:var(--cb-ink); }
.cb-h1 em { color:var(--cb-purple); font-style:italic; font-weight:500; }
.cb-hero-sub { color:var(--cb-muted); font-size:1.06rem; line-height:1.65; max-width:34rem; margin-bottom:28px; }

/* ---- 2. HUB & SPOKE DIAGRAM (in hero, right column) — adopted from the Claude Design version ---- */
.cbh-wrap { position:relative; width:100%; max-width:500px; aspect-ratio:1/1; margin:0 auto; }
.cbh-svg { position:absolute; inset:0; width:100%; height:100%; }
.cbh-spoke { stroke:#0F6E55; stroke-opacity:.28; stroke-width:1.5; stroke-dasharray:4 8;
             animation:cb-dash 2.4s linear infinite; }
.cbh-ring { fill:none; stroke:#0F6E55; stroke-width:1; }
.cbh-hub { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);
           width:128px; height:128px; border-radius:50%; background:var(--cb-green);
           display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2px;
           animation:cb-pulse 3s ease-in-out infinite; }
.cbh-hub-dot { width:14px; height:14px; border-radius:50%; background:var(--cb-yellow); margin-bottom:4px; }
.cbh-hub-name { font-family:'EB Garamond',Georgia,serif; font-size:24px; font-weight:700; color:#fff; }
.cbh-sat { position:absolute; transform:translate(-50%,-50%); background:#fff; border:1px solid #e6e0cf;
           border-radius:12px; padding:10px 16px; text-align:center;
           box-shadow:0 3px 12px rgba(26,26,26,.07); min-width:88px; }
.cbh-sat-label { font-size:13px; font-weight:600; color:var(--cb-ink); }
.cbh-sat-value { font-size:11px; font-weight:600; letter-spacing:.06em; margin-top:2px; }
@keyframes cb-pulse { 0%,100% { box-shadow:0 0 0 0 rgba(15,110,85,.25); } 50% { box-shadow:0 0 0 18px rgba(15,110,85,0); } }
@keyframes cb-dash { to { stroke-dashoffset:-24; } }
@media (prefers-reduced-motion: reduce) { .cbh-spoke, .cbh-hub { animation:none; } }
@media (max-width: 991.98px) { .cbh-wrap { max-width:420px; margin-top:10px; } }
@media (max-width: 575.98px) {
    .cbh-hub { width:104px; height:104px; }
    .cbh-hub-name { font-size:19px; }
    .cbh-sat { padding:7px 10px; min-width:70px; }
    .cbh-sat-label { font-size:11.5px; }
    .cbh-sat-value { font-size:9.5px; }
}

/* ---- 3. STATS BAND (deep cream band, bordered — Claude Design treatment) ---- */
.cb-stats { background:var(--cb-band); border-top:1px solid #f0e4bd; border-bottom:1px solid #f0e4bd; padding:40px 0; }
.cb-stat { text-align:center; padding:18px 8px; background:#fff; border:1px solid var(--cb-line); border-radius:12px; height:100%; }
.cb-stat-num { font-family:'EB Garamond',Georgia,serif; font-weight:600; font-size:2.5rem; color:var(--cb-green); line-height:1; }
.cb-stat-label { color:#6b6555; font-size:.84rem; font-weight:500; letter-spacing:.04em; margin-top:8px; }

/* ---- 4. TRUST BAR (brand green) ---- */
.cb-trustbar { background:var(--cb-green); padding:16px 0; }
.cb-trustbar .container { display:flex; flex-wrap:wrap; gap:10px 28px; justify-content:center; }
.cb-trust-item { color:#D7EAE1; font-size:.9rem; display:flex; align-items:center; gap:8px; }
.cb-trust-item::before { content:""; width:6px; height:6px; border-radius:50%; background:var(--cb-yellow); display:inline-block; }

/* ---- Section chrome ---- */
.cb-section { padding:56px 0; }
.cb-sec-white { background:#FFFFFF; }
.cb-sec-cream { background:var(--cb-cream); }
.cb-sec-head { display:flex; flex-wrap:wrap; align-items:end; justify-content:space-between; gap:12px; margin-bottom:28px; }
.cb-sec-head h2 { font-weight:700; font-size:clamp(1.5rem, 2.6vw, 2.1rem); margin:0; color:var(--cb-ink); }
.cb-sec-kicker { color:var(--cb-green); font-size:.76rem; font-weight:600; letter-spacing:.13em; text-transform:uppercase; margin-bottom:6px; }
.cb-viewall { color:var(--cb-green); font-weight:600; font-size:.92rem; text-decoration:none; white-space:nowrap; }
.cb-viewall:hover { color:var(--cb-purple); }

/* ---- 5/6. Recall & news cards ---- */
.cb-card { background:#fff; border:1px solid var(--cb-line); border-radius:12px; padding:20px; height:100%;
           display:flex; flex-direction:column; transition:all .22s ease; }
.cb-card:hover { transform:translateY(-4px); box-shadow:0 10px 24px rgba(0,0,0,.08); border-color:#CBE3DA; }
.cb-card-meta { color:var(--cb-muted); font-size:.8rem; margin-bottom:8px; }
.cb-card h3 { font-size:1rem; font-weight:700; line-height:1.4; margin-bottom:8px; color:var(--cb-ink); }
.cb-card p { color:var(--cb-muted); font-size:.88rem; line-height:1.55; margin-bottom:12px; }
.cb-card-link { margin-top:auto; color:var(--cb-green); font-weight:600; font-size:.85rem; text-decoration:none; }
.cb-card-link:hover { color:var(--cb-purple); }
.cb-badge { display:inline-block; font-size:.7rem; font-weight:700; letter-spacing:.05em; text-transform:uppercase;
            border-radius:20px; padding:3px 10px; margin-bottom:10px; background:var(--cb-green-soft); color:var(--cb-green); }
.cb-rt-mandatory { background:#FBEAEA; color:#B3261E; }
.cb-rt-voluntary { background:#FFF3D6; color:#8A6100; }
.cb-rt-expanded  { background:#F4EDFA; color:var(--cb-purple); }

/* ---- 7. Feature cards ---- */
.cb-feature { background:#fff; border:1px solid var(--cb-line); border-radius:14px; padding:26px 24px; height:100%;
              display:flex; flex-direction:column; text-decoration:none; color:inherit; transition:all .22s ease; }
.cb-feature:hover { transform:translateY(-5px); border-color:var(--cb-green); box-shadow:0 12px 28px rgba(15,110,85,.10); color:inherit; }
.cb-feature-icon { width:46px; height:46px; border-radius:10px; background:var(--cb-green-soft); color:var(--cb-green);
                   display:flex; align-items:center; justify-content:center; font-size:1.15rem; margin-bottom:16px; }
.cb-feature h3 { font-size:1.08rem; font-weight:700; margin-bottom:8px; color:var(--cb-ink); }
.cb-feature p { color:var(--cb-muted); font-size:.93rem; line-height:1.6; margin-bottom:14px; }
.cb-feature .cb-feature-go { margin-top:auto; color:var(--cb-green); font-weight:600; font-size:.87rem; }
.cb-feature-tag { display:inline-block; background:#F4EDFA; color:var(--cb-purple); font-size:.7rem; font-weight:700;
                  letter-spacing:.06em; text-transform:uppercase; border-radius:20px; padding:3px 10px; margin-left:8px; vertical-align:middle; }

/* ---- 8. CTA band ---- */
.cb-cta-sec { background:var(--cb-cream); padding:56px 0; }
.cb-cta { background:var(--cb-green); border-radius:18px; padding:48px 30px; text-align:center; }
.cb-cta h2 { color:#fff; font-weight:700; font-size:clamp(1.5rem, 2.6vw, 2.1rem); margin-bottom:10px; }
.cb-cta p { color:#D7EAE1; max-width:38rem; margin:0 auto 24px; }
.cb-cta .cb-btn-outline { border-color:#fff; color:#fff; }
.cb-cta .cb-btn-outline:hover { background:#fff; color:var(--cb-green); }

/* ---- Retained styles for the admin-managed sections ---- */
.ba-news-card, .ba-resource-card { position:relative; cursor:pointer; display:flex; flex-direction:column; height:100%;
    min-height:360px; width:100%; background:#fff; border-radius:12px; overflow:hidden;
    box-shadow:0 4px 20px rgba(0,0,0,0.06); transition:all .3s ease; border:1px solid rgba(0,0,0,0.03); }
.ba-news-card:hover, .ba-resource-card:hover { transform:translateY(-8px); box-shadow:0 10px 30px rgba(0,0,0,0.12); border-color:rgba(15,110,85,.25); }
.ba-admin-edit-item { position:absolute; top:10px; right:10px; z-index:10; background:rgba(255,255,255,.9); border-radius:50%;
    width:35px; height:35px; display:flex; align-items:center; justify-content:center; box-shadow:0 2px 5px rgba(0,0,0,.2); color:#333; transition:all .3s ease; }
.ba-admin-edit-item:hover { background:#0F6E55; color:#fff; transform:scale(1.1); }
.ba-admin-edit-section { display:inline-flex; align-items:center; margin-left:15px; font-size:.5em; vertical-align:middle; color:#0F6E55; }
.pagination-container { display:flex; justify-content:center; margin-top:20px; gap:5px; }
.pagination-btn { padding:5px 12px; border:1px solid #ddd; border-radius:4px; background:#fff; cursor:pointer; }
.pagination-btn.active { background:#0F6E55; color:#fff; border-color:#0F6E55; }
.pagination-btn:disabled { opacity:.5; cursor:not-allowed; }
.ba-news-img, .ba-resource-img { width:100%; height:220px; object-fit:cover; background-color:#f8f9fa; }
.ba-news-content, .ba-resource-content { flex-grow:1; display:flex; flex-direction:column; padding:25px; }
.ba-news-content h3, .ba-resource-content h3 { font-size:1.3rem; font-weight:700; margin-bottom:15px; color:#1a1a1a; line-height:1.3; }
.ba-news-content p, .ba-resource-content p { font-size:1rem; color:#555; margin-bottom:20px; line-height:1.6; }
.ba-read-more, .ba-resource-link { margin-top:auto; font-size:.9rem; font-weight:700; color:#0F6E55; display:flex; align-items:center; gap:5px; text-transform:uppercase; letter-spacing:.8px; }