* { box-sizing: border-box; }
  html { scroll-behavior: smooth; }
  body { margin: 0; background: #FFF6F0; color: #1B2540; font-family: 'Nunito', sans-serif; -webkit-font-smoothing: antialiased; }
  a { color: #E8482A; text-decoration: none; }
  a:hover { color: #B4331A; }
  ::selection { background: #FF6B47; color: #fff; }
  details > summary { list-style: none; cursor: pointer; }
  details > summary::-webkit-details-marker { display: none; }
  details[open] .faq-plus { transform: rotate(45deg); }

  @keyframes zpRise { from { opacity: 0; transform: translateY(30px); } to { opacity: 1; transform: translateY(0); } }
  @keyframes zpFade { from { opacity: 0; } to { opacity: 1; } }
  @keyframes zpScale { from { opacity: 0; transform: scale(.94); } to { opacity: 1; transform: scale(1); } }
  @keyframes zpSlideL { from { opacity: 0; transform: translateX(-36px); } to { opacity: 1; transform: translateX(0); } }
  @keyframes zpSlideR { from { opacity: 0; transform: translateX(36px); } to { opacity: 1; transform: translateX(0); } }
  @keyframes zpFloat { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-9px); } }
  @keyframes zpGlow { 0%,100% { opacity:.55; transform:scale(1); } 50% { opacity:.9; transform:scale(1.08); } }
  @keyframes zpPulse { 0%,100% { box-shadow:0 12px 28px -8px rgba(37,211,102,.8), 0 0 0 0 rgba(37,211,102,.45); } 50% { box-shadow:0 12px 28px -8px rgba(37,211,102,.8), 0 0 0 14px rgba(37,211,102,0); } }

  .zp-reveal { animation: zpRise .85s cubic-bezier(.22,.85,.28,1) both; animation-timeline: view(); animation-range: entry 0% cover 30%; }
  .zp-reveal-l { animation: zpSlideL .9s cubic-bezier(.22,.85,.28,1) both; animation-timeline: view(); animation-range: entry 0% cover 34%; }
  .zp-reveal-r { animation: zpSlideR .9s cubic-bezier(.22,.85,.28,1) both; animation-timeline: view(); animation-range: entry 0% cover 34%; }
  .zp-reveal-s { animation: zpScale .9s cubic-bezier(.22,.85,.28,1) both; animation-timeline: view(); animation-range: entry 0% cover 32%; }

  .zp-card { transition: transform .4s cubic-bezier(.22,.85,.28,1), box-shadow .4s, border-color .4s; }
  .zp-card:hover { transform: translateY(-7px); box-shadow: 0 26px 46px -26px rgba(27,37,64,.5); border-color: #FFC3B0; }
  .zp-btn { transition: transform .28s cubic-bezier(.22,.85,.28,1), box-shadow .28s, filter .28s; }
  .zp-btn:hover { transform: translateY(-3px) scale(1.02); filter: brightness(1.06); }
  .zp-nav a { transition: color .25s; }
  .zp-media img { transition: transform 1.1s cubic-bezier(.22,.85,.28,1); }
  .zp-media:hover img { transform: scale(1.05); }
  details { transition: border-color .3s, box-shadow .3s; }
  details:hover { border-color: #FFC3B0; }
  a[title="Falar no WhatsApp"]:hover { transform: scale(1.1); }

  @media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation: none !important; transition: none !important; }
  }

  /* --- refinamentos --- */
  @keyframes zpBlurIn { from { opacity:0; transform:translateY(26px); filter:blur(9px); } to { opacity:1; transform:translateY(0); filter:blur(0); } }
  @keyframes zpSheen { 0% { transform:translateX(-130%) skewX(-18deg); } 100% { transform:translateX(320%) skewX(-18deg); } }
  @keyframes zpDrift { 0%,100% { transform:translate(0,0) scale(1); } 50% { transform:translate(-24px,22px) scale(1.1); } }
  @keyframes zpBar { from { transform:scaleX(0); } to { transform:scaleX(1); } }
  @keyframes zpPop { from { opacity:0; transform:scale(.6) rotate(-14deg); } to { opacity:1; transform:scale(1) rotate(0); } }
  @keyframes zpKen { from { transform:scale(1.13); } to { transform:scale(1); } }
  @keyframes zpKenCrop { from { transform:scale(1.30); } to { transform:scale(1.18); } }
  @keyframes zpRule { from { transform:scaleX(0); } to { transform:scaleX(1); } }
  @keyframes zpDogLift { from { opacity:0; transform:translateY(46px) scale(.97); } to { opacity:1; transform:translateY(0) scale(1); } }

  /* ---------- menu mobile ---------- */
  .zp-menu { display: none; }
  .zp-menu > summary::-webkit-details-marker { display: none; }
  .zp-menu[open] > summary { background: #FFEDE7; border-color: #F5C9B8; }

  /* ---------- tablet ---------- */
  @media (max-width: 1024px) {
    .zp-4col { grid-template-columns: repeat(2,1fr) !important; }
    .zp-hero-grid { gap: 40px !important; }
    #diferenciais, #missao, #como-funciona, #planos, #liberdade, #depoimentos, #contrate { padding: 68px 24px !important; }
    #duvidas { padding: 16px 24px 68px !important; }
  }

  /* ---------- mobile ---------- */
  @media (max-width: 860px) {
    .zp-nav { display: none !important; }
    .zp-menu { display: block; }
    .zp-navbar { padding: 10px 16px !important; gap: 12px !important; }

    .zp-2col, .zp-3col, .zp-4col, .zp-foot { grid-template-columns: 1fr !important; gap: 16px !important; }
    .zp-liberdade { display: flex !important; flex-direction: column-reverse !important; }
    #home { min-height: 0 !important; align-items: flex-start !important; }
    .zp-hero-grid { gap: 34px !important; }
    #diferenciais, #missao, #como-funciona, #planos, #liberdade, #depoimentos, #contrate { padding: 54px 18px !important; }
    #duvidas { padding: 12px 18px 54px !important; }
    footer { padding: 44px 18px 28px !important; }
    .zp-card { padding: 24px !important; }
    details.zp-reveal, #duvidas details { padding: 18px 20px !important; }
    /* reveals sem deslocamento lateral em telas estreitas */
    .zp-reveal-l, .zp-reveal-r { transform: none !important; }
  }

  /* ---------- celular estreito ---------- */
  @media (max-width: 860px) {
    /* item de grid esticado + margin auto zera a largura: fixa a largura */
    #home .zp-hero-media { width: min(330px, 100%) !important; margin: 46px auto 0 !important; justify-self: center !important; }
    #home .zp-hero-media > div:first-child { width: 100% !important; }
    /* cachorro sai menos do painel para não invadir o texto */
    #home .zp-hero-media > div:last-child { width: 100% !important; }
    /* filhos flex sem largura intrínseca colapsam: garante 100% */
    .zp-liberdade > * { width: 100% !important; }
  }

  /* alvos de toque confortáveis no celular */
  @media (max-width: 860px) {
    #duvidas summary, #planos summary { min-height: 44px; display: flex; align-items: center; }
    footer a, #contrate a[href^="http"], #duvidas a[href^="http"] { display: inline-flex; align-items: center; min-height: 44px; }
    footer nav a, footer a { padding: 3px 0; }
  }

  @media (max-width: 520px) {
    .zp-hero-pad { padding: 34px 18px 52px !important; }
  }

  /* textura quadriculada leve para fundos claros */
  .zp-grid { position: relative; isolation: isolate; }
  .zp-grid::before {
    content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
    background-image:
      linear-gradient(to right, rgba(27,37,64,.055) 1px, transparent 1px),
      linear-gradient(to bottom, rgba(27,37,64,.055) 1px, transparent 1px);
    background-size: 68px 68px;
    background-position: center center;
    mask-image: radial-gradient(ellipse 90% 80% at 50% 45%, #000 45%, transparent 100%);
    -webkit-mask-image: radial-gradient(ellipse 90% 80% at 50% 45%, #000 45%, transparent 100%);
  }
  @keyframes zpScrollDot { 0% { transform:translateY(0); opacity:1; } 70% { transform:translateY(15px); opacity:0; } 100% { transform:translateY(0); opacity:0; } }

  /* revelação com desfoque + escalonamento por posição na grade */
  .zp-reveal, .zp-reveal-s { animation-name: zpBlurIn; }
  .zp-card { will-change: transform; }
  .zp-card:nth-child(2) { animation-delay: .06s; }
  .zp-card:nth-child(3) { animation-delay: .12s; }
  .zp-card:nth-child(4) { animation-delay: .18s; }
  .zp-card:nth-child(5) { animation-delay: .24s; }
  .zp-card:nth-child(6) { animation-delay: .3s; }

  /* títulos com sublinhado coral que cresce ao entrar */
  .zp-reveal.zp-h2 { position: relative; }

  /* brilho que atravessa os botões coral no hover */
  .zp-btn { position: relative; overflow: hidden; isolation: isolate; }
  .zp-btn::after {
    content: ""; position: absolute; top: 0; left: 0; width: 42%; height: 100%;
    background: linear-gradient(100deg, transparent, rgba(255,255,255,.42), transparent);
    transform: translateX(-130%) skewX(-18deg); pointer-events: none;
  }
  .zp-btn:hover::after { animation: zpSheen .85s cubic-bezier(.3,.7,.4,1) forwards; }
  .zp-btn:active { transform: translateY(-1px) scale(.99); }

  /* cards: brilho radial seguindo o topo + elevação mais rica */
  .zp-card { position: relative; overflow: hidden; }
  .zp-card[style*="overflow:visible"] { overflow: visible; }
  .zp-card::before {
    content: ""; position: absolute; inset: -1px; border-radius: inherit; opacity: 0;
    background: radial-gradient(420px circle at 50% -10%, rgba(255,107,71,.13), transparent 62%);
    transition: opacity .45s; pointer-events: none;
  }
  .zp-card:hover::before { opacity: 1; }
  .zp-card:hover { transform: translateY(-9px) scale(1.012); }

  /* mídia: ken burns lento na entrada + zoom no hover */
  .zp-media img { animation: zpKen 2.4s cubic-bezier(.22,.85,.28,1) both; }
  .zp-media { position: relative; }
  .zp-media::after {
    content: ""; position: absolute; inset: 0; pointer-events: none; opacity: 0;
    background: linear-gradient(180deg, transparent 55%, rgba(27,37,64,.35));
    transition: opacity .5s;
  }
  .zp-media:hover::after { opacity: 1; }

  /* chips do hero entram um a um */
  .zp-chip { animation: zpPop .6s cubic-bezier(.34,1.4,.5,1) both; }

  /* números dos passos giram levemente no hover do card */
  .zp-step { transition: transform .45s cubic-bezier(.34,1.4,.5,1), box-shadow .45s; }
  .zp-card:hover .zp-step { transform: scale(1.12) rotate(-8deg); box-shadow: 0 10px 20px -8px rgba(255,107,71,.8); }

  /* ícones dos diferenciais */
  .zp-ico { transition: transform .5s cubic-bezier(.34,1.4,.5,1), background-color .4s; }
  .zp-card:hover .zp-ico { transform: translateY(-3px) rotate(-7deg) scale(1.08); }

  /* FAQ mais suave */
  details { overflow: hidden; }
  details[open] > div { animation: zpBlurIn .5s cubic-bezier(.22,.85,.28,1) both; }
  .faq-plus { transition: transform .35s cubic-bezier(.34,1.4,.5,1), color .3s; }
  details:hover .faq-plus { color: #B4331A; }
  details[open] { box-shadow: 0 18px 34px -24px rgba(27,37,64,.4); }

  /* links do menu com underline que cresce */
  .zp-nav a:not([class]) { position: relative; }
  .zp-nav a:not([class])::after {
    content: ""; position: absolute; left: 0; bottom: -5px; height: 2px; width: 100%;
    background: #FF6B47; border-radius: 2px; transform: scaleX(0); transform-origin: left;
    transition: transform .35s cubic-bezier(.22,.85,.28,1);
  }
  .zp-nav a:not([class]):hover { color: #1B2540; }
  .zp-nav a:not([class]):hover::after { transform: scaleX(1); }

  /* halos de fundo à deriva */
  .zp-drift { animation: zpDrift 16s ease-in-out infinite; }

  /* barra de progresso de leitura no topo */
  @keyframes zpProgress { from { transform: scaleX(0); } to { transform: scaleX(1); } }
  .zp-progress {
    position: fixed; top: 0; left: 0; height: 3px; width: 100%; z-index: 90; transform-origin: left;
    background: linear-gradient(90deg, #FF6B47, #FFA187); transform: scaleX(0);
    animation: zpProgress linear both; animation-timeline: scroll(root block);
  }

  @media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation: none !important; transition: none !important; }
    .zp-progress { display: none; }
  }
