/* ClaudeAIGuide.com — Global Stylesheet */
:root {
  --navy: #1B2B5E;
  --navy-dark: #0D1A3A;
  --gold: #C9A84C;
  --gold-light: #E8C96A;
  --gold-pale: #F5EDD6;
  --white: #FFFFFF;
  --off-white: #F8F7F4;
  --gray-light: #F0EEE9;
  --gray-mid: #888888;
  --gray-dark: #333333;
  --teal: #0E6B6B;
  --green: #1A6B3A;
  --border: #E0DDD6;
  --lgray: #F4F6FA;
}
* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { font-family:'Source Sans 3',sans-serif; color:var(--gray-dark); background:var(--white); line-height:1.75; }

/* NAV */
nav { background:var(--navy-dark); padding:0 5%; display:flex; align-items:center; justify-content:space-between; height:66px; position:sticky; top:0; z-index:100; border-bottom:3px solid var(--gold); }
.nav-logo { font-family:'Playfair Display',serif; font-size:1.25rem; color:var(--white); text-decoration:none; }
.nav-logo span { color:var(--gold); }
.nav-links { display:flex; gap:28px; list-style:none; }
.nav-links a { color:#AABBCC; text-decoration:none; font-size:0.85rem; font-weight:600; letter-spacing:0.05em; text-transform:uppercase; transition:color 0.2s; }
.nav-links a:hover { color:var(--gold); }
.nav-cta { background:var(--gold); color:var(--navy-dark) !important; padding:7px 18px; border-radius:4px; font-weight:700 !important; }
.nav-cta:hover { background:var(--gold-light) !important; }

/* ARTICLE LAYOUT */
.article-hero { background:var(--navy-dark); padding:56px 5% 48px; position:relative; overflow:hidden; }
.article-hero::after { content:''; position:absolute; bottom:0; left:0; right:0; height:3px; background:linear-gradient(90deg,transparent,var(--gold),transparent); }
.article-hero-inner { max-width:820px; margin:0 auto; }
.article-cat { display:inline-block; background:rgba(201,168,76,0.15); border:1px solid rgba(201,168,76,0.35); color:var(--gold); font-size:0.72rem; font-weight:700; letter-spacing:0.12em; text-transform:uppercase; padding:5px 14px; border-radius:14px; margin-bottom:18px; }
.article-hero h1 { font-family:'Playfair Display',serif; font-size:clamp(1.9rem,4vw,3rem); color:var(--white); line-height:1.15; margin-bottom:18px; letter-spacing:-0.02em; }
.article-meta { font-size:0.82rem; color:#778899; }
.article-meta span { margin:0 8px; }

.article-body { max-width:820px; margin:0 auto; padding:52px 5%; }
.article-body h2 { font-family:'Playfair Display',serif; font-size:1.6rem; color:var(--navy); margin:36px 0 14px; line-height:1.25; }
.article-body h3 { font-size:1.1rem; font-weight:700; color:var(--navy); margin:24px 0 10px; }
.article-body p { font-size:1rem; line-height:1.8; margin-bottom:18px; color:var(--gray-dark); }
.article-body ul, .article-body ol { margin:0 0 18px 24px; }
.article-body li { font-size:1rem; line-height:1.75; margin-bottom:8px; }
.article-body strong { color:var(--navy); }

/* CALLOUT BOXES */
.callout { border-radius:10px; padding:20px 24px; margin:28px 0; }
.callout-blue { background:var(--lgray); border-left:4px solid var(--navy); }
.callout-gold { background:var(--gold-pale); border-left:4px solid var(--gold); }
.callout-green { background:#EAFAF1; border-left:4px solid var(--green); }
.callout p { margin-bottom:0; }
.callout strong { display:block; margin-bottom:6px; font-size:0.85rem; text-transform:uppercase; letter-spacing:0.06em; }

/* AD SLOTS */
.ad-slot { background:var(--lgray); border:1px dashed #CCCCCC; border-radius:8px; padding:20px; text-align:center; margin:28px 0; min-height:100px; display:flex; align-items:center; justify-content:center; }
.ad-slot-label { font-size:0.72rem; color:#BBBBBB; }

/* COMPARISON TABLE */
.comp-table { width:100%; border-collapse:collapse; border-radius:10px; overflow:hidden; margin:24px 0; box-shadow:0 2px 16px rgba(0,0,0,0.06); }
.comp-table th { background:var(--navy); color:var(--white); padding:14px 16px; font-size:0.9rem; text-align:left; }
.comp-table td { padding:12px 16px; font-size:0.9rem; border-bottom:1px solid var(--border); }
.comp-table tr:nth-child(even) td { background:var(--off-white); }
.comp-table tr:nth-child(odd) td { background:var(--white); }
.comp-table .win { color:var(--green); font-weight:700; }
.comp-table .lose { color:var(--gray-mid); }

/* CTA BOX */
.cta-box { background:var(--navy-dark); border-radius:14px; padding:40px 36px; text-align:center; margin:40px 0; border-top:4px solid var(--gold); }
.cta-box h3 { font-family:'Playfair Display',serif; font-size:1.6rem; color:var(--white); margin-bottom:12px; }
.cta-box p { color:#99AABB; font-size:0.95rem; margin-bottom:24px; max-width:480px; margin-left:auto; margin-right:auto; }
.cta-box a { background:var(--gold); color:var(--navy-dark); padding:14px 32px; font-size:0.95rem; font-weight:700; text-decoration:none; border-radius:6px; display:inline-block; transition:all 0.2s; }
.cta-box a:hover { background:var(--gold-light); transform:translateY(-2px); }

/* SIDEBAR LAYOUT */
.article-wrapper { display:grid; grid-template-columns:1fr 280px; gap:40px; max-width:1100px; margin:0 auto; padding:52px 5%; align-items:start; }
.sidebar { position:sticky; top:86px; }
.sidebar-card { background:var(--lgray); border:1px solid var(--border); border-radius:12px; padding:24px; margin-bottom:20px; }
.sidebar-card h4 { font-size:0.85rem; font-weight:700; color:var(--navy); text-transform:uppercase; letter-spacing:0.06em; margin-bottom:14px; }
.sidebar-card ul { list-style:none; }
.sidebar-card li { margin-bottom:8px; }
.sidebar-card a { font-size:0.88rem; color:var(--teal); text-decoration:none; font-weight:600; }
.sidebar-card a:hover { color:var(--gold); }
.sidebar-promo { background:var(--navy-dark); border-radius:12px; padding:24px; text-align:center; }
.sidebar-promo h4 { color:var(--gold); font-size:0.85rem; text-transform:uppercase; letter-spacing:0.06em; margin-bottom:10px; }
.sidebar-promo p { color:#99AABB; font-size:0.82rem; margin-bottom:16px; line-height:1.6; }
.sidebar-promo a { background:var(--gold); color:var(--navy-dark); padding:10px 20px; font-size:0.85rem; font-weight:700; text-decoration:none; border-radius:6px; display:block; }

/* FOOTER */
footer { background:#060E1F; padding:44px 5% 28px; border-top:3px solid var(--gold); }
.footer-inner { max-width:1100px; margin:0 auto; display:flex; flex-wrap:wrap; gap:36px; justify-content:space-between; margin-bottom:36px; }
.footer-brand p { font-size:0.82rem; color:#556677; max-width:230px; margin-top:10px; line-height:1.6; }
.footer-col h4 { font-size:0.72rem; font-weight:700; letter-spacing:0.1em; text-transform:uppercase; color:var(--gold); margin-bottom:14px; }
.footer-col ul { list-style:none; display:flex; flex-direction:column; gap:8px; }
.footer-col a { font-size:0.84rem; color:#556677; text-decoration:none; transition:color 0.2s; }
.footer-col a:hover { color:var(--gold); }
.footer-bottom { border-top:1px solid #1A2A3A; padding-top:20px; max-width:1100px; margin:0 auto; display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px; }
.footer-bottom p { font-size:0.76rem; color:#334455; }
.footer-bottom a { color:#334455; text-decoration:none; }
.footer-bottom a:hover { color:var(--gold); }

@media(max-width:768px) {
  .nav-links { display:none; }
  .article-wrapper { grid-template-columns:1fr; }
  .sidebar { position:static; }
}

/* ══════════════════════════════════════════════════════
   HOMEPAGE ONLY — added during refactor May 2026
   ══════════════════════════════════════════════════════ */

/* HERO */
.hero { background:var(--navy-dark); padding:90px 5% 80px; position:relative; overflow:hidden; }
.hero::before { content:''; position:absolute; top:-80px; right:-80px; width:500px; height:500px; border-radius:50%; background:radial-gradient(circle,rgba(201,168,76,0.08) 0%,transparent 70%); }
.hero::after { content:''; position:absolute; bottom:0; left:0; right:0; height:3px; background:linear-gradient(90deg,transparent,var(--gold),transparent); }
.hero-inner { max-width:860px; margin:0 auto; text-align:center; position:relative; z-index:2; }
.hero-badge { display:inline-block; background:rgba(201,168,76,0.15); border:1px solid rgba(201,168,76,0.4); color:var(--gold); font-size:0.78rem; font-weight:700; letter-spacing:0.12em; text-transform:uppercase; padding:6px 18px; border-radius:20px; margin-bottom:28px; }
.hero h1 { font-family:'Playfair Display',serif; font-size:clamp(2.2rem,5vw,3.6rem); color:var(--white); line-height:1.15; margin-bottom:24px; letter-spacing:-0.02em; }
.hero h1 em { font-style:normal; color:var(--gold); }
.hero-sub { font-size:1.15rem; color:#99AABB; max-width:600px; margin:0 auto 40px; line-height:1.75; }
.hero-buttons { display:flex; gap:16px; justify-content:center; flex-wrap:wrap; margin-bottom:56px; }
.btn-primary { background:var(--gold); color:var(--navy-dark); padding:16px 36px; font-size:1rem; font-weight:700; text-decoration:none; border-radius:6px; transition:all 0.2s; display:inline-block; letter-spacing:0.02em; }
.btn-primary:hover { background:var(--gold-light); transform:translateY(-2px); box-shadow:0 8px 24px rgba(201,168,76,0.3); }
.btn-secondary { background:transparent; color:var(--white); padding:16px 36px; font-size:1rem; font-weight:600; text-decoration:none; border-radius:6px; border:1.5px solid rgba(255,255,255,0.25); transition:all 0.2s; display:inline-block; }
.btn-secondary:hover { border-color:var(--gold); color:var(--gold); }
.hero-stats { display:flex; gap:40px; justify-content:center; flex-wrap:wrap; padding-top:40px; border-top:1px solid rgba(255,255,255,0.1); }
.stat-item { text-align:center; }
.stat-num { display:block; font-family:'Playfair Display',serif; font-size:2rem; color:var(--gold); font-weight:700; }
.stat-label { font-size:0.8rem; color:#778899; text-transform:uppercase; letter-spacing:0.08em; }

/* PROBLEM STRIP */
.problem-strip { background:var(--gold); padding:18px 5%; text-align:center; }
.problem-strip p { font-size:1rem; font-weight:700; color:var(--navy-dark); letter-spacing:0.02em; }

/* SECTION SHARED */
.section { padding:80px 5%; }
.section-inner { max-width:1100px; margin:0 auto; }
.section-label { font-size:0.78rem; font-weight:700; letter-spacing:0.14em; text-transform:uppercase; color:var(--gold); margin-bottom:12px; }
.section-title { font-family:'Playfair Display',serif; font-size:clamp(1.8rem,3.5vw,2.8rem); color:var(--navy-dark); line-height:1.2; margin-bottom:16px; letter-spacing:-0.02em; }
.section-sub { font-size:1.05rem; color:var(--gray-mid); max-width:600px; line-height:1.7; margin-bottom:48px; }

/* PAIN GRID */
.pain-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:24px; }
.pain-card { background:var(--off-white); border:1px solid #E0DDD6; border-left:4px solid var(--gold); padding:28px 24px; border-radius:8px; }
.pain-icon { font-size:1.8rem; margin-bottom:12px; display:block; }
.pain-card h3 { font-size:1rem; font-weight:700; color:var(--navy-dark); margin-bottom:8px; }
.pain-card p { font-size:0.9rem; color:var(--gray-mid); line-height:1.6; }

/* HOW IT WORKS */
.how-section { background:var(--navy-dark); padding:80px 5%; }
.how-section .section-title { color:var(--white); }
.how-section .section-sub { color:#99AABB; }
.steps-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:32px; margin-top:48px; }
.step-card { text-align:center; padding:32px 20px; border:1px solid rgba(201,168,76,0.2); border-radius:10px; background:rgba(255,255,255,0.03); }
.step-num { width:52px; height:52px; background:var(--gold); color:var(--navy-dark); border-radius:50%; display:flex; align-items:center; justify-content:center; font-family:'Playfair Display',serif; font-size:1.4rem; font-weight:900; margin:0 auto 20px; }
.step-card h3 { font-size:1rem; font-weight:700; color:var(--white); margin-bottom:10px; }
.step-card p { font-size:0.88rem; color:#778899; line-height:1.65; }

/* PROMPT PACK */
.prompts-section { background:var(--off-white); padding:80px 5%; }
.prompt-list { display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:20px; margin-top:48px; }
.prompt-item { background:var(--white); border:1px solid #E0DDD6; border-radius:10px; padding:24px; display:flex; gap:16px; align-items:flex-start; transition:all 0.2s; box-shadow:0 2px 8px rgba(0,0,0,0.04); }
.prompt-item:hover { border-color:var(--gold); box-shadow:0 4px 20px rgba(201,168,76,0.15); transform:translateY(-2px); }
.prompt-num { background:var(--navy-dark); color:var(--gold); width:36px; height:36px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-weight:700; font-size:0.9rem; flex-shrink:0; }
.prompt-text h3 { font-size:0.95rem; font-weight:700; color:var(--navy-dark); margin-bottom:4px; }
.prompt-text p { font-size:0.85rem; color:var(--gray-mid); line-height:1.5; }

/* PRODUCT CTA */
.product-section { padding:80px 5%; background:var(--white); }
.product-card { max-width:780px; margin:0 auto; background:var(--navy-dark); border-radius:16px; padding:56px 48px; text-align:center; position:relative; overflow:hidden; }
.product-card::before { content:''; position:absolute; top:0; left:0; right:0; height:4px; background:linear-gradient(90deg,var(--gold),var(--gold-light),var(--gold)); }
.product-card h2 { font-family:'Playfair Display',serif; font-size:2rem; color:var(--white); margin-bottom:16px; line-height:1.2; }
.product-card > p { color:#99AABB; font-size:1rem; max-width:500px; margin:0 auto 32px; line-height:1.7; }
.price-display { font-family:'Playfair Display',serif; font-size:3rem; color:var(--gold); font-weight:900; margin-bottom:8px; }
.price-sub { font-size:0.85rem; color:#778899; margin-bottom:32px; }
.product-features { display:flex; flex-direction:column; gap:10px; margin-bottom:36px; text-align:left; max-width:400px; margin-left:auto; margin-right:auto; }
.product-features li { list-style:none; font-size:0.92rem; color:#AABBCC; display:flex; gap:10px; align-items:flex-start; }
.product-features li::before { content:'✓'; color:var(--gold); font-weight:700; flex-shrink:0; margin-top:2px; }

/* FREE GUIDES / ARTICLES SECTION */
.articles-section { padding:80px 5%; background:var(--gray-light); }
.articles-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:28px; margin-top:48px; }
.article-card { background:var(--white); border-radius:10px; overflow:hidden; border:1px solid #E0DDD6; transition:all 0.2s; }
.article-card:hover { box-shadow:0 8px 28px rgba(0,0,0,0.1); transform:translateY(-3px); }
.article-top { background:var(--navy-mid,#243570); padding:32px 28px; }
.article-top .tag { font-size:0.7rem; font-weight:700; letter-spacing:0.1em; text-transform:uppercase; color:var(--gold); margin-bottom:10px; display:block; }
.article-top h3 { font-family:'Playfair Display',serif; font-size:1.15rem; color:var(--white); line-height:1.3; }
.article-card .article-body { padding:24px 28px; }
.article-card .article-body p { font-size:0.88rem; color:var(--gray-mid); line-height:1.65; margin-bottom:16px; }
.article-link { font-size:0.85rem; font-weight:700; color:var(--gold); text-decoration:none; letter-spacing:0.04em; }
.article-link:hover { text-decoration:underline; }

/* EMAIL CAPTURE */
.email-section { background:var(--gold); padding:64px 5%; text-align:center; }
.email-section h2 { font-family:'Playfair Display',serif; font-size:2rem; color:var(--navy-dark); margin-bottom:12px; }
.email-section p { font-size:1rem; color:rgba(13,26,58,0.75); margin-bottom:32px; max-width:480px; margin-left:auto; margin-right:auto; }
.email-form { display:flex; gap:12px; justify-content:center; flex-wrap:wrap; max-width:500px; margin:0 auto; }
.email-form input { flex:1; min-width:240px; padding:14px 18px; font-size:0.95rem; border:none; border-radius:6px; outline:none; font-family:'Source Sans 3',sans-serif; color:var(--gray-dark); }
.email-form button { background:var(--navy-dark); color:var(--white); padding:14px 28px; font-size:0.95rem; font-weight:700; border:none; border-radius:6px; cursor:pointer; font-family:'Source Sans 3',sans-serif; transition:background 0.2s; letter-spacing:0.03em; }
.email-form button:hover { background:#243570; }
.email-note { font-size:0.78rem; color:rgba(13,26,58,0.55); margin-top:12px; }

/* TESTIMONIALS */
.testimonials-section { padding:80px 5%; background:var(--white); }
.testimonials-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:28px; margin-top:48px; }
.testimonial-card { border:1px solid #E0DDD6; border-radius:12px; padding:32px 28px; background:var(--off-white); position:relative; }
.testimonial-card::before { content:'"'; font-family:'Playfair Display',serif; font-size:4rem; color:var(--gold); opacity:0.3; position:absolute; top:12px; left:20px; line-height:1; }
.stars { color:var(--gold); font-size:0.9rem; margin-bottom:14px; letter-spacing:2px; }
.testimonial-text { font-size:0.95rem; line-height:1.7; color:var(--gray-dark); margin-bottom:20px; font-style:italic; }
.testimonial-author { font-size:0.85rem; font-weight:700; color:var(--navy-dark); }
.testimonial-biz { font-size:0.8rem; color:var(--gray-mid); }

/* ABOUT STRIP */
.about-section { background:var(--navy-dark); padding:80px 5%; }
.about-inner { max-width:700px; margin:0 auto; text-align:center; }
.about-inner p { color:#99AABB; font-size:1rem; line-height:1.8; margin-bottom:16px; }
.about-inner strong { color:var(--gold); }

/* ANIMATIONS */
@keyframes fadeUp { from { opacity:0; transform:translateY(24px); } to { opacity:1; transform:translateY(0); } }
.hero-inner > * { animation:fadeUp 0.6s ease both; }
.hero-inner > *:nth-child(1) { animation-delay:0.1s; }
.hero-inner > *:nth-child(2) { animation-delay:0.2s; }
.hero-inner > *:nth-child(3) { animation-delay:0.3s; }
.hero-inner > *:nth-child(4) { animation-delay:0.4s; }
.hero-inner > *:nth-child(5) { animation-delay:0.5s; }

/* MOBILE ADDITIONS */
@media(max-width:680px) {
  .hero { padding:60px 5% 50px; }
  .product-card { padding:36px 24px; }
  .hero-stats { gap:24px; }
  .email-form { flex-direction:column; }
  .email-form input { min-width:unset; width:100%; }
}