/*
Theme Name: Visualiza Digital
Theme URI: https://visualizadigital.com.br
Author: Visualiza Digital
Description: Tema da landing page da Visualiza Digital — agência de tráfego pago e Google Ads em Goiânia.
Version: 1.0.0
License: Proprietary
Text Domain: visualiza-digital
*/

:root {
  --background: oklch(0.984 0.003 106);
  --foreground: oklch(0.218 0 0);
  --card: oklch(1 0 0);
  --secondary: oklch(0.968 0.003 106);
  --muted-foreground: oklch(0.63 0 0);
  --border: oklch(0.946 0 0);
  --brand: oklch(0.625 0.256 29);
  --whatsapp: oklch(0.761 0.201 150);
  --hero-blue: oklch(0.467 0.176 260);
  --glass: oklch(1 0 0 / 92%);
}
* { box-sizing: border-box; border-color: var(--border); }
html { scroll-behavior: smooth; scroll-padding-top: 112px; }
body { margin: 0; background: var(--background); color: var(--foreground); font-family: 'Plus Jakarta Sans', sans-serif; font-size: 15px; line-height: 1.65; }
h1,h2,h3,p,ul { margin: 0; padding: 0; }
h1,h2 { font-weight: 500; line-height: 1.13; }
ul { list-style: none; }
a { text-decoration: none; color: inherit; }
img { max-width: 100%; }
button,a { -webkit-tap-highlight-color: transparent; }

