/* =========================================
   BASE / TEMA — enxuto & mobile-first (v4.4-compact — clean)
   ========================================= */

/* ---- Tokens globais ---- */
:root{
  /* cores */
  --bg-1:#150a25; --bg-2:#2a114a;
  --brand-1:#a855f7; --brand-2:#7c3aed;
  --text:#f7f8ff; --text-dim:rgba(247,248,255,.70);

  /* dimensões */
  --nav-h:70px;
  --wrap-w:min(1120px,100% - 2rem);

  /* vidro / efeitos */
  --blur-nav:blur(12px) saturate(140%);
  --blur-card:blur(6px);
  --glass-bg:rgba(255,255,255,.045);
  --glass-bd:rgba(255,255,255,.08);

  /* gradientes */
  --grad-accent:linear-gradient(90deg,var(--brand-1),var(--brand-2));
  --grad-bg-global:
    radial-gradient(1200px 800px at 15% 20%, #1a2080 0%, transparent 70%),
    radial-gradient(1000px 700px at 85% 85%, #2b2f99 0%, transparent 70%),
    linear-gradient(180deg,var(--bg-1) 0%,var(--bg-2) 60%,color-mix(in oklab,var(--bg-2) 80%,#000 20%) 100%);
  --grad-bg-home:linear-gradient(180deg,var(--bg-1) 0%,var(--bg-2) 72%,var(--bg-2) 100%);

  /* safe areas */
  --sa-top:env(safe-area-inset-top,0px);
  --sa-bottom:env(safe-area-inset-bottom,0px);

  /* spacing / radius */
  --gutter:clamp(12px,4vw,20px);
  --radius:16px;

  /* seleção */
  --select-bg:rgba(91,99,255,.35);
  --select-fg:#fff;
}

/* ---- Reset leve ---- */
*,*::before,*::after{ box-sizing:border-box; }
::selection{ background:var(--select-bg); color:var(--select-fg); }
img,video{ display:block; max-width:100%; height:auto; }
.alignfull{ width:100%; margin:0; }
:where(.container,.wrap,.alignwide,.wp-block-group.alignwide){ width:var(--wrap-w); margin-inline:auto; padding-inline:var(--gutter); }

/* html/body */
html{
  min-height:100%;
  color-scheme:dark;
  background:fixed no-repeat var(--grad-bg-global)/cover;
  scroll-behavior:smooth;
}
@media (max-width:820px){ html{ background-attachment:scroll; } } /* evita jank em mobile */

body{
  margin:0; min-height:100vh;
  color:var(--text);
  font:400 clamp(15px,3.8vw,17px)/1.5 Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  background:transparent; /* html controla o fundo */
}

/* links (com fallback p/ color-mix) */
a{ text-decoration:none; color:color-mix(in oklab,var(--text) 85%, #aab 15%); transition:color .2s; }
a:hover{ color:#fff; }
a:focus-visible{ outline:2px solid #8ea2ff; outline-offset:2px; border-radius:6px; }
@supports not (color: color-mix(in oklab, #000 50%, #fff 50%)){ a{ color:#dfe3ff; } }

/* =========================================
   FUNDO LUMINOSO
   ========================================= */
body::before{
  content:""; position:fixed; inset:0; z-index:-1; pointer-events:none;
  background:
    radial-gradient(800px 600px at 20% 30%, rgba(91,99,255,.6), transparent 60%),
    radial-gradient(600px 500px at 80% 80%, rgba(47,55,255,.6), transparent 60%),
    radial-gradient(1200px 1000px at 50% 0%, rgba(91,99,255,.25), transparent 75%),
    linear-gradient(120deg,
      color-mix(in oklab,var(--bg-1) 90%, #000 10%) 0%,
      color-mix(in oklab,var(--bg-2) 90%, #000 10%) 50%,
      rgba(0,0,0,.25) 100%);
  background-size:340% 340%; background-repeat:no-repeat;
  background-blend-mode:screen, overlay, normal;
  opacity:.45; filter:blur(140px) brightness(1.4) contrast(1.25) saturate(260%);
  animation:luzes-maxxi 6.5s ease-in-out infinite alternate;
}
@keyframes luzes-maxxi{
  0%,100%{ background-position:0% 50%, 100% 50%, 50% 0%, 0% 50%; }
  33%{ background-position:68% 32%, 32% 68%, 42% 24%, 100% 0%; }
  66%{ background-position:22% 78%, 78% 22%, 58% 12%, 0% 100%; }
}

/* MOBILE / TOUCH — versão premium suave */
@media (hover:none), (max-width:640px){
  body::before{
    /* só sobrescreve o necessário */
    background:
      radial-gradient(900px 700px at 20% 28%, rgba(91,99,255,.75), transparent 60%),
      radial-gradient(700px 560px at 82% 82%, rgba(47,55,255,.7), transparent 60%),
      radial-gradient(1300px 1000px at 50% 0%, rgba(91,99,255,.35), transparent 75%),
      linear-gradient(120deg,
        color-mix(in oklab,var(--bg-1) 85%, #000 15%) 0%,
        color-mix(in oklab,var(--bg-2) 85%, #000 15%) 50%,
        rgba(0,0,0,.15) 100%);
    background-size:420% 420%;
    opacity:.55;
    filter:blur(110px) brightness(1.65) contrast(1.35) saturate(220%);
    animation:luzes-mobile 8s cubic-bezier(.4,0,.4,1) infinite alternate;
    will-change:background-position, filter;
  }
  body::after{
    content:""; position:fixed; inset:0; z-index:-1; pointer-events:none;
    background:radial-gradient(130% 115% at 50% 60%, rgba(0,0,0,.25) 40%, rgba(0,0,0,.12) 65%, transparent 85%);
    mix-blend-mode:soft-light; opacity:.15;
  }
}
@keyframes luzes-mobile{
  0%,100%{ background-position:-8% 58%, 108% 42%, 50% -4%, 0% 54%; }
  50%{ background-position:84% 22%, 16% 78%, 44% 16%, 100% 0%; }
}

/* =========================================
   UTILITÁRIOS — layout
   ========================================= */
[class^="stack"] > * + *{ margin-top:var(--stack-gap,16px); }
.stack-8{ --stack-gap:8px; } .stack-16{ --stack-gap:16px; } .stack-24{ --stack-gap:24px; } .stack-32{ --stack-gap:32px; }

.cluster{ display:flex; flex-wrap:wrap; align-items:center; gap:var(--gap,12px); }

:is(.grid,.grid-auto){ display:grid; gap:clamp(14px,2.4vw,24px); }
.grid-auto{ grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr)); }

.cols-1,.cols-2,.cols-3{ grid-template-columns:1fr; }
@media (min-width:560px){
  .cols-2,.cards-2{ grid-template-columns:repeat(2,1fr); }
  .cards-3{ grid-template-columns:repeat(2,1fr); }
}
@media (min-width:900px){ .cols-3,.cards-3{ grid-template-columns:repeat(3,1fr); } }

/* =========================================
   NAVBAR
   ========================================= */
.topnav{
  position:fixed; inset-block-start:0; inset-inline:0; z-index:1000;
  display:flex; align-items:center; block-size:var(--nav-h);
  backdrop-filter:var(--blur-nav);
  background:linear-gradient(180deg,rgba(7,8,25,.55),rgba(7,8,25,0));
  border-block-end:1px solid rgba(255,255,255,.05);
}
@supports not ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))){
  .topnav{ background:rgba(7,8,25,.78); }
}

.nav-wrap{
  inline-size:var(--wrap-w); margin-inline:auto;
  display:flex; align-items:center; justify-content:space-between;
  padding-inline:var(--gutter);
}
.brand img{ display:block; block-size:36px; }

/* Menu */
:where(.menu){ display:flex; gap:26px; list-style:none; margin:0; padding:0; }
.menu a{
  position:relative; display:inline-block;
  min-height:44px; line-height:44px; padding-inline:.25rem;
  font-size:.95rem; color:#cbd2ff; opacity:.75; transition:color .25s, opacity .25s;
}
.menu a:is(:hover,:focus-visible,.active){ opacity:1; color:var(--brand-1); }
.menu a::after{
  content:""; position:absolute; inset-inline-start:0; inset-block-end:-4px;
  inline-size:0; block-size:2px; background:var(--grad-accent); transition:inline-size .25s;
}
.menu a:is(:hover,:focus-visible,.active)::after{ inline-size:100%; }

.nav-toggle{
  display:none; inline-size:40px; aspect-ratio:1; border:0; background:transparent; cursor:pointer;
}
.nav-toggle-bar,.nav-toggle-bar::before,.nav-toggle-bar::after{
  content:""; display:block; block-size:2px; background:#fff; border-radius:2px;
}
.nav-toggle-bar{ position:relative; }
.nav-toggle-bar::before{ position:absolute; inset:auto 0 8px; }
.nav-toggle-bar::after{ position:absolute; inset:8px 0 auto; }

/* NAV RESPONSIVO */
@media (max-width:768px){
  .nav-toggle{ display:block; }
  .topnav .menu{
    position:fixed; inset-inline:0; inset-block-start:var(--nav-h); z-index:1100;
    display:flex; flex-direction:column; align-items:center; gap:.875rem; text-align:center;
    margin:0; padding:1.25rem clamp(1rem,6vw,2rem);
    background:rgba(11,13,44,.52);
    border-block-end:1px solid rgba(255,255,255,.06);
    box-shadow:0 20px 40px rgba(0,0,0,.25);
    transform:translateY(-120%); visibility:hidden; pointer-events:none;
    transition:transform .25s ease, visibility 0s linear .25s; will-change:transform;
  }
  body.menu-open .topnav .menu{
    transform:translateY(0); visibility:visible; pointer-events:auto; transition:transform .25s ease, visibility 0s;
  }
  body.menu-open .topnav .menu::before{
    content:""; position:absolute; inset:0; background:rgba(11,13,44,.45);
    -webkit-backdrop-filter:blur(12px) saturate(160%); backdrop-filter:blur(12px) saturate(160%);
    border-block-end:1px solid rgba(255,255,255,.06); pointer-events:none; z-index:-1;
  }
  .nav-wrap{ position:relative; justify-content:center; }
  .brand{ position:absolute; inset-inline-start:50%; transform:translateX(-50%); }
  .nav-toggle{ position:absolute; inset-inline-end:0; }
  .topnav{ background:transparent; border-block-end-color:transparent; overflow:visible; }
  body.menu-open .topnav{ background:rgba(7,8,25,.85); border-block-end-color:rgba(255,255,255,.06); }
}

/* =========================================
   TIPOGRAFIA
   ========================================= */
:where(h1,h2,h3){ margin:0; font-weight:700; }
h1{ font-size:clamp(2.5rem,10vw,4.5rem); line-height:1.1; }
h2{ font-size:clamp(1.75rem,7vw,3rem); line-height:1.15; }
h3{ font-size:clamp(1.25rem,5vw,2rem); line-height:1.2; }
.lead{ font-size:clamp(1.125rem,4.5vw,1.5rem); color:var(--text-dim); }

/* unidades modernas */
@supports (font-size:clamp(1rem,1vi,2rem)){
  h1{ font-size:clamp(2.5rem,10vi,4.5rem); }
  h2{ font-size:clamp(1.75rem,7vi,3rem); }
  h3{ font-size:clamp(1.25rem,5vi,2rem); }
  .lead{ font-size:clamp(1.125rem,4.5vi,1.5rem); }
}

/* texto com degradê (unificado) */
.accent{
  background:var(--grad-accent);
  -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent; color:transparent;
}
.grad-text{
  text-shadow:0 0 12px rgba(91,99,255,.35), 0 0 24px rgba(47,55,255,.25);
  filter:drop-shadow(0 0 6px rgba(91,99,255,.18));
}

/* =========================================
   BOTÕES
   ========================================= */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.6em;
  padding:.875em 1.25em; border-radius:999px; min-block-size:44px;
  font-weight:600; cursor:pointer;
  transition:transform .15s, box-shadow .15s, background .15s, color .15s, border-color .15s;
  will-change:transform,box-shadow;
}
.btn-primary{ color:#fff; background:var(--grad-accent); box-shadow:0 10px 30px rgba(47,55,255,.35); }
.btn-primary:is(:hover,:focus-visible){ transform:translateY(-1px); box-shadow:0 12px 36px rgba(47,55,255,.45),0 0 18px rgba(91,99,255,.25); }
.btn-ghost{ color:#fff; background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.18); }
.btn-ghost:is(:hover,:focus-visible){ background:rgba(255,255,255,.08); transform:translateY(-1px); }
.btn .play{ display:inline-block; line-height:1; font-weight:700; transform:translateY(1px); }

/* =========================================
   HERO INTERNO
   ========================================= */
.hero--internal{
  margin-block-start: calc(var(--nav-h) + var(--sa-top));
  padding: clamp(1.75rem,6vw,3.75rem) var(--gutter) .75rem;
  display:flex; align-items:center; justify-content:center; text-align:center;
  scroll-margin-top: calc(var(--nav-h) + 12px);
  content-visibility:auto; contain-intrinsic-size:320px 720px;
}
.hero--internal .title{
  margin:0 0 clamp(.5rem,1.6vw,1rem);
  font:800 clamp(1.75rem,6.8vw,4rem)/1.05 Sora,Inter,system-ui,sans-serif;
  letter-spacing:-.02em; text-transform:uppercase; text-wrap:balance;
}
.hero--internal .lead{
  margin:0 auto; max-inline-size:60ch;
  font-size:clamp(1rem,2.2vw,1.375rem); line-height:1.35; color:var(--text-dim); text-wrap:pretty;
}
.hero--internal + *{ margin-block-start:clamp(.625rem,3vw,1.25rem); }

/* =========================================
   SEÇÕES / CARDS
   ========================================= */
.section{
  --section-pad:clamp(2rem,4vw,3.75rem);
  padding:var(--section-pad) var(--gutter);
  content-visibility:auto; contain-intrinsic-size:480px 1120px;
}
.title-section{
  margin:0 0 clamp(1rem,2.4vw,1.75rem);
  font:800 clamp(1.25rem,4.2vw,2.25rem)/1.1 Sora,Inter,system-ui,sans-serif;
  letter-spacing:-.01em; text-align:center; text-wrap:balance;
}
.cards-2,.cards-3{ grid-template-columns:1fr; }

.card{
  background:var(--glass-bg); border:1px solid var(--glass-bd); border-radius:var(--radius);
  padding:clamp(1rem,2.6vw,1.375rem);
  box-shadow:0 10px 30px rgba(0,0,0,.25); backdrop-filter:var(--blur-card);
  overflow:hidden; content-visibility:auto; contain-intrinsic-size:260px 720px;
  transition:transform .18s ease, box-shadow .22s ease, border-color .22s ease;
}
.card:hover{
  transform:translateY(-3px);
  border-color:color-mix(in oklab,var(--glass-bd) 60%,#fff 40%);
  box-shadow:0 16px 44px rgba(0,0,0,.28);
}
.card :where(h3){ margin:.25rem 0 .5rem; font-family:Sora,Inter,system-ui,sans-serif; }
.card .icon{ font-size:clamp(1.375rem,4vw,1.75rem); line-height:1; margin-block-end:.5rem; }
.sobre .section + .section{ margin-block-start:clamp(1rem,4vw,1.75rem); }

/* mídias */
.post-card__media,.embed-responsive{ overflow:hidden; border-radius:12px; }
.post-card__media{ aspect-ratio:3/2; }
.post-card__media img{ width:100%; height:100%; object-fit:cover; }
.embed-responsive{ position:relative; aspect-ratio:16/9; }
.embed-responsive>*{ position:absolute; inset:0; width:100%; height:100%; }

/* =========================================
   FOOTER (site-footer completo + compacto coexistem)
   ========================================= */
.site-footer{
  --ft-text:rgba(247,248,255,.90); --ft-muted:rgba(247,248,255,.68); --ft-border:rgba(255,255,255,.08);
  --chip-bg:rgba(255,255,255,.06); --chip-bd:rgba(255,255,255,.14); --chip-hover:rgba(255,255,255,.12);
  padding-block:clamp(1.75rem,5svh,3.5rem); color:var(--ft-text);
  background:
    radial-gradient(900px 420px at 82% 0%, rgba(80,90,200,.18), transparent 60%),
    linear-gradient(180deg, color-mix(in oklab, var(--bg-2) 85%, var(--bg-1) 15%) 0%, color-mix(in oklab, #0d1038 70%, var(--bg-1) 30%) 100%);
  border-block-start:1px solid var(--ft-border);
  box-shadow:inset 0 -12px 40px rgba(10,12,35,.25);
  content-visibility:auto; contain-intrinsic-size:320px 1120px;
}
.site-footer .foot-wrap{
  inline-size:var(--wrap-w); margin-inline:auto; padding-inline:.5rem;
  display:grid; gap:clamp(1rem,2.6vw,1.75rem); align-items:start; grid-template-columns:1fr;
}
@media (min-width:560px){ .site-footer .foot-wrap{ grid-template-columns:1fr 1fr; } }
@media (min-width:900px){ .site-footer .foot-wrap{ grid-template-columns:1fr auto 1fr; } }

.site-footer :where(.foot-col){ display:grid; gap:.375rem; }
.site-footer :where(.foot-brand .foot-copy){ font-weight:700; opacity:.95; }
.site-footer :where(.foot-brand .foot-claim){ opacity:.88; }
.site-footer :where(.foot-brand .foot-loc){ color:var(--ft-muted); font-size:.75rem; }
.site-footer :where(.foot-top){ align-content:start; justify-items:center; }
.site-footer :where(.back-to-top){ font-weight:600; }
.site-footer :where(.foot-contacts){ order:2; justify-items:end; gap:.625rem; }
.site-footer :where(.foot-social){ display:flex; flex-wrap:wrap; gap:.5rem .625rem; justify-content:flex-end; }

.site-footer a{ color:var(--text-dim); transition:color .2s, background-color .2s, border-color .2s, opacity .2s, transform .15s; outline:0; }
.site-footer a:is(:hover,:focus-visible){ color:#e4e8ff; }

.site-footer .chip{
  display:inline-flex; align-items:center; justify-content:center; inline-size:max-content;
  block-size:2.25rem; padding-inline:.875rem; border-radius:999px;
  background:var(--chip-bg); border:1px solid var(--chip-bd); backdrop-filter:var(--blur-card);
  font-weight:500; line-height:1; white-space:nowrap; transition:transform .15s, background-color .2s, border-color .2s; will-change:transform;
}
.site-footer .chip:hover{ background:var(--chip-hover); transform:translateY(-1px); }
.site-footer .chip--primary{ background:linear-gradient(180deg, rgba(255,255,255,.14), rgba(255,255,255,.07)); border-color:rgba(255,255,255,.22); color:#fff; }

@media (max-width:559.98px){
  .site-footer .foot-brand{ order:1; }
  .site-footer .foot-contacts{ order:2; justify-items:start; }
  .site-footer .foot-top{ order:3; justify-items:start; }
  .site-footer .foot-social{ justify-content:flex-start; }
}

/* FAB topo */
.ft-fab-top{
  position:fixed; inset-inline-end:clamp(.75rem,2vw,1.25rem); inset-block-end:clamp(.75rem,2.4vw,1.25rem); z-index:999;
  inline-size:2.5rem; block-size:2.5rem; border-radius:999px; display:grid; place-items:center;
  border:1px solid rgba(255,255,255,.18); background:rgba(255,255,255,.06); color:#fff;
  backdrop-filter:blur(8px); box-shadow:0 10px 30px rgba(0,0,0,.28); cursor:pointer;
  opacity:0; transform:translateY(.75rem); transition:opacity .25s, transform .25s, background .2s, border-color .2s;
}
.ft-fab-top:hover{ background:rgba(255,255,255,.1); border-color:rgba(255,255,255,.26); }
.ft-fab-top:focus-visible{ outline:2px solid #8ea2ff; outline-offset:2px; }
.ft-fab-top.is-visible{ opacity:1; transform:translateY(0); }

/* Footer compacto (coexiste sem conflito) */
.footer{
  background:rgba(10,12,40,.78);
  backdrop-filter:var(--blur-nav);
  border-top:1px solid var(--glass-bd);
  text-align:center;
  padding-block:1rem .75rem; padding-inline:1rem;
  color:var(--text-dim); font-size:.9rem;
}
.footer-inner{ max-width:var(--wrap-w); margin-inline:auto; display:grid; justify-items:center; gap:.5rem; }
.footer-links{ display:flex; flex-wrap:wrap; gap:.75rem; }
.footer-links a{ color:var(--text); letter-spacing:.01em; font-size:.9rem; transition:opacity .25s, transform .25s; }
.footer-links a:hover{ opacity:.8; transform:translateY(-1px); }
.footer-email a{ color:var(--text-dim); font-style:italic; font-size:.85rem; }
.footer-social{ display:flex; align-items:center; justify-content:center; gap:.4rem; list-style:none; padding:0; margin:.2rem 0 0; }
.footer-social .icon{
  inline-size:26px; block-size:26px; display:grid; place-items:center; border-radius:50%;
  background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.1); color:var(--text);
  transition:transform .2s, border-color .2s, color .2s;
}
.footer-social .icon:hover{ color:var(--brand-1); border-color:var(--brand-1); transform:translateY(-1px); }
.footer-social svg{ inline-size:12px; block-size:12px; fill:currentColor; }
.footer-copy{ font-size:.78rem; opacity:.7; margin-top:.2rem; }

/* =========================================
   GRADIENTE DINÂMICO — texto (rev A)
   ========================================= */

/* Fallback seguro p/ engines sem @property */
@supports (background: paint(something)) or (background: linear-gradient(red,blue)) {
  @property --ang { syntax:'<angle>'; inherits:false; initial-value:0deg; }
}

/* Keyframes — pan linear, giro por ângulo, sweep do highlight */
@keyframes grad-pan   { from{background-position:0% 50%} to{background-position:100% 50%} }
@keyframes grad-spin  { to{ --ang:360deg } }
@keyframes grad-sweep {
  0%   { background-position:-60% 50%, 50% 50%, 0% 50% }
  50%  { background-position: 50% 50%, 50% 50%, 100% 50% }
  100% { background-position:160% 50%, 50% 50%, 0% 50% }
}

/* Efeito simples (somente pan do gradiente base) */
.grad-anim{
  /* camada única = var(--grad-accent) */
  background-image: var(--grad-accent);
  background-repeat: no-repeat;
  background-size: var(--size-1,400% 100%);
  background-position: var(--pos-1,0% 50%);
  animation: grad-pan var(--t-pan,2.5s) ease-in-out infinite alternate;
  will-change: background-position;
}

/* Efeito intenso (3 camadas: highlight, conic, base) */
.accent.grad-intenso{
  /* origem do conic levemente fora para varredura mais “rica” */
  --conic-x: 120%;
  --conic-y: 48%;

  /* tamanhos default das 3 camadas */
  --size-a: 220% 100%;  /* highlight linear */
  --size-b: 180% 180%;  /* conic orbitando */
  --size-c: 400% 100%;  /* base pan horizontal */

  /* tempos default */
  --t-sweep: 2.6s;
  --t-spin:  7.5s;
  --t-pan-i: 3.2s;

  /* leve glow (sem estourar legibilidade) */
  filter: drop-shadow(0 0 7px rgba(91,99,255,.18));

  /* 1) highlight linear “faixa” branca
     2) conic animando em torno de --ang
     3) gradiente base com pan horizontal */
  background-image:
    linear-gradient(120deg,
      transparent 22%,
      rgba(255,255,255,.65) 48%,
      rgba(255,255,255,.22) 56%,
      transparent 78%
    ),
    conic-gradient(from var(--ang) at var(--conic-x) var(--conic-y),
      color-mix(in oklab, var(--brand-1) 85%, #fff 15%),
      var(--brand-2),
      color-mix(in oklab, var(--brand-1) 85%, #fff 15%)
    ),
    var(--grad-accent);

  background-repeat: no-repeat;
  background-size:
    var(--size-a),
    var(--size-b),
    var(--size-c);
  background-position:
    var(--pos-a,-60% 50%),
    50% 50%,
    var(--pos-c,0% 50%);

  animation:
    grad-sweep var(--t-sweep) ease-in-out infinite,
    grad-spin  var(--t-spin)  linear       infinite,
    grad-pan   var(--t-pan-i) ease-in-out  infinite alternate;

  /* garante ativação de compositing eficiente */
  will-change: background-position, filter;
}

/* ======= Responsivo ======= */
@media (max-width:1024px){
  .accent.grad-intenso{
    --conic-x:108%;
    --conic-y:50%;
    --size-a:200% 100%;
    --size-b:160% 160%;
    --size-c:360% 100%;
    --t-sweep:3.4s;
    --t-spin:10s;
    --t-pan-i:3.6s;
    filter: drop-shadow(0 0 5px rgba(91,99,255,.14));
  }
}

@media (max-width:640px){
  .accent.grad-intenso{
    /* mobile: simplifica removendo o highlight linear (melhor leitura) */
    background-image:
      conic-gradient(from var(--ang) at var(--conic-x) var(--conic-y),
        color-mix(in oklab, var(--brand-1) 88%, #fff 12%),
        color-mix(in oklab, var(--brand-2) 90%, #000 10%),
        color-mix(in oklab, var(--brand-1) 88%, #fff 12%)
      ),
      var(--grad-accent);

    --conic-x:112%;
    --conic-y:50%;
    --size-b:240% 240%;
    --size-c:480% 140%;

    background-size:
      var(--size-b),
      var(--size-c);

    animation:
      grad-sweep 2s ease-in-out infinite,
      grad-spin  6s linear       infinite,
      grad-pan   2.4s ease-in-out infinite alternate;

    /* um toque extra p/ compensar telas pequenas */
    filter: saturate(160%) brightness(1.2)
            drop-shadow(0 0 10px rgba(91,99,255,.25));
  }
}

/* ======= Acessibilidade / preferências ======= */
@media (prefers-reduced-motion: reduce){
  .grad-anim,
  .accent.grad-intenso{
    animation: none;
    /* mantém estética sem motion agressivo */
    background-position: 50% 50%;
    filter: none;
  }
}

/* ======= Fallback p/ browsers sem color-mix/oklab ======= */
@supports not (color: color-mix(in oklab, red 50%, white 50%)){
  .accent.grad-intenso{
    /* aproximação usando apenas var(--grad-accent) e levinho highlight */
    background-image:
      linear-gradient(120deg,
        transparent 25%, rgba(255,255,255,.5) 50%,
        rgba(255,255,255,.2) 60%, transparent 75%
      ),
      var(--grad-accent);
  }
}


/* =========================================
   REVEAL-ON-SCROLL
   ========================================= */
.reveal{
  --reveal-dur:.6s; --reveal-ease:cubic-bezier(.2,.8,.2,1);
  --reveal-dy:24px; --reveal-dx:28px; --rx:0; --ry:var(--reveal-dy);
  opacity:0; transform:translate3d(var(--rx),var(--ry),0);
  transition:transform var(--reveal-dur) var(--reveal-ease), opacity var(--reveal-dur) ease;
  will-change:transform, opacity;
}
.reveal.is-in, .reveal.is-visible.is-in{ opacity:1; transform:translate3d(0,0,0); }
.reveal[data-anim="up"]{ --rx:0; --ry:var(--reveal-dy); }
.reveal[data-anim="down"]{ --rx:0; --ry:calc(-1 * var(--reveal-dy)); }
.reveal[data-anim="left"]{ --rx:calc(-1 * var(--reveal-dx)); --ry:0; }
.reveal[data-anim="right"]{ --rx:var(--reveal-dx); --ry:0; }
.reveal[data-stagger]{ --stagger-step:80ms; transition-delay:calc(var(--i,0) * var(--stagger-step)); }
[data-no-reveal] .reveal{ opacity:1 !important; transform:none !important; transition:none !important; }


/* =========================================
   ACESSIBILIDADE / REDUÇÃO DE MOVIMENTO
   ========================================= */
@media (prefers-reduced-motion:reduce){
  html{ scroll-behavior:auto; }
  .menu a, .menu a::after, .btn, .reveal, .fx-uline::after,
  .grad-anim, .grad-intenso, .topnav .menu{
    transition:none!important; animation:none!important; transform:none!important; opacity:1!important;
  }
  body.menu-open .topnav .menu{ visibility:visible!important; pointer-events:auto!important; }
  body.menu-open .topnav .menu::before{ -webkit-backdrop-filter:none; backdrop-filter:none; }
}

/* =========================================
   DECORAÇÃO: sublinhado elástico
   ========================================= */
.fx-uline{ position:relative; display:inline-block; }
.fx-uline::after{
  content:""; position:absolute; inset-inline-start:0; inset-block-end:-6px; inline-size:100%; block-size:2px; border-radius:999px;
  background:var(--grad-accent); box-shadow:0 0 10px rgba(91,99,255,.35), 0 0 20px rgba(47,55,255,.22);
  transform:scaleX(0); transform-origin:left center; transition:transform .6s cubic-bezier(.22,1,.36,1); will-change:transform;
}
.reveal.is-in .fx-uline::after, .fx-uline.is-in::after{ transform:scaleX(1); }

/* =========================================
   WP helpers
   ========================================= */
body.admin-bar .topnav{ inset-block-start:32px; }
@media (max-width:782px){ body.admin-bar .topnav{ inset-block-start:46px; } }

.wp-block-columns{ gap:clamp(12px,2vw,24px); }
@media (max-width:768px){ .wp-block-columns{ display:grid; grid-template-columns:1fr; } }

h1,h2,h3,.entry-title,.post-card__title{ overflow-wrap:anywhere; hyphens:auto; }
.entry-content{ overflow-wrap:anywhere; }
.entry-content :where(table,.wp-block-table){ display:block; max-width:100%; overflow-x:auto; -webkit-overflow-scrolling:touch; }

/* ---- Fallbacks compartilhados ---- */
@supports not ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))){
  .card, .site-footer .chip{ background:color-mix(in oklab,var(--glass-bg) 70%,#000 30%); }
}

/* =========================================
   SPOTLIGHT (lanterna)
   ========================================= */
#spotlight-overlay{
  position:fixed; inset:0; z-index:9999; pointer-events:none;
  background-color:rgba(0,0,0,.2);
  -webkit-mask-image:radial-gradient(
    circle var(--spotlight-size) at var(--mouse-x) var(--mouse-y),
    transparent 50%, rgba(0,0,0,.5) 70%, black 95%);
  mask-image:radial-gradient(
    circle var(--spotlight-size) at var(--mouse-x) var(--mouse-y),
    transparent 50%, rgba(0,0,0,.5) 75%, black 95%);
}