/* Fontes locais - somente os quatro arquivos realmente utilizados no site.
   Copie as fontes dos seus pacotes originais para a pasta fonts/.
   Nenhuma instalacao no sistema e necessaria. */
@font-face {
  font-family: "Marisa";
  src: url("fonts/MarisaBold.woff2") format("woff2");
  font-style: normal;
  font-weight: 700;
  font-display: swap;
}
@font-face {
  font-family: "Causten";
  src: url("fonts/Causten Regular.ttf") format("truetype");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: "Causten";
  src: url("fonts/Causten Bold.ttf") format("truetype");
  font-style: normal;
  font-weight: 700;
  font-display: swap;
}
@font-face {
  font-family: "Causten";
  src: url("fonts/Causten Extra Bold.ttf") format("truetype");
  font-style: normal;
  font-weight: 800;
  font-display: swap;
}

:root {
  --blue: #005A82;
  --blue-deep: #003F5D;
  --cream: #FFF4E4;
  --green: #7CAE8A;
  --orange: #DD633F;
  --yellow: #E5AE40;
  --purple: #9674A3;
  --ink: #17323D;
  --muted: #5E6F76;
  --white: #FFFFFF;
  --line: rgba(0, 90, 130, .16);
  --surface: #FFFCF7;
  --radius-sm: 1rem;
  --radius-md: 1.6rem;
  --radius-lg: 2.4rem;
  --shadow: 0 24px 70px rgba(0, 63, 93, .12);
  --shell: min(1250px, calc(100% - 3rem));
  --header-height: 84px;
  --display: "Marisa", Georgia, "Times New Roman", serif;
  --text: "Causten", "Segoe UI", Helvetica, Arial, sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: auto; scroll-padding-top: calc(var(--header-height) + 1.8rem); }
/* Alvo de âncoras sem sobreposição pelo menu sticky (Firefox, Chrome e Safari atuais). */
[id]:target { scroll-margin-top: calc(var(--header-height) + 1.8rem); }
@supports selector(:target-visible) { :target-visible { scroll-margin-top: calc(var(--header-height) + 1.8rem); } }
body {
  margin: 0;
  background: var(--surface);
  color: var(--ink);
  font-family: var(--text);
  font-size: 1rem;
  line-height: 1.65;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}
img { display: block; max-width: 100%; }
a { color: inherit; text-decoration-thickness: .08em; text-underline-offset: .18em; }
button, input, textarea, select { font: inherit; }

.skip-link {
  position: fixed;
  left: 1rem;
  top: 1rem;
  z-index: 999;
  transform: translateY(-160%);
  padding: .8rem 1rem;
  background: var(--blue);
  color: white;
  border-radius: .7rem;
}
.skip-link:focus { transform: translateY(0); }

.shell { width: var(--shell); margin-inline: auto; }

