/* Broadcast Affiliate Sales - shared base styles (tokens, header, footer, buttons).
   Page-specific styles live in home.css / clients.css. */

:root{
  --ink:#0F1B2D; --ink-2:#16253B; --ink-deep:#0A1422; --line-dark:#243349; --field:#34465F;
  --paper:#F6F4EF; --sand:#E9E4D8; --line:#E2DDD2; --chip:#CFC8B8; --white:#FFFFFF;
  --text:#3D4A5C; --muted:#9AA6B6; --soft:#C4CCD8;
  --accent:#E8A838; --accent-text:#8A4F06;
  /* All type set in Georgia per client request */
  --serif:Georgia,'Times New Roman',Times,serif;
  --sans:Georgia,'Times New Roman',Times,serif;
  --mono:Georgia,'Times New Roman',Times,serif;
  --pad:clamp(20px,6.5vw,96px);
  --section:clamp(64px,9vw,130px);
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;font-family:var(--sans);background:var(--paper);color:var(--ink);-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
:focus-visible{outline:3px solid var(--accent);outline-offset:3px;border-radius:6px}
h1,h2,h3,p{margin:0}
.serif{font-family:var(--serif);font-weight:600}
.eyebrow{font-family:var(--mono);font-size:13px;letter-spacing:.2em;color:var(--accent-text);text-transform:uppercase}
.on-dark .eyebrow{color:var(--accent)}
.h2{font-family:var(--serif);font-weight:600;font-size:clamp(40px,4.6vw,66px);line-height:1.06;letter-spacing:-.02em}
/* Emphasized words in display headings: not italic, brand amber */
.serif em,.h2 em,.hero h1 em,.page-hero h1 em{font-style:normal;color:var(--accent)}
.wrap{padding-inline:var(--pad)}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:54px;padding:0 30px;border-radius:999px;font-weight:600;font-size:17px;border:0;cursor:pointer;font-family:inherit}
.btn-accent{background:var(--accent);color:var(--ink)}
.btn-accent:hover{background:#F2B955}
.btn-ghost{border:1px solid #4A5A72;color:var(--paper);font-weight:400}
.btn-ghost:hover{border-color:var(--paper)}
.btn-dark{background:var(--ink);color:var(--paper)}
.btn-dark:hover{background:#1C2D45}
.btn-line{border:1px solid var(--ink);color:var(--ink);font-weight:500}

/* Header */
.site-header{position:sticky;top:0;z-index:50;background:var(--ink);color:var(--paper);border-bottom:1px solid var(--line-dark)}
.nav{display:flex;align-items:center;justify-content:space-between;gap:24px;padding-block:20px;position:relative}
.brand{display:flex;align-items:center;gap:14px}
.brand-name{display:flex;flex-direction:column;line-height:1.15}
.brand-name strong{font-family:var(--serif);font-size:18px;font-weight:700;letter-spacing:.02em}
.brand-name span{font-family:var(--mono);font-size:11px;letter-spacing:.18em;color:#B9C2CF}
.nav-links{display:flex;align-items:center;gap:36px;font-size:15px}
.nav-links a:not(.btn){color:#DCE2EA}
.nav-links a:not(.btn):hover,.nav-links a[aria-current]{color:var(--accent)}
.nav-links .phone{font-family:var(--mono)}
.nav-links .btn{min-height:46px;padding:0 22px;font-size:15px}
.menu-toggle{display:none;width:44px;height:44px;border:1px solid var(--field);border-radius:12px;background:transparent;color:var(--paper);align-items:center;justify-content:center;cursor:pointer}
.menu-toggle .icon-close{display:none}
.menu-toggle[aria-expanded="true"] .icon-open{display:none}
.menu-toggle[aria-expanded="true"] .icon-close{display:block}

/* Footer */
.site-footer{background:var(--ink-deep);color:#8795A8;font-size:14px;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;padding-block:36px}
.site-footer .social{display:flex;gap:18px}
.site-footer .social a:hover{color:var(--accent)}

/* Shared responsive: menu + brand */
@media (max-width:900px){
  .menu-toggle{display:inline-flex}
  .nav-links{position:absolute;top:100%;left:0;right:0;flex-direction:column;align-items:stretch;gap:0;background:var(--ink-2);padding:8px var(--pad) 24px;border-top:1px solid var(--line-dark);border-bottom:1px solid var(--line-dark);box-shadow:0 24px 40px rgba(0,0,0,.35);display:none}
  .nav-links.open{display:flex}
  .nav-links a:not(.btn){padding:16px 0;border-bottom:1px solid var(--line-dark)}
  .nav-links .btn{margin-top:16px}
}
@media (max-width:600px){
  .brand-name strong{font-size:15px}
  .brand-name span{display:none}
  .site-footer{flex-direction:column}
}

@media (max-width:680px){
  .eyebrow{font-size:12px}
  .btn{font-size:16px}
  .h2{font-size:30px;line-height:1.2}
}