@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,300..700;1,9..144,300..700&family=Inter:wght@400;500;600;700&display=swap');

:root {
  --tfmc-bg: #FAF9F6;
  --tfmc-ink: #343231;
  --tfmc-ink-soft: #423E37;
  --tfmc-deep: #251605;
  --tfmc-line: #e4e1da;
  --tfmc-surface: #F2F2F2;
  --tfmc-accent: #3F84E5;
  --tfmc-accent-soft: #3E7CB1;
  --tfmc-font-display: "Fraunces", Georgia, "Times New Roman", serif;
  --tfmc-font-body: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.tfmc-site, .tfmc-site *, .tfmc-site *::before, .tfmc-site *::after { box-sizing: border-box; }
.tfmc-site {
  font-family: var(--tfmc-font-body);
  color: var(--tfmc-ink);
  background: var(--tfmc-bg);
  line-height: 1.6;
  font-size: 1.0625rem;
}
.tfmc-site img, .tfmc-site video { max-width: 100%; display: block; }
.tfmc-site a { color: inherit; }
.tfmc-site ul { list-style: none; margin: 0; padding: 0; }
.tfmc-site h1, .tfmc-site h2, .tfmc-site h3, .tfmc-site h4 { font-family: var(--tfmc-font-display); line-height: 1.15; margin: 0 0 1rem; font-weight: 700; }
.tfmc-site p { margin: 0 0 1rem; }

@media (prefers-reduced-motion: reduce) {
  .tfmc-site, .tfmc-site * { animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; }
}

.tfmc-site .wrap { max-width: 72rem; margin-inline: auto; padding-inline: 1.5rem; }
.tfmc-site section { padding-block: 6rem; }
.tfmc-site section.tight { padding-block: 2.5rem; }
.tfmc-site .eyebrow {
  font-family: var(--tfmc-font-display);
  font-style: italic;
  font-size: 2.25rem;
  color: var(--tfmc-accent);
  font-weight: 600;
  opacity: 0.5;
  margin-bottom: 0.25rem;
  line-height: 1;
}

.tfmc-site .reveal {
  opacity: 0;
  transform: translateY(38px) scale(0.97);
  transition: opacity 0.7s cubic-bezier(0.16,1,0.3,1), transform 0.7s cubic-bezier(0.16,1,0.3,1);
}
.tfmc-site .reveal.is-visible { opacity: 1; transform: none; }

@keyframes tfmcFadeUp { from { opacity:0; transform:translateY(24px);} to { opacity:1; transform:none; } }
@keyframes tfmcBlink { 0%,100%{opacity:1;} 50%{opacity:0;} }
@keyframes tfmcMarquee { from{transform:translateX(0);} to{transform:translateX(-50%);} }

.tfmc-site .hero-animated h1 .line { animation: tfmcFadeUp 0.8s cubic-bezier(0.16,1,0.3,1) both; display:block; }
.tfmc-site .hero-animated h1 .line:nth-child(2) { animation-delay: 0.1s; }
.tfmc-site .hero-animated .lede { animation: tfmcFadeUp 0.8s cubic-bezier(0.16,1,0.3,1) 0.25s both; }
.tfmc-site .hero-animated .hero-cta { animation: tfmcFadeUp 0.8s cubic-bezier(0.16,1,0.3,1) 0.4s both; }

.tfmc-site .cursor { display:inline-block; animation: tfmcBlink 1s step-end infinite; color: var(--tfmc-accent); font-weight:400; }

.tfmc-site .hero { position:relative; padding-block: 7.2rem 4rem; border-bottom:1px solid var(--tfmc-line); }
.tfmc-site .hero h1 { font-size: clamp(2.5rem,6vw,4.75rem) !important; max-width:46rem; letter-spacing:-0.02em; line-height:1.05; }
.tfmc-site .hero p.lede { max-width:32rem; margin:1.5rem 0 1.5rem; color: var(--tfmc-ink-soft); font-size:1.15rem; }

.tfmc-site .stat-bar { display:grid; grid-template-columns:repeat(auto-fit,minmax(12rem,1fr)); gap:1.5rem; border-top:1px solid var(--tfmc-line); border-bottom:1px solid var(--tfmc-line); padding-block:2.5rem; }
.tfmc-site .stat-bar .stat { text-align:center; }
.tfmc-site .stat-bar .stat strong { display:block; font-family:var(--tfmc-font-display); font-size:clamp(2.75rem,6vw,4.5rem) !important; color:var(--tfmc-accent); letter-spacing:-0.02em; }
.tfmc-site .stat-bar .stat span { color:var(--tfmc-ink-soft); font-size:0.9rem; }

.tfmc-site .btn { display:inline-block; padding:0.75rem 1.5rem; background:var(--tfmc-ink); color:var(--tfmc-bg); text-decoration:none; border-radius:999px; font-family:var(--tfmc-font-body); font-size:0.95rem; font-weight:600; transition:opacity .15s ease, transform .15s ease; }
.tfmc-site .btn:hover { opacity:.85; transform:translateY(-1px); }
.tfmc-site .btn.btn-outline { background:transparent; color:var(--tfmc-ink); border:1px solid var(--tfmc-line); }
.tfmc-site .btn.btn-accent { background:var(--tfmc-accent); }

.tfmc-site .grid { display:grid; gap:1.5rem; grid-template-columns:repeat(auto-fill,minmax(16rem,1fr)); }
.tfmc-site .card { border:1px solid var(--tfmc-line); border-radius:0.5rem; overflow:hidden; background:var(--tfmc-surface); transition:border-color .25s ease; }
.tfmc-site .card:hover { border-color:var(--tfmc-accent); }
.tfmc-site .card img, .tfmc-site .card video { aspect-ratio:4/5; object-fit:cover; width:100%; }
.tfmc-site .card .card-body { padding:1rem; }
.tfmc-site .card .eyebrow { margin-bottom:0.35rem; }
.tfmc-site .card h3 { font-size:1.05rem; margin-bottom:0.25rem; }
.tfmc-site .card p { color:var(--tfmc-ink-soft); font-size:0.9rem; margin:0; }

.tfmc-site .pill-row { display:flex; flex-wrap:wrap; gap:0.6rem; margin-top:1rem; }
.tfmc-site .pill-row.centered { justify-content:center; }
.tfmc-site .pill { font-family:var(--tfmc-font-display); font-weight:600; color:var(--tfmc-ink-soft); border:1px solid var(--tfmc-line); border-radius:999px; padding:0.4rem 1rem; font-size:0.85rem; transition:color .2s ease, border-color .2s ease; }
.tfmc-site .pill:hover { color:var(--tfmc-accent); border-color:var(--tfmc-accent); }

.tfmc-site .logo-marquee { display:flex; flex-direction:column; gap:1rem; margin-top:1.5rem; }
.tfmc-site .logo-row { overflow:hidden; -webkit-mask-image: linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent); mask-image: linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent); }
.tfmc-site .logo-track { display:flex; width:max-content; gap:4rem; animation: tfmcMarquee 60s linear infinite; }
.tfmc-site .logo-row.reverse .logo-track { animation-direction:reverse; }
.tfmc-site .logo-row:hover .logo-track { animation-play-state:paused; }
.tfmc-site .logo-item { font-family:var(--tfmc-font-display); font-weight:700; font-size:1.15rem; color:var(--tfmc-ink-soft); white-space:nowrap; opacity:.65; transition:opacity .2s ease, color .2s ease; }
.tfmc-site .logo-item:hover { opacity:1; color:var(--tfmc-accent); }

