/* Landing page Ser Professor: identidade tirada do logo (creme, verde-oliva, terracota, mostarda, sálvia). */
@font-face { font-family: 'Nunito'; font-style: normal; font-weight: 400 900; font-display: swap; src: url("fonts/nunito-latin.166202cc391c.woff2") format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

:root {
  --sp-cream: #fcf8ec; --sp-paper: #fffaf1; --sp-ring: #e2d5ba;
  --sp-green: #3f4a35; --sp-green-deep: #2e3727; --sp-terra: #b4562c; --sp-terra-deep: #96441f;
  --sp-mustard: #e3a736; --sp-sage: #8f9a5a; --sp-salmon: #ef9f84;
  --sp-ink: #2b3326; --sp-muted: #565d4b; --sp-slate: #3b4652;
  --sp-gutter: clamp(16px, 4vw, 56px); --sp-max: 1320px;
  --sp-ease: cubic-bezier(.16, 1, .3, 1);
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scrollbar-color: #c9b994 var(--sp-cream); }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
body.sp {
  margin: 0; background: var(--sp-cream); color: var(--sp-ink);
  font: 400 1.0625rem/1.6 'Nunito', ui-rounded, system-ui, sans-serif;
  -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; caret-color: var(--sp-terra);
}
.sp ::selection { background: var(--sp-terra); color: #fff; }
:where(.sp) :is(img, svg) { display: block; max-width: 100%; }
:where(.sp) :is(h1, h2, h3, p, ul) { margin: 0; }
:where(.sp) ul { padding: 0; list-style: none; }
:where(.sp) a { color: inherit; text-underline-offset: .22em; text-decoration-thickness: 2px; }
.sp :focus-visible { outline: 3px solid var(--sp-mustard); outline-offset: 3px; border-radius: 6px; }
.sp-main { overflow-x: clip; width: 100%; }
.sp-ink-green { color: var(--sp-green); }
.sp-ink-terra { color: var(--sp-terra); }
.sp-skip { position: fixed; left: 16px; top: -80px; z-index: 60; padding: 12px 18px; border-radius: 12px; background: var(--sp-green); color: #fff; font-weight: 800; }
.sp-skip:focus { top: 16px; }

/* Botões: alvo de toque de 48 px ou mais; o principal é sempre terracota com texto branco */
.sp-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .5em;
  min-height: 48px; padding: 0 26px; border-radius: 999px; border: 0;
  font: 800 1.0625rem/1 'Nunito', system-ui, sans-serif; letter-spacing: .005em; text-decoration: none;
  transition: background-color .25s var(--sp-ease), transform .25s var(--sp-ease), box-shadow .25s var(--sp-ease);
}
.sp-btn--primary { background: var(--sp-terra); color: #fff; box-shadow: 0 12px 26px -14px rgba(150, 68, 31, .75); }
.sp-btn--primary:hover { background: var(--sp-terra-deep); transform: translateY(-2px); box-shadow: 0 18px 30px -16px rgba(150, 68, 31, .8); }
.sp-btn--primary:active { transform: translateY(0) scale(.98); }
.sp-btn--sm { min-height: 44px; padding: 0 20px; font-size: 1rem; }
.sp-btn--lg { min-height: 58px; padding: 0 34px; font-size: 1.125rem; }
.sp-btn--block { width: 100%; }
/* Reflexo na transversal: uma faixa de luz cruza o botão de tempos em tempos (e ao passar o mouse) */
.sp-btn--shine { position: relative; overflow: hidden; isolation: isolate; }
.sp-btn--shine::after {
  content: ""; position: absolute; inset: -20% auto -20% 0; width: 38%; z-index: -1; pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .26) 45%, rgba(255, 255, 255, .34) 50%, rgba(255, 255, 255, .26) 55%, transparent);
  transform: translateX(-160%) skewX(-22deg);
  animation: sp-shine 6s cubic-bezier(.45, 0, .2, 1) 2.2s infinite;
}
.sp-btn--shine:hover::after { animation: sp-shine-once .9s cubic-bezier(.45, 0, .2, 1); }
@keyframes sp-shine { 0% { transform: translateX(-160%) skewX(-22deg); } 18%, 100% { transform: translateX(330%) skewX(-22deg); } }
@keyframes sp-shine-once { from { transform: translateX(-160%) skewX(-22deg); } to { transform: translateX(330%) skewX(-22deg); } }
@media (prefers-reduced-motion: reduce) { .sp-btn--shine::after { animation: none; } }

/* Navegação flutuante: marca à esquerda, uma ação principal à direita */
.sp-nav { position: fixed; inset: 12px 0 auto; z-index: 40; padding: 0 var(--sp-gutter); pointer-events: none; }
.sp-nav__bar {
  pointer-events: auto; max-width: 1180px; margin: 0 auto; height: 64px; padding: 0 10px 0 14px;
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  background: rgba(252, 248, 236, .82); border: 1px solid rgba(63, 74, 53, .1); border-radius: 999px;
  backdrop-filter: blur(14px) saturate(1.2); -webkit-backdrop-filter: blur(14px) saturate(1.2);
  transition: box-shadow .4s var(--sp-ease), background-color .4s var(--sp-ease);
}
.sp-nav.is-scrolled .sp-nav__bar { background: rgba(255, 250, 241, .94); box-shadow: 0 14px 34px -22px rgba(46, 55, 39, .45); }
.sp-brand { display: inline-flex; align-items: center; gap: 10px; text-decoration: none; }
.sp-brand__mark { width: 44px; height: auto; }
.sp-brand__name { font-size: 1.25rem; font-weight: 900; letter-spacing: -.01em; line-height: 1; white-space: nowrap; }
.sp-brand__name b { color: var(--sp-green); font-weight: 900; }
.sp-brand__name i { color: var(--sp-terra); font-style: normal; }
.sp-nav__links { display: flex; align-items: center; gap: 6px; }
.sp-nav__link {
  display: inline-flex; align-items: center; min-height: 44px; padding: 0 14px; border-radius: 999px;
  color: var(--sp-green); font-weight: 700; text-decoration: none; transition: background-color .2s;
}
.sp-nav__link:hover { background: rgba(63, 74, 53, .07); }

/* Barra fixa do celular: a ação principal fica na zona do polegar depois do topo */
.sp-dock { display: none; }
@media (max-width: 768px) {
  .sp-hide-sm { display: none !important; }
  .sp-nav { inset: 8px 0 auto; }
  .sp-nav__bar { height: 58px; padding: 0 6px 0 10px; }
  .sp-brand__mark { width: 38px; }
  .sp-brand__name { font-size: 1.125rem; }
  .sp-dock {
    display: block; position: fixed; inset: auto 0 0; z-index: 45;
    padding: 12px 16px calc(12px + env(safe-area-inset-bottom));
    background: rgba(252, 248, 236, .94); border-top: 1px solid rgba(63, 74, 53, .12);
    backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
    transform: translateY(110%); transition: transform .45s var(--sp-ease); visibility: hidden;
  }
  .sp-dock.is-visible { transform: translateY(0); visibility: visible; }
}