@import url('./identifiable-graphic-tokens.css');

/* Local brand faces avoid a third-party font dependency on the homepage. */
@font-face{font-family:'Hanken Grotesk';font-style:normal;font-weight:400;font-display:swap;src:url('./fonts/hanken-grotesk-400.woff') format('woff')}
@font-face{font-family:'Hanken Grotesk';font-style:normal;font-weight:600;font-display:swap;src:url('./fonts/hanken-grotesk-600.woff') format('woff')}
@font-face{font-family:'Spline Sans Mono';font-style:normal;font-weight:400;font-display:swap;src:url('./fonts/spline-sans-mono-400.woff') format('woff')}

.id-home-design{
  --id-text:var(--idg-body);
  --id-disp:var(--idg-heading);
  --id-mono:var(--idg-mono);
  --id-title-font:var(--idg-heading);
  --id-title-weight:500;
  --id-text-primary:var(--idg-petrol);
  --id-surface-light:var(--idg-bone);
  --id-surface-warm:var(--idg-bone);
  background:var(--idg-bone);
  font-family:var(--idg-body);
}
.id-home-design :is(.id-engagement__card,.id-resource-card){border-radius:var(--idg-card-radius)}
.id-home-design .id-resource-card{background:var(--idg-paper)}
.id-home-design .id-testimonials__card{border-radius:var(--idg-image-radius)}

/* Calls to action use the shared site-wide pill component in identifiable-actions.css. */
@media(max-width:600px){
  .id-home-design .footer-newsletter>div{display:grid;grid-template-columns:minmax(0,1fr);gap:12px}
  .id-home-design .footer-newsletter :is(input,button){width:100%}
}