/* ===== Smart Motéis - design system ===== */
:root{
  --bg: #0a0e1a;
  --bg-alt: #0d1326;
  --surface: #131b33;
  --surface-2: #182247;
  --border: rgba(255,255,255,.08);
  --text: #eef1fb;
  --text-dim: #a4acc9;
  --violet: #7c3aed;
  --cyan: #06b6d4;
  --pink: #ec4899;
  --grad: linear-gradient(120deg, var(--violet), var(--cyan));
  --grad-soft: linear-gradient(120deg, rgba(124,58,237,.18), rgba(6,182,212,.18));
  --radius: 20px;
  --shadow: 0 20px 60px rgba(0,0,0,.45);
  --ease: cubic-bezier(.16,.84,.44,1);
}

*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{
  background: var(--bg);
  color: var(--text);
  font-family: "Segoe UI", Inter, system-ui, -apple-system, sans-serif;
  line-height:1.6;
  overflow-x:hidden;
  overflow-x:clip;
  position:relative;
}
img,svg{display:block; max-width:100%;}
a{color:inherit; text-decoration:none;}
ul{list-style:none;}
.container{width:100%; max-width:1180px; margin:0 auto; padding:0 24px;}

/* background ambient orbs */
.bg-orbs{position:fixed; inset:0; z-index:0; overflow:hidden; pointer-events:none;}
.orb{position:absolute; border-radius:50%; filter:blur(90px); opacity:.35;}
.orb-1{width:520px; height:520px; background:var(--violet); top:-160px; left:-120px; animation:float1 22s ease-in-out infinite;}
.orb-2{width:460px; height:460px; background:var(--cyan); top:20%; right:-160px; animation:float2 26s ease-in-out infinite;}
.orb-3{width:380px; height:380px; background:var(--pink); bottom:-140px; left:30%; animation:float3 24s ease-in-out infinite;}
@keyframes float1{0%,100%{transform:translate(0,0) scale(1);} 50%{transform:translate(60px,80px) scale(1.15);}}
@keyframes float2{0%,100%{transform:translate(0,0) scale(1);} 50%{transform:translate(-70px,60px) scale(1.1);}}
@keyframes float3{0%,100%{transform:translate(0,0) scale(1);} 50%{transform:translate(50px,-60px) scale(1.2);}}

