/* Additions to the Webflow stylesheet: components the template does not have (articles, glossary, legal),
   plus small fixes. Uses the template's own tokens: black, white, #cd1d5b, Alumni Sans + Lato. */
:root { --fb-magenta: #cd1d5b; }
html { overflow-x: clip; }
body { overflow-x: clip; }
.js-accordion-body { display: none; }
.callnow a { text-decoration: none !important; }
.w-webflow-badge { display: none !important; }

/* headings that must not be a second <h1> but keep the h1 look */
.fb-h1-like { letter-spacing: 2px; text-transform: uppercase; font-family: 'Alumni Sans', sans-serif; font-weight: 700; margin-top: 0; }
h2.about-subhead-h5 { margin-top: 0; margin-bottom: 20px; font-weight: 700; }

/* honeypot: off-screen, not display:none */
.fb-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* home: all-projects link */
.fb-all-work { padding: 25px 4%; }
.fb-all-work-link { color: var(--black); text-decoration: none; letter-spacing: 1px; font-weight: 700; }
.fb-all-work-link:hover { color: var(--fb-magenta); }
.fb-onphoto-link { color: #fff; text-decoration: underline; }

/* ---------- article / glossary / legal ---------- */
.fb-title { font-size: clamp(48px, 8.2vw, 128px); line-height: .82; margin-bottom: 0; color: var(--black); }
.fb-title.on-photo { color: #fff; }
.fb-crumbs { font-family: 'Alumni Sans', sans-serif; font-size: 22px; font-weight: 600; letter-spacing: 2px; text-transform: uppercase; margin-bottom: 20px; }
.fb-crumbs a { color: inherit; text-decoration: none; margin: 0; }
.fb-crumbs a:hover { color: var(--fb-magenta); }
.fb-crumbs .sep { margin: 0 8px; }
.fb-lede { max-width: 760px; font-family: Lato, sans-serif; font-size: 1.8rem; line-height: 1.2; font-weight: 400; margin: 28px 0 0; }
.fb-meta { display: flex; flex-wrap: wrap; gap: 8px 40px; margin-top: 28px; font-family: Lato, sans-serif; }
.fb-meta .project-info-label { font-family: 'Alumni Sans', sans-serif; font-size: 20px; font-weight: 600; letter-spacing: 2px; }
.fb-meta time, .fb-meta .bold { font-size: 1.125rem; }
.fb-hero-pad { padding: 60px; position: relative; z-index: 2; }
.fb-hero-image { border-top: 1px solid #000; }
.fb-hero-image img { display: block; width: 100%; height: auto; max-height: 640px; object-fit: cover; }

.fb-article { padding: 80px 4% 100px; }
.fb-prose { max-width: 760px; margin: 0 auto 0 0; font-family: Lato, sans-serif; font-size: 1.25rem; line-height: 1.55; color: var(--black); }
.fb-prose > :first-child { margin-top: 0; }
.fb-prose p, .fb-prose li { font-size: 1.25rem; line-height: 1.55; color: var(--black); }
.fb-prose p { margin: 0 0 1.2em; }
.fb-prose h2 { font-size: clamp(40px, 5vw, 64px); line-height: .9; margin: 1.6em 0 .5em; color: var(--black); }
.fb-prose h3 { font-size: clamp(30px, 3.4vw, 44px); line-height: 1; margin: 1.4em 0 .4em; }
.fb-prose h4 { margin: 1.4em 0 .4em; text-transform: none; }
.fb-prose a { color: var(--fb-magenta); text-decoration: underline; margin: 0; font-weight: 700; }
.fb-prose a:hover { color: var(--black); }
.fb-prose ul, .fb-prose ol { margin: 0 0 1.4em; padding-left: 1.3em; }
.fb-prose li { margin-bottom: .5em; }
.fb-prose blockquote { border-left: 3px solid var(--fb-magenta); margin: 1.6em 0; padding: .2em 0 .2em 24px; font-size: 1.5rem; line-height: 1.3; }
.fb-prose strong { font-weight: 700; }
.fb-prose hr { border: 0; border-top: 1px solid #000; margin: 2.4em 0; height: 0; }
.fb-prose table { width: 100%; margin: 0 0 1.4em; font-size: 1.05rem; }
.fb-prose th, .fb-prose td { border: 1px solid #000; padding: 8px 12px; text-align: left; }
.fb-prose img { max-width: 100%; height: auto; }

.fb-byline { border-top: 1px solid #000; margin: 60px 4% 0; padding: 40px 0 0; max-width: 760px; }
.fb-byline p { font-size: 1.25rem; margin-bottom: 12px; }

.fb-pn { display: grid; grid-template-columns: 1fr 1fr; gap: 0; border-top: 1px solid #000; }
.fb-pn a { display: flex; flex-direction: column; justify-content: space-between; gap: 24px; padding: 40px 4%; min-height: 220px; color: var(--black); text-decoration: none; margin: 0; transition: background-color .2s, color .2s; }
.fb-pn a + a { border-left: 1px solid #000; text-align: right; }
.fb-pn a:hover { background: var(--black); color: #fff; }
.fb-pn .lab { font-family: 'Alumni Sans', sans-serif; font-size: 22px; font-weight: 600; letter-spacing: 2px; text-transform: uppercase; }
.fb-pn .ttl { font-family: 'Alumni Sans', sans-serif; font-size: clamp(32px, 4vw, 56px); font-weight: 700; line-height: .95; text-transform: uppercase; }

/* filter chips */
.fb-chips { display: flex; flex-wrap: wrap; gap: 10px; padding: 24px 4%; }
.fb-chip { font-family: 'Alumni Sans', sans-serif; font-size: 22px; font-weight: 600; letter-spacing: 2px; text-transform: uppercase; background: transparent; border: 1px solid #000; padding: 6px 16px; cursor: pointer; color: var(--black); transition: background-color .2s, color .2s; }
.fb-chip:hover, .fb-chip.is-active { background: var(--black); color: #fff; }
.fb-chip:focus-visible { outline: 3px solid var(--fb-magenta); outline-offset: 2px; }

/* glossary */
.fb-grid { display: grid; grid-template-columns: repeat(3, 1fr); border-left: 1px solid #000; }
.fb-card { display: flex; flex-direction: column; gap: 14px; padding: 36px 30px; min-height: 220px; border-right: 1px solid #000; border-bottom: 1px solid #000; color: var(--black); text-decoration: none; margin: 0; transition: background-color .2s, color .2s; }
.fb-card:hover { background: var(--black); color: #fff; }
.fb-card:hover p { color: #fff; }
.fb-card h2, .fb-card h3 { font-size: 44px; line-height: .95; margin: 0; text-transform: uppercase; }
.fb-card p { font-size: 1.05rem; margin: 0; color: #333; }
.fb-card .more { font-family: 'Alumni Sans', sans-serif; font-size: 22px; letter-spacing: 2px; font-weight: 600; text-transform: uppercase; margin-top: auto; }
.fb-see-also { max-width: 760px; margin-top: 70px; border-top: 1px solid #000; padding-top: 28px; }
.fb-see-also ul { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 8px 28px; }
.fb-see-also a { color: var(--fb-magenta); font-weight: 700; text-decoration: none; margin: 0; }
.fb-see-also a:hover { color: var(--black); text-decoration: underline; }

.fb-center { padding: 120px 4%; }

@media screen and (max-width: 991px) {
  .fb-grid { grid-template-columns: repeat(2, 1fr); }
  .fb-hero-pad { padding: 40px 30px; }
}
@media screen and (max-width: 767px) {
  .fb-lede { font-size: 1.4rem; }
  .fb-hero-pad { padding: 30px 20px; }
  .fb-article { padding: 50px 6% 70px; }
  .fb-prose, .fb-prose p, .fb-prose li { font-size: 1.1rem; }
  .fb-pn { grid-template-columns: 1fr; }
  .fb-pn a + a { border-left: 0; border-top: 1px solid #000; text-align: left; }
  .fb-grid { grid-template-columns: 1fr; }
  .fb-see-also ul { grid-template-columns: 1fr; }
  .fb-all-work { padding: 20px 6%; }
  .fb-byline { margin: 40px 6% 0; }
}

/* article index rows (same look as the project rows, without Webflow interaction bindings) */
.fb-row-item { position: relative; }
.fb-row { position: relative; display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 16px; align-items: center; padding: 25px 4%; color: var(--black); text-decoration: none; margin: 0; transition: color .2s, background-color .2s; }
.fb-row h3 { z-index: 2; }
.fb-row > div { position: relative; z-index: 2; }
.fb-row:hover, .fb-row:focus-visible { background: var(--black); color: #fff; }
.fb-row:hover h3, .fb-row:focus-visible h3 { color: #fff; }
.fb-row-thumb { position: absolute; z-index: 3; left: 50%; top: 50%; width: min(34vw, 560px); transform: translate(-50%, -50%); opacity: 0; pointer-events: none; transition: opacity .2s; border: 1px solid #fff; background: #000; }
.fb-row-thumb img { display: block; width: 100%; height: auto; max-height: 40vh; object-fit: cover; }
.fb-row:hover .fb-row-thumb { opacity: 1; }
@media (hover: none) { .fb-row-thumb { display: none; } }
@media screen and (max-width: 767px) { .fb-row { grid-template-columns: 1fr; gap: 6px; padding: 20px 6%; } .fb-row .text-align-right { text-align: left; } }
.fb-head-grid { grid-template-columns: 1fr 1fr 1fr; row-gap: 20px; }
.fb-head-grid h2 { grid-column: 1 / -1; }
.fb-head-grid .label-text:last-child { text-align: right; }
@media screen and (max-width: 767px) { .fb-head-grid .label-text { display: none; } .fb-head-grid h2 { font-size: 64px; } }
/* the template's carousel container is meant to clip its off-screen slides (class says so, a later rule overrides it) */
.container.overflow-hidden { overflow: hidden; }

.fb-dim { background-color: rgba(0,0,0,.55); background-blend-mode: multiply; }

/* Project hero photo: fill the hero once, never tile (Webflow set this per-page in the designer) */
.section-header .hero-grid.inner-hero[style*="background-image"] { background-size: cover; background-position: 50% 50%; background-repeat: no-repeat; }

/* Home > Media card photo (James, 2026-10-25) */
.svc-04-b { background-image: url("/assets/img/home/disney-vacations.jpg"); background-size: cover; background-position: 50% 50%; background-repeat: no-repeat; }
/* Home > Consulting card photo (James, 2026-10-25) */
.svc-01-b { background-image: url("/assets/img/home/absolut-warhol.jpg"); background-size: cover; background-position: 50% 50%; background-repeat: no-repeat; }
/* Home > Video & Animation card: Patriot Engines spot (James, 2026-10-25) */
.svc-07-b.fb-svc-video { background: #000; position: relative; overflow: hidden; }
.svc-07-b.fb-svc-video video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
.svc-07-b.fb-svc-video .svc-b-overlay { position: relative; z-index: 1; }
/* Home > Public Relations card photo (James, 2026-10-25) */
.svc-05-b { background-image: url("/assets/img/home/public-relations.jpg"); background-size: cover; background-position: 50% 50%; background-repeat: no-repeat; }
/* Home > Creative card photo (James, 2026-10-25) */
.svc-06-b { background-image: url("/assets/img/home/911.jpg"); background-size: cover; background-position: 50% 50%; background-repeat: no-repeat; }
/* Home > Brandsoul card photo (James, 2026-10-25) */
.svc-02-b { background-image: url("/assets/img/home/blue-buffalo.jpg"); background-size: cover; background-position: 100% 50%; background-repeat: no-repeat; }
/* Project lists: no service date column (James, 2026-10-26) */
.project-row-grid { grid-template-columns: 1fr 1fr; }
.project-row-grid > * { grid-column: auto !important; grid-row: auto !important; }
.fb-head-grid { grid-template-columns: 1fr 1fr; }
#w-node-d3fc85ce-5d25-c51a-d96a-46286872c4f3-10dabdba { grid-template-columns: 1fr 1fr; }
#w-node-_61d4376c-ff00-e7ba-2bf7-91601883c218-10dabdba { grid-column: 1 / -1; }
