/* ============================================================
   AdestDog · Landing de conversão · 2026
   Clean · foco em WhatsApp
   ============================================================ */

@font-face { font-family:"Anton"; src:url("fonts/Anton-Regular.ttf") format("truetype"); font-weight:400; font-display:swap; }
@font-face { font-family:"Gabarito"; src:url("fonts/Gabarito-Regular.ttf") format("truetype"); font-weight:400; font-display:swap; }
@font-face { font-family:"Gabarito"; src:url("fonts/Gabarito-Bold.ttf") format("truetype"); font-weight:700; font-display:swap; }

:root{
  --azul-escuro:#104073;
  --azul:#1f75ff;
  --amarelo:#ffcd22;
  --ciano:#4dece2;
  --branco:#f7f6f4;
  --papel:#fbfcfe;
  --linha:#e8ecf3;
  --texto:#333a44;
  --texto-suave:#707986;
  --wa:#25d366;
  --font-display:"Anton","Arial Narrow",sans-serif;
  --font-body:"Gabarito",system-ui,-apple-system,sans-serif;
  --wrap:1140px;
  --r:20px;
  --shadow:0 12px 40px -18px rgba(16,64,115,.24);
  --shadow-lg:0 30px 70px -32px rgba(16,64,115,.4);
  --ease:cubic-bezier(.22,.61,.36,1);
}
*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body{ font-family:var(--font-body); color:var(--texto); background:#fff; line-height:1.65; overflow-x:hidden; -webkit-font-smoothing:antialiased; }
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
ul{ list-style:none; }
.wrap{ width:min(100% - 40px,var(--wrap)); margin-inline:auto; }

.eyebrow{ font-family:var(--font-body); font-weight:700; text-transform:uppercase; letter-spacing:.16em; font-size:.74rem; color:var(--azul); display:inline-block; }
.h2{ font-family:var(--font-display); text-transform:uppercase; font-size:clamp(2rem,4.2vw,3.2rem); line-height:1.02; color:var(--azul-escuro); letter-spacing:.01em; }
.hl{ color:var(--azul); }
.hl-amar{ position:relative; white-space:nowrap; }
.hl-amar::after{ content:""; position:absolute; left:0; right:0; bottom:-.12em; height:.16em; background:var(--amarelo); border-radius:4px; }

/* Botões */
.btn{ display:inline-flex; align-items:center; justify-content:center; gap:10px; cursor:pointer; font-family:var(--font-body); font-weight:700; font-size:1rem; padding:15px 28px; border-radius:999px; border:2px solid transparent; line-height:1; transition:transform .2s var(--ease), box-shadow .2s var(--ease), background .2s var(--ease), color .2s var(--ease); }
.btn svg{ flex:0 0 auto; }
.btn--wa{ background:var(--wa); color:#fff; box-shadow:0 10px 26px -10px rgba(37,211,102,.75); }
.btn--wa:hover{ background:#20bd5a; transform:translateY(-2px); box-shadow:0 16px 32px -12px rgba(37,211,102,.8); }
.btn--yellow{ background:var(--amarelo); color:var(--azul-escuro); box-shadow:0 10px 26px -10px rgba(255,205,34,.8); }
.btn--yellow:hover{ transform:translateY(-2px); }
.btn--ghost{ background:transparent; color:var(--azul-escuro); border-color:var(--linha); }
.btn--ghost:hover{ border-color:var(--azul); color:var(--azul); }
.btn--ghost-w{ background:rgba(255,255,255,.1); color:#fff; border-color:rgba(255,255,255,.55); backdrop-filter:blur(4px); }
.btn--ghost-w:hover{ background:#fff; color:var(--azul-escuro); border-color:#fff; }
.btn--lg{ padding:18px 36px; font-size:1.08rem; }

/* ============================================================
   NAV
   ============================================================ */
.nav{ position:sticky; top:0; z-index:60; background:rgba(255,255,255,.9); backdrop-filter:blur(12px); border-bottom:1px solid var(--linha); }
.nav__inner{ display:flex; align-items:center; justify-content:space-between; gap:24px; padding:8px 0; }
.nav__logo img{ height:110px; width:auto; }
.nav__menu{ display:flex; gap:30px; align-items:center; }
.nav__link{ color:var(--azul-escuro); font-weight:600; font-size:.95rem; position:relative; padding:4px 0; transition:color .2s var(--ease); }
.nav__link::after{ content:""; position:absolute; left:0; bottom:-3px; width:0; height:2px; background:var(--azul); border-radius:2px; transition:width .25s var(--ease); }
.nav__link:hover{ color:var(--azul); } .nav__link:hover::after{ width:100%; }
.nav__cta{ display:inline-flex; align-items:center; gap:8px; background:var(--wa); color:#fff; font-weight:700; font-size:.92rem; padding:11px 20px; border-radius:999px; box-shadow:0 8px 18px -8px rgba(37,211,102,.7); transition:transform .2s var(--ease), background .2s var(--ease); }
.nav__cta:hover{ background:#20bd5a; transform:translateY(-2px); }
.nav__burger{ display:none; background:none; border:0; cursor:pointer; width:44px; height:44px; position:relative; }
.nav__burger span{ position:absolute; left:10px; right:10px; height:2.5px; background:var(--azul-escuro); border-radius:3px; transition:transform .3s var(--ease), opacity .2s var(--ease); }
.nav__burger span:nth-child(1){ top:15px; } .nav__burger span:nth-child(2){ top:21px; } .nav__burger span:nth-child(3){ top:27px; }
.nav.open .nav__burger span:nth-child(1){ transform:translateY(6px) rotate(45deg); }
.nav.open .nav__burger span:nth-child(2){ opacity:0; }
.nav.open .nav__burger span:nth-child(3){ transform:translateY(-6px) rotate(-45deg); }

/* ============================================================
   HERO — clean, promessa + WhatsApp direto
   ============================================================ */
.hero{ position:relative; overflow:hidden; background:linear-gradient(180deg,#f4f8fe,#eaf1fb); }
.hero__grid{ display:grid; grid-template-columns:1.02fr .98fr; gap:52px; align-items:center; padding:72px 0 84px; }
.hero__tag{ display:inline-flex; align-items:center; gap:9px; background:#fff; border:1px solid var(--linha); color:var(--azul-escuro); font-weight:600; font-size:.82rem; padding:8px 16px; border-radius:999px; margin-bottom:24px; box-shadow:var(--shadow); }
.hero__tag .d{ width:8px; height:8px; border-radius:50%; background:var(--wa); }
.hero h1{ font-family:var(--font-display); text-transform:uppercase; line-height:.98; font-size:clamp(2.7rem,5.6vw,4.4rem); color:var(--azul-escuro); letter-spacing:.01em; margin-bottom:20px; }
.hero__sub{ font-size:clamp(1.06rem,1.4vw,1.2rem); color:var(--texto-suave); max-width:40ch; margin-bottom:30px; }
.hero__ctas{ display:flex; flex-wrap:wrap; gap:14px; align-items:center; }
.hero__ctas .mini{ font-size:.9rem; color:var(--texto-suave); }
.hero__media{ position:relative; }
.hero__media img{ width:100%; aspect-ratio:4/4.6; object-fit:cover; object-position:center 18%; border-radius:26px; box-shadow:var(--shadow-lg); }
.hero__badge{ position:absolute; left:-20px; bottom:30px; background:#fff; border-radius:16px; padding:14px 18px; box-shadow:var(--shadow-lg); display:flex; align-items:center; gap:12px; }
.hero__badge .ic{ width:44px; height:44px; border-radius:12px; background:var(--amarelo); display:grid; place-items:center; }
.hero__badge b{ display:block; color:var(--azul-escuro); font-size:1rem; line-height:1.2; }
.hero__badge span{ font-size:.8rem; color:var(--texto-suave); }

/* faixa de confiança */
.trust{ background:var(--azul-escuro); color:#fff; }
.trust__row{ display:flex; flex-wrap:wrap; justify-content:center; gap:14px 40px; padding:20px 0; text-align:center; }
.trust__row span{ font-weight:600; font-size:.98rem; color:#dbe6f5; display:inline-flex; align-items:center; gap:9px; }
.trust__row b{ color:var(--amarelo); }

/* ============================================================
   Seções base
   ============================================================ */
.section{ padding:90px 0; position:relative; }
.section--paper{ background:var(--papel); }
.section--white{ background:#fff; }
.section--navy{ background:var(--azul-escuro); color:#fff; }
.sec-head{ max-width:640px; margin-bottom:52px; }
.sec-head.center{ margin-inline:auto; text-align:center; }
.sec-head .eyebrow{ margin-bottom:12px; }
.sec-head p{ margin-top:16px; font-size:1.08rem; color:var(--texto-suave); }
.sec-head.center p{ margin-inline:auto; max-width:56ch; }
.section--navy .sec-head p{ color:#cdd9ea; }
.section--navy .h2{ color:#fff; }

/* ============================================================
   DOR — "para o seu cão que..." (venda)
   ============================================================ */
.pain{ display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:center; }
.pain__media img{ width:100%; aspect-ratio:4/5; object-fit:cover; object-position:center 50%; border-radius:24px; box-shadow:var(--shadow-lg); }
.pain__list{ display:grid; gap:12px; margin:26px 0 30px; }
.pain__list li{ display:flex; align-items:center; gap:12px; font-size:1.05rem; color:var(--texto); font-weight:500; }
.pain__list .ck{ flex:0 0 auto; width:26px; height:26px; border-radius:50%; background:rgba(31,117,255,.12); color:var(--azul); display:grid; place-items:center; font-size:.72rem; font-weight:800; }

/* ============================================================
   SERVIÇOS — cards numerados com CTA em cada (estilo ref)
   ============================================================ */
.svcs{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.svc{ background:#fff; border:1px solid var(--linha); border-radius:var(--r); overflow:hidden; display:flex; flex-direction:column; transition:transform .25s var(--ease), box-shadow .25s var(--ease); }
.svc:hover{ transform:translateY(-6px); box-shadow:var(--shadow-lg); }
.svc__img{ position:relative; aspect-ratio:16/10; overflow:hidden; }
.svc__img img{ width:100%; height:100%; object-fit:cover; object-position:center 42%; transition:transform .5s var(--ease); }
.svc:hover .svc__img img{ transform:scale(1.05); }
.svc__num{ position:absolute; top:14px; left:14px; background:var(--azul-escuro); color:#fff; font-family:var(--font-display); font-size:.95rem; padding:5px 12px; border-radius:999px; letter-spacing:.05em; }
.svc__num.amar{ background:var(--amarelo); color:var(--azul-escuro); }
.svc__body{ padding:26px 24px 24px; display:flex; flex-direction:column; flex:1; }
.svc__body h3{ font-family:var(--font-display); text-transform:uppercase; font-size:1.35rem; color:var(--azul-escuro); line-height:1.05; margin-bottom:10px; }
.svc__body p{ font-size:.98rem; color:var(--texto-suave); margin-bottom:16px; flex:1; }
.svc__tags{ display:flex; flex-wrap:wrap; gap:7px; margin-bottom:20px; }
.svc__tags span{ font-size:.78rem; font-weight:600; color:var(--azul-escuro); background:var(--papel); border:1px solid var(--linha); padding:5px 11px; border-radius:999px; }
.svc__cta{ display:inline-flex; align-items:center; justify-content:center; gap:8px; font-weight:700; color:#fff; background:var(--wa); padding:12px 18px; border-radius:12px; font-size:.95rem; transition:background .2s var(--ease), transform .2s var(--ease); }
.svc__cta:hover{ background:#20bd5a; transform:translateY(-2px); }

/* ============================================================
   INCLUSO — grid de ícones (estilo ref)
   ============================================================ */
.incl{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.incl__item{ background:#fff; border:1px solid var(--linha); border-radius:16px; padding:26px 24px; transition:transform .2s var(--ease), box-shadow .2s var(--ease); }
.incl__item:hover{ transform:translateY(-4px); box-shadow:var(--shadow); }
.incl__ic{ width:54px; height:54px; border-radius:14px; background:rgba(31,117,255,.1); display:grid; place-items:center; margin-bottom:16px; }
.incl__ic svg{ width:26px; height:26px; stroke:var(--azul); fill:none; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.incl__item:nth-child(2) .incl__ic{ background:rgba(255,205,34,.22); } .incl__item:nth-child(2) .incl__ic svg{ stroke:#c99700; }
.incl__item:nth-child(3) .incl__ic{ background:rgba(77,236,226,.28); } .incl__item:nth-child(3) .incl__ic svg{ stroke:#159c93; }
.incl__item:nth-child(4) .incl__ic{ background:rgba(16,64,115,.1); } .incl__item:nth-child(4) .incl__ic svg{ stroke:var(--azul-escuro); }
.incl__item:nth-child(5) .incl__ic{ background:rgba(255,205,34,.22); } .incl__item:nth-child(5) .incl__ic svg{ stroke:#c99700; }
.incl__item:nth-child(6) .incl__ic{ background:rgba(77,236,226,.28); } .incl__item:nth-child(6) .incl__ic svg{ stroke:#159c93; }
.incl__item h4{ font-family:var(--font-display); text-transform:uppercase; font-size:1.1rem; color:var(--azul-escuro); margin-bottom:6px; letter-spacing:.01em; }
.incl__item p{ font-size:.94rem; color:var(--texto-suave); }

/* ============================================================
   PROCESSO — passos numerados (estilo ref)
   ============================================================ */
.steps{ display:grid; grid-template-columns:repeat(4,1fr); gap:24px; counter-reset:step; }
.step{ position:relative; padding-top:16px; }
.step__n{ width:52px; height:52px; border-radius:50%; background:var(--azul); color:#fff; font-family:var(--font-display); font-size:1.5rem; display:grid; place-items:center; margin-bottom:18px; box-shadow:0 8px 20px -8px rgba(31,117,255,.6); }
.step:nth-child(2) .step__n{ background:var(--amarelo); color:var(--azul-escuro); box-shadow:0 8px 20px -8px rgba(255,205,34,.7); }
.step:nth-child(3) .step__n{ background:var(--ciano); color:var(--azul-escuro); }
.step:nth-child(4) .step__n{ background:var(--azul-escuro); }
.step h4{ font-family:var(--font-display); text-transform:uppercase; font-size:1.15rem; color:var(--azul-escuro); margin-bottom:8px; line-height:1.1; }
.step p{ font-size:.96rem; color:var(--texto-suave); }
.section--navy .step h4{ color:#fff; } .section--navy .step p{ color:#cdd9ea; }

/* ============================================================
   DEPOIMENTOS — nota Google + cards (estilo ref)
   ============================================================ */
.rating{ display:flex; flex-direction:column; align-items:center; gap:4px; margin-bottom:44px; }
.rating__num{ font-family:var(--font-display); font-size:3.4rem; color:var(--azul-escuro); line-height:1; }
.rating__stars{ color:var(--amarelo); font-size:1.4rem; letter-spacing:3px; }
.rating__label{ font-size:.95rem; color:var(--texto-suave); }
.reviews{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.review{ background:#fff; border:1px solid var(--linha); border-radius:var(--r); padding:26px 24px; display:flex; flex-direction:column; gap:14px; transition:transform .25s var(--ease), box-shadow .25s var(--ease); }
.review:hover{ transform:translateY(-4px); box-shadow:var(--shadow); }
.review__stars{ color:var(--amarelo); font-size:1rem; letter-spacing:2px; }
.review p{ font-size:.98rem; color:var(--texto); flex:1; }
.review__who{ display:flex; align-items:center; gap:12px; }
.review__av{ width:42px; height:42px; border-radius:50%; background:var(--azul); color:#fff; display:grid; place-items:center; font-family:var(--font-display); font-size:1.05rem; }
.review__who b{ color:var(--azul-escuro); font-size:.95rem; display:block; line-height:1.2; }
.review__who span{ font-size:.8rem; color:var(--texto-suave); }

/* ============================================================
   CTA BANNER — meio da página, foco WhatsApp
   ============================================================ */
.cta-mid{ position:relative; overflow:hidden; }
.cta-mid__bg{ position:absolute; inset:0; z-index:0; }
.cta-mid__bg img{ width:100%; height:100%; object-fit:cover; object-position:center 35%; }
.cta-mid__bg::after{ content:""; position:absolute; inset:0; background:linear-gradient(120deg,rgba(16,64,115,.95),rgba(31,117,255,.85)); }
.cta-mid__inner{ position:relative; z-index:2; text-align:center; color:#fff; padding:88px 0; }
.cta-mid__inner h2{ font-family:var(--font-display); text-transform:uppercase; font-size:clamp(2rem,4.4vw,3.4rem); line-height:1.02; margin-bottom:16px; }
.cta-mid__inner p{ font-size:1.1rem; color:#eaf2ff; max-width:46ch; margin:0 auto 28px; }

/* ============================================================
   LOCALIZAÇÃO / CONTATO
   ============================================================ */
.local{ display:grid; grid-template-columns:.92fr 1.08fr; gap:40px; align-items:stretch; }
.local__card{ background:#fff; border:1px solid var(--linha); border-radius:24px; padding:34px 32px; box-shadow:var(--shadow); }
.local__card h3{ font-family:var(--font-display); text-transform:uppercase; font-size:1.5rem; color:var(--azul-escuro); margin-bottom:22px; }
.local__list li{ display:flex; align-items:flex-start; gap:14px; padding:15px 0; border-bottom:1px solid var(--linha); }
.local__list li:last-child{ border-bottom:0; }
.local__ic{ flex:0 0 auto; width:44px; height:44px; border-radius:12px; background:rgba(31,117,255,.1); color:var(--azul); display:grid; place-items:center; }
.local__ic svg{ width:20px; height:20px; fill:currentColor; }
.local__list b{ display:block; color:var(--azul-escuro); font-size:.76rem; text-transform:uppercase; letter-spacing:.07em; }
.local__list a,.local__list span{ color:var(--texto); font-size:1.02rem; }
.local__list a:hover{ color:var(--azul); }
.local__hours{ margin-top:20px; background:var(--papel); border:1px solid var(--linha); border-radius:14px; padding:18px 20px; }
.local__hours b{ display:block; font-family:var(--font-display); text-transform:uppercase; color:var(--azul-escuro); margin-bottom:8px; }
.local__hours .row{ display:flex; justify-content:space-between; font-size:.92rem; padding:3px 0; color:var(--texto-suave); }
.local__wa{ margin-top:20px; width:100%; }
.local__map{ border-radius:24px; overflow:hidden; box-shadow:var(--shadow); min-height:480px; border:1px solid var(--linha); }
.local__map iframe{ width:100%; height:100%; min-height:480px; border:0; display:block; }

/* ============================================================
   CTA FINAL
   ============================================================ */
.final{ background:linear-gradient(180deg,#eaf1fb,#f4f8fe); text-align:center; }
.final__inner{ padding:88px 0; }
.final h2{ font-family:var(--font-display); text-transform:uppercase; font-size:clamp(2rem,4.4vw,3.2rem); color:var(--azul-escuro); line-height:1.02; margin-bottom:14px; }
.final p{ font-size:1.1rem; color:var(--texto-suave); max-width:48ch; margin:0 auto 28px; }

/* ============================================================
   FOOTER
   ============================================================ */
.footer{ background:var(--azul-escuro); color:#fff; padding:56px 0 28px; }
.footer__grid{ display:grid; grid-template-columns:1.5fr 1fr 1fr; gap:40px; padding-bottom:36px; border-bottom:1px solid rgba(255,255,255,.14); }
.footer__logo{ display:inline-block; background:#fff; padding:16px 22px; border-radius:18px; margin-bottom:20px; box-shadow:0 10px 30px -14px rgba(0,0,0,.4); }
.footer__logo img{ height:120px; width:auto; display:block; }
.footer__grid p{ color:#c7d5e8; font-size:.96rem; max-width:34ch; }
.footer h4{ font-family:var(--font-display); text-transform:uppercase; color:var(--amarelo); margin-bottom:15px; font-size:1.05rem; letter-spacing:.02em; }
.footer__links li{ margin-bottom:10px; }
.footer__links a,.footer__links span{ color:#c7d5e8; font-size:.95rem; }
.footer__links a:hover{ color:var(--amarelo); }
.footer__social{ display:flex; gap:10px; margin-top:16px; }
.footer__social a{ width:42px; height:42px; border-radius:12px; background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.16); display:grid; place-items:center; transition:background .2s var(--ease), transform .2s var(--ease); }
.footer__social a:hover{ background:var(--amarelo); border-color:var(--amarelo); transform:translateY(-3px); }
.footer__social svg{ width:19px; height:19px; fill:#fff; }
.footer__social a:hover svg{ fill:var(--azul-escuro); }
.footer__bottom{ padding-top:22px; display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px; font-size:.84rem; color:#8ea6c4; }

/* WhatsApp flutuante */
.wa-float{ position:fixed; right:22px; bottom:22px; z-index:80; display:inline-flex; align-items:center; gap:10px; background:var(--wa); color:#fff; font-weight:700; font-size:.95rem; padding:14px 22px 14px 18px; border-radius:999px; box-shadow:0 14px 34px -10px rgba(37,211,102,.7); transition:transform .25s var(--ease); animation:pulse 2.6s infinite; }
.wa-float:hover{ transform:translateY(-3px) scale(1.03); }
.wa-float svg{ width:26px; height:26px; fill:#fff; flex:0 0 auto; }
@keyframes pulse{ 0%{ box-shadow:0 0 0 0 rgba(37,211,102,.5); } 70%{ box-shadow:0 0 0 16px rgba(37,211,102,0); } 100%{ box-shadow:0 0 0 0 rgba(37,211,102,0); } }
@media (max-width:520px){ .wa-float span{ display:none; } .wa-float{ padding:16px; border-radius:50%; } }

.reveal{ opacity:0; transform:translateY(22px); transition:opacity .7s var(--ease), transform .7s var(--ease); }
.reveal.in{ opacity:1; transform:none; }

/* ============================================================
   Responsivo
   ============================================================ */
@media (max-width:940px){
  .hero__grid{ grid-template-columns:1fr; gap:44px; padding:52px 0 68px; }
  .hero__media{ max-width:460px; }
  .pain{ grid-template-columns:1fr; gap:40px; }
  .pain__media{ max-width:500px; order:-1; }
  .svcs{ grid-template-columns:repeat(2,1fr); }
  .incl{ grid-template-columns:repeat(2,1fr); }
  .steps{ grid-template-columns:repeat(2,1fr); }
  .reviews{ grid-template-columns:1fr; max-width:520px; margin-inline:auto; }
  .local{ grid-template-columns:1fr; }
  .footer__grid{ grid-template-columns:1fr 1fr; }
  .footer__brand{ grid-column:1 / -1; }
}
@media (max-width:640px){
  .nav__menu{ position:fixed; inset:110px 0 auto 0; flex-direction:column; align-items:stretch; background:#fff; padding:16px 24px 24px; gap:2px; transform:translateY(-200%); transition:transform .35s var(--ease); box-shadow:0 24px 40px -24px rgba(0,0,0,.3); border-bottom:1px solid var(--linha); }
  .nav.open .nav__menu{ transform:translateY(0); }
  .nav__link{ padding:13px 0; border-bottom:1px solid var(--linha); }
  .nav__cta{ margin-top:12px; }
  .nav__burger{ display:block; }
  .svcs,.incl,.steps{ grid-template-columns:1fr; }
  .section{ padding:64px 0; }
  .trust__row{ gap:10px 24px; }
}
@media (prefers-reduced-motion:reduce){ *,*::before,*::after{ animation:none!important; transition:none!important; } html{ scroll-behavior:auto; } .reveal{ opacity:1; transform:none; } }