/* Byline Relay theme — hand-written CSS that mirrors the Lovable design tokens. */
:root{
  --br-red:#CD0000;
  --br-ink:#000000;
  --br-bg:#FFFFFF;
  --br-bg-alt:#FAFAFA;
  --br-border:rgba(0,0,0,0.10);
  --br-border-soft:rgba(0,0,0,0.05);
  --br-muted:rgba(0,0,0,0.70);
  --br-muted-2:rgba(0,0,0,0.50);
  --br-muted-3:rgba(0,0,0,0.40);
  --br-font-head:'Montserrat',system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  --br-font-body:'Open Sans',system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
html,body{margin:0;padding:0}
body{font-family:var(--br-font-body);color:var(--br-ink);background:var(--br-bg);line-height:1.6;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:var(--br-red);text-decoration:none}
a:hover{opacity:.85}

.br-container{max-width:1120px;margin:0 auto;padding:0 1rem}
.br-text-center{text-align:center}

/* Nav */
.br-nav{position:sticky;top:0;z-index:40;background:rgba(255,255,255,.92);backdrop-filter:saturate(180%) blur(8px);border-bottom:1px solid var(--br-border-soft)}
.br-nav-inner{display:flex;align-items:center;justify-content:space-between;height:64px}
.br-logo{display:inline-flex;align-items:center;line-height:0}
.br-logo-img{height:32px;width:auto;display:block}
.br-logo-foot .br-logo-img{height:28px}
.br-nav-links{display:flex;align-items:center;gap:.5rem}

/* Buttons */
.br-btn{display:inline-flex;align-items:center;justify-content:center;font-family:var(--br-font-head);font-weight:700;border-radius:.5rem;padding:.55rem 1rem;font-size:.95rem;line-height:1;cursor:pointer;border:1px solid transparent;transition:opacity .15s, background .15s}
.br-btn-primary{background:var(--br-red);color:#fff}
.br-btn-primary:hover{opacity:.9;color:#fff}
.br-btn-ghost{background:transparent;color:var(--br-ink)}
.br-btn-ghost:hover{background:rgba(0,0,0,.05);color:var(--br-ink)}
.br-btn-lg{height:48px;padding:0 1.5rem;font-size:1rem}
.br-btn-block{display:flex;width:100%;height:44px;margin-top:2rem}

/* Typography */
.br-h1{font-family:var(--br-font-head);font-weight:800;font-size:clamp(2.25rem,5vw,3.75rem);line-height:1.05;letter-spacing:-.02em;margin:0}
.br-h1-sm{font-size:clamp(1.75rem,3.5vw,2.5rem);margin-bottom:.75rem}
.br-h2{font-family:var(--br-font-head);font-weight:700;font-size:clamp(1.75rem,3vw,2.25rem);margin:0;letter-spacing:-.01em}
.br-h3{font-family:var(--br-font-head);font-weight:600;font-size:1.125rem;margin:1rem 0 .5rem}
.br-lede{margin-top:1.25rem;font-size:clamp(1rem,1.4vw,1.2rem);color:var(--br-muted);line-height:1.65}

/* Hero */
.br-hero{padding:5rem 0 6rem}
.br-hero-inner{max-width:780px;margin:0 auto;text-align:center}
.br-hero-cta{margin-top:2.25rem;display:flex;gap:.75rem;justify-content:center;flex-wrap:wrap}
.br-hero-fine{margin-top:1rem;color:var(--br-muted-2);font-size:.875rem}

/* Sections */
.br-section{padding:5rem 0;border-top:1px solid var(--br-border-soft)}
.br-section-alt{background:var(--br-bg-alt)}
.br-section-head{max-width:640px;margin:0 auto;text-align:center}
.br-section-sub{margin-top:1rem;color:var(--br-muted);line-height:1.65}

/* Grids & cards */
.br-grid-3{margin-top:3.25rem;display:grid;grid-template-columns:1fr;gap:1.5rem}
@media(min-width:768px){.br-grid-3{grid-template-columns:repeat(3,1fr)}}
.br-card{background:#fff;border:1px solid var(--br-border);border-radius:.625rem;padding:1.5rem;list-style:none}
.br-card-icon{font-size:1.25rem;color:var(--br-red)}
.br-card p{margin:.5rem 0 0;color:var(--br-muted);font-size:.925rem;line-height:1.65}
.br-steps{padding:0}
.br-step-n{font-family:var(--br-font-head);font-weight:700;font-size:.875rem;color:var(--br-red)}

/* Pricing */
.br-pricing{margin:3rem auto 0;max-width:960px;display:grid;grid-template-columns:1fr;gap:1.25rem}
@media(min-width:768px){.br-pricing{grid-template-columns:1fr 1fr}}
.br-price-card{background:#fff;border:1px solid var(--br-border);border-radius:.625rem;padding:2rem;display:flex;flex-direction:column}
.br-price-card-primary{border:2px solid var(--br-red)}
.br-price-label{font-family:var(--br-font-head);font-weight:700;text-transform:uppercase;letter-spacing:.06em;font-size:.8rem;color:var(--br-red)}
.br-price-label-muted{color:var(--br-muted)}
.br-price-amount{margin-top:.75rem;display:flex;align-items:baseline;gap:.5rem}
.br-price-num{font-family:var(--br-font-head);font-weight:800;font-size:3rem;line-height:1}
.br-price-per{color:var(--br-muted)}
.br-price-note{margin:.5rem 0 0;color:var(--br-muted);font-size:.875rem}
.br-price-foot{margin-top:auto;padding-top:2rem;text-align:center;font-size:.875rem;color:var(--br-muted-2)}
.br-checklist{list-style:none;padding:0;margin:1.5rem 0 0;display:flex;flex-direction:column;gap:.65rem;font-size:.925rem}
.br-checklist li{position:relative;padding-left:1.5rem}
.br-checklist li::before{content:"";position:absolute;left:0;top:.45rem;width:.85rem;height:.85rem;background:var(--br-red);-webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'><polyline points='20 6 9 17 4 12'/></svg>") center/contain no-repeat;mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'><polyline points='20 6 9 17 4 12'/></svg>") center/contain no-repeat}

/* FAQ */
.br-faq{max-width:780px}
.br-faq-list{margin-top:2.5rem;border-top:1px solid var(--br-border)}
.br-faq-item{padding:1.25rem 0;border-bottom:1px solid var(--br-border)}
.br-faq-item summary{display:flex;align-items:center;justify-content:space-between;cursor:pointer;font-family:var(--br-font-head);font-weight:600;font-size:1rem;list-style:none}
.br-faq-item summary::-webkit-details-marker{display:none}
.br-faq-plus{color:var(--br-muted-3);transition:transform .2s;margin-left:1rem;font-size:1.25rem;line-height:1}
.br-faq-item[open] .br-faq-plus{transform:rotate(45deg)}
.br-faq-item p{margin:.75rem 0 0;color:var(--br-muted);font-size:.925rem;line-height:1.65}

/* Dark CTA */
.br-cta-dark{background:var(--br-ink);color:#fff;padding:4rem 0;text-align:center;border-top:1px solid var(--br-border-soft)}
.br-cta-h2{color:#fff}
.br-cta-sub{margin:.75rem 0 2rem;color:rgba(255,255,255,.7)}

/* Footer */
.br-footer{background:#fff;border-top:1px solid var(--br-border)}
.br-footer-inner{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:2.5rem 0;flex-wrap:wrap}
.br-foot-copy{margin:0;font-size:.875rem;color:var(--br-muted-2)}

/* Content / blog */
.br-content{padding:4rem 1rem}
.br-post-list{display:grid;gap:1.5rem;margin-top:2rem}
.br-post-card{background:#fff;border:1px solid var(--br-border);border-radius:.625rem;padding:1.75rem}
.br-post-meta{color:var(--br-muted-2);font-size:.875rem;margin:.25rem 0 .75rem}
.br-link{color:var(--br-red);font-weight:600}
.br-article{padding:3.5rem 1rem;max-width:780px}
.br-article-head{margin-bottom:1.5rem}
.br-article-thumb{margin:1.5rem 0;border-radius:.625rem;overflow:hidden}
.br-article-body{font-size:1.05rem;line-height:1.75;color:#111}
.br-article-body h2{font-family:var(--br-font-head);font-weight:700;font-size:1.5rem;margin:2.25rem 0 .75rem}
.br-article-body h3{font-family:var(--br-font-head);font-weight:600;font-size:1.2rem;margin:1.75rem 0 .5rem}
.br-article-body p{margin:0 0 1.1rem}
.br-article-body a,.br-article-body .relay-inline-citation{color:var(--br-red)}
.br-article-body blockquote{border-left:3px solid var(--br-red);padding-left:1rem;color:var(--br-muted);margin:1.5rem 0;font-style:italic}
.br-article-body ul,.br-article-body ol{padding-left:1.25rem;margin:0 0 1.1rem}
.br-pagination{margin-top:2rem}