/*
 * Missenger blog — shared base styles.
 * content-autopilot Pass 8.5 copies this file to /blog/[slug]/article.css
 * as the starting point for every new post. Post-specific custom components
 * are appended after the base block in the copied file.
 *
 * Theme: warm-white background, orange accent (#E85D04), Oswald display + Sora body.
 * Design compliance: no side-stripe borders, no em dashes in copy, no gradient text.
 */

*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}

:root{
  --orange:#E85D04;--orange-dark:#c44a00;--orange-soft:rgba(232,93,4,0.06);
  --charcoal:#1a1a1a;--warm-white:#f5f3ef;--paper:#ffffff;
  --text:#1a1a1a;--text-muted:#5a5a5a;--text-dim:#8a8a8a;
  --border:#e0dcd4;--border-subtle:#eae7e0;
  --green:#2d6a4f;--green-soft:rgba(45,106,79,0.08);
  --red:#c44a3a;--red-soft:rgba(196,74,58,0.06);
  --font-display:'Oswald',Impact,sans-serif;
  --font-body:'Sora',system-ui,sans-serif;
}

html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}

body{
  font-family:var(--font-body);font-size:17px;line-height:1.75;
  color:var(--text);background:var(--warm-white);
  -webkit-font-smoothing:antialiased
}

a{color:var(--orange);text-decoration:none}
a:hover{color:var(--orange-dark)}

/* Navigation */
nav{padding:20px 5vw;border-bottom:1px solid var(--border);background:var(--warm-white)}
nav a.logo{
  font-family:var(--font-display);font-size:1.4rem;font-weight:700;
  color:var(--charcoal);text-decoration:none
}
nav a.logo .dot{color:var(--orange)}

/* Article container */
article{max-width:720px;margin:0 auto;padding:6vh 5vw 12vh}

/* Meta line */
.meta{font-size:0.8rem;color:var(--text-dim);margin-bottom:24px}
.meta span{margin-right:16px}

/* Typography */
h1{font-size:clamp(2rem,4vw,2.8rem);font-weight:700;margin-bottom:20px;line-height:1.1}
h2{font-size:1.5rem;font-weight:600;margin:48px 0 16px}
h3{font-size:1.15rem;font-weight:600;margin:32px 0 12px}
p{margin-bottom:20px;color:var(--text-muted);max-width:68ch}

/* Lead / intro paragraph */
.lead{font-size:1.2rem;color:var(--text);line-height:1.7;margin-bottom:32px;max-width:68ch}

/* Citation block — elite tactic Tactic 1 / Tactic 8 */
.citation-block{
  font-size:1.05rem;color:var(--text);line-height:1.7;
  margin-bottom:16px;max-width:68ch
}
.citation-block strong{color:var(--charcoal)}

/* Lead answer — SpeakableSpecification target */
.lead-answer{
  font-size:1.15rem;color:var(--text);line-height:1.7;
  margin-bottom:24px;max-width:68ch
}

/* Deep passage — follows citation block */
.deep-passage p{margin-bottom:16px}

/* Callouts (soft tint, no side-stripe per impeccable) */
.callout{background:var(--orange-soft);border-radius:8px;padding:20px 24px;margin:32px 0}
.callout p{margin:0;color:var(--text);font-size:1.05rem;max-width:none}
.callout strong{color:var(--orange)}

.callout-green{background:var(--green-soft)}
.callout-red{background:var(--red-soft)}

/* Last reviewed callout — Tactic 6 */
.last-reviewed{
  background:var(--paper);border:1px solid var(--border);
  border-radius:8px;padding:16px 20px;margin:24px 0;
  font-size:0.95rem;color:var(--text-muted)
}
.last-reviewed strong{color:var(--text)}
.last-reviewed a{color:var(--orange);text-decoration:underline}

/* Lists */
ul,ol{margin:16px 0 24px 28px;color:var(--text-muted)}
li{margin-bottom:10px;max-width:64ch}

/* Featured image */
.featured-img{width:100%;height:auto;border-radius:8px;margin:32px 0;display:block}

