/* Personal DOG v2 — direção de arte
   Branco dominante, preto profundo, verde #70B226 como energia.
   Display: Unbounded | Corpo: Figtree | Curvas, colagem orgânica, selo giratório. */

:root{
  --branco:#FFFFFF;
  --gelo:#F6F6F2;
  --preto:#0A0A0A;
  --verde:#70B226;
  --verde-claro:#A6DF5C;
  --cinza:#6B6B64;
  --r-xl:36px;
  --r-md:22px;
  --largura:1200px;
  --f-display:"Unbounded",system-ui,sans-serif;
  --f-corpo:"Figtree",system-ui,sans-serif;
}

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:var(--f-corpo);background:var(--branco);color:var(--preto);line-height:1.65;font-size:1.0625rem;overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
.wrap{max-width:var(--largura);margin:0 auto;padding:0 clamp(1rem,4vw,2.5rem)}

h1,h2{font-family:var(--f-display);font-weight:800;line-height:1.04;letter-spacing:-.02em}
h1{font-size:clamp(2.2rem,5.4vw,4.3rem)}
h2{font-size:clamp(1.6rem,3.4vw,2.7rem)}
h3{font-family:var(--f-display);font-weight:600;font-size:clamp(1.05rem,1.8vw,1.3rem);line-height:1.25}
p+p{margin-top:1em}
.destaque{position:relative;display:inline-block;color:var(--preto);z-index:1}
.destaque::after{content:"";position:absolute;left:-.15em;right:-.15em;bottom:.06em;height:.42em;background:var(--verde);z-index:-1;border-radius:999px;transform:rotate(-1.2deg)}

/* barra de progresso do scroll */
.progresso{position:fixed;top:0;left:0;height:4px;background:var(--verde);width:0;z-index:90}

