/* $INTCOM token section — additive block for the inticomp mirror.
   Palette mirrors the upstream .home / .home-dark tokens so light and dark
   both look native. Never overrides anything from the app bundle. */

#intcom{
  --ic-paper:#fff;
  --ic-ink:#000;
  --ic-hair:rgba(0,0,0,.10);
  --ic-chip:#efebe6;
  --ic-body:#5f5f5f;
  --ic-quiet:#6f6f6f;
  background:var(--ic-paper);
  color:var(--ic-ink);
  font-family:"Geist Variable","Helvetica Neue",Arial,sans-serif;
  font-weight:400;
  padding:clamp(56px,7vw,112px) clamp(18px,5vw,56px) clamp(48px,5vw,84px);
  border-top:1px solid var(--ic-hair);
  -webkit-font-smoothing:antialiased;
}
/* The app's home surface is light by default and switches to the .home-dark
   palette from inside the bundle, so mirror that signal instead of the OS one:
   token.js sets html.ic-dark whenever #root carries .home-dark. */
html.ic-dark #intcom{
  --ic-paper:#000;
  --ic-ink:#fff;
  --ic-hair:rgba(255,255,255,.14);
  --ic-chip:#1a1a1a;
  --ic-body:#a6a6a6;
  --ic-quiet:#8a8a8a;
}

#intcom .ic-wrap{max-width:1120px;margin:0 auto}

#intcom .ic-eyebrow{
  font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;
  font-size:12px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--ic-quiet);margin:0 0 18px;
}
#intcom .ic-display{
  font-weight:500;line-height:.98;letter-spacing:-.045em;
  font-size:clamp(34px,6vw,68px);margin:0 0 20px;
}
#intcom .ic-lead{
  max-width:62ch;font-size:clamp(16px,1.6vw,20px);line-height:1.45;
  color:var(--ic-body);margin:0 0 44px;
}
#intcom .ic-lead strong{color:var(--ic-ink);font-weight:500}
#intcom .ic-lead em{font-style:normal;color:var(--ic-ink)}

.ic-grid{display:grid;grid-template-columns:1fr;gap:14px;margin:0 0 40px}
@media (min-width:640px){.ic-grid{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1000px){.ic-grid{grid-template-columns:repeat(3,1fr)}}
.ic-card{
  background:var(--ic-chip);border:1px solid var(--ic-hair);border-radius:22px;
  padding:22px 22px 24px;display:flex;flex-direction:column;gap:10px;min-height:170px;
}
.ic-card .ic-num{
  font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;
  font-size:12px;letter-spacing:.14em;color:var(--ic-body);
}
.ic-card h3{margin:0;font-weight:500;letter-spacing:-.03em;font-size:clamp(19px,2vw,24px);line-height:1.12}
.ic-card p{margin:0;font-size:15px;line-height:1.5;color:var(--ic-body)}

.ic-launch{
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:18px;
  background:var(--ic-chip);border:1px solid var(--ic-hair);border-radius:26px;
  padding:26px 26px;margin:0 0 18px;
}
.ic-ca-block{display:flex;flex-direction:column;gap:10px;min-width:0}
.ic-ca-block .ic-btn{align-self:flex-start;min-width:132px}
.ic-ca-label{
  font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;
  font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--ic-quiet);margin:0;
}
#ic-ca-value{
  display:block;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;
  font-size:clamp(15px,1.7vw,20px);line-height:1.35;letter-spacing:-.01em;
  word-break:break-all;max-width:64ch;background:none;border:0;padding:0;color:var(--ic-ink);
}
#ic-ca-value[data-ca-state="soon"]{color:var(--ic-body)}
.ic-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  height:44px;padding:0 22px;border-radius:999px;border:0;cursor:pointer;
  font-family:inherit;font-size:16px;letter-spacing:-.02em;text-decoration:none;
  background:var(--ic-ink);color:var(--ic-paper);transition:opacity .15s ease;
}
.ic-btn:hover{opacity:.82}
.ic-btn[disabled]{display:none}
.ic-btn-ghost{background:var(--ic-paper);color:var(--ic-ink);border:1px solid var(--ic-hair)}
.ic-meta{
  font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;
  font-size:13px;line-height:1.7;color:var(--ic-quiet);margin:0;
}
.ic-meta b{color:var(--ic-ink);font-weight:500}
.ic-cta{display:flex;flex-wrap:wrap;align-items:center;gap:14px;margin:26px 0 0}
.ic-cta .ic-fine{font-size:14px;line-height:1.5;max-width:52ch;color:var(--ic-body);margin:0}

/* header nav links injected into the React header */
.header-x-link,
a.ic-navlink{
  font-family:"Geist Variable","Helvetica Neue",Arial,sans-serif;
  font-weight:300;letter-spacing:-.045em;line-height:.95;
  font-size:16px;
  text-decoration:none;
  color:var(--home-quiet,#9a9a9a);
  transition:color .15s ease;
  white-space:nowrap;
}
a.ic-navlink:hover{color:var(--home-ink,currentColor)}
@media (min-width:640px){a.ic-navlink{font-size:22px}}