/* Tables */
table{width:100%;border-collapse:collapse;margin:24px 0;font-size:0.95rem}
th,td{padding:12px 16px;text-align:left;border-bottom:1px solid var(--border)}
th{
  font-weight:600;color:var(--text);background:var(--paper);
  font-size:0.7rem;text-transform:uppercase;letter-spacing:0.08em
}
td{color:var(--text-muted)}
tr:last-child td{border-bottom:none}

/* CTA box */
.cta-box{
  background:var(--charcoal);color:var(--warm-white);
  border-radius:12px;padding:32px;margin:48px 0
}
.cta-box h3{color:var(--paper);margin-top:0}
.cta-box p{color:rgba(255,255,255,0.7);max-width:68ch}
.cta-box a{
  display:inline-block;padding:14px 28px;background:var(--orange);
  color:white;text-decoration:none;font-weight:600;border-radius:6px;margin-top:8px
}
.cta-box a:hover{background:var(--orange-dark)}

/* FAQ section */
.faq-section{margin:40px 0}
.faq-item{margin-bottom:28px;padding-bottom:24px;border-bottom:1px solid var(--border-subtle)}
.faq-item:last-child{border-bottom:none}
.faq-question{font-size:1.05rem;font-weight:600;color:var(--text);margin-bottom:10px}
.faq-answer{color:var(--text-muted);font-size:1rem;line-height:1.75}

/* Version history — Tactic 6 */
.version-history{margin:48px 0;padding-top:32px;border-top:1px solid var(--border)}
.version-history h2{font-size:1.3rem}
.version-history ul{margin:16px 0 0 20px;color:var(--text-muted)}
.version-history li{margin-bottom:8px}
.version-history li strong{color:var(--text)}

/* Sources / about data */
.sources{
  margin-top:48px;padding-top:32px;border-top:1px solid var(--border);
  font-size:0.85rem;color:var(--text-dim)
}
.sources strong{color:var(--text)}

/* Footer */
footer{
  border-top:1px solid var(--border);padding:40px 5vw;
  text-align:center;color:var(--text-dim);font-size:0.85rem
}
footer a{color:var(--text-dim);text-decoration:none}
footer a:hover{color:var(--orange)}

/* Responsive */
@media(max-width:640px){
  article{padding:4vh 4vw 8vh}
  h1{font-size:clamp(1.6rem,6vw,2.2rem)}
  th,td{padding:10px 12px;font-size:0.9rem}
  .cta-box{padding:24px}
}

/* ==========================================================================
 * POST-SPECIFIC CUSTOM COMPONENTS — answering-service-toronto
 * Appended after the _base.css block per per-post-copy convention.
 * Replicates the proven geo-short component chrome (sticky header, hero image,
 * dark CTA band, accordion FAQ, nearby-reading block, dark footer) so the
 * linked stylesheet renders the established Missenger blog layout. No
 * side-stripe borders, no em dashes, no gradient text (design compliance).
 * ========================================================================== */

/* Sticky site header */
header.site-header{background:var(--paper);border-bottom:1px solid var(--border);padding:16px 0}
header.site-header .container{display:flex;align-items:center;justify-content:space-between}
.container{max-width:720px;margin:0 auto;padding:0 24px}
.logo{font-family:var(--font-display);font-size:1.5rem;font-weight:700;color:var(--orange);text-decoration:none;letter-spacing:-0.02em}
.nav-links a{font-size:0.875rem;color:var(--text-muted);text-decoration:none;margin-left:24px;font-weight:500}
.nav-links a:hover{color:var(--orange)}

/* Article shell override: white paper card centered in warm-white */
article{background:var(--paper);margin:40px auto;padding:48px 0;max-width:760px}
article .container{max-width:720px}

/* Article meta */
.article-meta{font-size:0.8125rem;color:var(--text-dim);margin-bottom:24px;line-height:1.5}
.article-meta a{color:var(--text-muted);text-decoration:none}
.article-meta a:hover{color:var(--orange)}

/* Headings tuned for the card layout */
h1{font-family:var(--font-display);font-size:2.5rem;line-height:1.15;font-weight:700;color:var(--charcoal);margin:0 0 24px;letter-spacing:-0.01em}
h2{font-family:var(--font-display);font-size:1.75rem;font-weight:600;color:var(--charcoal);margin:48px 0 20px;line-height:1.25}