.site-header {
  position: sticky;
  top: 0;
  z-index: 100;
  background: color-mix(in srgb, var(--surface) 92%, transparent);
  border-bottom: 1px solid transparent;
  backdrop-filter: blur(18px);
}
.header-inner {
  min-height: var(--header-height);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.25rem;
}
.brand { display: inline-flex; align-items: center; flex: 0 0 auto; }
.brand img { display:block; width: clamp(188px, 16vw, 226px); height: auto; }
.brand { text-decoration: none; }
.brand:focus-visible { outline: 3px solid var(--yellow); outline-offset: 5px; border-radius: .3rem; }
.desktop-nav { display: flex; align-items: center; gap: clamp(.75rem,1.35vw,1.4rem); font-size: .93rem; font-weight: 700; }
.desktop-nav a { position: relative; text-decoration: none; padding: .65rem .15rem; white-space: nowrap; }
.desktop-nav a:not(.nav-cta)::after { content:""; position: absolute; height: 2px; bottom: .4rem; left: .15rem; right: .15rem; background: var(--orange); transform: scaleX(0); transform-origin: left center; transition: transform .24s ease; }
.desktop-nav a:not(.nav-cta):is(:hover,:focus-visible)::after { transform: scaleX(1); }
body:has(#sobre:target) .desktop-nav a[href="#sobre"]::after,
body:has(#acolhemos:target) .desktop-nav a[href="#acolhemos"]::after,
body:has(#programas:target) .desktop-nav a[href="#programas"]::after,
body:has(#metodo:target) .desktop-nav a[href="#metodo"]::after,
body:has(#parcerias:target) .desktop-nav a[href="#parcerias"]::after { transform: scaleX(1); }
.desktop-nav a:not(.nav-cta):hover { color: var(--blue); }
.nav-cta { background: var(--blue); color: white; padding: .78rem 1rem !important; border-radius: 999px; }
.nav-cta:hover { background: var(--blue-deep); }
.mobile-menu { display: none; position: relative; }
.menu-toggle { display:inline-flex; align-items:center; gap:.75rem; text-decoration:none; }
.mobile-menu-links { display:none; }
.mobile-menu.is-open .mobile-menu-links { display:block; }

.hero {
  position: relative;
  overflow: clip;
  padding: clamp(3.5rem, 6.5vw, 5.8rem) 0 clamp(4rem, 7vw, 7rem);
  background:
    radial-gradient(circle at 11% 4%, rgba(229,174,64,.15), transparent 31rem),
    radial-gradient(circle at 85% 15%, rgba(124,174,138,.15), transparent 30rem),
    linear-gradient(180deg, #FFFCF7 0%, #FFF8EE 100%);
}
.hero::after {
  content: "";
  position: absolute;
  inset: auto -6rem -14rem auto;
  width: 34rem;
  aspect-ratio: 1;
  border-radius: 50%;
  background: rgba(150, 116, 163, .08);
  pointer-events: none;
}
.hero-grid { display: grid; grid-template-columns: minmax(0, 1.13fr) minmax(0, .87fr); gap: clamp(1.5rem, 3.2vw, 4rem); align-items: center; }
.hero-copy, .hero-art { min-width: 0; }
.eyebrow, .kicker {
  margin: 0 0 1rem;
  color: var(--blue);
  font-size: .78rem;
  font-weight: 800;
  letter-spacing: .14em;
  text-transform: uppercase;
}
/* Marisa exibe letras minúsculas acentuadas sem os diacríticos.
   Usar as maiúsculas reais da própria fonte preserva os acentos.
   O HTML continua com capitalização normal para acessibilidade e SEO. */
h1, h2, h3 { font-family: var(--display); font-weight: 700; margin-top: 0; line-height: 1.07; letter-spacing: -.018em; text-transform: uppercase; }
h1 { max-width: 16.5ch; margin-bottom: 1.35rem; color: var(--blue-deep); font-size: clamp(3.05rem, 4.9vw, 5.55rem); font-weight: 700; line-height: 1.085; text-wrap: balance; overflow-wrap: normal; }
h1 span { color: var(--orange); }
.hero-lead { max-width: 62ch; margin: 0; font-size: clamp(1.06rem, 1.8vw, 1.28rem); color: #38525C; }
.hero-actions { display: flex; flex-wrap: wrap; gap: .9rem; margin: 2.2rem 0 1rem; }
.button {
  min-height: 48px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: .86rem 1.25rem;
  border: 1px solid transparent;
  border-radius: 999px;
  text-decoration: none;
  font-weight: 800;
  transition: transform .2s ease, background .2s ease, border-color .2s ease;
}
.button:hover { transform: translateY(-2px); }
.button:focus-visible, .desktop-nav a:focus-visible, .mobile-menu a:focus-visible, summary:focus-visible { outline: 3px solid var(--yellow); outline-offset: 4px; }
.button-primary { background: var(--blue); color: white; box-shadow: 0 14px 30px rgba(0,90,130,.18); }
.button-primary:hover { background: var(--blue-deep); }
.button-ghost { border-color: rgba(0,90,130,.25); color: var(--blue); background: rgba(255,255,255,.5); }
.button-ghost:hover { border-color: var(--blue); background: white; }
.microcopy { margin: 0; color: var(--muted); font-size: .9rem; }

.hero-art { position: relative; min-height: 510px; display: grid; place-items: center; isolation: isolate; }
.hero-symbol-wrap {
  width: min(410px, 90%);
  aspect-ratio: 1 / 1;
  height: auto;
  min-height: 0;
  flex-shrink: 0;
  overflow: hidden;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: rgba(255,255,255,.75);
  box-shadow: var(--shadow);
  border: 1px solid rgba(0,90,130,.10);
  z-index: 2;
}
.hero-symbol-wrap img { display: block; width: 88%; height: auto; max-height: 88%; aspect-ratio: 1 / 1; object-fit: contain; }
@media (prefers-reduced-motion: no-preference) {
  .hero-symbol-wrap { animation: hero-enter .7s ease-out both; }
  .hero-note { animation: note-appear .65s ease-out both; }
  .hero-note-b { animation-delay: .13s; }
  .hero-note-c { animation-delay: .24s; }
}
@keyframes hero-enter { from { opacity:0; transform:translateY(12px) scale(.985); } to { opacity:1; transform:translateY(0) scale(1); } }
@keyframes note-appear { from { opacity:0; transform: translateY(8px); } to { opacity:1; transform:translateY(0); } }
.orbit { position: absolute; border-radius: 50%; border: 1px solid rgba(0,90,130,.22); }
 .orbit-a { width: min(107%, 475px); aspect-ratio: 1 / 1; }
.orbit-b { width: min(122%, 535px); aspect-ratio: 1; border-style: dashed; border-color: rgba(221,99,63,.18); }
.hero-note {
  position: absolute;
  z-index: 3;
  padding: .72rem 1rem;
  border-radius: 999px;
  background: white;
  box-shadow: 0 12px 34px rgba(0,63,93,.12);
  font-size: .86rem;
  font-weight: 800;
  color: var(--blue-deep);
  white-space: nowrap;
}
 .hero-note-a { top: 19%; left: -2%; }
 .hero-note-b { right: -1%; top: 43%; }
 .hero-note-c { bottom: 16%; left: 4%; }

.trust-band { background: var(--blue-deep); color: white; }
.trust-grid { display: grid; grid-template-columns: repeat(4, 1fr); }
.trust-grid div { padding: 1.35rem 1.2rem; border-left: 1px solid rgba(255,255,255,.13); }
.trust-grid div:last-child { border-right: 1px solid rgba(255,255,255,.13); }
.trust-grid strong, .trust-grid span { display: block; }
.trust-grid strong { margin-bottom: .2rem; font-size: 1rem; }
.trust-grid span { font-size: .82rem; opacity: .78; line-height: 1.45; }

.section { padding: clamp(5rem, 9vw, 9rem) 0; }
.section h2 { max-width: 16ch; margin-bottom: 0; color: var(--blue-deep); font-size: clamp(2.35rem, 4.8vw, 4.65rem); }
.split { display: grid; grid-template-columns: .78fr 1.22fr; gap: clamp(2rem, 6vw, 6rem); align-items: start; }
.large-prose { font-size: clamp(1.12rem, 2vw, 1.35rem); }
.prose p:first-child { margin-top: 0; }
.prose p:last-child { margin-bottom: 0; }

.pillars { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; margin-top: 4rem; }
.pillars article { min-height: 270px; padding: 1.6rem; border: 1px solid var(--line); border-radius: var(--radius-md); background: white; }
.pillars article:nth-child(1) { background: #F4FAFD; }
.pillars article:nth-child(2) { background: #F5FAF6; }
.pillars article:nth-child(3) { background: #FFF8EE; }
.pillar-number { color: var(--orange); font-weight: 800; font-size: .8rem; letter-spacing: .08em; }
.pillars h3 { margin: 5.7rem 0 .65rem; color: var(--blue-deep); font-size: 1.7rem; }
.pillars p { margin: 0; color: #506269; }

.section-soft { background: var(--cream); }
.section-heading { display: grid; grid-template-columns: 1.1fr .9fr; gap: clamp(2rem, 7vw, 7rem); align-items: end; margin-bottom: 3rem; }
.section-heading > p { max-width: 50ch; margin: 0; color: #53666E; font-size: 1.06rem; }
.audience-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; }
.audience-card { min-height: 260px; padding: 1.55rem; border-radius: var(--radius-md); background: rgba(255,255,255,.78); border: 1px solid rgba(0,90,130,.10); }
.audience-card h3 { margin: 4.2rem 0 .75rem; color: var(--blue-deep); font-size: 1.4rem; }
.audience-card p { margin: 0; color: #56676E; }
.dot { display: block; width: 16px; height: 16px; border-radius: 50%; }
.dot-blue { background: var(--blue); }
.dot-green { background: var(--green); }
.dot-yellow { background: var(--yellow); }
.dot-purple { background: var(--purple); }
.family-callout { display: grid; grid-template-columns: 1fr 1fr; gap: 3rem; align-items: end; margin-top: 1rem; padding: clamp(1.8rem, 4vw, 3rem); border-radius: var(--radius-md); background: var(--blue); color: white; }
.family-callout .kicker { color: #D6EDF6; }
.family-callout h3 { margin-bottom: 0; font-size: clamp(2rem, 4vw, 3.4rem); }
.family-callout > p { margin: 0; color: rgba(255,255,255,.88); }

.program-list { display: grid; gap: .8rem; }
.program-card { display: grid; grid-template-columns: 70px minmax(0, 1fr) minmax(190px, .36fr); gap: 1.3rem; align-items: center; padding: 1.5rem; border-radius: var(--radius-md); border: 1px solid var(--line); background: white; }
.program-index { font-size: .82rem; font-weight: 800; color: #6C7B80; }
.program-name { margin: 0 0 .25rem; color: var(--blue); font-weight: 800; font-size: .78rem; letter-spacing: .14em; }
.program-main h3 { margin: 0 0 .5rem; font-size: clamp(1.8rem, 3vw, 2.65rem); color: var(--blue-deep); }
.program-main p:last-child { max-width: 68ch; margin: 0; color: #53666E; }
.program-tag { justify-self: end; padding: .58rem .75rem; border-radius: 999px; font-weight: 800; font-size: .8rem; text-align: center; }
.program-athos { border-left: 6px solid var(--blue); }
.program-porthos { border-left: 6px solid var(--green); }
.program-aramis { border-left: 6px solid var(--yellow); }
.program-dartagnan { border-left: 6px solid var(--purple); }
.program-athos .program-tag { background: #E8F5FA; color: var(--blue-deep); }
.program-porthos .program-tag { background: #EAF4ED; color: #31543C; }
.program-aramis .program-tag { background: #FFF3CF; color: #654B0D; }
.program-dartagnan .program-tag { background: #F3ECF5; color: #5F4569; }

.method { background: var(--blue-deep); color: white; }
.method-grid { display: grid; grid-template-columns: .86fr 1.14fr; gap: clamp(3rem, 7vw, 7rem); align-items: start; }
.method-sticky { position: sticky; top: 118px; }
.method .light { color: #B7D8E5; }
.method h2 { max-width: 12ch; color: white; }
.method-sticky > p:last-child { max-width: 48ch; color: rgba(255,255,255,.78); font-size: 1.06rem; }
.method-steps { border-top: 1px solid rgba(255,255,255,.18); }
.method-steps article { display: grid; grid-template-columns: 62px 1fr; column-gap: 1rem; padding: 2rem 0; border-bottom: 1px solid rgba(255,255,255,.18); }
.method-steps span { grid-row: 1 / span 2; color: var(--yellow); font-weight: 800; }
.method-steps h3 { margin: 0 0 .5rem; font-size: 1.6rem; }
.method-steps p { margin: 0; color: rgba(255,255,255,.74); }

.outcome-grid { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.outcome-grid article { min-height: 220px; padding: 1.45rem; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.outcome-grid strong { display: block; margin: 5rem 0 .6rem; color: var(--blue-deep); font-size: 1.2rem; }
.outcome-grid p { margin: 0; color: #5A6B72; }

.partnerships { background: #F2F7F8; }
.partnerships-grid { display: grid; grid-template-columns: .9fr 1.1fr; gap: clamp(3rem, 7vw, 7rem); }
.partnerships h2 { margin-bottom: 1.2rem; }
.partnerships-grid > div:first-child > p:last-child { color: #53666E; font-size: 1.06rem; }
.partner-links { border-top: 1px solid var(--line); }
.partner-links > div { display: grid; grid-template-columns: 48px 1fr; padding: 1.7rem 0; border-bottom: 1px solid var(--line); }
.partner-links span { grid-row: 1 / span 2; color: var(--orange); font-weight: 800; }
.partner-links strong { color: var(--blue-deep); font-size: 1.1rem; }
.partner-links p { margin: .25rem 0 0; color: #586B73; }

.contact { background: var(--surface); }
.contact-card { display: grid; grid-template-columns: 1.1fr .9fr; gap: 2rem; padding: clamp(2rem, 5vw, 4rem); border-radius: var(--radius-lg); background: var(--orange); color: #122E38; box-shadow: var(--shadow); }
.contact .kicker { color: #472517; }
.contact h2 { max-width: 13ch; color: #122E38; }
.contact-copy > p:not(.kicker) { max-width: 56ch; }
.button-light { margin-top: 1rem; background: var(--blue-deep); color: white; }
.button-light:hover { background: #002F45; }
.contact-info { align-self: end; display: grid; gap: .8rem; font-style: normal; }
.contact-info div { padding: 1rem 0; border-bottom: 1px solid rgba(18,46,56,.23); }
.contact-info span, .contact-info a { display: block; }
.contact-info span { font-size: .75rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.contact-info a { margin-top: .2rem; font-size: 1.08rem; font-weight: 800; text-decoration: none; }
.contact-info a:hover { text-decoration: underline; }

.site-footer { padding: 3rem 0; background: #0F2B36; color: white; }
.footer-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 2rem; align-items: end; }
.site-footer img { width: 210px; height: auto; opacity: .98; }
.site-footer p { margin: .2rem 0; }
.footer-small { max-width: 56ch; color: rgba(255,255,255,.65); font-size: .82rem; }

@media (max-width: 980px) {
  .desktop-nav { display: none; }
  .mobile-menu { display: block; }
  .menu-toggle { padding: .65rem .9rem; border: 1px solid var(--line); border-radius: 999px; font-weight: 800; color: var(--blue-deep); background: var(--surface); cursor: pointer; }
  .menu-toggle:focus-visible, .mobile-menu-links a:focus-visible { outline:3px solid var(--yellow); outline-offset:3px; }
  .mobile-menu-links { position: absolute; right: 0; top: calc(100% + .6rem); width: min(320px, 85vw); padding: .7rem; background: white; border: 1px solid var(--line); border-radius: 1rem; box-shadow: var(--shadow); }
  .mobile-menu-links a { display: block; padding: .75rem; border-radius: .6rem; text-decoration: none; font-weight: 750; }
  .mobile-menu-links a:hover { background: var(--cream); }
  .mobile-menu-links .menu-close { display: block; width: 100%; text-align: left; padding: .75rem; border: 0; border-radius: .6rem; margin-top: .3rem; background: var(--cream); font-size: .88rem; font-weight: 750; color: var(--blue-deep); cursor: pointer; }
  .hero-grid { grid-template-columns: 1fr; }
  .hero-copy { max-width: 760px; }
  .hero-art { min-height: 440px; }
  .trust-grid { grid-template-columns: repeat(2, 1fr); }
  .audience-grid, .outcome-grid { grid-template-columns: repeat(2, 1fr); }
  .program-card { grid-template-columns: 54px 1fr; }
  .program-tag { grid-column: 2; justify-self: start; }
}

@media (max-width: 760px) {
  :root { --shell: min(100% - 1.25rem, 1180px); --header-height: 72px; }
  .header-inner { min-height: var(--header-height); }
  .brand img { width: 170px; }
  .hero { padding-top: 4rem; }
  h1 { font-size: clamp(2.75rem, 9vw, 4.5rem); max-width: 19ch; }
  .hero-grid { gap: 1.8rem; }
  .hero-art { min-height: 360px; }
  .hero-symbol-wrap { width: min(330px, 84%); aspect-ratio: 1 / 1; }
  .orbit-a { width: min(108%, 360px); }
  .orbit-b { width: min(122%, 430px); }
  .hero-note { font-size: .72rem; padding: .55rem .7rem; }
  .hero-note-a { top: 12%; }
  .hero-note-b { top: 47%; }
  .hero-note-c { bottom: 9%; }
  .trust-grid, .split, .section-heading, .family-callout, .method-grid, .partnerships-grid, .contact-card, .footer-grid { grid-template-columns: 1fr; }
  .trust-grid div { border-right: 1px solid rgba(255,255,255,.13); border-bottom: 1px solid rgba(255,255,255,.13); }
  .pillars { grid-template-columns: 1fr; }
  .pillars article { min-height: 220px; }
  .pillars h3 { margin-top: 3.8rem; }
  .section-heading { align-items: start; }
  .section-heading h2 { margin-bottom: 1rem; }
  .family-callout { gap: 1rem; }
  .method-sticky { position: static; }
  .outcome-grid { border-left: 0; }
}

@media (max-width: 520px) {
  .audience-grid, .outcome-grid { grid-template-columns: 1fr; }
  .hero-actions { align-items: stretch; flex-direction: column; }
  .button { width: 100%; }
  .program-card { grid-template-columns: 1fr; }
  .program-index, .program-tag { grid-column: 1; }
  .program-index { margin-bottom: -.5rem; }
  .contact-card { border-radius: 1.5rem; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto !important; }
  *, *::before, *::after { animation: none !important; scroll-behavior: auto !important; transition-duration: .01ms !important; }
}

@media (prefers-contrast: more) {
  :root { --line: rgba(0, 63, 93, .42); --muted: #3E5058; }
  .button-ghost { border-width: 2px; }
}

/* Refino da composição em telas intermediárias e amplas */
@media (min-width: 761px) and (max-width: 1220px) {
  .hero-grid { grid-template-columns: minmax(0, 1.12fr) minmax(0, .88fr); gap: 2rem; }
  h1 { font-size: clamp(3.05rem, 5.3vw, 4.75rem); }
  .hero-art { min-height: 420px; }
  .hero-symbol-wrap { width: min(350px, 88%); aspect-ratio: 1 / 1; }
  .hero-note { font-size: .76rem; }
}
@media (max-width: 370px) {
  .brand img { width: 144px; }
  .hero-note { font-size: .62rem; }
  h1 { font-size: 2.6rem; }
}

/* Navegação CSS-only: painel com entrada suave e indicação de leitura. */
@media (prefers-reduced-motion: no-preference) {
  @media (max-width: 980px) {
    .mobile-menu.is-open .mobile-menu-links { animation: menu-entrance .18s ease-out both; }
  }
}
@keyframes menu-entrance {
  from { opacity:0; transform:translateY(-5px); }
  to { opacity:1; transform:translateY(0); }
}
@supports (animation-timeline: scroll(root block)) {
  @media (prefers-reduced-motion: no-preference) {
    .site-header::after {
      content: "";
      position: absolute;
      left: 0;
      bottom: -1px;
      height: 2px;
      width: 100%;
      pointer-events: none;
      background: var(--orange);
      transform-origin: left center;
      animation: reading-progress linear both;
      animation-timeline: scroll(root block);
    }
  }
}
@keyframes reading-progress {
  from { transform:scaleX(0); }
  to { transform:scaleX(1); }
}

/* Garantia de proporção e fluidez do emblema em browsers variados. */
.hero-symbol-wrap, .orbit { border-radius: 50%; }
.hero-symbol-wrap { justify-self: center; align-self: center; }
.hero-symbol-wrap img { object-position: center; }
/* Rolagem personalizada controlada pelo arquivo navigation.js. */
:target { scroll-margin-block-start: calc(var(--header-height) + 1.8rem); }