/* MCL Construtora — fontes e tokens de design
   Arquivo compartilhado entre o site institucional e o blog. */

<style>
@font-face{
  font-family:'Montserrat';font-style:normal;font-weight:600;font-display:swap;
  src:url(/assets/fonts/montserrat-600.woff2) format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+2000-206F,U+20AC,U+2122;
}
@font-face{
  font-family:'Montserrat';font-style:normal;font-weight:700;font-display:swap;
  src:url(/assets/fonts/montserrat-700.woff2) format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+2000-206F,U+20AC,U+2122;
}
@font-face{
  font-family:'Montserrat';font-style:normal;font-weight:900;font-display:swap;
  src:url(/assets/fonts/montserrat-900.woff2) format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+2000-206F,U+20AC,U+2122;
}
@font-face{
  font-family:'Plex Sans';font-style:normal;font-weight:400;font-display:swap;
  src:url(/assets/fonts/plex-sans-400.woff2) format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+2000-206F,U+20AC,U+2122;
}
@font-face{
  font-family:'Plex Sans';font-style:normal;font-weight:500;font-display:swap;
  src:url(/assets/fonts/plex-sans-500.woff2) format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+2000-206F,U+20AC,U+2122;
}
@font-face{
  font-family:'Plex Sans';font-style:normal;font-weight:600;font-display:swap;
  src:url(/assets/fonts/plex-sans-600.woff2) format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+2000-206F,U+20AC,U+2122;
}
@font-face{
  font-family:'Plex Mono';font-style:normal;font-weight:500;font-display:swap;
  src:url(/assets/fonts/plex-mono-500.woff2) format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+2000-206F,U+20AC,U+2122;
}

:root{
  --ink:#14171c;
  --ink-2:#1c2027;
  --ink-soft:#333a42;
  --steel:#5c636b;
  --concrete:#ffffff;
  --concrete-deep:#f1efe8;
  --card:#ffffff;
  --brass:#b8862e;
  --brass-light:#e6c374;
  --brass-dark:#8c631c;
  --blueprint:#33566d;
  --blueprint-light:#7fa0b6;
  --line: rgba(20,23,28,.16);
  --line-soft: rgba(20,23,28,.08);
  --line-dark: rgba(255,255,255,.14);
  --radius:3px;
  --maxw:1220px;
  /* coluna de texto do hero: o recuo à esquerda acompanha o container,
     e a largura do texto é somada por fora (não é engolida pelo padding) */
  --hero-col:760px;
  --hero-pad-left: min(360px, max(56px, (100vw - var(--maxw)) / 2 + 24px));
  /* medidos por JS no load/resize; estes são apenas os valores de partida */
  --header-h:88px;
  --hero-banner-h:50px;
  --shadow: 0 18px 44px rgba(20,17,10,.14);
  --f-display:'Montserrat',-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  --f-body:'Plex Sans',-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  --f-mono:'Plex Mono','SFMono-Regular',Consolas,monospace;
  --noise: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ---------- monitores grandes / ultrawide: escala tipográfica ----------
   a raiz cresce, então todo o site em rem acompanha; o container e a
   coluna do hero abrem junto para o conteúdo não ficar minúsculo. */
@media (min-width:1800px){
  :root{--maxw:1400px;--hero-col:860px;}
  html{font-size:17.5px;}
}
@media (min-width:2300px){
  :root{--maxw:1560px;--hero-col:960px;}
  html{font-size:19px;}
}
@media (min-width:2900px){
  :root{--maxw:1760px;--hero-col:1080px;}
  html{font-size:21px;}
}