/* Featured hero image */
.featured-image{margin:0 0 32px;border-radius:12px;overflow:hidden}
.featured-image img{width:100%;height:auto;display:block}

/* Citation block as soft-tint paragraph (no side stripe) */
p.citation-block{background:var(--orange-soft);border-radius:10px;padding:20px 24px;font-size:0.9375rem;line-height:1.65;color:var(--text);margin:0 0 20px;font-weight:500;max-width:none}

/* Lead answer */
.lead-answer{font-size:1.0625rem;line-height:1.7;color:var(--text-muted);margin:0 0 40px;font-weight:400;max-width:none}

/* Last reviewed — soft orange tint variant */
.last-reviewed{background:var(--orange-soft);border:none;border-radius:10px;padding:16px 20px;font-size:0.875rem;color:var(--text-muted);margin-bottom:32px}
.last-reviewed a{color:var(--orange-dark);text-decoration:underline}

/* Dark CTA band */
.cta-band{background:var(--charcoal);color:var(--paper);border-radius:14px;padding:36px 32px;margin:48px 0;text-align:center}
.cta-band h3{font-family:var(--font-display);font-size:1.5rem;margin:0 0 8px;color:var(--paper)}
.cta-band p{color:rgba(245,243,239,0.78);margin:0 0 20px;max-width:none}
.cta-band .btn{display:inline-block;background:var(--orange);color:var(--paper);padding:14px 28px;border-radius:8px;text-decoration:none;font-weight:600;font-size:0.95rem}
.cta-band .btn:hover{background:var(--orange-dark);color:var(--paper)}
.cta-band .phone{display:block;margin-top:12px;color:rgba(245,243,239,0.65);font-size:0.85rem}
.cta-band .phone a{color:rgba(245,243,239,0.85);text-decoration:underline}

/* Accordion FAQ */
.faq-list{margin:0 0 32px}
.faq-item{border-bottom:1px solid var(--border);padding:0;margin:0}
.faq-q{width:100%;background:none;border:none;padding:20px 0;text-align:left;font-family:var(--font-body);font-size:1rem;font-weight:600;color:var(--text);cursor:pointer;display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.faq-q .icon{color:var(--orange);font-size:1.2rem;flex-shrink:0;transition:transform 0.2s}
.faq-item.open .faq-q .icon{transform:rotate(45deg)}
.faq-a{display:none;padding:0 0 20px}
.faq-item.open .faq-a{display:block}
.faq-a p{color:var(--text-muted);font-size:0.95rem;line-height:1.7;max-width:none}

/* Nearby reading block (soft green tint) */
.nearby{background:var(--green-soft);border-radius:10px;padding:18px 22px;font-size:0.9rem;color:var(--text-muted);margin:32px 0}
.nearby strong{color:var(--text);font-weight:600}
.nearby a{color:var(--orange-dark)}

/* Version history within card */
.version-history{font-size:0.8125rem;color:var(--text-dim);border-top:1px solid var(--border);padding-top:24px;margin-top:48px}
.version-history h2{font-size:1rem;font-family:var(--font-body);font-weight:600;margin:0 0 8px;color:var(--text-muted)}
.version-history ul{padding-left:18px}

/* Dark site footer */
footer.site-footer{background:var(--charcoal);color:rgba(245,243,239,0.72);padding:40px 0;margin-top:60px;font-size:0.875rem;border-top:none;text-align:left}
footer.site-footer .container{display:flex;flex-wrap:wrap;gap:32px;justify-content:space-between}
footer.site-footer a{color:rgba(245,243,239,0.85);text-decoration:none}
footer.site-footer a:hover{color:var(--orange)}
footer.site-footer h4{font-family:var(--font-display);color:var(--paper);margin:0 0 10px;font-size:0.95rem}
footer.site-footer .col{min-width:140px}
footer.site-footer .col a{display:block;margin-bottom:6px}

@media (max-width:600px){
  h1{font-size:2rem}
  h2{font-size:1.4rem;margin-top:40px}
  article{padding:32px 0}
}