/* nav */
.nav{position:fixed; top:0; left:0; right:0; z-index:100; padding:18px 0; transition:all .35s var(--ease);}
.nav.scrolled{background:rgba(10,14,26,.75); backdrop-filter:blur(14px); border-bottom:1px solid var(--border); padding:12px 0;}
.nav-inner{display:flex; align-items:center; justify-content:space-between; gap:24px;}
.brand{display:flex; align-items:center; gap:10px; font-weight:700; font-size:1.15rem; letter-spacing:.2px;}
.brand-logo{background:#fff; border-radius:12px; padding:5px 12px; display:flex; align-items:center; box-shadow:0 8px 20px rgba(0,0,0,.25); transition:transform .3s var(--ease);}
.brand:hover .brand-logo{transform:translateY(-2px);}
.brand-logo img{height:42px; width:auto; display:block;}
.nav-links{display:flex; gap:32px;}
.nav-links a{font-size:.95rem; color:var(--text-dim); position:relative; padding:4px 0; transition:color .25s;}
.nav-links a:hover{color:var(--text);}
.nav-links a::after{content:""; position:absolute; left:0; bottom:0; width:0; height:2px; background:var(--grad); transition:width .3s var(--ease);}
.nav-links a:hover::after{width:100%;}
.nav-cta{white-space:nowrap;}
.nav-links a.nav-mobile-cta{display:none;}
.burger{display:none; flex-direction:column; gap:5px; background:none; border:0; cursor:pointer; z-index:110;}
.burger span{width:24px; height:2px; background:var(--text); border-radius:2px; transition:all .3s;}

/* buttons */
.btn{display:inline-flex; align-items:center; gap:10px; padding:13px 26px; border-radius:999px; font-weight:600; font-size:.95rem; transition:transform .25s var(--ease), box-shadow .25s var(--ease), background .25s; cursor:pointer; border:1px solid transparent;}
.btn-primary{background:var(--grad); color:#fff; box-shadow:0 10px 30px rgba(124,58,237,.35);}
.btn-primary:hover{transform:translateY(-3px); box-shadow:0 16px 40px rgba(124,58,237,.5);}
.btn-outline{border-color:var(--border); color:var(--text); background:rgba(255,255,255,.03);}
.btn-outline:hover{background:rgba(255,255,255,.08); transform:translateY(-3px);}
.btn-ghost{padding:10px 20px; background:rgba(255,255,255,.05); border:1px solid var(--border); font-size:.9rem;}
.btn-ghost:hover{background:rgba(255,255,255,.1);}
.btn-lg{padding:16px 34px; font-size:1.05rem; margin-top:8px;}
.btn-sm{padding:10px 20px; font-size:.9rem;}
.wa-icon{width:20px; height:20px; fill:#fff;}

/* reveal animation */
.reveal{opacity:0; transform:translateY(28px); transition:opacity .8s var(--ease), transform .8s var(--ease); transition-delay: var(--delay, 0s);}
.reveal.is-visible{opacity:1; transform:translateY(0);}

/* intro (home, below the banner) */
.eyebrow{display:inline-block; font-size:.8rem; text-transform:uppercase; letter-spacing:1.5px; color:var(--cyan); font-weight:700; margin-bottom:16px;}
.grad-text{background:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent;}
.intro-grid{display:grid; grid-template-columns:1.1fr .9fr; gap:60px; align-items:center;}
.intro h1{font-size:clamp(2.2rem, 4.6vw, 3.6rem); line-height:1.12; font-weight:800; letter-spacing:-.5px; margin-bottom:22px;}
.hero-sub{color:var(--text-dim); font-size:1.08rem; max-width:520px; margin-bottom:34px;}
.hero-actions{display:flex; gap:16px; flex-wrap:wrap;}
.stats-bar.stats-grid{grid-template-columns:repeat(2,1fr); margin:0;}

/* home banner (Swiper) */
.banner{position:relative; z-index:1; min-height:100vh; padding-top:96px; display:flex; flex-direction:column; justify-content:center; overflow:hidden;}
.banner-circuit{position:absolute; inset:0; pointer-events:none; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160' fill='none' stroke='%2306b6d4' stroke-opacity='.22' stroke-width='1.4'%3E%3Cpath d='M0 40h50l20 20h40M160 120h-40l-20-20H60l-20 20v40M100 0v30l20 20h40M0 100h20l14-14'/%3E%3Ccircle cx='110' cy='60' r='3.5'/%3E%3Ccircle cx='40' cy='140' r='3.5'/%3E%3Ccircle cx='34' cy='86' r='3.5'/%3E%3C/svg%3E"); background-size:160px; opacity:.9; -webkit-mask-image:radial-gradient(ellipse 70% 60% at 65% 45%, #000 0%, transparent 75%); mask-image:radial-gradient(ellipse 70% 60% at 65% 45%, #000 0%, transparent 75%); animation:circuitDrift 40s linear infinite;}
@keyframes circuitDrift{to{background-position:160px 160px;}}
.banner-swiper{width:100%;}
.banner-slide{display:flex; align-items:center;}
.banner-grid{display:grid; grid-template-columns:1.12fr 1fr; gap:48px; align-items:center; min-height:min(640px, calc(100vh - 220px));}
.banner-title{font-size:clamp(2.2rem, 4.4vw, 3.8rem); line-height:1.08; font-weight:800; letter-spacing:-.8px; margin-bottom:20px;}
.banner-sub{color:var(--text-dim); font-size:1.1rem; max-width:540px; margin-bottom:32px;}
.banner-copy > *{opacity:0; transform:translateY(24px); transition:opacity .7s var(--ease), transform .7s var(--ease);}
.swiper-slide-active .banner-copy > *{opacity:1; transform:none;}
.swiper-slide-active .banner-copy > *:nth-child(2){transition-delay:.08s;}
.swiper-slide-active .banner-copy > *:nth-child(3){transition-delay:.16s;}
.swiper-slide-active .banner-copy > *:nth-child(4){transition-delay:.24s;}

/* banner visual composition */
.banner-visual{position:relative; height:clamp(320px, 40vw, 540px); transform:perspective(1400px) rotateY(var(--ry, 0deg)) rotateX(var(--rx, 0deg)); transition:transform .5s var(--ease);}
.banner-visual::before{content:""; position:absolute; inset:8%; background:var(--grad-soft); filter:blur(70px); border-radius:50%; z-index:-1;}
.bv-main{position:absolute; inset:0; margin:auto; max-width:88%; max-height:92%; object-fit:contain; filter:drop-shadow(0 30px 60px rgba(0,0,0,.55)); opacity:0; transform:scale(.94); transition:opacity .8s var(--ease) .1s, transform 1s var(--ease) .1s;}
.bv-photo{border-radius:22px; border:1px solid var(--border); max-width:80%; max-height:78%; object-fit:cover;}
.bv-card{position:absolute; width:44%; margin:0; border-radius:14px; overflow:hidden; background:var(--surface); border:1px solid var(--border); box-shadow:0 24px 50px rgba(0,0,0,.5); opacity:0; transform:translateY(30px) scale(.92); transition:opacity .7s var(--ease) .35s, transform .9s var(--ease) .35s;}
.bv-card img{width:100%; display:block; aspect-ratio:16/9; object-fit:cover;}
.bv-card figcaption{padding:8px 12px; font-size:.78rem; font-weight:600; color:var(--text-dim);}
.bv-card.is-small{width:30%;}
.bv-tl{top:2%; left:-2%;} .bv-tr{top:4%; right:-2%;} .bv-bl{bottom:4%; left:0;} .bv-br{bottom:0; right:-3%;}
.swiper-slide-active .bv-main, .swiper-slide-active .bv-card{opacity:1; transform:none;}
.swiper-slide-active .bv-card > *{animation:bvFloat 6s ease-in-out infinite;}
.swiper-slide-active .bv-br > *, .swiper-slide-active .bv-tr > *{animation-delay:-3s;}
@keyframes bvFloat{0%,100%{transform:translateY(0);} 50%{transform:translateY(-8px);}}

/* banner: web panel screenshot in a browser frame */
.bv-browser{position:absolute; inset:6% 20% 12% 0; background:var(--surface); border:1px solid var(--border); border-radius:16px; box-shadow:0 30px 60px rgba(0,0,0,.55); overflow:hidden; display:flex; flex-direction:column; opacity:0; transform:scale(.95); transition:opacity .8s var(--ease) .1s, transform 1s var(--ease) .1s;}
.bv-bar{display:flex; align-items:center; gap:6px; padding:10px 14px; background:rgba(255,255,255,.04); border-bottom:1px solid var(--border); font-size:.72rem; color:var(--text-dim);}
.bv-bar i{width:9px; height:9px; border-radius:50%; background:rgba(255,255,255,.18);}
.bv-bar span{margin-left:8px;}
.bv-browser.is-shot{top:12%; right:8%; bottom:auto;}
.bv-browser.is-shot img{width:100%; height:auto; display:block;}
.bv-phone{position:absolute; right:0; bottom:0; width:26%; aspect-ratio:9/17; background:#0b1020; border:6px solid #1c2440; border-radius:28px; box-shadow:0 30px 60px rgba(0,0,0,.6); padding:26px 10px 10px; display:flex; flex-direction:column; gap:8px; opacity:0; transform:translateY(40px); transition:opacity .8s var(--ease) .4s, transform 1s var(--ease) .4s;}
.bv-phone.is-shot{padding:0; overflow:hidden;}
.bv-phone.is-shot img{width:100%; height:100%; object-fit:cover; object-position:top; display:block;}
.bv-phone::before{content:""; position:absolute; z-index:1; top:8px; left:50%; width:34%; height:6px; border-radius:4px; background:#1c2440; transform:translateX(-50%);}
.swiper-slide-active .bv-browser, .swiper-slide-active .bv-phone{opacity:1; transform:none;}

/* banner navigation: tabs + arrows */
.banner-nav{display:flex; align-items:center; justify-content:center; gap:14px; padding:26px 24px 44px;}
.banner-tabs{display:flex; gap:6px; padding:6px; min-width:0; overflow-x:auto; scrollbar-width:none; background:rgba(255,255,255,.04); border:1px solid var(--border); border-radius:18px; backdrop-filter:blur(10px);}
.banner-tabs::-webkit-scrollbar{display:none;}
.banner-tab{position:relative; flex-shrink:0; display:flex; align-items:center; gap:10px; padding:12px 18px; border:0; border-radius:12px; overflow:hidden; background:transparent; color:var(--text-dim); font:inherit; font-size:.92rem; font-weight:600; white-space:nowrap; cursor:pointer; transition:background .25s, color .25s;}
.banner-tab svg{width:18px; height:18px; fill:currentColor; flex-shrink:0; transition:fill .25s;}
.banner-tab:hover{color:var(--text);}
.banner-tab.is-active{background:rgba(255,255,255,.08); color:var(--text);}
.banner-tab.is-active svg{fill:var(--cyan);}
.banner-progress{position:absolute; left:0; bottom:0; width:100%; height:2px; background:var(--grad); transform-origin:left; transform:scaleX(0);}
.banner-tab.is-active .banner-progress{transform:scaleX(var(--p, 0));}
.banner-arrow{width:46px; height:46px; flex-shrink:0; border-radius:50%; border:1px solid var(--border); background:rgba(255,255,255,.04); color:var(--text); display:grid; place-items:center; cursor:pointer; transition:background .25s, border-color .25s, transform .25s var(--ease);}
.banner-arrow:hover{background:var(--grad); border-color:transparent; transform:scale(1.06);}
.banner-arrow svg{width:20px; height:20px; fill:currentColor;}
.banner-tab:focus-visible, .banner-arrow:focus-visible{outline:2px solid var(--cyan); outline-offset:2px;}
@media (prefers-reduced-motion: reduce){
  .banner-circuit, .swiper-slide-active .bv-card > *{animation:none;}
}

/* sections */
.section{position:relative; z-index:1; padding:110px 0;}
.section-alt{background:linear-gradient(180deg, transparent, rgba(255,255,255,.02) 20%, rgba(255,255,255,.02) 80%, transparent);}
.section-head{text-align:center; max-width:640px; margin:0 auto 60px;}
.section-head h2{font-size:clamp(1.8rem,3.4vw,2.6rem); font-weight:800; line-height:1.15; margin:14px 0 16px; letter-spacing:-.3px;}
.section-sub{color:var(--text-dim); font-size:1.05rem;}

/* mission/vision/values */
.mv-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:26px; margin-bottom:70px;}
.mv-card{background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); padding:36px 32px; transition:transform .35s var(--ease), border-color .35s;}
.mv-card:hover{transform:translateY(-8px); border-color:rgba(124,58,237,.4);}
.mv-icon{font-size:1.9rem; display:block; margin-bottom:16px;}
.mv-card h2, .mv-card h3{font-size:1.25rem; margin-bottom:12px; font-weight:700;}
.mv-card p{color:var(--text-dim); font-size:.97rem;}
.values-list{display:flex; flex-direction:column; gap:8px;}
.values-list li{color:var(--text-dim); font-size:.93rem; padding-left:18px; position:relative;}
.values-list li::before{content:""; position:absolute; left:0; top:9px; width:7px; height:7px; border-radius:50%; background:var(--grad);}

/* diferenciais */
.diff-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:26px;}
.diff-card{position:relative; background:linear-gradient(160deg, var(--surface), transparent); border:1px solid var(--border); border-radius:var(--radius); padding:34px 30px; overflow:hidden; transition:transform .35s var(--ease);}
.diff-card:hover{transform:translateY(-8px);}
.diff-num{font-size:2.6rem; font-weight:800; background:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent; opacity:.5;}
.diff-card h3, .diff-card h4{font-size:1.15rem; margin:10px 0 10px; font-weight:700;}
.diff-card p{color:var(--text-dim); font-size:.93rem;}

/* products */
.products-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:24px;}
.product-card{background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); padding:34px 28px; transition:transform .4s var(--ease), box-shadow .4s var(--ease), border-color .4s; position:relative;}
.product-card:hover{transform:translateY(-10px) scale(1.02); box-shadow:0 20px 50px rgba(0,0,0,.5); border-color:rgba(6,182,212,.4);}
.product-icon{width:56px; height:56px; border-radius:14px; background:var(--grad-soft); border:1px solid var(--border); display:grid; place-items:center; margin-bottom:20px;}
.product-icon svg{width:26px; height:26px; fill:var(--cyan);}
.product-thumb{width:84px; height:84px; border-radius:18px; background:var(--grad-soft); border:1px solid var(--border); display:grid; place-items:center; padding:8px; margin-bottom:20px; overflow:hidden;}
.product-thumb img{width:100%; height:100%; min-width:0; min-height:0; object-fit:contain; filter:drop-shadow(0 6px 12px rgba(0,0,0,.45));}
.product-thumb.is-cover{padding:0;}
.product-thumb.is-cover img{width:100%; height:100%; max-width:none; max-height:none; object-fit:cover; object-position:top;}
.product-thumb.is-picto{padding:14px;}
.product-thumb.is-picto img{filter:invert(1) opacity(.85);}
.product-card h3{font-size:1.2rem; margin-bottom:10px; font-weight:700;}
.product-card p{color:var(--text-dim); font-size:.92rem; margin-bottom:20px; min-height:80px;}
.product-link{font-weight:600; font-size:.9rem; color:var(--cyan); transition:gap .25s;}
.product-link:hover{color:var(--pink);}

/* cta */
.cta-section{padding:90px 0 120px;}
.cta-inner{text-align:center; max-width:640px; margin:0 auto; background:var(--surface); border:1px solid var(--border); border-radius:32px; padding:64px 40px; position:relative;}
.cta-inner::before{content:""; position:absolute; inset:-2px; border-radius:32px; padding:2px; background:var(--grad); -webkit-mask:linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0); -webkit-mask-composite:xor; mask-composite:exclude; opacity:.5; pointer-events:none;}
.cta-inner h2{font-size:clamp(1.6rem,3vw,2.2rem); font-weight:800; margin-bottom:14px;}
.cta-inner p{color:var(--text-dim); margin-bottom:30px;}
.contact-phone{display:block; margin-top:18px; color:var(--text-dim); font-size:.95rem;}

