@import "https://fonts.cdnfonts.com/css/nasalization";
:root{--ink:#17211d;--muted:#56635d;--paper:#f6f3ec;--panel:#fff;--line:rgba(23,33,29,.14);--green:#287363;--gold:#d69a5f;--blue:#146aa0;--topbar:76px;--brand-font:"Nasalization Rg","Nasalization","Audiowide","Orbitron",sans-serif;color:var(--ink);background:var(--paper);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;overflow-x:hidden}a{color:inherit;text-decoration:none}.topbar{position:fixed;z-index:20;top:0;right:0;left:0;min-height:var(--topbar);display:flex;align-items:center;justify-content:space-between;gap:24px;padding:16px clamp(18px,5vw,72px);border-bottom:1px solid rgba(255,255,255,.2);background:rgba(16,23,22,.86);color:#fff;backdrop-filter:blur(18px)}.brand{display:inline-flex;flex-direction:column;gap:2px}.brand-montek{font-family:var(--brand-font);font-size:clamp(1.45rem,2vw,2rem);line-height:.95}.brand-line{color:var(--gold);font-size:.78rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase}nav{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:clamp(12px,2.4vw,28px);font-size:.95rem;font-weight:800}.hero{min-height:0;aspect-ratio:3/2;margin-top:var(--topbar);display:flex;align-items:flex-end;padding:110px clamp(18px,6vw,86px) 70px;color:#fff;background:linear-gradient(90deg,rgba(12,20,27,.58),rgba(12,20,27,.24) 42%,rgba(12,20,27,.02) 68%),url("assets/header-montek-servicos.png") center/cover no-repeat;background-color:#08141d}.hero-copy{width:min(32vw,430px);max-width:100%}.eyebrow{margin:0 0 12px;color:var(--gold);font-size:.78rem;font-weight:900;letter-spacing:.08em;text-transform:uppercase}h1,h2,h3,p{margin-top:0}h1{max-width:430px;margin-bottom:22px;font-size:clamp(1.9rem,2.65vw,2.75rem);line-height:1.08;text-shadow:0 3px 20px rgba(0,0,0,.75)}h2{margin-bottom:16px;font-size:clamp(2rem,4vw,3.6rem);line-height:1.05}.hero p,.contact-band p{max-width:720px;color:rgba(255,255,255,.9);font-size:clamp(1.08rem,2vw,1.32rem);line-height:1.55}.hero-copy>p:not(.eyebrow){max-width:430px}.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}.primary,.secondary,.resource-card a,.app-list a,footer a{min-height:48px;display:inline-flex;align-items:center;justify-content:center;border-radius:8px;padding:0 18px;font-weight:900}.primary{background:var(--gold);color:#17120d}.secondary{border:1px solid rgba(255,255,255,.72);color:#fff}.quick-panel{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:var(--line)}.quick-panel a{min-height:170px;display:grid;align-content:start;gap:10px;padding:30px clamp(18px,4vw,48px);background:#fff}.quick-panel span{color:var(--green);font-weight:900}.quick-panel strong{font-size:1.28rem}.quick-panel small{color:var(--muted);font-size:.96rem;line-height:1.45}.section,.learning-band,.contact-band,footer{padding:76px clamp(18px,5vw,72px)}.section-heading{max-width:840px;margin-bottom:30px}.section-heading p:not(.eyebrow),.resource-card p,.app-list p,.learning-band p,.check-list,footer p{color:var(--muted);line-height:1.6}.resource-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.resource-card,.app-list article{border:1px solid var(--line);border-radius:8px;background:var(--panel);box-shadow:0 22px 60px rgba(23,33,29,.1)}.resource-card{min-height:310px;padding:28px}.resource-icon{width:54px;height:54px;display:grid;place-items:center;margin-bottom:22px;border-radius:8px;background:#e8f0ec;color:var(--green);font-weight:1000}.resource-card h3{font-size:1.55rem}.resource-card a,.app-list a{margin-top:14px;background:var(--ink);color:#fff}.learning-band{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(320px,.9fr);gap:clamp(28px,5vw,64px);background:#e6eee8}.check-list{display:grid;gap:14px;margin:0;padding:0;list-style:none}.check-list li{padding:18px 20px;border-left:4px solid var(--green);background:rgba(255,255,255,.72)}.apps-section{background:#101716;color:#fff}.apps-section .section-heading p:not(.eyebrow),.app-list p{color:rgba(255,255,255,.72)}.app-list{display:grid;gap:16px}.app-list article{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:24px;background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.14);box-shadow:none}.app-list strong{min-width:210px;font-size:1.2rem}.app-list p{flex:1;margin-bottom:0}.app-list a{flex:none;background:var(--gold);color:#17120d}.contact-band{display:flex;align-items:center;justify-content:space-between;gap:28px;background:linear-gradient(90deg,#17362f,#193d58);color:#fff}.contact-band h2{max-width:820px}footer{display:flex;align-items:center;justify-content:space-between;gap:24px;background:#fff}footer strong{font-family:var(--brand-font);font-size:1.4rem}footer p{margin:8px 0 0}footer a{border:1px solid var(--line)}@media(max-width:860px){:root{--topbar:120px}.topbar{align-items:flex-start;flex-direction:column}nav{justify-content:flex-start}.hero-copy{width:min(42vw,430px)}.quick-panel,.resource-grid,.learning-band{grid-template-columns:1fr}.app-list article,.contact-band,footer{align-items:flex-start;flex-direction:column}.app-list strong{min-width:0}}@media(max-width:560px){h1{font-size:2.15rem}.hero-copy{width:100%}nav a{font-size:.88rem}.hero{aspect-ratio:auto;min-height:82vh;padding-bottom:54px}}@import "https://fonts.cdnfonts.com/css/nasalization";

:root {
  --ink: #17211d;
  --muted: #56635d;
  --paper: #f6f3ec;
  --panel: #ffffff;
  --line: rgba(23, 33, 29, 0.14);
  --green: #287363;
  --gold: #d69a5f;
  --blue: #146aa0;
  --topbar: 76px;
  --brand-font: "Nasalization Rg", "Nasalization", "Audiowide", "Orbitron", sans-serif;
  color: var(--ink);
  background: var(--paper);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  overflow-x: hidden;
}

a {
  color: inherit;
  text-decoration: none;
}

.topbar {
  position: fixed;
  z-index: 20;
  top: 0;
  right: 0;
  left: 0;
  min-height: var(--topbar);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 16px clamp(18px, 5vw, 72px);
  border-bottom: 1px solid rgba(255, 255, 255, 0.2);
  background: rgba(16, 23, 22, 0.86);
  color: #fff;
  backdrop-filter: blur(18px);
}

.brand {
  display: inline-flex;
  flex-direction: column;
  gap: 2px;
}

.brand-montek {
  font-family: var(--brand-font);
  font-size: clamp(1.45rem, 2vw, 2rem);
  line-height: 0.95;
}

.brand-line {
  color: var(--gold);
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

nav {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: clamp(12px, 2.4vw, 28px);
  font-size: 0.95rem;
  font-weight: 800;
}

.hero {
  min-height: 0;
  aspect-ratio: 3 / 2;
  margin-top: var(--topbar);
  display: flex;
  align-items: flex-end;
  padding: 110px clamp(18px, 6vw, 86px) 70px;
  color: #fff;
  background:
    linear-gradient(90deg, rgba(12, 20, 27, 0.58), rgba(12, 20, 27, 0.24) 42%, rgba(12, 20, 27, 0.02) 68%),
    url("assets/header-montek-servicos.png") center / cover no-repeat;
  background-color: #08141d;
}

.hero-copy {
  width: min(40vw, 560px);
  max-width: 100%;
}

.eyebrow {
  margin: 0 0 12px;
  color: var(--gold);
  font-size: 0.78rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

h1,
h2,
h3,
p {
  margin-top: 0;
}

h1 {
  max-width: 540px;
  margin-bottom: 22px;
  font-size: clamp(2.05rem, 3.15vw, 3.2rem);
  line-height: 1.08;
  text-shadow: 0 3px 20px rgba(0, 0, 0, 0.75);
}

h2 {
  margin-bottom: 16px;
  font-size: clamp(2rem, 4vw, 3.6rem);
  line-height: 1.05;
}

.hero p,
.contact-band p {
  max-width: 720px;
  color: rgba(255, 255, 255, 0.9);
  font-size: clamp(1.08rem, 2vw, 1.32rem);
  line-height: 1.55;
}

.hero-copy > p:not(.eyebrow) {
  max-width: 430px;
}

.hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 30px;
}

.primary,
.secondary,
.resource-card a,
.app-list a,
footer a {
  min-height: 48px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  padding: 0 18px;
  font-weight: 900;
}

.primary {
  background: var(--gold);
  color: #17120d;
}

.secondary {
  border: 1px solid rgba(255, 255, 255, 0.72);
  color: #fff;
}

.quick-panel {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1px;
  background: var(--line);
}

.quick-panel a {
  min-height: 170px;
  display: grid;
  align-content: start;
  gap: 10px;
  padding: 30px clamp(18px, 4vw, 48px);
  background: #fff;
}

.quick-panel span {
  color: var(--green);
  font-weight: 900;
}

.quick-panel strong {
  font-size: 1.28rem;
}

.quick-panel small {
  color: var(--muted);
  font-size: 0.96rem;
  line-height: 1.45;
}

.section,
.learning-band,
.contact-band,
footer {
  padding: 76px clamp(18px, 5vw, 72px);
}

.section-heading {
  max-width: 840px;
  margin-bottom: 30px;
}

.section-heading p:not(.eyebrow),
.resource-card p,
.app-list p,
.learning-band p,
.check-list,
footer p {
  color: var(--muted);
  line-height: 1.6;
}

.resource-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.resource-card,
.app-list article {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  box-shadow: 0 22px 60px rgba(23, 33, 29, 0.1);
}

.resource-card {
  min-height: 310px;
  padding: 28px;
}

.resource-icon {
  width: 54px;
  height: 54px;
  display: grid;
  place-items: center;
  margin-bottom: 22px;
  border-radius: 8px;
  background: #e8f0ec;
  color: var(--green);
  font-weight: 1000;
}

.resource-card h3 {
  font-size: 1.55rem;
}

.resource-card a,
.app-list a {
  margin-top: 14px;
  background: var(--ink);
  color: #fff;
}

.learning-band {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(320px, 0.9fr);
  gap: clamp(28px, 5vw, 64px);
  background: #e6eee8;
}

.check-list {
  display: grid;
  gap: 14px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.check-list li {
  padding: 18px 20px;
  border-left: 4px solid var(--green);
  background: rgba(255, 255, 255, 0.72);
}

.apps-section {
  background: #101716;
  color: #fff;
}

.apps-section .section-heading p:not(.eyebrow),
.app-list p {
  color: rgba(255, 255, 255, 0.72);
}

.app-list {
  display: grid;
  gap: 16px;
}

.app-list article {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 24px;
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, 0.14);
  box-shadow: none;
}

.app-list strong {
  min-width: 210px;
  font-size: 1.2rem;
}

.app-list p {
  flex: 1;
  margin-bottom: 0;
}

.app-list a {
  flex: none;
  background: var(--gold);
  color: #17120d;
}

.contact-band {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
  background: linear-gradient(90deg, #17362f, #193d58);
  color: #fff;
}

.contact-band h2 {
  max-width: 820px;
}

footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  background: #fff;
}

footer strong {
  font-family: var(--brand-font);
  font-size: 1.4rem;
}

footer p {
  margin: 8px 0 0;
}

footer a {
  border: 1px solid var(--line);
}

@media (max-width: 860px) {
  :root {
    --topbar: 120px;
  }

  .topbar {
    align-items: flex-start;
    flex-direction: column;
  }

  nav {
    justify-content: flex-start;
  }

  .hero-copy {
    width: min(62vw, 620px);
  }

  .quick-panel,
  .resource-grid,
  .learning-band {
    grid-template-columns: 1fr;
  }

  .app-list article,
  .contact-band,
  footer {
    align-items: flex-start;
    flex-direction: column;
  }

  .app-list strong {
    min-width: 0;
  }
}

@media (max-width: 560px) {
  h1 {
    font-size: 2.15rem;
  }

  .hero-copy {
    width: 100%;
  }

  nav a {
    font-size: 0.88rem;
  }

  .hero {
    aspect-ratio: auto;
    min-height: 82vh;
    padding-bottom: 54px;
  }
}

/* Mantem o titulo fora do logotipo central. */
.hero-copy{width:min(27vw,360px);max-width:100%}
h1{max-width:360px;font-size:clamp(1.75rem,2.15vw,2.3rem)}
.hero-copy>p:not(.eyebrow){max-width:360px}
@media(max-width:860px) and (min-width:681px){.hero-copy{width:min(36vw,360px)}}

.hero .hero-copy{width:min(24vw,300px)!important;max-width:300px!important}
.hero .hero-copy h1{max-width:300px!important;font-size:clamp(1.65rem,1.9vw,2rem)!important}
.hero .hero-copy>p:not(.eyebrow){max-width:300px!important;font-size:1rem!important}
@media(max-width:680px){.hero .hero-copy{width:100%!important;max-width:100%!important}.hero .hero-copy h1,.hero .hero-copy>p:not(.eyebrow){max-width:100%!important}}
