/*
 * cecypo.com — Shared design system (CL prefix)
 * Extracted from inline <style> blocks to reduce per-page token cost.
 * Include in every com page: <link rel="stylesheet" href="/assets/cecypo_builder_site/css/com-styles.css">
 * Page-specific CSS (hero, sections, cards) stays inline after this link.
 */

/* ── Tokens ── */
:root {
  --cl-blue:   #33669A;
  --cl-blue-d: #274f7a;
  --cl-blue-l: #e8f0f8;
  --cl-text:   #1a1a1a;
  --cl-muted:  #6b7280;
}

/* ── Base reset ── */
.navbar, .web-footer { display:none!important; }
.cl-page * { box-sizing:border-box; }
.cl-page a { text-decoration:none; }
.cl-page img { display:block; }
body { margin:0; font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif; }

/* ── Navbar ── */
.cl-nav { position:sticky;top:0;z-index:50;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.08); }
.cl-nav__inner { max-width:1200px;margin:0 auto;padding:0 1.5rem;height:68px;display:flex;align-items:center;justify-content:space-between;gap:1rem; }
.cl-nav__logo img { height:44px;width:auto; }
.cl-nav__links { display:flex;align-items:center;gap:2rem;list-style:none;margin:0;padding:0; }
.cl-nav__links a { font-size:.9rem;font-weight:500;color:var(--cl-text);transition:color .2s; }
.cl-nav__links a:hover { color:var(--cl-blue); }
.cl-nav__links a.active { color:var(--cl-blue);border-bottom:2px solid var(--cl-blue);padding-bottom:2px; }
.cl-nav__cta { background:var(--cl-blue);color:#fff!important;padding:.55em 1.25em;border-radius:4px;font-size:.875rem;font-weight:600;transition:background .2s; }
.cl-nav__cta:hover { background:var(--cl-blue-d)!important;color:#fff!important; }
.cl-nav__burger { display:none;background:none;border:none;cursor:pointer;padding:4px;color:var(--cl-text); }
.cl-nav__mobile { display:none;background:#fff;border-top:1px solid #e5e7eb;padding:1rem 1.5rem;flex-direction:column;gap:1rem; }
.cl-nav__mobile a { font-size:.95rem;font-weight:500;color:var(--cl-text); }
.cl-nav__mobile a:hover { color:var(--cl-blue); }
.cl-nav__mobile--open { display:flex; }
@media(max-width:768px){.cl-nav__links{display:none;}.cl-nav__burger{display:block;}}

/* ── Footer ── */
.cl-footer { background:#111827;color:#9ca3af;padding:4rem 1.5rem 2rem; }
.cl-footer__inner { max-width:1200px;margin:0 auto;display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:3rem;margin-bottom:3rem; }
.cl-footer__brand img { height:36px;width:auto;margin-bottom:1rem; }
.cl-footer__brand p { font-size:.875rem;line-height:1.7;max-width:30ch; }
.cl-footer__col h4 { font-size:.8rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:#f9fafb;margin:0 0 1rem; }
.cl-footer__col ul { list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.6rem; }
.cl-footer__col a { font-size:.875rem;color:#9ca3af;transition:color .2s; }
.cl-footer__col a:hover { color:#fff; }
.cl-footer__bottom { max-width:1200px;margin:0 auto;padding-top:2rem;border-top:1px solid #1f2937;display:flex;justify-content:space-between;flex-wrap:wrap;gap:.5rem;font-size:.8rem; }
@media(max-width:900px){.cl-footer__inner{grid-template-columns:1fr 1fr;}}
@media(max-width:600px){.cl-footer__inner{grid-template-columns:1fr;gap:2rem;}}

/* ── Reveal animation ── */
.cl-reveal{opacity:0;transform:translateY(20px);transition:opacity .5s ease,transform .5s ease;}
.cl-reveal.cl-in{opacity:1;transform:none;}