/* Sales Storm — página institucional (www.salesstorm.com.br) */
@font-face { font-family: 'Izmir'; src: url('../fonts/izmir-heavy.otf') format('opentype'); font-weight: 900; font-display: swap; }

:root {
  --blue: #0045f5; --blue-on-dark: #6b95ff; --blue-light: #e8eeff;
  --navy: #081426; --navy-2: #0e1e38;
  --ink: #000; --text: #1a1a1a; --muted: #555; --muted-dark: #a8b3c7;
  --ease: cubic-bezier(0.4, 0, 0.2, 1);
}
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; font-family: 'Outfit', Arial, sans-serif; font-size: 16px; line-height: 1.6; color: var(--text); background: #fff; -webkit-font-smoothing: antialiased; }
h1, h2, h3, p, ul, figure { margin: 0; }
ul { padding: 0; list-style: none; }
img, svg { display: block; max-width: 100%; }
strong { font-weight: 700; }
h1, h2 { text-wrap: balance; }
:focus-visible { outline: 2px solid var(--blue-on-dark); outline-offset: 3px; border-radius: 4px; }

.container { width: 100%; max-width: 1120px; margin: 0 auto; padding: 0 20px; }
@media (min-width: 768px) { .container { padding: 0 32px; } }
.i { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

.btn {
  display: inline-flex; align-items: center; gap: 10px; min-height: 52px; padding: 14px 26px;
  border-radius: 8px; background: var(--blue); color: #fff; text-decoration: none;
  font-weight: 700; font-size: 16px; letter-spacing: 0.02em;
  box-shadow: 0 8px 22px rgba(0, 69, 245, 0.35);
  transition: transform 200ms var(--ease), background 200ms var(--ease);
}
.btn:hover { background: #0030b0; transform: translateY(-2px); }
.btn--light { background: #fff; color: var(--blue); box-shadow: 0 8px 22px rgba(5, 13, 26, 0.25); }
.btn--light:hover { background: #fff; }

/* Hero */
.hero {
  background: radial-gradient(ellipse at 80% 0%, #13306b 0%, var(--navy) 55%);
  color: #fff; padding: 40px 0 88px;
}
.logo { height: 56px; width: auto; color: #fff; }
.logo--sm { height: 40px; margin: 0 auto; }
.hero h1 { margin-top: 64px; max-width: 820px; font-size: clamp(32px, 5vw, 56px); line-height: 1.1; font-weight: 700; letter-spacing: -0.02em; }
.hero h1 span { color: var(--blue-on-dark); }
.hero__lead { margin-top: 20px; max-width: 640px; font-size: clamp(18px, 2vw, 21px); color: #d3dbea; }
.hero .btn { margin-top: 32px; }

/* Serviços */
.section { padding: 72px 0; }
.section h2 { text-align: center; font-size: clamp(26px, 3.4vw, 38px); line-height: 1.15; color: var(--ink); margin-bottom: 40px; }
.cards { display: grid; gap: 16px; }
@media (min-width: 860px) { .cards { grid-template-columns: repeat(3, 1fr); gap: 20px; } }
.card { padding: 32px 28px; border-radius: 18px; background: #fff; border: 1px solid #e0e0e0; box-shadow: inset 0 -4px 0 #8fa9e0, 0 8px 20px rgba(8, 20, 38, 0.05); }
.card__icon { width: 52px; height: 52px; border-radius: 12px; display: grid; place-items: center; background: var(--blue-light); color: var(--blue); }
.card__icon .i { width: 26px; height: 26px; }
.card h3 { margin-top: 18px; font-size: 21px; color: var(--ink); }
.card p { margin-top: 8px; color: var(--muted); }

/* Sobre */
.about { position: relative; overflow: hidden; background: var(--navy); color: #fff; }
.about__photo { position: relative; }
.about__photo img { width: 100%; height: auto; aspect-ratio: 4 / 5; object-fit: cover; object-position: center 30%; }
.about__photo::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(8, 20, 38, 0) 55%, var(--navy) 100%); }
.about .container { position: relative; z-index: 1; }
.about__text { margin-top: -56px; padding-bottom: 56px; }
.about__kicker { color: var(--blue-on-dark); font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; font-size: 14px; }
.about h2 { margin-top: 6px; font-size: clamp(30px, 4vw, 46px); line-height: 1.1; }
.about__text > p:not(.about__kicker):not(.about__brands) { margin-top: 20px; font-size: 18px; color: #dfe5f0; }
.about__facts { margin-top: 20px; display: grid; gap: 12px; }
.about__facts li { display: grid; grid-template-columns: 24px 1fr; gap: 10px; font-size: 17px; color: #dfe5f0; }
.about__facts .i { width: 20px; height: 20px; margin-top: 3px; color: var(--blue-on-dark); stroke-width: 2.6; }
.about__facts strong { color: #fff; }
.about__brands { margin-top: 28px; font-size: 20px; font-weight: 700; letter-spacing: 0.08em; color: #7d8aa3; }
@media (min-width: 900px) {
  .about { min-height: 600px; display: flex; align-items: center; }
  .about__photo { position: absolute; top: 0; right: 0; bottom: 0; width: 46%; }
  .about__photo img { height: 100%; aspect-ratio: auto; object-position: center 25%; }
  .about__photo::after { background: linear-gradient(90deg, var(--navy) 0%, rgba(8, 20, 38, 0.5) 25%, rgba(8, 20, 38, 0) 55%); }
  .about__text { margin-top: 0; padding: 72px 0; max-width: 560px; }
}

/* Contato */
.contact { background: var(--blue); color: #fff; text-align: center; padding: 64px 0; }
.contact h2 { font-size: clamp(26px, 3.4vw, 38px); line-height: 1.15; max-width: 720px; margin: 0 auto; }
.contact p { margin: 12px auto 0; max-width: 560px; font-size: 18px; color: #e3eaff; }
.contact .btn { margin-top: 28px; }

/* Rodapé */
.footer { background: var(--navy); color: var(--muted-dark); text-align: center; padding: 32px 0; }
.footer p { margin-top: 14px; font-size: 13px; }