.tfmc-site .testimonial-grid { display:grid; gap:2.5rem 1.5rem; grid-template-columns:repeat(auto-fill,minmax(16rem,1fr)); }
.tfmc-site .testimonial { border-top:2px solid var(--tfmc-ink); padding-top:1rem; }
.tfmc-site .testimonial p { margin-bottom:0.5rem; }
.tfmc-site .testimonial cite { font-style:normal; font-family:var(--tfmc-font-display); font-weight:700; font-size:0.85rem; text-transform:uppercase; letter-spacing:0.04em; color:var(--tfmc-accent-soft); }

.tfmc-site .case-study { border-top:1px solid var(--tfmc-line); padding-block:1.5rem; }
.tfmc-site .case-study:first-of-type { border-top:none; padding-top:0; }
.tfmc-site .case-study .eyebrow { color:var(--tfmc-accent); }
.tfmc-site .case-study .case-index { color:var(--tfmc-ink-soft); font-weight:400; margin-right:0.4em; }

.tfmc-site form.contact-form { display:grid; gap:1rem; max-width:32rem; }
.tfmc-site label { font-family:var(--tfmc-font-display); font-size:0.9rem; display:block; margin-bottom:0.35rem; }
.tfmc-site input, .tfmc-site textarea { width:100%; padding:0.65rem 0.8rem; border:1px solid var(--tfmc-line); border-radius:0.5rem; font-family:var(--tfmc-font-body); font-size:1rem; background:var(--tfmc-bg); color:var(--tfmc-ink); }
.tfmc-site textarea { min-height:8rem; resize:vertical; }

.tfmc-site .split { display:grid; gap:2.5rem; grid-template-columns:1fr 1fr; align-items:center; }
@media (max-width:42rem) { .tfmc-site .split { grid-template-columns:1fr; } }

