/* ============================================================
   Belzcont — base compartilhada (tokens, header, rodapé)
   Usado por index.html e por todas as páginas do /infoblog.
   Alterou cor/fonte aqui? Muda o site inteiro.
   ============================================================ */

/* Fontes servidas pelo próprio site (sem Google Fonts: o IP do visitante não sai daqui).
   Arquivos variáveis em assets/fonts, subconjuntos latin + latin-ext. */
@font-face{font-family:"Sora";font-style:normal;font-weight:500 800;font-display:swap;
  src:url("fonts/sora-latin.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}
@font-face{font-family:"Sora";font-style:normal;font-weight:500 800;font-display:swap;
  src:url("fonts/sora-latin-ext.woff2") format("woff2");
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Manrope";font-style:normal;font-weight:400 700;font-display:swap;
  src:url("fonts/manrope-latin.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}
@font-face{font-family:"Manrope";font-style:normal;font-weight:400 700;font-display:swap;
  src:url("fonts/manrope-latin-ext.woff2") format("woff2");
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}

:root{
  --radius: 1.75rem;
  --radius-3xl: calc(var(--radius) + 12px);

  --background: oklch(98.5% .008 150);
  --foreground: oklch(22% .03 165);
  --card: oklch(100% 0 0);
  --primary: oklch(44% .098 166);
  --primary-foreground: oklch(98.5% .01 150);
  --primary-glow: oklch(63% .13 168);
  --muted-foreground: oklch(52% .025 165);
  --accent: oklch(93% .045 165);
  --accent-foreground: oklch(32% .06 166);
  --gold: oklch(79% .13 82);
  --surface-foreground: oklch(97% .012 150);
  --border: oklch(90% .018 160);
  --input: oklch(90% .018 160);
  --ring: oklch(63% .13 168);

  --gradient-primary: linear-gradient(135deg, var(--primary), var(--primary-glow));
  --gradient-surface: linear-gradient(160deg, oklch(28% .055 166), oklch(20% .04 172));

  --shadow-soft: 0 2px 8px -2px color-mix(in oklab, var(--primary) 12%, transparent);
  --shadow-card: 0 18px 45px -22px color-mix(in oklab, var(--primary) 40%, transparent);
  --shadow-float: 0 30px 70px -30px color-mix(in oklab, var(--primary) 55%, transparent);
  --shadow-glow: 0 0 0 1px color-mix(in oklab, var(--primary-glow) 25%, transparent), 0 20px 50px -20px color-mix(in oklab, var(--primary-glow) 55%, transparent);

  --ease-out-soft: cubic-bezier(.22, 1, .36, 1);

  --font-display: "Sora", ui-sans-serif, system-ui, sans-serif;
  --font-body: "Manrope", ui-sans-serif, system-ui, sans-serif;

  --wrap: 72rem;
}

/* fallback p/ navegadores sem oklch */
@supports not (color: oklch(50% .1 160)){
  :root{
    --background:#f7fbf8; --foreground:#182c25; --card:#fff;
    --primary:#256b56; --primary-foreground:#f7fbf8; --primary-glow:#3fa583;
    --muted-foreground:#5f7a70; --accent:#dff0e7; --accent-foreground:#24503f;
    --gold:#d9a441; --surface-foreground:#f2f8f4; --border:#dbe8e0; --input:#dbe8e0; --ring:#3fa583;
  }
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  background-color:var(--background);
  color:var(--foreground);
  font-family:var(--font-body);
  font-size:16px;
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4{font-family:var(--font-display);letter-spacing:-.02em;line-height:1.15}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button,input,textarea{font:inherit;color:inherit}
ul{list-style:none}
:focus-visible{outline:2px solid var(--ring);outline-offset:2px}

.wrap{width:100%;max-width:var(--wrap);margin-inline:auto;padding-inline:1.25rem}
.section{padding-block:5rem}
@media(min-width:640px){.section{padding-block:7rem}}

.eyebrow{
  font-size:.75rem;font-weight:600;letter-spacing:.18em;
  text-transform:uppercase;color:var(--primary);
}
.s-title{margin-top:.75rem;font-size:1.875rem;font-weight:700}
.s-lead{margin-top:1rem;color:var(--muted-foreground)}
@media(min-width:640px){.s-title{font-size:2.25rem}}
.s-head{max-width:42rem}

/* ---------- botões ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.5rem;
  white-space:nowrap;font-weight:500;cursor:pointer;border:0;
  border-radius:9999px;transition:background-color .2s,color .2s,border-color .2s,box-shadow .2s;
}
.btn svg{width:1rem;height:1rem;flex-shrink:0;pointer-events:none}
.btn-primary{background:var(--primary);color:var(--primary-foreground);box-shadow:0 1px 2px rgba(0,0,0,.06)}
.btn-primary:hover{background:color-mix(in oklab,var(--primary) 90%,transparent)}
.btn-outline{border:1px solid var(--border);background:var(--background);box-shadow:0 1px 2px rgba(0,0,0,.04)}
.btn-outline:hover{background:var(--accent);color:var(--accent-foreground)}
.btn-lg{height:3.25rem;padding-inline:1.75rem;font-size:1rem}
.btn-md{height:2.5rem;padding-inline:2rem;font-size:.875rem}
.btn-sm{height:2.25rem;padding:.5rem 1rem;font-size:.875rem}
.btn .arrow{transition:transform .2s}
.btn:hover .arrow{transform:translateX(4px)}

/* ---------- cards ---------- */
.card{
  border-radius:var(--radius-3xl);
  background:var(--card);
  border:1px solid var(--border);
  box-shadow:var(--shadow-soft);
  transition:transform .5s var(--ease-out-soft),box-shadow .5s var(--ease-out-soft),border-color .5s var(--ease-out-soft);
}
.card:hover{
  box-shadow:var(--shadow-card);
  border-color:color-mix(in oklab,var(--primary-glow) 45%,transparent);
  transform:translateY(-6px);
}

/* ---------- blobs decorativos ---------- */
.blob{
  position:absolute;pointer-events:none;z-index:0;
  border-radius:62% 38% 46% 54%/55% 48% 52% 45%;
  animation:blob-morph 14s ease-in-out infinite;
}
@keyframes blob-morph{
  0%,100%{border-radius:62% 38% 46% 54%/55% 48% 52% 45%}
  33%{border-radius:42% 58% 62% 38%/44% 62% 38% 56%}
  66%{border-radius:54% 46% 36% 64%/62% 40% 60% 38%}
}
@keyframes float-slow{0%,100%{transform:translateY(0)}50%{transform:translateY(-14px)}}
@keyframes pulse-dot{0%,100%{opacity:1}50%{opacity:.4}}

/* ============================================================
   HEADER
   ============================================================ */
.site-header{position:fixed;inset-inline:0;top:0;z-index:50;padding:.75rem}
@media(min-width:640px){.site-header{padding:1.25rem 1.5rem}}
.header-bar{
  max-width:var(--wrap);margin-inline:auto;
  display:flex;align-items:center;justify-content:space-between;gap:1rem;
  border:1px solid var(--border);border-radius:2rem;
  padding:.75rem 1rem;
  background:color-mix(in oklab,var(--card) 85%,transparent);
  box-shadow:var(--shadow-card);
  -webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);
  transition:padding .5s var(--ease-out-soft),box-shadow .5s var(--ease-out-soft);
}
@media(min-width:640px){.header-bar{padding:.9rem 1.75rem}}
.brand{display:flex;align-items:center;gap:.75rem}
.brand-mark{
  width:2.875rem;height:2.875rem;border-radius:1rem;
  object-fit:cover;box-shadow:var(--shadow-soft);
}
@media(min-width:640px){.brand-mark{width:3.25rem;height:3.25rem;border-radius:1.125rem}}
.brand-text{display:flex;flex-direction:column;line-height:1}
.brand-name{font-family:var(--font-display);font-size:1.25rem;font-weight:700;letter-spacing:.02em}
@media(min-width:640px){.brand-name{font-size:1.4375rem}}
.brand-sub{
  margin-top:.2rem;font-size:.5rem;font-weight:600;
  letter-spacing:.22em;text-transform:uppercase;color:var(--primary);
}
@media(min-width:640px){.brand-sub{font-size:.6563rem;margin-top:.25rem}}

.nav-desktop{display:none;align-items:center;gap:.25rem}
@media(min-width:1024px){.nav-desktop{display:flex}}
.nav-desktop a{
  border-radius:9999px;padding:.5rem .5rem;font-size:.8125rem;font-weight:500;
  white-space:nowrap;
  color:var(--muted-foreground);transition:background-color .2s,color .2s;
}
@media(min-width:1200px){.nav-desktop a{padding:.55rem .875rem;font-size:.9375rem}}
.nav-desktop a:hover{background:var(--accent);color:var(--accent-foreground)}
.nav-desktop a[aria-current="page"]{color:var(--primary);font-weight:600}

.header-actions{display:flex;align-items:center;gap:.5rem}
.header-cta{display:none}
@media(min-width:640px){.header-cta{display:inline-flex;height:2.75rem;padding-inline:1.5rem;font-size:.9375rem}}
.menu-toggle{
  display:grid;place-items:center;width:2.5rem;height:2.5rem;
  border:1px solid var(--border);border-radius:1rem;background:var(--card);cursor:pointer;
}
@media(min-width:1024px){.menu-toggle{display:none}}
.menu-toggle svg{width:1.25rem;height:1.25rem}
.menu-toggle .icon-close{display:none}
.menu-toggle[aria-expanded="true"] .icon-open{display:none}
.menu-toggle[aria-expanded="true"] .icon-close{display:block}

.nav-mobile{
  max-width:var(--wrap);margin:.5rem auto 0;
  border:1px solid var(--border);border-radius:1.75rem;
  background:color-mix(in oklab,var(--card) 96%,transparent);
  box-shadow:var(--shadow-card);
  -webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);
  padding:.5rem;display:none;
}
.nav-mobile.open{display:block}
@media(min-width:1024px){.nav-mobile{display:none !important}}
.nav-mobile a{
  display:block;padding:.75rem 1rem;border-radius:1.25rem;
  font-size:.9375rem;font-weight:500;color:var(--muted-foreground);
}
.nav-mobile a:hover{background:var(--accent);color:var(--accent-foreground)}
.nav-mobile .btn{width:100%;margin-top:.25rem}

/* ============================================================

/* ============================================================
   FOOTER
   ============================================================ */
.site-footer{border-top:1px solid var(--border);padding-block:3rem}
.footer-top{
  max-width:var(--wrap);margin-inline:auto;padding-inline:1.25rem;
  display:flex;flex-direction:column;gap:1.5rem;
}
@media(min-width:640px){.footer-top{flex-direction:row;align-items:center;justify-content:space-between}}
.footer-actions{display:flex;flex-wrap:wrap;align-items:center;gap:.75rem}
.footer-legal{max-width:var(--wrap);margin:2rem auto 0;padding-inline:1.25rem;font-size:.75rem;color:var(--muted-foreground)}

/* ============================================================
   TOAST + REVELAÇÃO NO SCROLL
   ============================================================ */
.toast{
  position:fixed;z-index:100;left:50%;bottom:1.5rem;transform:translate(-50%,1rem);
  display:flex;align-items:center;gap:.625rem;
  border:1px solid var(--border);border-radius:1.25rem;background:var(--card);
  padding:.875rem 1.25rem;font-size:.875rem;font-weight:500;
  box-shadow:var(--shadow-card);opacity:0;pointer-events:none;
  transition:opacity .3s var(--ease-out-soft),transform .3s var(--ease-out-soft);
  max-width:calc(100vw - 2rem);
}
.toast.show{opacity:1;transform:translate(-50%,0)}
.toast svg{width:1.125rem;height:1.125rem;color:var(--primary);flex-shrink:0}

.reveal{opacity:0;filter:blur(6px);transform:translateY(28px);
  transition:opacity .7s var(--ease-out-soft),filter .7s var(--ease-out-soft),transform .7s var(--ease-out-soft)}
.reveal.in{opacity:1;filter:blur(0);transform:none}

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

/* rodapé: dados da empresa e links legais */
.footer-legal{line-height:1.7}
.footer-legal a{color:var(--primary);text-decoration:underline;text-underline-offset:3px}
.footer-legal a:hover{text-decoration-thickness:2px}