.site-header { position: sticky; top: 0; z-index: 30; background: var(--glass); backdrop-filter: blur(16px); border-bottom: 1px solid var(--border); }
.header-inner { max-width: 1440px; margin: auto; height: 96px; padding: 0 48px; display:flex; align-items:center; justify-content:space-between; gap:32px; }
.logo { width: 155px; height: 40px; object-fit:contain; }
.logo-wrap { display:flex; align-items:center; gap:10px; }
.logo-wrap small { border-left:1px solid var(--border); padding-left:10px; color:var(--muted-foreground); font-size:11px; }
.nav-links { display:flex; align-items:center; gap:30px; }
.nav-links a { font-size:12px; color:var(--muted-foreground); transition:color .2s; }
.nav-links a:hover { color:var(--foreground); }
.dot:before { content:''; display:inline-block; width:6px; height:6px; border-radius:50%; background:var(--brand); margin-right:8px; vertical-align:middle; }
.btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; border:0; cursor:pointer; font-family:inherit; }
.btn-pill { border-radius:999px; height:46px; padding:0 24px; font-size:12px; font-weight:500; background:var(--foreground); color:var(--card); }
.btn-circle { border-radius:50%; width:46px; height:46px; background:var(--foreground); color:var(--card); flex-shrink:0; }
.btn-circle svg { width:19px; height:19px; stroke-width:1.5; transition:transform .25s; }
.btn-circle:hover svg { transform:rotate(45deg); }
.btn-brand { background:var(--brand); color:var(--card); }
.btn-light { background:var(--card); color:var(--foreground); border:1px solid var(--border); }
.cta-pair { display:flex; gap:7px; align-items:center; }
.page-shell { max-width:1440px; margin:auto; padding:24px 32px 0; }
.hero-photo { position:relative; height:435px; border-radius:24px; overflow:hidden; background:var(--hero-blue); }
.hero-photo > img { position:absolute; top:0; left:50%; transform:translateX(-50%); height:100%; width:auto; max-width:none; }
.hero-social { position:absolute; left:26px; top:26px; display:flex; align-items:center; gap:17px; padding:12px 17px; background:var(--glass); backdrop-filter:blur(12px); border-radius:999px; font-size:11px; }
.hero-social svg { width:15px; height:15px; stroke-width:1.5; }
.diagnosis { position:absolute; top:26px; right:26px; width:290px; padding:17px; border-radius:16px; background:var(--glass); backdrop-filter:blur(12px); }
.diagnosis-top { display:flex; gap:12px; align-items:center; }
.diagnosis img { width:61px; height:66px; border-radius:9px; object-fit:cover; }
.diagnosis h3 { font-size:13px; font-weight:600; }
.diagnosis p { font-size:11px; color:var(--muted-foreground); margin-top:3px; line-height:1.5; }
.diagnosis-bottom { border-top:1px solid var(--border); padding-top:11px; margin-top:13px; display:flex; justify-content:space-between; align-items:center; font-size:10px; }
.hero-caption { display:grid; grid-template-columns: 1.65fr 1fr; align-items:end; gap:60px; padding:34px 16px 40px; }
.eyebrow { text-transform:uppercase; font-size:10px; font-weight:600; letter-spacing:1.5px; color:var(--muted-foreground); display:block; margin-bottom:18px; }
.hero-caption h1 { font-size:60px; }
.soft { color:var(--muted-foreground); }
.hero-caption p { max-width:330px; color:var(--muted-foreground); font-size:14px; margin-bottom:23px; }
.section { padding:115px 40px; border-top:1px solid var(--border); }
.section-heading { display:flex; justify-content:space-between; align-items:end; margin-bottom:40px; gap:30px; }
.section h2 { font-size:44px; }
.about { display:grid; grid-template-columns:1fr 1fr; gap:90px; align-items:center; }
.photo-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.photo-grid img { width:100%; height:190px; object-fit:cover; border-radius:20px; }
.photo-grid img:last-child { grid-column:span 2; height:220px; object-position:center 38%; }
.about-copy > p { color:var(--muted-foreground); max-width:420px; margin:26px 0; }
.service-icons { display:flex; gap:25px; margin-top:34px; }
.service-icon { display:flex; align-items:center; gap:9px; font-size:11px; }
.icon-ring { display:grid; place-items:center; border:1px solid var(--border); border-radius:50%; width:37px; height:37px; }
.icon-ring svg { width:17px; stroke-width:1.5; }
.service-section { display:grid; grid-template-columns:1fr 1.1fr; gap:70px; background:var(--card); border-radius:30px; border:1px solid var(--border); padding:65px 40px; }
.service-list { display:grid; gap:22px; }
.service-item h3 { font-size:19px; font-weight:500; margin-bottom:7px; }
.service-item p { color:var(--muted-foreground); font-size:13px; max-width:400px; }
.services-photos { display:grid; grid-template-columns:1.1fr 1fr; gap:13px; height:400px; }
.image-tile { position:relative; border-radius:20px; overflow:hidden; }
.image-tile img { width:100%; height:100%; object-fit:cover; transition:transform .5s; }
.image-tile:hover img { transform:scale(1.02); }
.image-tile:first-child { grid-row:span 2; }
.photo-chip { position:absolute; bottom:14px; left:14px; background:var(--glass); padding:8px 12px; border-radius:999px; font-size:9px; backdrop-filter:blur(10px); }
.more-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:23px; }
.feature-photo { height:275px; position:relative; overflow:hidden; border-radius:21px; margin-bottom:21px; }
.feature-photo img { width:100%; height:100%; object-fit:cover; }
.feature h3 { font-size:19px; font-weight:500; margin-bottom:9px; }
.feature p { font-size:13px; color:var(--muted-foreground); max-width:320px; }
.stats { padding:55px 40px; background:var(--secondary); border-radius:24px; display:grid; grid-template-columns:repeat(4,1fr); margin-bottom:110px; }
.stat { padding:0 28px; border-right:1px solid var(--border); }
.stat:first-child { padding-left:0; }
.stat:last-child { border:0; }
.stat strong { display:block; font-size:43px; font-weight:500; line-height:1.3; }
.stat span { font-size:11px; color:var(--muted-foreground); }
.cases { padding-top:0; border-top:0; }
.case-grid { display:grid; grid-template-columns:1fr 1fr; gap:24px; }
.case-grid img { width:100%; aspect-ratio:1.25; object-fit:cover; border-radius:22px; }
.case-caption { display:flex; justify-content:space-between; margin-top:15px; }
.case-caption h3 { font-size:16px; font-weight:500; }
.case-caption span { font-size:11px; color:var(--muted-foreground); }
.final-cta { text-align:center; border-radius:30px; background:var(--secondary); padding:80px 24px; margin:0 0 50px; }
.final-cta h2 { font-size:46px; max-width:650px; margin:0 auto 22px; }
.final-cta p { color:var(--muted-foreground); margin-bottom:27px; font-size:13px; }
.final-cta .cta-pair { justify-content:center; }
.footer { padding:40px 16px 25px; border-top:1px solid var(--border); }
.footer-top { display:flex; justify-content:space-between; align-items:center; }
.footer-columns { display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:40px; margin-top:36px; font-size:12px; }
.footer-title { font-size:11px; font-weight:600; text-transform:uppercase; letter-spacing:1.4px; color:var(--muted-foreground); margin-bottom:14px; }
.footer-columns ul { display:grid; gap:8px; }
.footer-nap { font-style:normal; display:grid; gap:6px; align-content:start; }
.footer-bottom { display:flex; justify-content:space-between; border-top:1px solid var(--border); margin-top:35px; padding-top:20px; color:var(--muted-foreground); font-size:10px; }
.whatsapp-float { position:fixed; right:24px; bottom:24px; z-index:50; display:flex; align-items:center; gap:11px; padding:9px 20px 9px 9px; border-radius:999px; background:var(--card); border:1px solid var(--border); box-shadow:0 12px 34px oklch(0.218 0 0 / 14%); }
.whatsapp-badge { display:grid; place-items:center; width:34px; height:34px; border-radius:50%; background:var(--whatsapp); color:#fff; flex-shrink:0; }
.whatsapp-badge svg { width:19px; height:19px; }
.whatsapp-copy { text-align:left; line-height:1.25; }
.whatsapp-copy strong { display:block; font-size:12px; font-weight:600; }
.whatsapp-copy small { display:block; font-size:10px; color:var(--muted-foreground); }
.faq-list { display:grid; grid-template-columns:1fr 1fr; gap:32px 44px; }
.faq-item { border-top:1px solid var(--border); padding-top:18px; }
.faq-item h3 { font-size:17px; font-weight:500; margin-bottom:9px; }
.faq-item p { font-size:13px; color:var(--muted-foreground); max-width:430px; }
@media(max-width:1050px) { .header-inner { padding:0 28px; gap:20px; } .nav-links { gap:20px; } .header-inner>.cta-pair { display:none; } .hero-caption h1 { font-size:49px; } .about { gap:40px; } .section { padding:85px 20px; } .service-section { gap:30px; } .section h2 { font-size:36px; } }
@media(max-width:700px) {
 .header-inner { height:76px; padding:0 22px; } .header-inner>.nav-links { display:none; } .logo { width:130px; height:34px; } .page-shell { padding:14px 14px 0; }
 .hero-photo { height:320px; border-radius:20px; } .hero-social { top:14px; left:14px; gap:12px; padding:9px 12px; } .diagnosis { display:none; }
 .hero-caption { grid-template-columns:1fr; gap:25px; padding:29px 7px 45px; } .hero-caption h1 { font-size:40px; }
 .section { padding:65px 7px; } .section h2 { font-size:34px; } .about { grid-template-columns:1fr; gap:35px; } .photo-grid img { height:150px; } .photo-grid img:last-child { height:200px; }
 .service-section { grid-template-columns:1fr; padding:35px 20px; border-radius:24px; gap:35px; } .services-photos { height:320px; }
 .more-grid { grid-template-columns:1fr; } .stats { grid-template-columns:1fr 1fr; gap:30px 0; padding:35px 20px; margin-bottom:65px; } .stat { padding:0 16px; } .stat:nth-child(2) { border:0; } .stat:nth-child(3) { padding-left:0; } .stat strong { font-size:35px; }
 .case-grid { grid-template-columns:1fr; gap:30px; } .final-cta { padding:58px 20px; margin-bottom:30px; } .final-cta h2 { font-size:33px; }
 .footer { padding:30px 7px 20px; } .footer-top { align-items:start; gap:28px; flex-direction:column; } .footer .nav-links { flex-wrap:wrap; gap:20px; } .footer-columns { grid-template-columns:1fr; gap:26px; } .footer-bottom { gap:15px; flex-direction:column; }
 .whatsapp-float { right:14px; bottom:14px; padding:8px 15px 8px 8px; } .faq-list { grid-template-columns:1fr; gap:22px; }
}
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*:before,*:after { animation:none!important; transition:none!important; } }