.tfmc-site .band-deep { background:var(--tfmc-deep); color:var(--tfmc-bg); }
.tfmc-site .band-deep .eyebrow { color:var(--tfmc-accent); }
.tfmc-site .band-deep h2 { color:var(--tfmc-bg); }
.tfmc-site .band-deep p { color:#d9d3ca; }


.tfmc-site .video-wall {
  overflow: hidden;
  margin-top: 1.5rem;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 4%, #000 96%, transparent);
  mask-image: linear-gradient(90deg, transparent, #000 4%, #000 96%, transparent);
}
.tfmc-site .video-wall-track {
  display: flex;
  gap: 1.5rem;
  width: max-content;
  animation: marquee-left 26s linear infinite;
}
.tfmc-site .video-wall:hover .video-wall-track { animation-play-state: paused; }
.tfmc-site .video-wall .video-card {
  flex: 0 0 auto;
  width: 16rem;
  aspect-ratio: 9 / 16;
  border-radius: 1rem;
  background: var(--tfmc-surface);
  border: 1px dashed var(--tfmc-line);
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  overflow: hidden;
}
.tfmc-site .video-wall .play-icon {
  width: 3rem;
  height: 3rem;
  border-radius: 50%;
  background: var(--tfmc-ink);
  color: var(--tfmc-bg);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.1rem;
}
.tfmc-site .video-wall .video-label {
  position: absolute;
  bottom: 0.75rem;
  left: 0.5rem;
  right: 0.5rem;
  font-family: var(--tfmc-font-display);
  font-weight: 700;
  font-size: 0.78rem;
  color: var(--tfmc-ink-soft);
  text-align: center;
}

.tfmc-site .path-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.5rem;
  margin-top: 1.5rem;
}
@media (max-width: 42rem) {
  .tfmc-site .path-grid { grid-template-columns: 1fr; }
}
.tfmc-site .path-card {
  border-radius: 1rem;
  padding: 2rem;
  border: 1px solid var(--tfmc-line);
  background: var(--tfmc-surface);
}
.tfmc-site .path-card.path-deep {
  background: var(--tfmc-deep);
  color: var(--tfmc-bg);
  border: none;
}
.tfmc-site .path-card.path-deep .eyebrow { color: var(--tfmc-accent); }
.tfmc-site .path-card.path-deep p { color: #d9d3ca; }
.tfmc-site .path-card ul { margin: 1rem 0 1.5rem; }
.tfmc-site .path-card li {
  padding-left: 1.2rem;
  position: relative;
  margin-bottom: 0.4rem;
  font-size: 0.92rem;
}
.tfmc-site .path-card li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.55em;
  width: 0.5rem;
  height: 0.5rem;
  border-radius: 50%;
  background: var(--tfmc-accent);
}


/* Heading color safety net + dark-card contrast fix */
.tfmc-site h1, .tfmc-site h2, .tfmc-site h3, .tfmc-site h4 { color: var(--tfmc-ink); }
.tfmc-site .path-card.path-deep h3,
.tfmc-site .path-card.path-deep h2,
.tfmc-site .path-card.path-deep h4 { color: var(--tfmc-bg); }

/* Bullet fix: kill native + duplicate markers, keep only the custom dot */
.tfmc-site .path-card ul,
.tfmc-site .path-card li {
  list-style: none !important;
  padding-left: 0;
}
.tfmc-site .path-card li { padding-left: 1.2rem; }

/* Hero visual mockup placeholder */
.tfmc-site .hero-grid {
  display: grid;
  grid-template-columns: 1.15fr 0.85fr;
  gap: 2.5rem;
  align-items: center;
}
@media (max-width: 48rem) {
  .tfmc-site .hero-grid { grid-template-columns: 1fr; }
}
.tfmc-site .hero-visual { position: relative; height: 22rem; }
@media (max-width: 48rem) { .tfmc-site .hero-visual { height: 18rem; margin-top: 2rem; } }
.tfmc-site .mock-frame {
  position: absolute;
  width: 11.5rem;
  aspect-ratio: 9 / 16;
  border-radius: 1.5rem;
  border: 6px solid var(--tfmc-ink);
  box-shadow: 0 20px 40px -12px rgba(37, 22, 5, 0.25);
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--tfmc-font-display);
  font-weight: 700;
  text-align: center;
  padding: 1rem;
}
.tfmc-site .mock-frame-1 {
  top: 0;
  left: 1.5rem;
  transform: rotate(-6deg);
  z-index: 2;
  background: var(--tfmc-surface);
  color: var(--tfmc-ink-soft);
}
.tfmc-site .mock-frame-2 {
  top: 2.5rem;
  right: 0;
  transform: rotate(5deg);
  z-index: 1;
  background: var(--tfmc-deep);
  border-color: var(--tfmc-deep);
  color: var(--tfmc-bg);
}

.tfmc-site .accent-word {
  font-style: italic;
  color: var(--tfmc-accent);
  font-weight: 600;
}
.tfmc-site h2 { font-size: clamp(2rem, 4.5vw, 3rem); }
.tfmc-site h3 { font-size: clamp(1.4rem, 2.5vw, 1.85rem); }

.tfmc-site h2.heading-sm { font-size: clamp(1.85rem,4vw,2.5rem); }