/* ==========================================================================
   SUPERDATA - BASE
   Reset, variáveis de tema, tipografia base.
   Portado fielmente de superdata-processwire-final/site/templates/assets/css/global.css
   (mesmos tokens --sd-*, mesmos valores de layout do Figma) para manter
   fidelidade pixel a pixel com a referência.
   ========================================================================== */

:root {
  /* Cores */
  --sd-blue: #0048ff;
  --sd-blue-dark: #132951;
  --sd-blue-deep: #102655;
  --sd-red: #c70100;
  --sd-red-alt: #e31316;
  --sd-white: #ffffff;
  --sd-text: #212d51;

  /* Layout — container global 1140px centralizado */
  --container: 1140px;
  --figma-gutter: 24px;
  --figma-gutter-sm: 12px;

  /* Header */
  --header-height-mobile: 120px;
  --header-height-tablet: 128px;
  --header-height-desktop: 172px;
  --header-shell-top: 12px;
  --header-shell-h: 185px;
  --header-logo-size: 157px;
  --header-logo-size-mobile: 106px;
  --header-logo-size-tablet: 118px;
  --header-nav-width: 1055px;
  --header-capsule-h: 60px;
  --header-capsule-h-mobile: 58px;
  --header-capsule-border: #4e5f7d;
  --header-nav-font-size: 22px;
  --header-z-shell: 1000;

  /* Hero — Figma frame "home" 1920×1075 (FILE_KEY 2mzvSlHaHsorFm4mpfP51Y) */
  --hero-canvas-w: 1920px;
  --hero-canvas-h: 1075px;
  --hero-h: 1075px;
  --hero-content-h: 849px;
  --hero-stats-y: 849px;
  --hero-stats-x: -19px;
  --hero-stats-w: 1958px;
  --hero-stats-h: 226px;
  --hero-scale: min(1, 100vw / var(--hero-canvas-w));

  /* Background geométrico — Vector */
  --hero-bg-pattern-x: 0px;
  --hero-bg-pattern-y: 0px;
  --hero-bg-pattern-w: 1920px;
  --hero-bg-pattern-h: 409px;

  /* Decorativos laterais — image 1 / image 2 */
  --hero-decor-left-x: -484px;
  --hero-decor-left-y: -1px;
  --hero-decor-left-w: 952px;
  --hero-decor-left-h: 850px;
  --hero-decor-right-x: 1332px;
  --hero-decor-right-y: -1px;
  --hero-decor-right-w: 952px;
  --hero-decor-right-h: 850px;

  /* Glow esquerdo — Ellipse 3 */
  --hero-glow-left-x: -234px;
  --hero-glow-left-y: -164px;
  --hero-glow-left-w: 501px;
  --hero-glow-left-h: 501px;
  --hero-glow-left-blur: 137.5px;
  --hero-glow-left-color: #0048ff;

  /* Glow atrás da mulher — Ellipse 2 */
  --hero-glow-media-x: 1055px;
  --hero-glow-media-y: 299px;
  --hero-glow-media-w: 492px;
  --hero-glow-media-h: 492px;
  --hero-glow-media-blur: 137.5px;
  --hero-glow-media-color: #0048ff;

  /* Logo */
  --hero-logo-x: 802px;
  --hero-logo-y: 21px;
  --hero-logo-w: 315px;
  --hero-logo-h: 235px;

  /* Headline — MATRÍCULAS ABERTAS… */
  --hero-h1-x: 492px;
  --hero-h1-y: 272px;
  --hero-h1-w: 456px;
  --hero-h1-h: 110px;
  --hero-h1-size: 40px;
  --hero-h1-lh: 54.51551055908203px;

  /* Subtítulo */
  --hero-subtitle-x: 492px;
  --hero-subtitle-y: 391px;
  --hero-subtitle-w: 480px;
  --hero-subtitle-h: 58px;
  --hero-subtitle-size: 24px;
  --hero-subtitle-lh: 29.088001251220703px;

  /* Corpo */
  --hero-body-x: 492px;
  --hero-body-y: 476px;
  --hero-body-w: 456px;
  --hero-body-h: 184px;
  --hero-body-size: 20px;
  --hero-body-lh: 24px;

  /* CTA — Rectangle 230 + texto */
  --hero-cta-x: 492px;
  --hero-cta-y: 695px;
  --hero-cta-w: 384px;
  --hero-cta-h: 96px;
  --hero-cta-radius: 27px;
  --hero-cta-text-x: 522px;
  --hero-cta-text-y: 708px;
  --hero-cta-text-w: 325px;
  --hero-cta-text-h: 70px;
  --hero-cta-text-size: 32px;
  --hero-cta-text-lh: 34.560001373291016px;

  /* Mulher — retrato */
  --hero-img-x: 996px;
  --hero-img-y: 241px;
  --hero-img-w: 519px;
  --hero-img-h: 509px;

  /* Card vermelho — Rectangle 229 */
  --hero-shape-x: 1078px;
  --hero-shape-y: 368px;
  --hero-shape-w: 447px;
  --hero-shape-h: 382px;
  --hero-shape-radius: 80px;
  --hero-shape-color: #e21215;

  /* Distâncias derivadas (auditoria Figma) */
  --hero-logo-to-headline: 16px;
  --hero-headline-to-sub: 9px;
  --hero-sub-to-body: 27px;
  --hero-body-to-cta: 35px;

  /* Legado — container offset (492 = 396 + 96) */
  --hero-text-x: 96px;
  --hero-text-w: 456px;
  --hero-text-col: calc(var(--hero-text-x) + var(--hero-text-w));

  /* Stats — coords home-local, faixa y=849 */
  --stats-icon-1-x: 585px;
  --stats-icon-1-y: 43px;
  --stats-icon-1-w: 79px;
  --stats-icon-1-h: 79px;
  --stats-text-1-x: 497px;
  --stats-text-1-y: 144px;
  --stats-icon-2-x: 921px;
  --stats-icon-2-y: 48px;
  --stats-icon-2-w: 75px;
  --stats-icon-2-h: 75px;
  --stats-text-2-x: 817px;
  --stats-text-2-y: 144px;
  --stats-icon-3-x: 1260px;
  --stats-icon-3-y: 43px;
  --stats-icon-3-w: 80px;
  --stats-icon-3-h: 80px;
  --stats-text-3-x: 1173px;
  --stats-text-3-y: 144px;

  /* Pilares — Figma: cards 264×447, gap 24px, grid 1128px em container 1140px */
  --pillar-w: 264px;
  --pillar-h: 447px;
  --pillar-gap: 24px;
  --pillar-border: 3px;
  --pillar-radius: 32px;
  --pillar-subtitle-w: 100%;
  --pillar-title-w: 100%;
  --pillars-container-w: var(--container);
  --pillars-grid-max-w: 100%;
  --pillar-icon-size: 82px;
  --pillar-icon-mb: 14px;
  --pillars-header-mb: 30px;
  --pillar-card-title-size: 20px;
  --pillar-card-text-size: 14px;
  --pillar-card-pt: 22px;
  --pillar-card-px: 14px;
  --pillar-card-pb: 20px;
  --pillars-cards-mt: 0;
  --stats-text-1-w: 255px;
  --stats-text-2-w: 287px;
  --stats-text-3-w: 247px;

  /* Cursos — intro Figma: imagens 333×302, grid full width do container */
  --course-intro-img-w: 333px;
  --course-intro-img-h: 302px;
  --course-intro-title-w: 1fr;
  --course-intro-subtitle-w: 100%;
  --course-intro-max-w: 100%;
  --course-intro-mb: 34px;
  --course-intro-col-gap: 28px;
  --course-intro-title-color: #d60000;
  --course-intro-subtitle-color: #212d51;
  --course-intro-heading-to-sub: 10px;
  --courses-pt: 46px;
  --courses-pb: 72px;
  --course-category-title-mb: 24px;
  --course-category-gap-y: 48px;
  --course-grid-gap-y: 18px;
  --course-grid-gap-x: 20px;
  --course-card-h: 178px;
  --course-thumb-w: 119px;
  --course-thumb-h: 145px;
  --radius-course: 18px;
  --radius-thumb: 12px;
  --radius-intro-img: 24px;

  /* Quem somos — frame Figma 1948×796 (coords relativas a 1920) */
  --about-pt: 72px;
  --about-pb: 56px;
  --about-content-max: 1140px;
  --about-frame-w: 1920;
  --about-decor-left-x: -316px;
  --about-decor-left-y: -117px;
  --about-decor-left-w: 688px;
  --about-decor-left-h: 770px;
  --about-decor-right-x: 1194px;
  --about-decor-right-y: -129px;
  --about-decor-right-w: 888px;
  --about-decor-right-h: 770px;
  --about-logo-w: 218px;
  --about-logo-h: 163px;
  --about-img-w: 480px;
  --about-img-h: 417px;
  --about-text-x: 86px;
  --about-logo-offset: 70px;
  --about-title-w: 421px;
  --about-lead-w: 456px;
  --about-text-wide: 960px;
  --about-media-mt: 55px;
  --about-title-size: 3rem;
  --about-title-color: #132b51;
  --about-lead-size: 1.5rem;
  --about-body-size: 1.5rem;
  --about-body-color: #5b5960;
  --radius-about-img: 37px;
  --about-glow-size: 620px;
  --about-glow-x: -70px;
  --about-glow-y: -100px;
  --about-inner-gap: 24px;
  --about-wide-mt: 16px;

  /* Pré-matrícula */
  --pre-card-w: 1128px;
  --pre-input-h: 44px;
  --pre-btn-w: 300px;
  --pre-btn-h: 54px;

  /* Contato */
  --contact-info-w: 371px;
  --contact-map-w: 544px;
  --contact-map-h: 402px;
  --contact-gap: 68px;
  --contact-map-padding: 31px;
  --footer-pill-w: 255px;
  --footer-pill-h: 58px;
  --footer-avatar: 44px;

  /* Ritmo vertical (Y Figma) */
  --pillars-pt: 28px;
  --pillars-pb: 46px;
  --stats-icon-pt: 43px;
  --stats-icon-text-gap: 101px;
  --stats-col-1-x: 32.3%;
  --stats-col-2-x: 50%;
  --stats-col-3-x: 67.7%; /* mobile/tablet fallback */
  --pre-card-px: 32px;
  --pre-card-pt: 34px;
  --pre-field-gap: 6px;
  --pre-title-field-gap: 24px;
  --pre-field-gap-y: 14px;
  --pre-btn-mt: 20px;
  --footer-pill-x: 869px;

  /* Radius / shadow */
  --radius-pill: 999px;
  --radius-lg: 32px;
  --radius-xxl: 42px;
  --shadow-nav: 0 4px 12px -1px #132951;
  --shadow-soft: 0 12px 30px rgb(19 41 81 / 14%);
  --shadow-cta: 0 6px 0 #8a0100;
}

html {
  scroll-behavior: smooth;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

body {
  margin: 0;
  font-family: "Roboto", sans-serif;
  color: var(--sd-text);
  background-color: var(--sd-white);
  overflow-x: hidden;
}

img {
  display: block;
  max-width: 100%;
}

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

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible {
  outline: 3px solid var(--sd-blue);
  outline-offset: 2px;
}

/* AJUSTE GLOBAL DE CONTAINER */
.container {
  width: 100%;
  max-width: 1140px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  box-sizing: border-box;
}

/* Respiro seguro em telas menores */
@media (max-width: 1200px) {
  .container {
    max-width: calc(100% - 40px) !important;
  }
}

@media (max-width: 767px) {
  .container {
    max-width: calc(100% - 32px) !important;
  }
}