:root {
  --cor-principal: #0f2a4f;
  --cor-principal-hsl: 215 68% 18%;
  --cor-principal-escura: #0b203b;
  --cor-principal-escura-hsl: 214 69% 14%;
  --cor-principal-clara: #3f5572;
  --cor-principal-clara-hsl: 214 29% 35%;
  --cor-destaque: #c9a45c;
  --cor-destaque-hsl: 40 50% 57%;
  --cor-destaque-escura: #a1834a;
  --cor-destaque-escura-hsl: 39 37% 46%;
  --cor-destaque-clara: #d9bf8d;
  --cor-destaque-clara-hsl: 39 50% 70%;
  --cor-fundo: #08172b;
  --cor-fundo-hsl: 214 69% 10%;
  --cor-fundo-alt: #0a1e38;
  --cor-fundo-alt-hsl: 214 70% 13%;
  --cor-superficie: #0c2241;
  --cor-superficie-hsl: 215 69% 15%;
  --cor-texto: #f1f2f4;
  --cor-texto-hsl: 220 12% 95%;
  --cor-texto-suave: #abb0b8;
  --cor-texto-suave-hsl: 217 8% 70%;
  --cor-borda: #2d3a4b;
  --cor-borda-hsl: 214 25% 24%;
  --cor-sobre-principal: #ffffff;
  --cor-sobre-principal-hsl: 0 0% 100%;
  --cor-sobre-destaque: #111111;
  --cor-sobre-destaque-hsl: 0 0% 7%;
}
.tema-claro {
  --cor-principal: #0f2a4f;
  --cor-principal-hsl: 215 68% 18%;
  --cor-principal-escura: #0b203b;
  --cor-principal-escura-hsl: 214 69% 14%;
  --cor-principal-clara: #3f5572;
  --cor-principal-clara-hsl: 214 29% 35%;
  --cor-destaque: #c9a45c;
  --cor-destaque-hsl: 40 50% 57%;
  --cor-destaque-escura: #a1834a;
  --cor-destaque-escura-hsl: 39 37% 46%;
  --cor-destaque-clara: #d9bf8d;
  --cor-destaque-clara-hsl: 39 50% 70%;
  --cor-fundo: #ffffff;
  --cor-fundo-hsl: 0 0% 100%;
  --cor-fundo-alt: #f3f4f6;
  --cor-fundo-alt-hsl: 220 14% 96%;
  --cor-superficie: #ffffff;
  --cor-superficie-hsl: 0 0% 100%;
  --cor-texto: #111721;
  --cor-texto-hsl: 218 32% 10%;
  --cor-texto-suave: #585d64;
  --cor-texto-suave-hsl: 215 6% 37%;
  --cor-borda: #dbdfe5;
  --cor-borda-hsl: 216 16% 88%;
  --cor-sobre-principal: #ffffff;
  --cor-sobre-principal-hsl: 0 0% 100%;
  --cor-sobre-destaque: #111111;
  --cor-sobre-destaque-hsl: 0 0% 7%;
}
@font-face {
  font-family: "Playfair Display";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/fontes/playfair-display/613a720f.woff2) format("woff2");
}
@font-face {
  font-family: "Playfair Display";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/fontes/playfair-display/613a720f.woff2) format("woff2");
}
@font-face {
  font-family: "Playfair Display";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/fontes/playfair-display/613a720f.woff2) format("woff2");
}
@font-face {
  font-family: "Playfair Display";
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url(/fontes/playfair-display/3a1af34e.woff2) format("woff2");
}
@font-face {
  font-family: "DM Sans";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/fontes/dm-sans/780cf59b.woff2) format("woff2");
}
@font-face {
  font-family: "DM Sans";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/fontes/dm-sans/780cf59b.woff2) format("woff2");
}
@font-face {
  font-family: "DM Sans";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/fontes/dm-sans/780cf59b.woff2) format("woff2");
}
@font-face {
  font-family: "DM Sans";
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url(/fontes/dm-sans/e519a935.woff2) format("woff2");
}
@font-face {
  font-family: "Cinzel";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/fontes/cinzel/97f503ba.woff2) format("woff2");
}
@font-face {
  font-family: "Cinzel";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/fontes/cinzel/97f503ba.woff2) format("woff2");
}
:root {
  --fonte-titulo: "Playfair Display", serif;
  --fonte-texto: "DM Sans", sans-serif;
  --fonte-logo: "Cinzel", serif;
}
@media (max-width: 389px) { #inicio h1 { font-size: 2.125rem; } }
@media (min-width: 1024px) and (max-width: 1279px) { #areas h3 { font-size: 1.375rem; } }