/* cursor customizado */
.cursor-dot,.cursor-anel{position:fixed;top:0;left:0;pointer-events:none;z-index:95;border-radius:50%;transform:translate(-50%,-50%)}
.cursor-dot{width:8px;height:8px;background:var(--verde)}
.cursor-anel{width:36px;height:36px;border:2px solid var(--preto);transition:width .18s,height .18s,border-color .18s;mix-blend-mode:difference;border-color:#fff}
body.cursor-on,body.cursor-on a,body.cursor-on button{cursor:none}
.cursor-anel.gr{width:64px;height:64px}
@media(pointer:coarse){.cursor-dot,.cursor-anel{display:none}}

/* Header */
.topo{position:sticky;top:0;z-index:80;background:color-mix(in srgb,var(--branco) 82%,transparent);backdrop-filter:blur(12px)}
.topo-in{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.8rem 0}
.marca{display:flex;align-items:center;gap:.6rem;text-decoration:none;font-family:var(--f-display);font-weight:800;font-size:1.05rem}
.marca img{width:46px;height:auto}
.nav{display:flex;gap:1.5rem;align-items:center}
.nav a{text-decoration:none;font-weight:600;font-size:.94rem;position:relative;padding:.2rem 0}
.nav a::after{content:"";position:absolute;left:0;bottom:-2px;height:3px;width:0;background:var(--verde);border-radius:99px;transition:width .25s}
.nav a:hover::after,.nav a.ativo::after{width:100%}
.topo-acoes{display:flex;align-items:center;gap:.7rem}
.icone-social{width:40px;height:40px;border-radius:50%;background:var(--preto);display:inline-flex;align-items:center;justify-content:center;transition:transform .18s,background .18s}
.icone-social:hover{transform:translateY(-3px) rotate(-6deg);background:var(--verde)}
.icone-social svg{width:19px;height:19px;fill:#fff}
.menu-btn{display:none;background:var(--preto);color:#fff;border:none;border-radius:99px;padding:.5rem .9rem;font-size:1.05rem;cursor:pointer}

/* Botões */
.btn{display:inline-flex;align-items:center;gap:.6rem;background:var(--preto);color:#fff;font-weight:700;font-family:var(--f-corpo);font-size:1rem;text-decoration:none;padding:1rem 1.9rem;border-radius:999px;border:none;cursor:pointer;transition:background .2s,color .2s;will-change:transform}
.btn:hover{background:var(--verde);color:var(--preto)}
.btn-verde{background:var(--verde);color:var(--preto)}
.btn-verde:hover{background:var(--preto);color:#fff}
.btn-borda{background:transparent;color:var(--preto);box-shadow:inset 0 0 0 2px var(--preto)}
.btn-borda:hover{background:var(--preto);color:#fff}
.escuro .btn-borda{color:#fff;box-shadow:inset 0 0 0 2px #fff}
.escuro .btn-borda:hover{background:var(--verde);color:var(--preto);box-shadow:none}
.btn-nav{padding:.6rem 1.3rem;font-size:.9rem}

/* HERO */
.hero{padding:clamp(2rem,5vw,4.5rem) 0 0;position:relative}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(1.2rem,3.5vw,3rem);align-items:center}
.hero .sub{font-size:clamp(1.05rem,1.7vw,1.3rem);color:var(--cinza);margin:1.3rem 0 2rem;max-width:32rem}
.hero-acoes{display:flex;gap:.9rem;flex-wrap:wrap;align-items:center}
.colagem{position:relative;min-height:clamp(340px,42vw,560px)}
.colagem .foto{position:absolute;object-fit:cover;box-shadow:0 24px 60px -20px rgba(10,10,10,.35);will-change:transform}
.colagem .f1{width:72%;height:78%;right:0;top:0;border-radius:54% 46% 48% 52%/48% 42% 58% 52%}
.colagem .f2{width:46%;height:52%;left:0;bottom:0;border-radius:46% 54% 55% 45%/55% 48% 52% 45%;border:6px solid var(--branco)}
.colagem .blob{position:absolute;width:58%;height:58%;left:8%;top:-6%;background:var(--verde);opacity:.16;border-radius:60% 40% 55% 45%/45% 60% 40% 55%;filter:blur(4px);animation:blobmove 14s ease-in-out infinite alternate}
@keyframes blobmove{to{border-radius:44% 56% 42% 58%/58% 44% 56% 42%;transform:translate(4%,6%) scale(1.08)}}
/* selo circular giratório */
.selo{position:absolute;left:-1.5rem;bottom:16%;width:clamp(110px,12vw,150px);height:clamp(110px,12vw,150px);z-index:3}
.selo svg{width:100%;height:100%;animation:gira 16s linear infinite}
.selo text{font-family:var(--f-display);font-weight:600;font-size:6px;letter-spacing:.12em;fill:var(--preto)}
.selo .selo-miolo{position:absolute;inset:0;display:flex;align-items:center;justify-content:center}
.selo .selo-miolo img{width:44%}
@keyframes gira{to{transform:rotate(360deg)}}

/* Marquee */
.marquee{background:var(--preto);color:#fff;overflow:hidden;padding:1rem 0;margin-top:clamp(2.5rem,5vw,4rem)}
.marquee-track{display:flex;gap:3rem;width:max-content;animation:mar 22s linear infinite;font-family:var(--f-display);font-weight:600;font-size:1rem;letter-spacing:.08em;text-transform:uppercase;white-space:nowrap}
.marquee-track span{display:flex;align-items:center;gap:3rem}
.marquee .pata{color:var(--verde)}
@keyframes mar{to{transform:translateX(-50%)}}

/* Curvas entre seções */
.curva{display:block;width:100%;height:70px;margin-bottom:-1px}
.curva.sob{transform:scaleY(-1);margin-bottom:0;margin-top:-1px}

/* Seções */
.secao{padding:clamp(3rem,6.5vw,5.5rem) 0}
.escuro{background:var(--preto);color:#F4F4EF;position:relative}
.escuro::before{content:"";position:absolute;inset:0;opacity:.05;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='.85' numOctaves='2'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)'/%3E%3C/svg%3E")}
.escuro h2 .destaque::after{background:var(--verde)}
.escuro .cinzatx{color:#B9BDB0}
.gelo{background:var(--gelo)}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.6rem,4vw,3.4rem);align-items:center}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem}
.cinzatx{color:var(--cinza)}

/* Etiqueta */
.tag{display:inline-flex;align-items:center;gap:.5rem;font-weight:700;font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;background:var(--gelo);border-radius:999px;padding:.45rem 1.1rem;margin-bottom:1.2rem}
.tag::before{content:"🐾";font-size:.85rem}
.escuro .tag{background:#1C1C18;color:var(--verde-claro)}

/* Fotos orgânicas */
.foto-org{border-radius:var(--r-xl);object-fit:cover;width:100%;box-shadow:0 24px 50px -22px rgba(10,10,10,.4)}
.foto-blob{border-radius:52% 48% 45% 55%/48% 52% 48% 52%}

/* Cards */
.card{background:var(--branco);border-radius:var(--r-xl);padding:2rem 1.8rem;box-shadow:0 14px 40px -18px rgba(10,10,10,.18);transition:box-shadow .25s;will-change:transform;transform-style:preserve-3d}
.card:hover{box-shadow:0 26px 60px -20px rgba(112,178,38,.45)}
.card .num{font-family:var(--f-display);font-weight:800;font-size:1rem;color:var(--branco);background:var(--preto);width:2.6rem;height:2.6rem;border-radius:50%;display:flex;align-items:center;justify-content:center;margin-bottom:1rem}
.card:hover .num{background:var(--verde);color:var(--preto)}
.card h3{margin-bottom:.6rem}
.card-foto{margin:-2rem -1.8rem 1.3rem;overflow:hidden;border-radius:var(--r-xl) var(--r-xl) 0 0}
.card-foto img{aspect-ratio:4/3;object-fit:cover;width:100%;transition:transform .5s}
.card:hover .card-foto img{transform:scale(1.05)}
.escuro .card{background:#141410;color:#F4F4EF}

/* Números animados */
.numeros{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;text-align:center}
.numeros .n{font-family:var(--f-display);font-weight:800;font-size:clamp(2.4rem,5vw,3.8rem);color:var(--verde)}
.numeros .l{font-weight:600;letter-spacing:.04em}

/* Resposta AIO */
.resposta{background:var(--gelo);border-radius:var(--r-xl);padding:1.6rem 1.9rem;font-size:1.08rem;margin:1.5rem 0;border-left:8px solid var(--verde)}
.escuro .resposta{background:#141410}

/* Listas */
.check{list-style:none;margin:1.2rem 0}
.check li{padding-left:2.2rem;position:relative;margin-bottom:.75rem}
.check li::before{content:"✓";position:absolute;left:0;top:.05rem;width:1.45rem;height:1.45rem;background:var(--verde);color:var(--preto);border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:.85rem}

/* FAQ */
.faq-item{border-radius:var(--r-md);background:var(--gelo);margin-bottom:.9rem;overflow:hidden;transition:background .2s}
.faq-item[open]{background:var(--branco);box-shadow:0 14px 34px -18px rgba(10,10,10,.25)}
.faq-item summary{cursor:pointer;padding:1.2rem 1.5rem;font-weight:700;font-family:var(--f-display);font-size:1rem;list-style:none;display:flex;justify-content:space-between;gap:1rem;align-items:center}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{content:"+";font-family:var(--f-corpo);font-size:1.6rem;color:var(--verde);flex-shrink:0;transition:transform .25s}
.faq-item[open] summary::after{transform:rotate(45deg)}
.faq-item .faq-corpo{padding:0 1.5rem 1.3rem}

/* Galeria */
.galeria{display:grid;grid-template-columns:repeat(3,1fr);gap:1.1rem}
.galeria figure{overflow:hidden;border-radius:var(--r-md)}
.galeria img{aspect-ratio:1/1;object-fit:cover;width:100%;transition:transform .5s}
.galeria figure:hover img{transform:scale(1.06)}
.legenda{font-size:.85rem;color:var(--cinza);margin-top:.45rem}

/* Credenciais */
.cred{display:grid;grid-template-columns:1fr 1fr;gap:.9rem;margin-top:1.4rem;list-style:none}
.cred li{background:#141410;border-radius:var(--r-md);padding:1rem 1.2rem;font-size:.95rem;color:#DDE2D2}
.cred li strong{display:block;font-family:var(--f-display);font-weight:600;color:#fff;font-size:.92rem;margin-bottom:.15rem}

/* CTA final */
.cta-final{text-align:center}
.cta-final h2{max-width:40rem;margin:0 auto 1rem}

/* Rodapé */
.rodape{background:var(--preto);color:#E9EAE2;padding:0 0 2rem;font-size:.95rem}
.rodape a{color:var(--verde-claro);text-decoration:none}
.rodape a:hover{text-decoration:underline}
.rodape-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:2rem;margin:2.5rem 0 2rem}
.rodape .marca{color:#fff}
.rodape-baixo{border-top:1px solid #23231E;padding-top:1.3rem;display:flex;justify-content:space-between;flex-wrap:wrap;gap:.6rem;font-size:.85rem;color:#8b8f80}
.rodape .sociais{display:flex;gap:.7rem;margin-top:1rem}
.rodape .icone-social{background:#1C1C18}
.rodape .icone-social:hover{background:var(--verde)}

/* WhatsApp oficial flutuante */
.zap{position:fixed;right:1.3rem;bottom:1.3rem;z-index:85;width:62px;height:62px;border-radius:50%;background:#25D366;display:flex;align-items:center;justify-content:center;box-shadow:0 10px 26px -6px rgba(37,211,102,.7);transition:transform .18s}
.zap:hover{transform:scale(1.1)}
.zap svg{width:34px;height:34px;fill:#fff}

/* Ajuste mobile: botão WhatsApp menor e afastado da borda/gestos do celular */
@media(max-width:920px){
  .zap{width:52px;height:52px;right:.8rem;bottom:calc(1rem + env(safe-area-inset-bottom, 0px));}
  .zap svg{width:26px;height:26px;}
}

/* Reveal */
.rev{opacity:0;transform:translateY(28px);transition:opacity .7s ease,transform .7s ease}
.rev.on{opacity:1;transform:none}

.migalha{font-size:.85rem;padding:1.1rem 0 0;color:var(--cinza)}
.migalha a{text-decoration:none}

@media(max-width:920px){
  .hero-grid,.grid-2{grid-template-columns:1fr}
  .grid-3,.numeros{grid-template-columns:1fr}
  .numeros{gap:2rem}
  .rodape-grid{grid-template-columns:1fr}
  .cred{grid-template-columns:1fr}
  .galeria{grid-template-columns:repeat(2,1fr)}
  .colagem{min-height:74vw}
  .selo{left:auto;right:-.4rem;bottom:-1.2rem}
  .nav{position:fixed;inset:64px 0 auto 0;background:var(--branco);flex-direction:column;padding:1.6rem;box-shadow:0 18px 30px -18px rgba(0,0,0,.3);display:none;z-index:79}
  .nav.aberto{display:flex}
  .menu-btn{display:block}
  .topo-acoes .icone-social{display:none}
 .topo-acoes .btn-nav{display:none}
}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .rev{opacity:1;transform:none;transition:none}
  .marquee-track,.selo svg,.colagem .blob{animation:none}
  .btn,.card,.zap,.card-foto img,.galeria img{transition:none}
}

/* ===== Ajustes pós-revisão ===== */
/* Correção de leitura: título destacado em seção escura (texto branco sobre verde era ruim) */
.escuro .destaque{color:var(--verde-claro)}
.escuro .destaque::after{content:none}

/* Selo não invade a coluna de texto em larguras médias */
@media(max-width:1150px){.selo{left:0;bottom:8%}}

/* Botões sociais personalizados por plataforma */
.icone-social[aria-label*="Instagram"]{background:radial-gradient(circle at 30% 110%,#FDF497 0%,#FD5949 45%,#D6249F 60%,#285AEB 90%)}
.icone-social[aria-label*="Facebook"]{background:#1877F2}
.icone-social[aria-label*="WhatsApp"]{background:#25D366}
.icone-social[aria-label*="Instagram"]:hover,.icone-social[aria-label*="Facebook"]:hover,.icone-social[aria-label*="WhatsApp"]:hover{filter:brightness(1.12);background-image:radial-gradient(circle at 30% 110%,#FDF497 0%,#FD5949 45%,#D6249F 60%,#285AEB 90%)}
.icone-social[aria-label*="Facebook"]:hover{background:#1877F2;background-image:none}
.icone-social[aria-label*="WhatsApp"]:hover{background:#25D366;background-image:none}

/* ===== Blog / artigos ===== */
.artigo{max-width:46rem;margin:0 auto}
.artigo h2{margin:2.4rem 0 .9rem;font-size:clamp(1.35rem,2.4vw,1.8rem)}
.artigo ul,.artigo ol{margin:1rem 0 1rem 1.4rem}
.artigo li{margin-bottom:.5rem}
.artigo .meta{color:var(--cinza);font-size:.9rem;margin:.8rem 0 1.6rem;display:flex;gap:1rem;flex-wrap:wrap}
.artigo img.capa{border-radius:var(--r-xl);margin:1.4rem 0;box-shadow:0 20px 44px -20px rgba(10,10,10,.35)}
.autor-box{display:flex;gap:1.2rem;align-items:center;background:var(--gelo);border-radius:var(--r-xl);padding:1.4rem 1.6rem;margin:2.6rem 0 0}
.autor-box img{width:84px;height:84px;border-radius:50%;object-fit:cover;flex-shrink:0}
.autor-box strong{font-family:var(--f-display);font-weight:600}
.post-card .cat{font-size:.75rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--verde);margin-bottom:.4rem;display:block}
.post-card p{font-size:.98rem}
.post-card a.leia{font-weight:700;text-decoration:none;color:var(--preto)}
.post-card a.leia:hover{color:var(--verde)}