/* Self-hosted Inter (variable, latin) - replaces the render-blocking Google Fonts
   request that was the measured LCP bottleneck. */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400 600;
  font-display: swap;
  src: url('fonts/inter-latin.woff2') format('woff2');
}

/* ============================================================
   EVERYTHING ADVERTS - site.css
   Structure now cloned from bycrawford VERBATIM inline styles (index.html
   embeds bycrawford's real <style> block inline). This file only carries
   what still depends on external CSS: design tokens, the carried-over
   video-wall testimonials section, the header, the WhatsApp widget, the
   sticky CTA bar, and the footer. Section layouts (hero/marquee/why-us/
   process/work/pricing/faq/final) are bycrawford's inline styles now -
   do not re-add recreated CSS for them here, it will fight the inline values.
   ============================================================ */

@font-face{font-family:'GS';src:url('gsfonts/GeneralSans-Regular.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'GS';src:url('gsfonts/GeneralSans-Medium.woff2') format('woff2');font-weight:500;font-display:swap}
@font-face{font-family:'GS';src:url('gsfonts/GeneralSans-Semibold.woff2') format('woff2');font-weight:600;font-display:swap}
@font-face{font-family:'GS';src:url('gsfonts/GeneralSans-Bold.woff2') format('woff2');font-weight:700;font-display:swap}

:root{
  /* dark grounds + on-dark type */
  --dark:#1E2630; --dark-2:#232B36; --dark-3:#2C3743;
  --slate:#8FA6BA;            /* accent - ON DARK ONLY */
  --slate-soft:#A9B6C2;
  --on-dark:#EDECE9; --on-dark-72:rgba(237,236,233,.74); --on-dark-50:rgba(237,236,233,.5);
  --feature:#D5DBE0;
  --line-d:rgba(143,166,186,.14); --line-d-2:rgba(237,236,233,.1); --line-d-strong:rgba(143,166,186,.5);
  /* cream grounds + on-cream type */
  --cream:#F2F1EF; --cream-hi:#FCFBFA; --cream-band:#E9E8E5; --cream-lo:#EDECE9;
  --ink:#232B36;             /* primary type on cream */
  --soft:#5A6570;            /* secondary type on cream */
  --muted:#8A95A0;           /* meta on cream */
  --ea-slate:#4A6076;        /* THE accent on cream (contrast fix, 5.77:1) */
  --ea-slate-12:rgba(90,113,132,.12);
  --line-c:rgba(35,43,54,.10); --line-c-2:rgba(35,43,54,.16);
  --gold:#C9930A;
  /* system */
  --maxw:1520px; --pad:40px;
  --disp:'GS','Helvetica Neue',Helvetica,Arial,sans-serif;
  --body:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;
  --r-card:18px; --r-panel:22px; --r-quote:24px; --r-section:28px;
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--cream);color:var(--ink);font-family:var(--body);font-size:16px;line-height:1.55;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;color-scheme:only light;overflow-x:clip}
img,video,svg{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;cursor:pointer}
:focus-visible{outline:2px solid var(--ea-slate);outline-offset:3px}
::selection{background:rgba(143,166,186,.28)}

.wrap{max-width:var(--maxw);margin:0 auto;padding:0 var(--pad)}
@media(max-width:680px){:root{--pad:20px}}

/* ---- CTA button - still used by the sticky bar (#ctabar), which has no
   inline styles of its own and is carried over unchanged from the prior
   build. Every #bch button now inlines its own colors (bycrawford's own
   convention), so this system is redundant-but-harmless there and
   load-bearing here. ---- */
.cta{display:inline-flex;align-items:stretch;gap:3px;height:49px;text-decoration:none;white-space:nowrap;cursor:pointer;transition:gap .25s ease}
.cta:hover{gap:6px}
.cta:hover .cta-arrow{transform:rotate(-45deg)}
.cta-label{display:flex;align-items:center;padding:0 25px;border-radius:12px;font-family:var(--disp);font-size:12.5px;letter-spacing:.08em;text-transform:uppercase;font-weight:500;transition:background .25s ease,color .25s ease,transform .35s cubic-bezier(0.34,1.56,0.64,1)}
.cta-arrow{display:flex;align-items:center;justify-content:center;width:49px;border-radius:12px;transition:background .25s ease,color .25s ease,transform .35s cubic-bezier(0.34,1.56,0.64,1)}
.cta-chev{display:block;width:9px;height:9px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(-45deg);margin-left:-3px}
.cta-onlight .cta-label,.cta-onlight .cta-arrow{background:#232B36;color:#F2F1EF}
.cta-light .cta-label,.cta-light .cta-arrow{background:#F2F1EF;color:#232B36}
.cta-ondark .cta-label,.cta-ondark .cta-arrow{background:rgba(237,236,233,0.14);color:#EDECE9}
.cta.block{display:flex;width:100%}.cta.block .cta-label{flex:1;justify-content:center}

/* ============================================================
   HEADER (carried over unchanged - bycrawford has no nav; EA keeps a light logo bar)
   ============================================================ */
.ea-head{position:relative;z-index:10;padding:22px 0}
.ea-head .brand{display:inline-flex}
.ea-head .brand img{width:44px;height:44px}

/* ============================================================
   TESTIMONIALS (KEPT Nave video wall - carried over unchanged, the one
   section that stayed on EA's class-based CSS instead of bycrawford's
   inline convention, per the rebuild brief)
   ============================================================ */
.cream{background:var(--cream)}
.tsm{padding:96px 0}
.tsm .thead{margin-bottom:40px}
.tsm .eyebrow{display:block;background:none;padding:0;border:0;font-family:var(--body);font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--slate);margin:0 0 14px}
.tsm .ph{font-family:var(--disp);font-weight:600;font-size:clamp(28px,3.9vw,50px);line-height:1.06;letter-spacing:-.028em;color:var(--ink);margin:0}
.tsm .ph i{font-style:normal;color:var(--slate)}
.tsm .tsub{font-family:var(--body);font-size:16px;line-height:1.55;color:var(--soft);max-width:600px;margin:10px 0 0}
.cargo{column-count:4;column-gap:14px;margin-top:4px}
@media(max-width:1080px){.cargo{column-count:3}}
@media(max-width:820px){.cargo{column-count:2}}
@media(max-width:520px){.cargo{column-count:1}}
/* .crate styling lives ONE place now: the #bch .crate rules inline in
   index.html (video-wall section). The old duplicate .crate / .crate.land /
   .crate::before,::after rules here were dead (out-ranked by #bch) and were
   removed 2026-09-05 in the design pass, along with the slate-blue corner
   brackets. Do not re-add crate box styling here. */
.chead{display:flex;justify-content:space-between;align-items:center;gap:8px;font-family:var(--body);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--slate);padding:7px 10px;border-bottom:1px solid var(--line-c)}
.cnum{color:rgba(35,43,54,.4)}
.cmedia{position:relative;background:#0c0f0d}
.cmedia video{width:100%;display:block}
.crate.hasv{cursor:pointer}
.csnd{position:absolute;right:8px;bottom:8px;font-family:var(--body);font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--slate);background:rgba(252,251,250,.9);border:1px solid var(--line-c);padding:4px 7px;opacity:0;transition:opacity .25s;pointer-events:none}
.crate.hasv:hover .csnd,.crate.loud .csnd{opacity:1}
.cdesc{margin:0;padding:8px 10px 10px;font-size:12.5px;line-height:1.5;color:var(--soft)}
.tsm .foot{margin-top:28px;text-align:left;font-size:13px;color:var(--muted);letter-spacing:.02em}
/* #bch's Squarespace guards (#bch p{color:inherit;margin:0} etc.) win by ID
   specificity over the plain classes above wherever this section sits
   inside #bch - these #bch-prefixed overrides win back by specificity
   (no !important needed) so the video wall keeps its own type/color/spacing. */
#bch .tsm .tsub{color:var(--soft);margin:10px 0 0}
#bch .tsm .cdesc{color:var(--soft)}
#bch .tsm .foot{color:var(--muted);margin-top:28px}

/* ============================================================
   Footer + floating WhatsApp widget + sticky bar (carried over unchanged)
   ============================================================ */
footer{padding:40px 0 110px}
.pagechrome{display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;font-family:var(--body);font-size:13px;color:var(--muted)}
.pagechrome a{color:var(--ea-slate)}

#ctabar{position:fixed;left:0;right:0;bottom:0;z-index:50;background:rgba(35,43,54,.9);backdrop-filter:blur(12px);border-top:1px solid var(--line-d);padding:12px 0 calc(12px + env(safe-area-inset-bottom));transform:translateY(110%);transition:transform .3s ease}
#ctabar.show{transform:none}
#ctabar .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px}
#ctabar .t{font-family:var(--body);font-size:13px;color:var(--on-dark-72)}
#ctabar .cta{height:44px}#ctabar .cta-arrow{width:44px}#ctabar .cta-label{padding:0 20px}
@media(max-width:640px){#ctabar .t{display:none}#ctabar .wrap{justify-content:center}}

/* WhatsApp widget */
.wa{position:fixed;right:20px;bottom:20px;z-index:60}
body.cta-on .wa{bottom:84px}
.wa-btn{width:56px;height:56px;border-radius:50%;background:#25D366;border:none;box-shadow:0 10px 30px -8px rgba(0,0,0,.4);display:flex;align-items:center;justify-content:center;position:relative}
.wa-ic{width:28px;height:28px}.wa-close-ic{width:24px;height:24px;position:absolute;opacity:0;transition:opacity .2s}
.wa.wa-open .wa-ic{opacity:0}.wa.wa-open .wa-close-ic{opacity:1}
.wa-panel{position:absolute;right:0;bottom:70px;width:320px;max-width:calc(100vw - 40px);background:var(--cream-hi);border:1px solid var(--line-c);border-radius:16px;overflow:hidden;box-shadow:0 24px 60px -20px rgba(30,38,48,.5);opacity:0;transform:translateY(10px) scale(.98);pointer-events:none;transition:opacity .2s,transform .2s}
.wa.wa-open .wa-panel{opacity:1;transform:none;pointer-events:auto}
.wa-head{display:flex;align-items:center;gap:10px;padding:14px;background:var(--dark);color:var(--on-dark)}
.wa-ava{width:38px;height:38px;border-radius:50%;background:var(--cream);display:flex;align-items:center;justify-content:center;overflow:hidden}
.wa-ava img{width:34px;height:34px;object-fit:contain}
.wa-id b{display:block;font-size:14px}
.wa-status{display:flex;align-items:center;gap:6px;font-size:11px;color:var(--on-dark-72)}
.wa-status i{width:7px;height:7px;border-radius:50%;background:#25D366;display:inline-block}
.wa-x{margin-left:auto;background:none;border:none;color:var(--on-dark);font-size:20px;line-height:1}
.wa-body{padding:16px;min-height:90px;background:var(--cream)}
.wa-typing{display:flex;gap:4px}
.wa-typing span{width:7px;height:7px;border-radius:50%;background:var(--muted);animation:wat 1s infinite}
.wa-typing span:nth-child(2){animation-delay:.15s}.wa-typing span:nth-child(3){animation-delay:.3s}
@keyframes wat{0%,60%,100%{opacity:.3}30%{opacity:1}}
.wa-bubble{background:var(--cream-hi);border:1px solid var(--line-c);border-radius:12px;padding:12px 14px;font-size:13.5px;line-height:1.5;color:var(--ink)}
.wa-time{display:block;font-size:10px;color:var(--muted);margin-top:6px}
.wa-foot{display:flex;gap:8px;padding:12px;border-top:1px solid var(--line-c);background:var(--cream-hi)}
.wa-foot input{flex:1;border:1px solid var(--line-c);border-radius:999px;padding:9px 14px;font:inherit;font-size:13.5px;background:var(--cream);color:var(--ink)}
.wa-send{width:38px;height:38px;border-radius:50%;background:#25D366;border:none;display:flex;align-items:center;justify-content:center}
.wa-send svg{width:18px;height:18px}

hr.rule{border:0;border-top:1px solid var(--line-c);margin:0}