/* Site na Conversa's frame around each fictional example: the sticky band at the top and the call at the bottom.
   Only .snc-* selectors, each stating every property it relies on, so a preview's own styles never reach the frame. */
@font-face{font-family:'SNC Texto';src:url('/assets/snc-texto-400.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'SNC Texto';src:url('/assets/snc-texto-600.woff2') format('woff2');font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:Bricolage;src:url('/assets/bricolage-700.woff2') format('woff2');font-weight:700;font-style:normal;font-display:swap}

.snc-band,.snc-cta{--snc-cream:#fff6e9;--snc-brick:#8b3528;--snc-ink:#2d2926;--snc-honey:#f3c66a;--snc-blue:#244a58;--snc-grey:#d9d6d0;box-sizing:border-box;margin:0;font:400 1rem/1.35 'SNC Texto',Arial,sans-serif;letter-spacing:0;text-align:left;text-transform:none;word-spacing:normal}
.snc-band *,.snc-cta *{box-sizing:border-box}

.snc-band{position:relative;z-index:50;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:4px 16px;min-height:48px;padding:2px max(16px,calc((100% - 1160px) / 2));background:var(--snc-ink);color:var(--snc-cream)}
.snc-band .snc-band-text{flex:1 1 9em;min-width:0;margin:0;padding:4px 0;color:var(--snc-cream);font:400 1rem/1.35 'SNC Texto',Arial,sans-serif;overflow-wrap:break-word}
.snc-band .snc-band-text strong{font-weight:600;color:var(--snc-honey)}
.snc-band .snc-band-link{flex:0 0 auto;display:inline-flex;align-items:center;gap:6px;min-height:44px;margin:0;padding:0 2px;color:var(--snc-honey);font:600 1rem/1.35 'SNC Texto',Arial,sans-serif;text-decoration:underline;text-underline-offset:.2em;white-space:nowrap;background:none;border:0}
.snc-band .snc-band-link:hover{color:var(--snc-cream)}
.snc-band .snc-band-link:focus-visible{outline:3px solid var(--snc-honey);outline-offset:2px;border-radius:2px}
/* Sticky only where it stays one short line: from 600 px at normal text size. On phones, and whenever enlarged
   text leaves less than 37.5em of width, it stays at the top of the page and never covers what has focus. */
@media (min-width:37.5em){.snc-band{position:sticky;top:0}}

.snc-cta{display:block;padding:44px 16px 52px;border-top:1px solid var(--snc-grey);background:var(--snc-cream);color:var(--snc-ink)}
.snc-cta .snc-cta-inner{max-width:40rem;margin:0 auto}
.snc-cta p{margin:0;color:var(--snc-ink);font:400 1.125rem/1.45 'SNC Texto',Arial,sans-serif}
.snc-cta .snc-cta-title{margin:0 0 8px}
.snc-cta .snc-cta-title strong{display:block;color:var(--snc-brick);font:700 1.625rem/1.15 Bricolage,Arial,sans-serif;letter-spacing:-.01em}
.snc-cta .snc-cta-text{margin:0 0 22px}
.snc-cta .snc-button{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:56px;max-width:100%;padding:14px 22px;border:2px solid var(--snc-brick);border-radius:5px;background:var(--snc-brick);color:var(--snc-cream);font:600 1.125rem/1.35 'SNC Texto',Arial,sans-serif;text-align:center;text-decoration:none;overflow-wrap:anywhere}
.snc-cta .snc-button:hover{background:var(--snc-ink);border-color:var(--snc-ink)}
.snc-cta .snc-button:focus-visible{outline:3px solid var(--snc-blue);outline-offset:4px}
.snc-cta .snc-cta-links{display:flex;flex-wrap:wrap;gap:0 24px;margin:20px 0 0}
.snc-cta .snc-cta-links a{display:inline-flex;align-items:center;min-height:44px;color:var(--snc-brick);font:600 1rem/1.35 'SNC Texto',Arial,sans-serif;text-decoration:underline;text-underline-offset:.2em}
.snc-cta .snc-cta-links a:focus-visible{outline:3px solid var(--snc-blue);outline-offset:2px;border-radius:2px}

@media (prefers-reduced-motion:reduce){.snc-band *,.snc-cta *{transition:none!important;animation:none!important}}
