/* Blog article pages — matches templates/page-template.html (Android beta look). */

/* Header: logo pill on scroll, desktop Chat Now, no nav. */
body.blog-post-page #header{padding-top:14px}
body.blog-post-page #header .header-container{min-height:68px;padding:7px 0;background:transparent;border-color:transparent;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none}
body.blog-post-page #header .logo{padding:8px 18px 8px 12px;border-radius:50px;background:transparent;border:1px solid transparent;box-shadow:none;transition:background .5s var(--transition-silk),border-color .5s var(--transition-silk),box-shadow .5s var(--transition-silk)}
body.blog-post-page #header .logo h1{letter-spacing:0}
body.blog-post-page #header .logo img{filter:drop-shadow(0 4px 12px rgba(168, 116, 0,.22))}
body.blog-post-page.scrolled #header .logo{background:color-mix(in srgb,var(--surface-color),transparent 6%);border-color:color-mix(in srgb,var(--heading-color),transparent 92%);box-shadow:0 1px 3px rgba(31,41,55,.05),0 12px 30px rgba(31,41,55,.08);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}
@media(max-width:991.98px){body.blog-post-page #header{padding-top:10px}body.blog-post-page #header .header-container{margin-left:10px;margin-right:10px;border-radius:26px}}

/* Chat lives in the floating bottom-centre nudge on every screen size, not the header. */
body.blog-post-page #header .btn-getstarted{display:none !important}
body.blog-post-page .floating-chat-cta{display:none}

/* Hero */
.blog-post-page .main{padding-top:96px}
.post-hero{padding:48px 0 32px;text-align:center}
.post-back{display:inline-flex;align-items:center;gap:8px;padding:.5rem 1.15rem;background:linear-gradient(135deg,color-mix(in srgb,var(--surface-color) 90%,var(--accent-color)),color-mix(in srgb,var(--surface-color) 95%,var(--accent-color)));border:1px solid var(--border-accent-soft);border-radius:50px;color:var(--accent-color);font-weight:600;letter-spacing:.02em;text-decoration:none;box-shadow:0 2px 8px rgba(168, 116, 0,.08),0 12px 24px rgba(168, 116, 0,.06);transition:transform .35s var(--transition-silk),box-shadow .35s var(--transition-silk)}
.post-back:hover{color:var(--accent-color);transform:translateY(-2px);box-shadow:0 6px 14px rgba(168, 116, 0,.12),0 16px 30px rgba(168, 116, 0,.1)}
.post-back i{transition:transform .35s var(--transition-silk)}
.post-back:hover i{transform:translateX(-3px)}
.post-hero h1{max-width:860px;margin:24px auto 18px;padding-bottom:22px;position:relative;font-size:clamp(2.1rem,1.6rem + 2vw,3.4rem);font-weight:700;letter-spacing:-.03em;line-height:1.1;color:var(--heading-color)}
.post-hero h1::after{content:"";position:absolute;left:0;right:0;bottom:0;margin:auto;width:48px;height:2px;background:var(--accent-color)}
.post-hero .post-meta{margin:0;color:#6b7280;font-size:.95rem}
.post-hero .post-meta span+span::before,.post-hero .post-meta time+span::before,.post-hero .post-meta span+time::before{content:"·";margin:0 .5em;color:var(--accent-color)}

/* Article body */
.post-body{max-width:740px;margin:0 auto;padding:8px 0 40px}
.blog-post .post-content{color:#374151;font-size:1.08rem;line-height:1.8}
.blog-post .post-content p{margin:0 0 1.35rem}
.blog-post .post-content h2{margin:2.6rem 0 1rem;color:var(--heading-color);font-size:clamp(1.55rem,1.3rem + 1vw,1.95rem);font-weight:600;line-height:1.2;letter-spacing:-.015em}
.blog-post .post-content h3{margin:2rem 0 .75rem;color:var(--heading-color);font-size:1.3rem;font-weight:600;line-height:1.3}
.blog-post .post-content ul,.blog-post .post-content ol{margin:0 0 1.5rem;padding-left:1.35rem}
.blog-post .post-content li{margin-bottom:.6rem;padding-left:.25rem}
.blog-post .post-content li::marker{color:var(--accent-color);font-weight:700}
.blog-post .post-content a{color:var(--accent-color);text-decoration:underline;text-decoration-color:color-mix(in srgb,var(--accent-color) 40%,transparent);text-underline-offset:3px;transition:text-decoration-color .25s ease}
.blog-post .post-content a:hover{text-decoration-color:var(--accent-color)}
.blog-post .post-content strong{color:var(--heading-color)}
.blog-post .post-content blockquote{position:relative;margin:2rem 0;padding:22px 24px 22px 28px;border:1px solid rgba(168, 116, 0,.18);border-left:4px solid var(--accent-color);border-radius:4px 20px 20px 4px;background:rgba(168, 116, 0,.06)}
.blog-post .post-content blockquote p{margin:0;font-family:var(--heading-font);font-size:1.15rem;font-style:italic;line-height:1.6;color:var(--heading-color)}
.blog-post .post-content img{max-width:100%;height:auto;border-radius:16px}

/* FAQ */
.blog-post .faq-section{margin:3rem 0 2rem;padding-top:.5rem}
.blog-post .faq-section>h2{margin:0 0 1.25rem}
.blog-post .faq-item{margin-bottom:14px;padding:20px 22px;border:1px solid rgba(229,231,235,.96);border-radius:20px;background:#fff;box-shadow:0 10px 30px rgba(15,23,42,.05)}
.blog-post .post-content .faq-question{margin:0 0 .45rem;text-wrap:pretty;font-family:var(--default-font);font-size:1.05rem;font-weight:700;line-height:1.4}
.blog-post .post-content .faq-answer{margin:0;color:#5f6673;font-size:1rem;line-height:1.65}

/* Editorial note */
.blog-post .editorial-note{margin-top:2rem;padding-top:1.5rem;border-top:1px solid rgba(15,23,42,.08)!important}
.blog-post .editorial-note p{margin:0;color:#6b7280!important;font-size:.9rem;line-height:1.6}

/* End-of-article CTA (capability-card look) */
.post-cta{position:relative;overflow:hidden;margin:2.5rem 0 1rem;padding:30px 28px;border:1px solid rgba(229,231,235,.96);border-radius:28px;background:#fff;box-shadow:0 20px 54px rgba(15,23,42,.08);text-align:center}
.post-cta::before{content:"";position:absolute;top:0;left:0;width:100%;height:5px;background:var(--accent-color)}
.post-cta h3{margin:0 0 10px;color:var(--heading-color);font-size:clamp(1.4rem,2vw,1.75rem);line-height:1.15}
.post-cta p{max-width:520px;margin:0 auto 22px;color:#5f6673;line-height:1.6}
.post-cta .btn-cta{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 28px;border-radius:999px;background:var(--gradient-gold);color:#fff;font-weight:600;letter-spacing:.015em;text-decoration:none;box-shadow:0 14px 30px rgba(168, 116, 0,.22),var(--gold-inner-sheen);transition:transform .4s var(--transition-silk),box-shadow .4s var(--transition-silk),filter .4s var(--transition-silk)}
.post-cta .btn-cta:hover{color:#fff;transform:translateY(-3px) scale(1.012);filter:brightness(1.05) saturate(1.04);box-shadow:0 20px 40px rgba(168, 116, 0,.3),var(--gold-inner-sheen)}
.post-cta .btn-cta:focus-visible{outline:none;box-shadow:0 0 0 4px rgba(168, 116, 0,.3),0 16px 32px rgba(168, 116, 0,.2),var(--gold-inner-sheen)}

@media(max-width:575.98px){
  .blog-post-page .main{padding-top:80px}
  .post-hero{padding:32px 0 24px}
  .blog-post .post-content{font-size:1.03rem}
  .post-cta{padding:26px 22px;border-radius:24px}
  .blog-post-page .post-body{padding-bottom:90px}
}

/* Dark */
html[data-theme="dark"] body.blog-post-page{background-image:none}
html[data-theme="dark"] .post-back{color:#E0B23A;background:linear-gradient(135deg,#2a241b,#221d16);border-color:rgba(224, 178, 58,.25);box-shadow:0 8px 24px rgba(0,0,0,.2)}
html[data-theme="dark"] .post-hero h1{color:#f3ece0}
html[data-theme="dark"] .post-hero .post-meta,html[data-theme="dark"] .blog-post .editorial-note p{color:#a39a8a!important}
html[data-theme="dark"] .blog-post .post-content{color:#d0c8b9}
html[data-theme="dark"] .blog-post .post-content h2,html[data-theme="dark"] .blog-post .post-content h3,html[data-theme="dark"] .blog-post .post-content strong,html[data-theme="dark"] .blog-post .post-content blockquote p{color:#f3ece0}
html[data-theme="dark"] .blog-post .post-content a{color:#E0B23A}
html[data-theme="dark"] .blog-post .post-content blockquote{background:#221d16;border-color:rgba(224, 178, 58,.25);border-left-color:#E0B23A}
html[data-theme="dark"] .blog-post .faq-item,html[data-theme="dark"] .post-cta{background:#221d16;border-color:rgba(235,227,212,.11);box-shadow:0 20px 54px rgba(0,0,0,.28)}
html[data-theme="dark"] .blog-post .post-content .faq-answer,html[data-theme="dark"] .post-cta p{color:#d0c8b9}
html[data-theme="dark"] .post-cta h3{color:#f3ece0}
html[data-theme="dark"] .post-cta::before{background:#E0B23A}
html[data-theme="dark"] .blog-post .editorial-note{border-top-color:rgba(235,227,212,.11)!important}
html[data-theme="dark"] .footer .footer-links ul a{color:#c4bbab}
html[data-theme="dark"] .footer .footer-links ul a:hover{color:#E0B23A}

/* Floating "continue this topic in chat" nudge (bottom centre). */
.blog-chat-nudge{position:fixed;left:50%;bottom:calc(20px + env(safe-area-inset-bottom,0px));z-index:996;width:min(680px,calc(100% - 32px));transform:translate(-50%,24px);opacity:0;visibility:hidden;pointer-events:none;transition:opacity .45s var(--transition-silk),transform .45s var(--transition-silk),visibility 0s linear .45s}
.blog-chat-nudge.is-visible{transform:translate(-50%,0);opacity:1;visibility:visible;pointer-events:auto;transition:opacity .45s var(--transition-silk),transform .45s var(--transition-silk),visibility 0s}
.blog-chat-nudge[hidden]{display:none}
html.is-in-app-embed .blog-chat-nudge,html.is-native-app .blog-chat-nudge{display:none !important}
.blog-chat-nudge-link{position:relative;display:flex;align-items:center;gap:16px;padding:14px 56px 14px 14px;border:1px solid color-mix(in srgb,#C8920E 38%,transparent);border-radius:22px;background:color-mix(in srgb,#fff,transparent 4%);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);box-shadow:0 2px 6px rgba(31,41,55,.06),0 22px 48px rgba(31,41,55,.14),0 10px 28px rgba(168,116,0,.1);color:var(--heading-color);text-decoration:none;transition:transform .3s var(--transition-silk),box-shadow .3s var(--transition-silk)}
.blog-chat-nudge-link:hover{color:var(--heading-color);box-shadow:0 4px 10px rgba(31,41,55,.07),0 26px 56px rgba(31,41,55,.16),0 12px 32px rgba(168,116,0,.14)}
.blog-chat-nudge-link:focus-visible{outline:2px solid #A87400;outline-offset:3px}
.blog-chat-nudge-icon{flex:0 0 auto;display:grid;place-items:center;width:46px;height:46px;border:1px solid #C8920E;border-radius:50%;background:#fff;color:#A87400;font-size:1.3rem}
.blog-chat-nudge-text{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:2px;line-height:1.35}
.blog-chat-nudge-text strong{font-family:var(--heading-font);font-weight:400;font-size:1.12rem;color:var(--heading-color)}
.blog-chat-nudge-text span{color:#5f6673;font-size:.9rem}
.blog-chat-nudge-short,.blog-chat-nudge-btn-short{display:none}
.blog-chat-nudge-btn{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:11px 22px;border-radius:999px;background:var(--gradient-gold);color:#fff;font-weight:600;font-size:.95rem;letter-spacing:.015em;white-space:nowrap;box-shadow:0 14px 30px rgba(168,116,0,.22),var(--gold-inner-sheen)}
.blog-chat-nudge-btn i{transition:transform .35s var(--transition-silk)}
/* Same hover as the other gold CTAs (lift, glow, foil sweep), triggered from anywhere on the card. */
.blog-chat-nudge-link:is(:hover,:focus-visible) .blog-chat-nudge-btn{color:#fff;transform:translateY(-3px) scale(1.012);filter:brightness(1.05) saturate(1.04);box-shadow:0 20px 40px rgba(168,116,0,.3),var(--gold-inner-sheen);background-position:-20% 50%,100% 50% !important}
.blog-chat-nudge-link:is(:hover,:focus-visible) .blog-chat-nudge-btn i{transform:translateX(3px)}
.blog-chat-nudge-close{position:absolute;top:50%;right:12px;transform:translateY(-50%);display:grid;place-items:center;width:32px;height:32px;padding:0;border:0;border-radius:50%;background:transparent;color:#8b8f97;font-size:.85rem;cursor:pointer;transition:background .2s ease,color .2s ease}
.blog-chat-nudge-close:hover{background:rgba(168,116,0,.08);color:#946800}
.blog-chat-nudge-close:focus-visible{outline:2px solid #A87400;outline-offset:2px}
@media(max-width:767.98px){
  .blog-chat-nudge{bottom:calc(12px + env(safe-area-inset-bottom,0px))}
  .blog-chat-nudge-link{gap:12px;padding:12px 40px 12px 12px;border-radius:20px}
  .blog-chat-nudge-icon{width:40px;height:40px;font-size:1.1rem}
  .blog-chat-nudge-text strong{font-size:1rem}
  .blog-chat-nudge-text span{font-size:.82rem}
  .blog-chat-nudge-long{display:none}
  .blog-chat-nudge-short{display:inline}
  .blog-chat-nudge-btn{padding:10px 16px;font-size:.88rem}
  .blog-chat-nudge-btn-label{display:none}
  .blog-chat-nudge-btn-short{display:inline}
  .blog-chat-nudge-close{top:8px;right:6px;transform:none;width:28px;height:28px;font-size:.75rem}
}
@media(max-width:399.98px){.blog-chat-nudge-icon{display:none}}
@media(prefers-reduced-motion:reduce){.blog-chat-nudge,.blog-chat-nudge.is-visible,.blog-chat-nudge-link{transition:none}}
html[data-theme="dark"] .blog-chat-nudge-link{background:color-mix(in srgb,#221d16,transparent 4%);border-color:rgba(224,178,58,.3);box-shadow:0 22px 48px rgba(0,0,0,.4)}
html[data-theme="dark"] .blog-chat-nudge-icon{background:#1a1610;border-color:#E0B23A;color:#E0B23A}
html[data-theme="dark"] .blog-chat-nudge-text strong{color:#f3ece0}
html[data-theme="dark"] .blog-chat-nudge-text span{color:#c4bbab}
html[data-theme="dark"] .blog-chat-nudge-close{color:#a39a8a}
html[data-theme="dark"] .blog-chat-nudge-close:hover{background:rgba(224,178,58,.12);color:#E0B23A}