/* footer */
.footer{position:relative; z-index:1; border-top:1px solid var(--border); padding:40px 0;}
.footer-inner{display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:20px;}
.footer-links{display:flex; gap:22px;}
.footer-links a{color:var(--text-dim); font-size:.9rem; transition:color .25s;}
.footer-links a:hover{color:var(--text);}
.footer-copy{color:var(--text-dim); font-size:.85rem;}
.footer-copy a{text-decoration:underline; text-underline-offset:3px;}
.footer-copy a:hover{color:var(--text);}
.footer-social{display:flex; gap:12px;}
.footer-social a{width:42px; height:42px; border-radius:50%; background:var(--surface); border:1px solid var(--border); display:grid; place-items:center; transition:all .25s var(--ease);}
.footer-social a:hover{background:var(--grad); border-color:transparent; transform:translateY(-4px);}
.footer-social svg{width:19px; height:19px; fill:var(--text-dim); transition:fill .25s;}
.footer-social a:hover svg{fill:#fff;}

/* floating action stack (whatsapp, phone, instagram) */
.float-stack{position:fixed; bottom:26px; right:26px; z-index:90; display:flex; flex-direction:column; align-items:center; gap:14px;}
.float-btn{width:52px; height:52px; border-radius:50%; display:grid; place-items:center; box-shadow:0 10px 26px rgba(0,0,0,.35); transition:transform .25s var(--ease), box-shadow .25s var(--ease); opacity:0; transform:translateY(12px) scale(.9); animation:floatIn .5s var(--ease) forwards;}
.float-btn:hover{transform:translateY(-4px) scale(1.06);}
.float-btn svg{width:24px; height:24px; fill:#fff;}
.float-instagram{background:radial-gradient(circle at 30% 110%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285AEB 90%); animation-delay:.05s;}
.float-phone{background:linear-gradient(135deg, var(--violet), var(--cyan)); animation-delay:.1s;}
.float-whatsapp{width:60px; height:60px; background:#25D366; box-shadow:0 10px 30px rgba(37,211,102,.5); animation:floatIn .5s var(--ease) forwards, pulse 2.4s 1s infinite;}
.float-whatsapp svg{width:30px; height:30px;}
@keyframes floatIn{to{opacity:1; transform:translateY(0) scale(1);}}

/* admin heatmap preview: everything visible, no floating widgets */
.is-heatmap-preview .reveal{opacity:1 !important; transform:none !important;}
/* the preview iframe is as tall as the page, so viewport-based heights use a typical 900px screen */
.is-heatmap-preview .banner{min-height:900px;}
.is-heatmap-preview .sc-step{min-height:648px;}
.is-heatmap-preview .float-stack, .is-heatmap-preview .chat-bubble, .is-heatmap-preview .cookie-bar{display:none !important;}

/* cookie consent bar */
.cookie-bar{position:fixed; left:24px; bottom:24px; z-index:95; width:min(460px, calc(100vw - 48px)); background:var(--surface-2); border:1px solid var(--border); border-radius:18px; padding:18px 20px; box-shadow:0 20px 50px rgba(0,0,0,.5); display:flex; flex-direction:column; gap:14px; opacity:0; transform:translateY(16px); transition:opacity .4s var(--ease), transform .4s var(--ease);}
.cookie-bar.is-visible{opacity:1; transform:none;}
/* escondidos ou transparentes, não podem bloquear o clique no que está embaixo */
.cookie-bar[hidden], .chat-bubble[hidden]{display:none;}
.cookie-bar:not(.is-visible), .chat-bubble:not(.is-visible){pointer-events:none;}
.cookie-bar p{color:var(--text-dim); font-size:.88rem; line-height:1.5;}
.cookie-bar a{color:var(--cyan); text-decoration:underline;}
.cookie-actions{display:flex; gap:10px; justify-content:flex-end;}
@media (max-width:620px){ .cookie-bar{left:12px; right:12px; bottom:12px; width:auto;} }

/* chat prompt bubble (next to the WhatsApp button) */
.chat-bubble{position:fixed; right:100px; bottom:30px; z-index:91; width:min(320px, calc(100vw - 130px)); background:#fff; color:#1b1f2e; border-radius:18px 18px 4px 18px; box-shadow:0 18px 50px rgba(0,0,0,.45); opacity:0; transform:translateY(14px) scale(.96); transform-origin:bottom right; transition:opacity .4s var(--ease), transform .4s var(--ease);}
.chat-bubble.is-visible{opacity:1; transform:none;}
.chat-body{display:flex; gap:12px; align-items:flex-start; padding:16px 34px 16px 16px;}
.chat-avatar{position:relative; flex-shrink:0;}
.chat-avatar img{width:42px; height:42px; border-radius:12px; display:block;}
.chat-online{position:absolute; right:-2px; bottom:-2px; width:12px; height:12px; border-radius:50%; background:#22c55e; border:2px solid #fff;}
.chat-text{font-size:.88rem; line-height:1.4; color:#4b5168;}
.chat-text strong{display:block; color:#1b1f2e; font-size:.95rem; margin-bottom:2px;}
.chat-close{position:absolute; top:6px; right:8px; width:26px; height:26px; border:0; background:transparent; color:#8a90a6; font-size:1.3rem; line-height:1; cursor:pointer; border-radius:50%;}
.chat-close:hover{background:#eef0f6; color:#1b1f2e;}
@media (max-width:620px){
  .chat-bubble{right:82px; bottom:22px; width:calc(100vw - 100px);}
  .chat-body{padding:12px 30px 12px 12px;}
  .chat-avatar img{width:36px; height:36px;}
}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(37,211,102,.55);} 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:620px){
  .float-stack{bottom:18px; right:18px; gap:10px;}
  .float-btn{width:46px; height:46px;}
  .float-whatsapp{width:54px; height:54px;}
}

/* nav dropdown */
.has-dropdown{position:relative;}
.has-dropdown > a{display:flex; align-items:center; gap:4px;}
.caret{font-size:.65rem; transition:transform .3s;}
.dropdown-menu{position:absolute; top:calc(100% + 16px); left:50%; transform:translateX(-50%) translateY(8px); background:var(--surface); border:1px solid var(--border); border-radius:16px; padding:10px; min-width:190px; display:flex; flex-direction:column; gap:2px; opacity:0; visibility:hidden; transition:all .3s var(--ease); transition-delay:.35s; box-shadow:var(--shadow); z-index:50;}
.has-dropdown:hover .dropdown-menu, .has-dropdown:focus-within .dropdown-menu{opacity:1; visibility:visible; transform:translateX(-50%) translateY(0); transition-delay:0s;}
.has-dropdown:hover .caret, .has-dropdown:focus-within .caret{transform:rotate(180deg);}
/* ponte invisível sobre o vão entre o menu e o submenu: o mouse passa sem fechar */
.has-dropdown::after{content:""; position:absolute; left:-24px; right:-24px; top:100%; height:24px;}
.dropdown-menu a{padding:10px 14px; border-radius:10px; font-size:.9rem; color:var(--text-dim);}
.dropdown-menu a::after{display:none;}
.dropdown-menu a:hover{background:rgba(255,255,255,.06); color:var(--text);}
/* item da página atual dentro do submenu */
.dropdown-menu a.is-current{background:rgba(124,58,237,.18); color:var(--text); font-weight:600;}
.dropdown-menu a.is-current:hover{background:rgba(124,58,237,.26);}
.nav-links a.is-active{color:var(--text);}
.nav-links a.is-active::after{width:100%;}

/* teaser (home) */
.teaser-grid{display:grid; grid-template-columns:1.2fr .8fr; gap:50px; align-items:center;}
.teaser-diffs{display:flex; flex-direction:column; gap:16px;}
.mini-diff{display:flex; align-items:center; gap:16px; background:var(--surface); border:1px solid var(--border); border-radius:16px; padding:18px 22px; transition:transform .3s var(--ease);}
.mini-diff:hover{transform:translateX(6px);}
.mini-diff span{font-size:1.3rem; font-weight:800; background:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent;}
.mini-diff p{font-weight:600;}

/* page hero (internal pages) */
.page-hero{position:relative; z-index:1; padding:115px 0 60px; text-align:center;}
.page-hero .container{max-width:760px;}
.page-hero h1{font-size:clamp(2rem,4vw,3rem); font-weight:800; margin:12px 0 16px; letter-spacing:-.3px;}
.page-hero > .container > p{color:var(--text-dim); font-size:1.05rem;}

/* stats bar */
.stats-bar{display:grid; grid-template-columns:repeat(4,1fr); gap:20px; margin:10px 0 70px; text-align:center;}
.stat{background:var(--surface); border:1px solid var(--border); border-radius:18px; padding:30px 14px; transition:transform .3s var(--ease);}
.stat:hover{transform:translateY(-6px);}
.stat strong{display:block; font-size:1.9rem; font-weight:800; background:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent;}
.stat span{color:var(--text-dim); font-size:.82rem; margin-top:6px; display:block;}

/* feature grid (product detail pages) */
.feature-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:22px; margin:10px 0 60px;}
.feature-card{background:var(--surface); border:1px solid var(--border); border-radius:18px; padding:28px 26px; transition:transform .3s var(--ease), border-color .3s;}
.feature-card:hover{transform:translateY(-6px); border-color:rgba(6,182,212,.35);}
.feature-card .f-icon{font-size:1.5rem; margin-bottom:12px; display:block;}
.feature-card h3, .feature-card h4{font-size:1.05rem; margin-bottom:8px; font-weight:700;}
.feature-card p{color:var(--text-dim); font-size:.9rem;}

/* brand compatibility chips */
.chip-group{display:flex; flex-wrap:wrap; gap:10px; margin:0 0 34px;}
.chip{padding:8px 16px; border-radius:999px; background:rgba(255,255,255,.05); border:1px solid var(--border); font-size:.85rem; color:var(--text-dim); transition:all .25s;}
.chip:hover{border-color:var(--cyan); color:var(--text);}

/* alternating product rows (produtos.php) */
.product-row{display:grid; grid-template-columns:1fr 1fr; gap:54px; align-items:center; margin-bottom:100px;}
.product-row.reverse .row-visual{order:2;}
.product-row.reverse .row-copy{order:1;}
.row-copy h2{font-size:clamp(1.6rem,2.6vw,2.2rem); font-weight:800; line-height:1.15; letter-spacing:-.3px; margin-bottom:14px;}
.row-copy > p{color:var(--text-dim); font-size:1.02rem;}
.row-visual{background:linear-gradient(160deg, var(--surface), var(--surface-2)); border:1px solid var(--border); border-radius:28px; min-height:280px; display:grid; place-items:center; position:relative; overflow:hidden;}
.row-visual::before{content:""; position:absolute; inset:0; background:var(--grad-soft); opacity:.5;}
.row-icon{width:100px; height:100px; fill:var(--cyan); position:relative; filter:drop-shadow(0 0 30px rgba(6,182,212,.4));}
.row-visual img{width:100%; height:100%; object-fit:cover; position:relative; z-index:1;}
.row-visual.contain{min-height:340px;}
.row-visual.contain img{width:auto; height:auto; max-width:70%; max-height:300px; object-fit:contain; padding:0;}

/* hero media (product detail pages) */
.hero-media{max-width:820px; margin:36px auto 0; border-radius:22px; overflow:hidden; border:1px solid var(--border); box-shadow:var(--shadow);}
.hero-media img{width:100%; display:block;}

/* screenshot gallery */
.gallery-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin:10px 0 70px;}
.gallery-item{border-radius:16px; overflow:hidden; border:1px solid var(--border); background:var(--surface); transition:transform .3s var(--ease); position:relative;}
.gallery-item:hover{transform:translateY(-6px);}
.gallery-item img{width:100%; display:block; aspect-ratio:4/3; object-fit:cover;}
.gallery-grid.is-wide .gallery-item img{aspect-ratio:16/9; object-position:left top;}
.gallery-item span{display:block; padding:12px 14px; font-size:.85rem; color:var(--text-dim);}

/* icon images inside feature cards / stats */
.f-icon-img{width:44px; height:44px; object-fit:contain; margin-bottom:12px; display:block;}
.feature-card.icon-tile{text-align:center;}
.feature-card.icon-tile .f-icon-img{margin:0 auto 14px;}
.stat-icon{width:60px; height:60px; border-radius:50%; background:#eef2fb; box-shadow:0 0 0 5px rgba(6,182,212,.15); display:grid; place-items:center; margin:0 auto 16px;}
.stat-icon img{width:32px; height:32px; object-fit:contain;}
.row-feature-list{margin:18px 0 26px; display:flex; flex-direction:column; gap:10px;}
.row-feature-list li{padding-left:24px; position:relative; color:var(--text-dim); font-size:.95rem;}
.row-feature-list li::before{content:"✓"; position:absolute; left:0; color:var(--cyan); font-weight:700;}

/* contact page */
.contact-grid{max-width:560px; margin:0 auto;}
.contact-info-card{background:var(--surface); border:1px solid var(--border); border-radius:20px; padding:34px;}
.contact-info-card .info-row{display:flex; gap:14px; align-items:flex-start; margin-bottom:24px;}
.contact-info-card .info-icon{width:44px; height:44px; border-radius:12px; background:var(--grad-soft); display:grid; place-items:center; flex-shrink:0; font-size:1.2rem;}
.contact-info-card strong{font-size:.95rem;}
.contact-info-card p{color:var(--text-dim); font-size:.92rem; margin-top:2px;}

/* products page: quick nav, ecosystem map, why grid */
.eco-nav{display:grid; grid-template-columns:repeat(5,1fr); gap:16px;}
.eco-card{display:flex; flex-direction:column; gap:4px; background:var(--surface); border:1px solid var(--border); border-radius:18px; padding:22px 20px; transition:transform .3s var(--ease), border-color .3s;}
.eco-card:hover{transform:translateY(-6px); border-color:rgba(6,182,212,.4);}
.eco-card .product-thumb{margin-bottom:14px; width:64px; height:64px; border-radius:14px; padding:6px;}
.eco-card .product-thumb.is-cover{padding:0;}
.eco-card .product-thumb.is-picto{padding:11px;}
.eco-card strong{font-size:1rem;}
.eco-card > span:last-child{color:var(--text-dim); font-size:.85rem;}
.eco-map{position:relative; max-width:900px; margin:0 auto; display:grid; grid-template-columns:1fr 1.1fr 1fr; grid-template-areas:". top ." "left hub right" ". bottom ."; gap:44px 30px; align-items:center;}
.eco-lines{position:absolute; inset:0; width:100%; height:100%; pointer-events:none;}
.eco-lines line{stroke:var(--cyan); stroke-opacity:.45; stroke-width:2; stroke-dasharray:6 8; vector-effect:non-scaling-stroke; animation:ecoFlow 1.6s linear infinite;}
@keyframes ecoFlow{to{stroke-dashoffset:-28;}}
.eco-node{position:relative; z-index:1; display:flex; flex-direction:column; gap:4px; text-align:center; background:var(--surface); border:1px solid var(--border); border-radius:18px; padding:18px 16px; transition:border-color .3s, transform .3s var(--ease);}
a.eco-node:hover{border-color:rgba(6,182,212,.45); transform:translateY(-4px);}
.eco-node strong{font-size:1rem;}
.eco-node span{color:var(--text-dim); font-size:.84rem;}
.eco-top{grid-area:top;} .eco-left{grid-area:left;} .eco-right{grid-area:right;} .eco-bottom{grid-area:bottom;}
.eco-hub{grid-area:hub; padding:30px 20px; background:linear-gradient(160deg, var(--surface-2), var(--surface)); border-color:rgba(6,182,212,.45); box-shadow:0 0 0 6px rgba(6,182,212,.06), 0 20px 50px rgba(0,0,0,.45);}
.eco-hub strong{font-size:1.25rem; background:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent;}
.row-visual.is-web{padding:24px 20px; place-items:stretch;}
.row-visual.is-web .web-visual{height:auto; display:flex; align-items:center; position:relative; z-index:1;}
.row-visual.is-web .bv-browser{position:relative; inset:auto; width:100%;}
.row-visual.is-web img{height:auto; object-fit:initial;}
.why-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:22px;}
@media (prefers-reduced-motion: reduce){ .eco-lines line{animation:none;} }

/* real-time notifications block */
.live-dot{display:inline-block; width:8px; height:8px; margin-right:6px; border-radius:50%; background:#22c55e; vertical-align:middle; box-shadow:0 0 0 0 rgba(34,197,94,.6); animation:livePulse 1.8s infinite;}
@keyframes livePulse{0%{box-shadow:0 0 0 0 rgba(34,197,94,.6);} 70%{box-shadow:0 0 0 8px rgba(34,197,94,0);} 100%{box-shadow:0 0 0 0 rgba(34,197,94,0);}}
.notif-visual{position:relative; max-width:440px; margin:0 auto;}
.notif-visual::before{content:""; position:absolute; inset:10%; background:var(--grad-soft); filter:blur(60px); border-radius:50%; z-index:-1;}
.notif-visual img{width:100%; display:block; border-radius:28px; border:1px solid var(--border); box-shadow:0 30px 60px rgba(0,0,0,.55);}
.notif-visual.is-wide{max-width:600px;}
.notif-visual.is-wide img{border-radius:18px;}
.spot[hidden]{display:none;}
@media (prefers-reduced-motion: reduce){ .live-dot{animation:none;} }

/* ===== Smart Control page (Apple-style) ===== */
.sc-hero{position:relative; z-index:1; padding:130px 0 0; text-align:center; overflow:hidden;}
.sc-hero-title{font-size:clamp(2.6rem,7vw,5.6rem); font-weight:800; line-height:1.02; letter-spacing:-2px; margin:6px 0 22px;}
.sc-hero-sub{color:var(--text-dim); font-size:clamp(1.05rem,1.6vw,1.3rem); max-width:640px; margin:0 auto 32px;}
.sc-hero-stage{position:relative; max-width:980px; margin:70px auto 0; padding:0 24px 120px;}
.sc-hero-stage::before{content:""; position:absolute; left:8%; right:8%; top:0; bottom:22%; background:radial-gradient(closest-side, rgba(124,58,237,.5), rgba(6,182,212,.22) 60%, transparent); filter:blur(40px); z-index:-1;}

/* the panel: angled tablet like the real product photo */
.sc-device{perspective:1800px;}
.sc-bezel{--ry:0deg; --rx:0deg; --rz:0deg; position:relative; padding:3.2% 4.2%; border-radius:clamp(16px,2.4vw,30px); background:linear-gradient(150deg,#3b3c42 0%,#0d0d10 36%,#000 100%); box-shadow:inset 0 0 0 1px rgba(255,255,255,.09), 12px 6px 0 -3px #a8121b, 16px 10px 34px -6px rgba(220,30,40,.5), 0 50px 90px rgba(0,0,0,.65); transform:rotateY(var(--ry)) rotateX(var(--rx)) rotateZ(var(--rz)); transition:transform .2s linear;}
.sc-screen{position:relative; aspect-ratio:1400/872; border-radius:6px; overflow:hidden; background:#000;}
.sc-screen img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:0; transform:scale(1.05); transition:opacity .6s var(--ease), transform 1s var(--ease);}
.sc-screen img.is-active{opacity:1; transform:none;}
.sc-glare{position:absolute; inset:0; border-radius:inherit; background:linear-gradient(115deg, rgba(255,255,255,.16) 0%, rgba(255,255,255,.04) 30%, rgba(255,255,255,0) 45%); pointer-events:none;}
.sc-hero-device .sc-bezel{--ry:-22deg; --rx:12deg; --rz:-3deg;}
.sc-hero-device{animation:scRise 1.3s var(--ease) .15s both;}
@keyframes scRise{from{opacity:0; transform:translateY(90px) scale(.94);}}
.sc-tour-device .sc-bezel{--ry:-14deg; --rx:5deg; --rz:-1deg;}

/* statement + flow */
.sc-big{font-size:clamp(2.2rem,5vw,4rem) !important; letter-spacing:-1.2px !important; line-height:1.05 !important;}
.sc-statement .section-head{max-width:820px;}
.sc-flow{list-style:none; display:grid; grid-template-columns:repeat(6,1fr); gap:18px;}
.sc-flow li{position:relative; background:var(--surface); border:1px solid var(--border); border-radius:18px; padding:22px 16px; font-size:.92rem; font-weight:600; line-height:1.4;}
.sc-flow li span{display:block; font-size:1.7rem; font-weight:800; margin-bottom:8px; background:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent;}
.sc-flow li:not(:last-child)::after{content:"→"; position:absolute; right:-15px; top:50%; transform:translateY(-50%); color:var(--cyan); font-weight:700;}

/* sticky screen tour */
.sc-tour{display:grid; grid-template-columns:1.15fr .85fr; gap:64px; align-items:start;}
.sc-tour-sticky{position:sticky; top:calc(50vh - 200px);}
.sc-step{min-height:72vh; display:flex; flex-direction:column; justify-content:center; opacity:.25; transition:opacity .5s var(--ease);}
.sc-step.is-active{opacity:1;}
.sc-step h3{font-size:clamp(1.6rem,2.8vw,2.4rem); font-weight:800; line-height:1.1; letter-spacing:-.6px; margin-bottom:14px;}
.sc-step p{color:var(--text-dim); font-size:1.05rem;}
.sc-step-img{display:none;}

/* energy */
.sc-energy-grid{display:grid; grid-template-columns:1.2fr .8fr; gap:60px; align-items:center;}
.sc-energy h2, .sc-staff h2{margin:8px 0 20px;}
.sc-energy-number{text-align:center;}
.sc-energy-number strong{display:block; font-size:clamp(6rem,14vw,11rem); font-weight:800; line-height:1; letter-spacing:-4px; background:linear-gradient(120deg,#22c55e,var(--cyan)); -webkit-background-clip:text; background-clip:text; color:transparent;}
.sc-count-label{color:var(--text-dim); font-size:1rem; text-transform:uppercase; letter-spacing:2px;}

/* owner benefits */
.sc-benefits{display:grid; grid-template-columns:repeat(3,1fr); gap:20px;}
.sc-benefit{position:relative; background:linear-gradient(160deg, var(--surface-2), var(--surface)); border:1px solid var(--border); border-radius:22px; padding:30px 28px; overflow:hidden; transition:transform .35s var(--ease), border-color .35s;}
.sc-benefit::before{content:""; position:absolute; top:-60px; right:-60px; width:160px; height:160px; border-radius:50%; background:var(--grad-soft); filter:blur(30px);}
.sc-benefit:hover{transform:translateY(-6px); border-color:rgba(6,182,212,.4);}
.sc-benefit-tag{display:inline-block; padding:4px 12px; border-radius:999px; background:var(--grad); color:#fff; font-size:.72rem; font-weight:700; letter-spacing:1px; text-transform:uppercase; margin-bottom:16px;}
.sc-benefit h3{font-size:1.3rem; font-weight:800; line-height:1.2; margin-bottom:10px; letter-spacing:-.3px;}
.sc-benefit p{color:var(--text-dim); font-size:.95rem;}

/* staff */
.sc-staff-list{list-style:none; display:grid; gap:14px;}
.sc-staff-list li{display:flex; flex-direction:column; gap:4px; background:var(--surface); border:1px solid var(--border); border-left:3px solid var(--cyan); border-radius:14px; padding:18px 22px;}
.sc-staff-list strong{font-size:1.05rem;}
.sc-staff-list span{color:var(--text-dim); font-size:.93rem;}

/* more features */
.sc-more{display:grid; grid-template-columns:repeat(3,1fr); gap:18px;}
.sc-more-item{display:flex; flex-direction:column; gap:8px; background:var(--surface); border:1px solid var(--border); border-radius:18px; padding:24px; transition:transform .3s var(--ease), border-color .3s;}
.sc-more-item:hover{transform:translateY(-4px); border-color:rgba(6,182,212,.35);}
.sc-more-item span{color:var(--text-dim); font-size:.92rem;}
@media (max-width: 980px){
  .sc-flow{grid-template-columns:repeat(3,1fr);}
  .sc-flow li::after{display:none;}
  .sc-tour{grid-template-columns:1fr; gap:0;}
  .sc-tour-sticky{display:none;}
  .sc-step{min-height:0; opacity:1; padding:28px 0;}
  .sc-step-img{display:block; width:100%; border-radius:16px; border:8px solid #0d0d10; box-shadow:8px 4px 0 -2px #a8121b, 0 24px 50px rgba(0,0,0,.5); margin-bottom:20px;}
  .sc-energy-grid{grid-template-columns:1fr; text-align:center;}
  .sc-more{grid-template-columns:repeat(2,1fr);}
  .sc-benefits{grid-template-columns:repeat(2,1fr);}
}
@media (max-width: 620px){
  .sc-flow{grid-template-columns:1fr 1fr;}
  .sc-more{grid-template-columns:1fr;}
  .sc-benefits{grid-template-columns:1fr;}
  .sc-hero-stage{margin-top:44px; padding-bottom:70px;}
}
@media (prefers-reduced-motion: reduce){
  .sc-hero-device{animation:none;}
  .sc-step{opacity:1;}
}

/* ===== Blog ===== */
.blog-hero{position:relative; z-index:1; padding:130px 0 30px; text-align:center;}
.blog-hero .container{max-width:860px;}
.blog-hero h1{font-size:clamp(2.2rem,5vw,3.8rem); font-weight:800; line-height:1.08; letter-spacing:-1px; margin:8px 0 16px;}
.blog-hero > .container > p{color:var(--text-dim); font-size:1.1rem; max-width:620px; margin:0 auto;}
.blog-cats{display:flex; flex-wrap:wrap; justify-content:center; gap:8px; margin-top:26px;}
.blog-cats a{padding:8px 16px; border-radius:999px; border:1px solid var(--border); background:rgba(8,11,22,.72); color:var(--text-dim); font-size:.88rem; font-weight:600; transition:all .25s;}
.blog-cats a:hover{color:var(--text); border-color:rgba(6,182,212,.4);}
.blog-cats a.is-active{background:var(--grad); color:#fff; border-color:transparent;}
.blog-tag{display:inline-block; padding:4px 12px; border-radius:999px; background:var(--grad); color:#fff; font-size:.72rem; font-weight:700; letter-spacing:.8px; text-transform:uppercase;}
.blog-meta{color:var(--text-dim); font-size:.84rem;}
.blog-placeholder{display:block; width:100%; height:100%; background:radial-gradient(circle at 30% 30%, rgba(124,58,237,.55), transparent 60%), radial-gradient(circle at 75% 70%, rgba(6,182,212,.45), transparent 55%), var(--surface-2);}

.blog-featured{display:grid; grid-template-columns:1.2fr 1fr; gap:0; background:var(--surface); border:1px solid var(--border); border-radius:28px; overflow:hidden; margin-bottom:34px; transition:transform .4s var(--ease), border-color .4s, box-shadow .4s;}
.blog-featured:hover{transform:translateY(-6px); border-color:rgba(6,182,212,.4); box-shadow:0 30px 70px rgba(0,0,0,.45);}
.blog-featured-img{position:relative; min-height:340px; overflow:hidden;}
.blog-featured-img img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform .8s var(--ease);}
.blog-featured:hover .blog-featured-img img{transform:scale(1.04);}
.blog-featured-copy{padding:40px 38px; display:flex; flex-direction:column; justify-content:center; gap:14px;}
.blog-featured-copy h2{font-size:clamp(1.6rem,2.6vw,2.3rem); font-weight:800; line-height:1.15; letter-spacing:-.5px;}
.blog-featured-copy p{color:var(--text-dim);}
.blog-featured-copy .blog-tag{align-self:flex-start;}
.blog-more{color:var(--cyan); font-weight:700; margin-top:6px;}

.blog-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:24px;}
.blog-card{display:flex; flex-direction:column; background:var(--surface); border:1px solid var(--border); border-radius:20px; overflow:hidden; transition:transform .35s var(--ease), border-color .35s, box-shadow .35s;}
.blog-card:hover{transform:translateY(-6px); border-color:rgba(6,182,212,.35); box-shadow:0 22px 50px rgba(0,0,0,.4);}
.blog-card-img{position:relative; aspect-ratio:16/9; overflow:hidden;}
.blog-card-img img{width:100%; height:100%; object-fit:cover; transition:transform .7s var(--ease);}
.blog-card:hover .blog-card-img img{transform:scale(1.05);}
.blog-card-img .blog-tag{position:absolute; left:14px; top:14px;}
.blog-card-body{padding:20px 22px 22px; display:flex; flex-direction:column; gap:10px; flex:1;}
.blog-card-body h3{font-size:1.15rem; font-weight:700; line-height:1.3;}
.blog-card-body p{color:var(--text-dim); font-size:.92rem; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden;}
.blog-card-body .blog-meta{margin-top:auto;}
/* layout configurável no painel (Blog > Layout) */
.blog-grid.is-cols-1{grid-template-columns:1fr; max-width:760px; margin:0 auto;}
.blog-grid.is-cols-2{grid-template-columns:repeat(2,1fr);}
.blog-grid.is-cols-4{grid-template-columns:repeat(4,1fr);}
.blog-grid.is-cols-4 .blog-card-body h3{font-size:1.02rem;}
.blog-grid.is-list{grid-template-columns:1fr; max-width:980px; margin:0 auto;}
.blog-grid.is-list .blog-card{flex-direction:row;}
.blog-grid.is-list .blog-card-img{flex:0 0 40%; aspect-ratio:auto; min-height:220px;}
.blog-grid.is-list .blog-card-body{padding:26px 28px; justify-content:center;}
.blog-grid.is-list .blog-card-body h3{font-size:1.35rem;}
/* estilo minimalista (inspirado no blog do Linear): sem caixa, mais respiro */
.blog-grid.is-minimal{gap:48px 34px;}
.blog-grid.is-minimal .blog-card{background:none; border:0; border-radius:0; overflow:visible; box-shadow:none;}
.blog-grid.is-minimal .blog-card:hover{transform:none; box-shadow:none;}
.blog-grid.is-minimal .blog-card-img{border-radius:18px; overflow:hidden; border:1px solid var(--border);}
.blog-grid.is-minimal .blog-card-body{padding:18px 2px 0;}
.blog-grid.is-minimal .blog-card-body h3{font-size:1.3rem; letter-spacing:-.3px; transition:color .25s;}
.blog-grid.is-minimal .blog-card:hover h3{color:var(--cyan);}
.blog-grid.is-minimal .blog-card-body .blog-meta{order:-1; margin:0; font-size:.78rem; text-transform:uppercase; letter-spacing:1px;}
.blog-grid.is-minimal.is-list .blog-card{gap:28px; padding-bottom:40px; border-bottom:1px solid var(--border);}
.blog-grid.is-minimal.is-list .blog-card-body{padding:0;}
.blog-featured.is-minimal{background:none; border:0; gap:40px; overflow:visible;}
.blog-featured.is-minimal:hover{transform:none; box-shadow:none;}
.blog-featured.is-minimal .blog-featured-img{border-radius:24px; border:1px solid var(--border);}
.blog-featured.is-minimal .blog-featured-copy{padding:10px 0;}
.blog-pager{display:flex; justify-content:center; gap:12px; margin-top:40px;}
.blog-empty{text-align:center; max-width:560px; margin:0 auto; padding:60px 20px; background:var(--surface); border:1px solid var(--border); border-radius:24px;}
.blog-empty h2{font-size:1.6rem; margin-bottom:10px;}
.blog-empty p{color:var(--text-dim); margin-bottom:24px;}

/* post */
.post-progress{position:fixed; top:0; left:0; height:3px; width:0; z-index:200; background:var(--grad); box-shadow:0 0 12px rgba(6,182,212,.6);}
.post-preview-flag{position:fixed; left:50%; bottom:20px; transform:translateX(-50%); z-index:150; background:#f59e0b; color:#1b1f2e; font-weight:700; font-size:.88rem; padding:10px 18px; border-radius:999px; box-shadow:0 10px 30px rgba(0,0,0,.4);}
.post-hero{position:relative; z-index:1; padding:120px 0 0; text-align:center;}
.post-hero .container{max-width:860px;}
.post-crumbs{font-size:.86rem; color:var(--text-dim); margin-bottom:18px;}
.post-crumbs a{color:var(--cyan);}
.post-hero h1{font-size:clamp(2rem,4.6vw,3.5rem); font-weight:800; line-height:1.1; letter-spacing:-1px;}
.post-lead{color:var(--text-dim); font-size:clamp(1.05rem,1.6vw,1.25rem); margin:18px auto 0; max-width:700px;}
.post-meta{display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:8px 22px; margin-top:24px; color:var(--text-dim); font-size:.9rem;}
.post-author{display:flex; align-items:center; gap:8px; color:var(--text); font-weight:600;}
.post-author img{width:28px; height:28px; border-radius:8px;}
.post-cover{max-width:1100px; margin:44px auto 0; padding:0 24px;}
.post-cover img{width:100%; border-radius:26px; border:1px solid var(--border); box-shadow:var(--shadow); aspect-ratio:16/9; object-fit:cover;}
.post-layout{position:relative; z-index:1; display:grid; grid-template-columns:60px minmax(0, 720px); justify-content:center; gap:40px; padding-top:50px; padding-bottom:80px;}
.post-share{position:sticky; top:110px; align-self:start; display:flex; flex-direction:column; align-items:center; gap:10px;}
.post-share span{font-size:.68rem; text-transform:uppercase; letter-spacing:1px; color:var(--text-dim); writing-mode:vertical-rl; transform:rotate(180deg); margin-bottom:6px;}
.post-share a, .post-share button{width:42px; height:42px; border-radius:50%; display:grid; place-items:center; background:var(--surface); border:1px solid var(--border); cursor:pointer; transition:all .25s;}
.post-share a:hover, .post-share button:hover{background:var(--grad); border-color:transparent;}
.post-share svg{width:18px; height:18px; fill:var(--text);}
.post-share button.is-copied{background:#22c55e;}

.prose{font-size:1.12rem; line-height:1.8; color:#d6dbef;}
.prose > * + *{margin-top:1.15em;}
.prose h2{font-size:1.75rem; font-weight:800; line-height:1.25; color:var(--text); margin-top:1.8em; letter-spacing:-.3px;}
.prose h3{font-size:1.35rem; font-weight:700; color:var(--text); margin-top:1.5em;}
.prose a{color:var(--cyan); text-decoration:underline; text-underline-offset:3px;}
.prose strong, .prose b{color:var(--text);}
.prose ul, .prose ol{padding-left:1.4em;}
.prose ul{list-style:disc;} .prose ol{list-style:decimal;}
.prose li + li{margin-top:.4em;}
.prose li::marker{color:var(--cyan);}
.prose blockquote{border-left:3px solid; border-image:var(--grad) 1; padding:.2em 0 .2em 1.2em; font-size:1.25rem; font-style:italic; color:var(--text);}
.prose .callout{background:linear-gradient(135deg, rgba(124,58,237,.16), rgba(6,182,212,.1)); border:1px solid rgba(6,182,212,.3); border-radius:18px; padding:20px 24px;}
.prose .callout p{margin:0;}
.prose figure img, .prose > img{width:100%; border-radius:18px; border:1px solid var(--border);}
.prose figcaption{text-align:center; color:var(--text-dim); font-size:.86rem; margin-top:8px;}
.prose hr{border:0; height:1px; background:var(--border); margin:2.2em 0;}
.prose .video{position:relative; aspect-ratio:16/9; border-radius:18px; overflow:hidden; border:1px solid var(--border);}
.prose .video iframe{position:absolute; inset:0; width:100%; height:100%; border:0;}

.post-socials{margin-top:50px; display:flex; flex-direction:column; gap:18px; background:var(--surface); border:1px solid var(--border); border-radius:22px; padding:26px 28px;}
.post-socials h2{font-size:1.25rem; font-weight:700;}
.post-socials-list{display:flex; flex-wrap:wrap; gap:10px;}
.post-social{display:inline-flex; align-items:center; gap:10px; padding:11px 18px; border-radius:999px; font-weight:700; font-size:.92rem; color:#fff; transition:transform .25s var(--ease);}
.post-social:hover{transform:translateY(-3px);}
.post-social svg{width:18px; height:18px; fill:#fff;}
.post-social.is-instagram{background:radial-gradient(circle at 30% 110%, #fdf497 0%, #fd5949 45%, #d6249f 60%, #285AEB 90%);}
.post-social.is-tiktok{background:#111; border:1px solid rgba(255,255,255,.2); box-shadow:-2px -2px 0 #25F4EE, 2px 2px 0 #FE2C55;}
.post-social.is-youtube{background:#ff0033;}
.post-social.is-link{background:var(--grad);}
.post-tags{display:flex; flex-wrap:wrap; gap:8px; margin-top:30px;}
.post-tags span{padding:5px 12px; border-radius:999px; background:rgba(255,255,255,.05); border:1px solid var(--border); color:var(--text-dim); font-size:.84rem;}
.post-cta{margin-top:40px; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:18px; background:linear-gradient(135deg, var(--surface-2), var(--surface)); border:1px solid rgba(6,182,212,.3); border-radius:22px; padding:28px;}
.post-cta h2{font-size:1.3rem; font-weight:800;}
.post-cta p{color:var(--text-dim);}
@media (max-width: 980px){
  .blog-featured{grid-template-columns:1fr;}
  .blog-featured-img{min-height:240px;}
  .blog-grid, .blog-grid.is-cols-3, .blog-grid.is-cols-4{grid-template-columns:repeat(2,1fr);}
  .blog-featured.is-minimal{gap:20px;}
  .post-layout{grid-template-columns:minmax(0,1fr); gap:24px;}
  .post-share{position:static; flex-direction:row; justify-content:center; order:2;}
  .post-share span{writing-mode:horizontal-tb; transform:none; margin:0 6px 0 0;}
}
@media (max-width: 620px){
  .blog-grid, .blog-grid.is-cols-2, .blog-grid.is-cols-3, .blog-grid.is-cols-4{grid-template-columns:1fr;}
  .blog-grid.is-list .blog-card{flex-direction:column;}
  .blog-grid.is-list .blog-card-img{flex:none; aspect-ratio:16/9; min-height:0;}
  .blog-featured-copy{padding:26px 22px;}
  .prose{font-size:1.04rem;}
  .post-cover{padding:0 16px;}
  .post-cover img{border-radius:18px;}
}

/* "em breve" badge */
.badge-soon{display:inline-block; vertical-align:middle; margin-left:6px; padding:3px 9px; border-radius:999px; background:rgba(236,72,153,.15); border:1px solid rgba(236,72,153,.35); color:#f9a8d4; font-size:.66rem; font-weight:700; letter-spacing:.8px; text-transform:uppercase;}

/* operational summary box (Smart Motel) */
.ops-box{display:grid; grid-template-columns:.8fr 1.2fr; gap:40px; align-items:center; background:linear-gradient(160deg, var(--surface), var(--surface-2)); border:1px solid var(--border); border-radius:var(--radius); padding:36px 40px; margin-bottom:20px;}
.ops-box h3{font-size:1.4rem; font-weight:800; line-height:1.25;}
.ops-list{display:grid; grid-template-columns:1fr 1fr; gap:10px 28px; margin:0;}

/* web panel section (Smart Motel) */
.web-grid{display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:center;}
.web-title{font-size:clamp(1.8rem,3.2vw,2.5rem); font-weight:800; line-height:1.15; margin-bottom:14px; letter-spacing:-.3px;}
.web-grid .row-feature-list strong{color:var(--text);}
.web-visual{height:clamp(320px, 36vw, 460px);}
.web-visual.is-visible .bv-browser, .web-visual.is-visible .bv-phone{opacity:1; transform:none;}

/* in-page anchors (product pages) */
[id]{scroll-margin-top:110px;}
.page-anchors{display:flex; flex-wrap:wrap; justify-content:center; gap:10px; margin:0 auto 60px;}
.page-anchors a{padding:8px 18px; border-radius:999px; background:rgba(255,255,255,.05); border:1px solid var(--border); font-size:.88rem; color:var(--text-dim); transition:all .25s;}
.page-anchors a:hover{border-color:var(--cyan); color:var(--text);}

/* comparison table */
.compare-wrap{max-width:920px; margin:10px auto 70px; overflow-x:auto; background:var(--surface); border:1px solid var(--border); border-radius:var(--radius);}
.compare-table{width:100%; min-width:560px; border-collapse:collapse; font-size:.93rem;}
.compare-table th, .compare-table td{padding:16px 20px; text-align:left; vertical-align:top; border-bottom:1px solid var(--border);}
.compare-table tbody tr:last-child td{border-bottom:0;}
.compare-table thead th{font-size:.78rem; text-transform:uppercase; letter-spacing:1px; color:var(--text-dim); background:rgba(255,255,255,.03);}
.compare-table thead th.is-smart{color:var(--cyan);}
.compare-table td:first-child{font-weight:600; width:24%;}
.compare-table td.is-before{color:var(--text-dim);}
.compare-table td.is-before::before{content:"✕ "; color:var(--pink); font-weight:700;}
.compare-table td.is-smart{background:rgba(6,182,212,.06);}
.compare-table td.is-smart::before{content:"✓ "; color:var(--cyan); font-weight:700;}

/* faq accordion */
.faq-list{max-width:820px; margin:0 auto; display:flex; flex-direction:column; gap:12px;}
.faq-item{background:var(--surface); border:1px solid var(--border); border-radius:16px; transition:border-color .25s;}
.faq-item[open]{border-color:rgba(6,182,212,.35);}
.faq-item summary{list-style:none; cursor:pointer; padding:20px 24px; font-weight:600; display:flex; justify-content:space-between; align-items:center; gap:16px;}
.faq-item summary::-webkit-details-marker{display:none;}
.faq-item summary::after{content:"+"; font-size:1.4rem; line-height:1; color:var(--cyan); flex-shrink:0; transition:transform .3s var(--ease);}
.faq-item[open] summary::after{transform:rotate(45deg);}
.faq-item p{padding:0 24px 22px; color:var(--text-dim); font-size:.95rem;}

/* legal pages */
.legal{max-width:820px; margin:0 auto;}
.legal h2{font-size:1.3rem; margin:36px 0 12px;}
.legal p, .legal li{color:var(--text-dim); margin-bottom:12px;}
.legal ul{list-style:disc; padding-left:22px;}
.legal a{color:var(--cyan);}

/* responsive */
@media (max-width: 980px){
  .intro-grid{grid-template-columns:1fr; text-align:center; gap:40px;}
  .hero-sub{margin-left:auto; margin-right:auto;}
  .hero-actions{justify-content:center;}
  .banner{min-height:0; padding-top:90px;}
  .banner-grid{grid-template-columns:1fr; gap:28px; text-align:center; min-height:0; padding-top:20px;}
  .banner-sub{margin-left:auto; margin-right:auto;}
  .banner-visual{height:clamp(260px, 62vw, 420px); max-width:620px; width:100%; margin:0 auto;}
  .mv-grid, .diff-grid{grid-template-columns:1fr;}
  .products-grid{grid-template-columns:repeat(2,1fr);}
  .teaser-grid{grid-template-columns:1fr; text-align:center;}
  .teaser-grid .section-sub, .teaser-grid p{text-align:center !important;}
  .product-row, .product-row.reverse{grid-template-columns:1fr;}
  .product-row.reverse .row-visual, .product-row.reverse .row-copy{order:0;}
  .stats-bar{grid-template-columns:repeat(2,1fr);}
  .feature-grid{grid-template-columns:1fr;}
  .ops-box{grid-template-columns:1fr; gap:22px; padding:28px 24px;}
  .eco-nav{grid-template-columns:repeat(3,1fr);}
  .why-grid{grid-template-columns:repeat(2,1fr);}
  .eco-map{grid-template-columns:1fr; grid-template-areas:"hub" "top" "left" "right" "bottom"; gap:14px; max-width:460px;}
  .eco-lines{display:none;}
  .eco-hub{order:-1;}
  .web-grid{grid-template-columns:1fr; gap:36px;}
  .gallery-grid{grid-template-columns:repeat(2,1fr);}
}
@media (max-width: 860px){
  .nav-links, .nav-cta{display:none;}
  .burger{display:flex;}
  .nav-links.open{display:flex; position:fixed; inset:0 0 0 auto; width:70%; height:100vh; background:rgba(10,14,26,.98); flex-direction:column; justify-content:center; align-items:center; gap:28px; font-size:1.2rem; overflow-y:auto; padding:40px 0;}
  .has-dropdown{display:flex; flex-direction:column; align-items:center;}
  .has-dropdown::after{display:none;}
  .dropdown-menu{position:static; opacity:1; visibility:visible; transform:none; background:transparent; border:0; box-shadow:none; padding:14px 0 0; margin:0; align-items:center;}
  .dropdown-menu a{font-size:1rem; padding:8px 0; color:var(--text-dim);}
  .dropdown-menu a.is-current{padding:8px 16px;}
  .nav-links.open a.nav-mobile-cta{display:inline-flex; color:#fff; font-size:1rem;}
  .nav-links a.nav-mobile-cta::after{display:none;}
}
@media (max-width: 620px){
  .products-grid{grid-template-columns:1fr;}
  .banner-arrow{display:none;}
  .banner-nav{padding:18px 16px 32px;}
  .banner-tab{padding:10px 14px; font-size:.85rem;}
  .bv-card figcaption{display:none;}
  .cta-inner{padding:44px 24px;}
  .stats-bar{grid-template-columns:1fr 1fr;}
  .gallery-grid{grid-template-columns:1fr;}
  .ops-list{grid-template-columns:1fr;}
  .eco-nav{grid-template-columns:1fr 1fr;}
  .why-grid{grid-template-columns:1fr;}
}

/* ===== Animações (Painel > Configurações > Animações do site). Cada grupo é uma classe no <html> ===== */

/* troca de página: o menu fica parado e só o conteúdo troca (script em lib/anim.php) */
.anim-pages .nav{view-transition-name:site-nav;}
/* --vt-ms vem de Painel > Configurações (duração da troca de página); o resto é proporcional a ela */
::view-transition-old(root), ::view-transition-new(root){animation-duration:calc(var(--vt-ms, 1300ms) * .46);}
/* links do menu: a página nova abre num círculo a partir do clique */
html[data-vt="circle"]::view-transition-image-pair(root){isolation:auto;}
html[data-vt="circle"]::view-transition-old(root), html[data-vt="circle"]::view-transition-new(root){animation:none; mix-blend-mode:normal; display:block;}
/* cartões de produto: a imagem e o título do cartão viram o topo da página do produto */
html[data-vt="card"] .page-hero h1{view-transition-name:vt-title; width:fit-content; margin-inline:auto;}
html[data-vt="card"] .page-hero .hero-media, html[data-vt="card"] .sc-hero-device{view-transition-name:vt-photo;}
html[data-vt="card"] .page-hero .reveal{opacity:1; transform:none; transition:none;}
html[data-vt="card"] .sc-hero-device{animation:none;}
html[data-vt="card"]::view-transition-group(vt-photo), html[data-vt="card"]::view-transition-group(vt-title){animation-duration:var(--vt-ms, 1300ms); animation-timing-function:cubic-bezier(.65,0,.35,1);}
::view-transition-old(vt-photo), ::view-transition-new(vt-photo){width:100%; height:100%; object-fit:contain;}
html[data-vt="card"]::view-transition-old(root){animation-duration:calc(var(--vt-ms, 1300ms) * .38);}
html[data-vt="card"]::view-transition-new(root){animation-duration:calc(var(--vt-ms, 1300ms) * .6); animation-delay:calc(var(--vt-ms, 1300ms) * .65);}

/* menu do celular: o ícone vira X, o painel desliza e os itens entram um a um */
.anim-menu .burger.open span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.anim-menu .burger.open span:nth-child(2){opacity:0; transform:scaleX(0);}
.anim-menu .burger.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
@keyframes smMenuIn{from{transform:translateX(100%);}}
@keyframes smItemIn{from{opacity:0; transform:translateX(28px);}}
@media (max-width: 860px){
  .anim-menu .nav-links.open{animation:smMenuIn .45s var(--ease);}
  .anim-menu .nav-links.open > *{animation:smItemIn .5s var(--ease) both;}
  .anim-menu .nav-links.open > :nth-child(1){animation-delay:.08s;}
  .anim-menu .nav-links.open > :nth-child(2){animation-delay:.13s;}
  .anim-menu .nav-links.open > :nth-child(3){animation-delay:.18s;}
  .anim-menu .nav-links.open > :nth-child(4){animation-delay:.23s;}
  .anim-menu .nav-links.open > :nth-child(5){animation-delay:.28s;}
  .anim-menu .nav-links.open > :nth-child(6){animation-delay:.33s;}
}
/* submenu de Produtos no computador: abre com uma leve escala e os itens descem em sequência */
@media (min-width: 861px){
  .anim-menu .dropdown-menu{transform:translateX(-50%) translateY(10px) scale(.94); transform-origin:50% 0;}
  .anim-menu .has-dropdown:hover .dropdown-menu, .anim-menu .has-dropdown:focus-within .dropdown-menu{transform:translateX(-50%) translateY(0) scale(1);}
  .anim-menu .dropdown-menu a{opacity:0; transform:translateY(-6px); transition:opacity .25s, transform .3s var(--ease), background .25s, color .25s;}
  .anim-menu .has-dropdown:hover .dropdown-menu a, .anim-menu .has-dropdown:focus-within .dropdown-menu a{opacity:1; transform:none;}
  .anim-menu .has-dropdown:hover .dropdown-menu a:nth-child(2), .anim-menu .has-dropdown:focus-within .dropdown-menu a:nth-child(2){transition-delay:.04s;}
  .anim-menu .has-dropdown:hover .dropdown-menu a:nth-child(3), .anim-menu .has-dropdown:focus-within .dropdown-menu a:nth-child(3){transition-delay:.08s;}
  .anim-menu .has-dropdown:hover .dropdown-menu a:nth-child(4), .anim-menu .has-dropdown:focus-within .dropdown-menu a:nth-child(4){transition-delay:.12s;}
}

/* detalhes: brilho que passa pelos botões principais de tempos em tempos e borda em gradiente nos cartões de produto */
.anim-details .btn-primary{position:relative; overflow:hidden; isolation:isolate;}
.anim-details .btn-primary::after{content:""; position:absolute; z-index:-1; top:0; bottom:0; left:-60%; width:45%; background:linear-gradient(100deg, transparent, rgba(255,255,255,.38), transparent); transform:skewX(-20deg); animation:smShine 7s ease-in-out infinite; pointer-events:none;}
@keyframes smShine{0%, 74%{transform:translateX(0) skewX(-20deg);} 88%, 100%{transform:translateX(420%) skewX(-20deg);}}
.anim-details .product-card::before{content:""; position:absolute; inset:-1px; border-radius:inherit; padding:1px; background:var(--grad); -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite:xor; mask-composite:exclude; opacity:0; transition:opacity .4s var(--ease); pointer-events:none;}
.anim-details .product-card:hover::before{opacity:1;}

@media (prefers-reduced-motion: reduce){
  ::view-transition-group(*), ::view-transition-old(*), ::view-transition-new(*){animation:none !important;}
  .anim-menu .nav-links.open, .anim-menu .nav-links.open > *{animation:none;}
  .anim-details .btn-primary::after{display:none;}
}