/*
Theme Name: Sabb Viagens
Theme URI: https://www.sabb.com.br/
Author: Sabb Viagens
Author URI: https://www.sabb.com.br/
Description: Tema WordPress da Sabb Viagens com identidade visual personalizada.
Version: 1.1.0
Requires at least: 6.0
Tested up to: 6.6
Requires PHP: 7.4
Text Domain: sabb
*/:root{
  --sabb-primary:#2FB3B5; /* teal from logo pin */
  --sabb-accent:#D74967;  /* pink script color */
  --sabb-dark:#2E3440;    /* deep gray for text */
  --sabb-light:#F8FAFD;   /* soft background */
}
*{box-sizing:border-box}
body{margin:0;font-family:'Montserrat',sans-serif;color:var(--sabb-dark);background:var(--sabb-light)}
a{color:var(--sabb-accent);text-decoration:none}
.container{max-width:1140px;margin:0 auto;padding:0 16px}
.header{background:#fff;border-bottom:1px solid #e8eef5;position:sticky;top:0;z-index:50}
.header .wrap{display:flex;align-items:center;justify-content:space-between;padding:14px 0}
.logo img{height:50px}
.nav a{margin:0 10px;font-weight:600}
.hero{background:linear-gradient(180deg,#ffffff,#eef5fb);padding:48px 0;margin-bottom:18px;text-align:center}
.hero h1{margin:0 0 8px 0;font-size:36px;color:var(--sabb-primary);font-weight:700}
.hero p{margin:0 0 18px 0;max-width:720px;margin-left:auto;margin-right:auto}
.btn{display:inline-block;padding:10px 16px;border-radius:10px;background:var(--sabb-primary);color:#fff;font-weight:700;transition:.2s}
.btn:hover{opacity:.85}
.btn.outline{background:transparent;border:2px solid var(--sabb-accent);color:var(--sabb-accent)}
.grid{display:grid;gap:16px}
.grid.cards{grid-template-columns:repeat(auto-fill,minmax(240px,1fr))}
.card{background:#fff;border:1px solid #e7edf4;border-radius:14px;overflow:hidden;display:flex;flex-direction:column;transition:.2s}
.card:hover{box-shadow:0 6px 14px rgba(0,0,0,.08)}
.card .thumb{aspect-ratio:16/9;background:#ddd}
.card .body{padding:14px}
.badges{display:flex;gap:6px;flex-wrap:wrap;margin:8px 0}
.badge{background:var(--sabb-secondary);color:#fff;padding:4px 8px;border-radius:999px;font-size:12px}
.footer{background:var(--sabb-secondary);color:#fff;margin-top:40px}
.footer .wrap{padding:26px 0;display:flex;flex-wrap:wrap;gap:20px;align-items:center;justify-content:space-between}
.whatsapp-fab{position:fixed;right:16px;bottom:16px;background:#25D366;color:#fff;border-radius:999px;padding:12px 16px;font-weight:800;box-shadow:0 8px 24px rgba(0,0,0,.2);z-index:60}
.filters{background:#fff;border:1px solid #e7edf4;border-radius:12px;padding:10px;display:flex;gap:8px;flex-wrap:wrap}
.filters select,.filters input{padding:8px;border-radius:8px;border:1px solid #cfe1f3}
.ad-slot{margin:16px 0}
.section-title{font-size:22px;margin:16px 0;font-weight:700;color:var(--sabb-primary)}
.small{font-size:14px;color:#666}
@media (max-width:768px){
  .nav{display:none}
  .menu-toggle{display:inline-block}
}
.menu-toggle{display:none;background:transparent;border:0;font-size:28px}

/* === Viagem Sales Page (Sabb) === */
.viagem-hero{position:relative;min-height:320px;background-size:cover;background-position:center;border-radius:18px;overflow:hidden;margin:18px 0}
.viagem-hero .shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.45),rgba(0,0,0,.15))}
.viagem-hero .hero-inner{position:relative;color:#fff;padding:40px 0}
.viagem-hero .title{margin:8px 0 4px 0;font-size:34px;line-height:1.15}
.viagem-hero .kicker{font-weight:600;opacity:.95}
.viagem-hero .meta-line span{margin-right:10px;opacity:.95}
.price-pill{display:inline-block;margin-top:10px;background:var(--sabb-accent);color:#fff;padding:8px 12px;border-radius:999px;font-weight:800}

.viagem-layout{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:20px;margin:20px 0}
.viagem-main .block{background:#fff;border:1px solid #e7edf4;border-radius:14px;padding:16px;margin-bottom:14px}
.usp-grid{display:grid;gap:12px;grid-template-columns:1fr 1fr}
.usp h3{margin:.2rem 0}
.content p{margin:.6rem 0 1rem 0}

.viagem-aside .sticky-cta{position:sticky;top:90px}
.price-big{font-size:18px;margin-bottom:6px}
.mini-specs{list-style:none;padding:0;margin:8px 0}
.mini-specs li{margin:4px 0}
.pad{padding:8px;background:#f6f9fc;border-radius:10px;border:1px solid #e7edf4}

.trust-bar{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:16px 0}
.trust-bar .trust-item{background:#f7fbff;border:1px solid #e3eef9;border-radius:10px;padding:10px}

.faq .faq-item{border:1px solid #e8eef5;border-radius:10px;margin:8px 0;overflow:hidden;background:#fff}
.faq .faq-q{width:100%;text-align:left;padding:12px 14px;font-weight:700;border:0;background:#f4f8fc;cursor:pointer}
.faq .faq-a{display:none}
.faq .faq-a.open{display:block}
.faq .pad{border-top:1px solid #e8eef5}

@media (max-width: 980px){
  .viagem-layout{grid-template-columns:1fr}
  .viagem-aside .sticky-cta{position:static}
  .usp-grid{grid-template-columns:1fr}
}

/* ==== Refinamento Visual Sabb (cores, hero e ícones) ==== */

/* Ajuste fino das cores da marca (pode trocar pelos HEX oficiais que você usar) */
:root{
  --sabb-primary:#2FB3B5; /* teal/pin */
  --sabb-accent:#D74967;  /* rosa caligrafia */
  --sabb-dark:#2E3440;    /* cinza profundo */
  --sabb-light:#F8FAFD;   /* fundo suave */
  --sabb-teal-900:#117C7E;
  --sabb-rose-900:#AD2D4A;
  --sabb-hero-1: rgba(47,179,181,.70); /* overlay alto */
  --sabb-hero-2: rgba(215,73,103,.60); /* overlay baixo */
}

/* HERO com gradiente da marca */
.viagem-hero{position:relative;min-height:360px;background-size:cover;background-position:center;border-radius:20px;overflow:hidden;margin:22px 0;box-shadow:0 10px 30px rgba(0,0,0,.06)}
.viagem-hero .shade{position:absolute;inset:0;background:
  linear-gradient(180deg,var(--sabb-hero-1),transparent 40%),
  linear-gradient(0deg,var(--sabb-hero-2),transparent 45%);}
.viagem-hero .hero-inner{position:relative;color:#fff;padding:48px 0}
.viagem-hero .title{font-weight:800;letter-spacing:.2px}
.price-pill{display:inline-block;margin-top:12px;background:var(--sabb-accent);color:#fff;padding:10px 14px;border-radius:999px;font-weight:800;box-shadow:0 6px 18px rgba(215,73,103,.28)}

/* Layout / cartões com micro-interações */
.viagem-main .block{background:#fff;border:1px solid #e7edf4;border-radius:16px;padding:18px;margin-bottom:16px;transition:box-shadow .2s ease, transform .2s ease}
.viagem-main .block:hover{box-shadow:0 10px 30px rgba(0,0,0,.06); transform:translateY(-1px)}
.viagem-aside .sticky-cta.card{border-radius:16px;box-shadow:0 10px 26px rgba(0,0,0,.06)}
.btn,.whatsapp-fab{transition:transform .08s ease, box-shadow .2s ease}
.btn:hover{transform:translateY(-1px);box-shadow:0 8px 20px rgba(0,0,0,.08)}
.whatsapp-fab{font-weight:800}

/* Títulos com ícones (SVG como máscara, sem imagens externas) */
.sec-title{display:flex;align-items:center;gap:10px;font-weight:800;color:var(--sabb-dark)}
.sec-title::before{
  content:"";width:18px;height:18px;background:var(--sabb-accent);
  -webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
}

/* Ícone padrão (avião) */
.sec-title::before{
  -webkit-mask-image: url('data:image/svg+xml;utf8,<svg width="18" height="18" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="%23000" d="M21 16v-2l-8-5V3.5a1.5 1.5 0 0 0-3 0V9L2 14v2l8-2.5V19l-2 1.5V22l3.5-1 3.5 1v-1.5L13 19v-5.5z"/></svg>');
          mask-image: url('data:image/svg+xml;utf8,<svg width="18" height="18" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="%23000" d="M21 16v-2l-8-5V3.5a1.5 1.5 0 0 0-3 0V9L2 14v2l8-2.5V19l-2 1.5V22l3.5-1 3.5 1v-1.5L13 19v-5.5z"/></svg>');
}

/* Ícones específicos por seção */
.sec-descricao::before{
  background:var(--sabb-primary);
  -webkit-mask-image:url('data:image/svg+xml;utf8,<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path fill="%23000" d="M6 2h9l5 5v13a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2zm8 1.5V8h4.5L14 3.5z"/></svg>');
          mask-image:url('data:image/svg+xml;utf8,<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path fill="%23000" d="M6 2h9l5 5v13a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2zm8 1.5V8h4.5L14 3.5z"/></svg>');
}
.sec-roteiro::before{
  background:var(--sabb-accent);
  -webkit-mask-image:url('data:image/svg+xml;utf8,<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path fill="%23000" d="M3 5h14v2H3V5zm0 6h10v2H3v-2zm0 6h14v2H3v-2zM19 5h2v14h-2V5z"/></svg>');
          mask-image:url('data:image/svg+xml;utf8,<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path fill="%23000" d="M3 5h14v2H3V5zm0 6h10v2H3v-2zm0 6h14v2H3v-2zM19 5h2v14h-2V5z"/></svg>');
}
.sec-hospedagem::before{
  background:var(--sabb-primary);
  -webkit-mask-image:url('data:image/svg+xml;utf8,<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path fill="%23000" d="M4 12V6a4 4 0 0 1 4-4h8a2 2 0 0 1 2 2v8h2v8h-2v-3H4v3H2v-8h2zm2 0h10V4H8a2 2 0 0 0-2 2v6z"/></svg>');
          mask-image:url('data:image/svg+xml;utf8,<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path fill="%23000" d="M4 12V6a4 4 0 0 1 4-4h8a2 2 0 0 1 2 2v8h2v8h-2v-3H4v3H2v-8h2zm2 0h10V4H8a2 2 0 0 0-2 2v6z"/></svg>');
}
.sec-transporte::before{
  background:var(--sabb-accent);
  -webkit-mask-image:url('data:image/svg+xml;utf8,<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path fill="%23000" d="M3 13V6a2 2 0 0 1 2-2h7l5 4v5h1a2 2 0 0 1 2 2v4h-2a2 2 0 1 1-4 0H9a2 2 0 1 1-4 0H3v-3a2 2 0 0 1 2-2h12V9.5L11 5H5v8H3z"/></svg>');
          mask-image:url('data:image/svg+xml;utf8,<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path fill="%23000" d="M3 13V6a2 2 0 0 1 2-2h7l5 4v5h1a2 2 0 0 1 2 2v4h-2a2 2 0 1 1-4 0H9a2 2 0 1 1-4 0H3v-3a2 2 0 0 1 2-2h12V9.5L11 5H5v8H3z"/></svg>');
}
.sec-opcionais::before{
  background:var(--sabb-primary);
  -webkit-mask-image:url('data:image/svg+xml;utf8,<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path fill="%23000" d="M12 2l3 7h7l-5.7 4.1L18.9 21 12 16.8 5.1 21l2.6-7.9L2 9h7z"/></svg>');
          mask-image:url('data:image/svg+xml;utf8,<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path fill="%23000" d="M12 2l3 7h7l-5.7 4.1L18.9 21 12 16.8 5.1 21l2.6-7.9L2 9h7z"/></svg>');
}
.sec-faq::before{
  background:var(--sabb-accent);
  -webkit-mask-image:url('data:image/svg+xml;utf8,<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path fill="%23000" d="M12 3a9 9 0 0 0-9 9 8.9 8.9 0 0 0 3.1 6.8L5 21l2.4-1.1A9 9 0 1 0 12 3zm-1 13h2v2h-2v-2zm2.1-3.9c-.6.5-1.1.9-1.1 1.9h-2c0-1.6.8-2.3 1.5-2.9.6-.5 1.1-.9 1.1-1.7 0-.8-.6-1.4-1.6-1.4s-1.7.7-1.7 1.9H7c0-2 1.4-3.7 3.6-3.7 2.1 0 3.5 1.3 3.5 3.1 0 1.3-.7 2-1.4 2.8z"/></svg>');
          mask-image:url('data:image/svg+xml;utf8,<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path fill="%23000" d="M12 3a9 9 0 0 0-9 9 8.9 8.9 0 0 0 3.1 6.8L5 21l2.4-1.1A9 9 0 1 0 12 3zm-1 13h2v2h-2v-2zm2.1-3.9c-.6.5-1.1.9-1.1 1.9h-2c0-1.6.8-2.3 1.5-2.9.6-.5 1.1-.9 1.1-1.7 0-.8-.6-1.4-1.6-1.4s-1.7.7-1.7 1.9H7c0-2 1.4-3.7 3.6-3.7 2.1 0 3.5 1.3 3.5 3.1 0 1.3-.7 2-1.4 2.8z"/></svg>');
}

/* Subtítulos dentro do bloco "USP" (inclui/não inclui) */
.sub-title{display:flex;align-items:center;font-weight:800;margin:.3rem 0 .6rem 0}
.sub-title::before{
  content:"";width:16px;height:16px;margin-right:8px;background:var(--sabb-primary);
  -webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
}
.sub-inclui::before{
  background:var(--sabb-primary);
  -webkit-mask-image:url('data:image/svg+xml;utf8,<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path fill="%23000" d="M9 16.17l-3.88-3.88L3.7 13.7 9 19l12-12-1.41-1.41z"/></svg>');
          mask-image:url('data:image/svg+xml;utf8,<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path fill="%23000" d="M9 16.17l-3.88-3.88L3.7 13.7 9 19l12-12-1.41-1.41z"/></svg>');
}
.sub-nao-inclui::before{
  background:var(--sabb-rose-900);
  -webkit-mask-image:url('data:image/svg+xml;utf8,<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path fill="%23000" d="M18.3 5.71L12 12l6.3 6.29-1.41 1.42L10.59 13.4 4.29 19.7 2.87 18.3 9.17 12 2.87 5.7 4.29 4.29 10.6 10.6l6.29-6.3z"/></svg>');
          mask-image:url('data:image/svg+xml;utf8,<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path fill="%23000" d="M18.3 5.71L12 12l6.3 6.29-1.41 1.42L10.59 13.4 4.29 19.7 2.87 18.3 9.17 12 2.87 5.7 4.29 4.29 10.6 10.6l6.29-6.3z"/></svg>');
}

/* FAQ melhorada */
.faq .faq-item{border:1px solid #e8eef5;border-radius:12px;margin:10px 0;background:#fff;overflow:hidden}
.faq .faq-q{width:100%;text-align:left;padding:12px 14px;font-weight:800;border:0;background:#f4f8fc;color:var(--sabb-dark);cursor:pointer}
.faq .faq-a{display:none}
.faq .faq-a.open{display:block}
.faq .pad{border-top:1px solid #e8eef5}

/* Responsivo */
@media (max-width: 980px){
  .viagem-hero{min-height:300px}
}

/* ====== Hero mais atrativo na single de viagens ====== */

/* reforça o overlay com as cores da marca */
.viagem-hero .shade{
  position:absolute; inset:0;
  background:
    linear-gradient(180deg, rgba(47,179,181,.65), rgba(47,179,181,0) 40%),
    linear-gradient(0deg, rgba(215,73,103,.55), rgba(215,73,103,0) 55%),
    linear-gradient(180deg, rgba(0,0,0,.35), rgba(0,0,0,.15));
}

/* texto branco com sombra suave para legibilidade */
.viagem-hero .title,
.viagem-hero .kicker,
.viagem-hero .meta-line span{
  color:#fff;
  text-shadow:0 2px 6px rgba(0,0,0,.35);
}

/* transforma a meta-line em badges */
.viagem-hero .meta-line{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  margin-top:8px;
}
.viagem-hero .meta-line span{
  background:rgba(255,255,255,.18);
  border:1px solid rgba(255,255,255,.25);
  padding:4px 10px;
  border-radius:999px;
  font-weight:600;
  font-size:14px;
  line-height:1.3;
}

/* dá destaque na pill de preço */
.price-pill{
  display:inline-block;
  margin-top:12px;
  background:var(--sabb-accent);
  color:#fff;
  padding:10px 16px;
  border-radius:999px;
  font-weight:800;
  box-shadow:0 6px 18px rgba(215,73,103,.28);
}

/* responsivo */
@media (max-width: 768px){
  .viagem-hero .hero-inner{ padding:36px 16px; }
  .viagem-hero .title{ font-size:28px; }
}

/* ====== CTA Premium Lateral ====== */

.viagem-aside .sticky-cta.card{
  background: linear-gradient(135deg, var(--sabb-primary) 0%, var(--sabb-accent) 100%);
  color:#fff;
  border:0;
  border-radius:18px;
  box-shadow:0 10px 30px rgba(0,0,0,.12);
  overflow:hidden;
  transform:translateY(0);
  transition:transform .2s ease, box-shadow .2s ease;
}
.viagem-aside .sticky-cta.card:hover{
  transform:translateY(-2px);
  box-shadow:0 14px 34px rgba(0,0,0,.18);
}

.viagem-aside .sticky-cta .body{
  padding:22px 18px;
}

/* preço grande destacado */
.viagem-aside .price-big{
  font-size:22px;
  font-weight:800;
  margin-bottom:10px;
  color:#fff;
  text-shadow:0 2px 8px rgba(0,0,0,.3);
}

/* lista menor, em branco */
.viagem-aside .mini-specs li{
  color:#f0f0f0;
  margin:6px 0;
}

/* botão WhatsApp especial */
.viagem-aside .sticky-cta .whatsapp-fab{
  position:static;
  display:block;
  width:100%;
  text-align:center;
  padding:14px 18px;
  border-radius:12px;
  font-size:16px;
  font-weight:800;
  background:#25D366;
  box-shadow:0 6px 20px rgba(0,0,0,.25);
}
.viagem-aside .sticky-cta .whatsapp-fab:hover{
  background:#1ebe5d;
  transform:translateY(-1px);
}

/* fundo claro no formulário interno */
.viagem-aside .pad{
  background:#fff;
  border:0;
  border-radius:12px;
  padding:12px;
  margin-top:12px;
}
.viagem-aside .pad *{
  color:#333 !important;
}

/* texto auxiliar menor */
.viagem-aside .sticky-cta .small{
  color:#f8f8f8;
}

.viagem-hero .meta-line .pill{
  background:rgba(255,255,255,.18);
  border:1px solid rgba(255,255,255,.25);
  padding:4px 10px;
  border-radius:999px;
  font-weight:600;
  font-size:14px;
  line-height:1.3;
  color:#fff; text-shadow:0 2px 6px rgba(0,0,0,.35);
}

/* ======== Página Links (Sabb) ======== */
.links-hero{
  background: radial-gradient(1200px 600px at 20% -10%, rgba(47,179,181,.25), transparent 60%),
              radial-gradient(1200px 600px at 80% 110%, rgba(215,73,103,.22), transparent 60%),
              var(--sabb-light);
  padding: 28px 16px 40px;
}
.links-card{
  max-width:560px; margin:0 auto;
  background:#fff; border:1px solid #e7edf4; border-radius:22px;
  box-shadow:0 14px 38px rgba(0,0,0,.06);
  padding:24px 18px;
}
.links-brand{ text-align:center; margin-bottom:10px}
.links-logo{ height:58px; display:block; margin:0 auto 4px}
.links-title{ margin:6px 0 0 0; font-weight:800; letter-spacing:.2px; color:var(--sabb-dark) }
.links-sub{ margin:4px 0 0 0; color:#557; }

.links-actions{ display:flex; flex-direction:column; gap:10px; margin:14px 0 6px }
.btn-whats{
  display:block; text-align:center; width:100%;
  padding:14px 18px; border-radius:14px;
  background:#25D366; color:#fff; font-weight:800;
  box-shadow:0 10px 24px rgba(37,211,102,.28);
}
.btn-whats:hover{ background:#1ebe5d; transform:translateY(-1px) }
.btn-ghost{
  display:block; text-align:center; width:100%;
  padding:12px 16px; border-radius:12px; font-weight:700;
  border:2px solid var(--sabb-primary); color:var(--sabb-primary);
}
.btn-ghost:hover{ background:var(--sabb-primary); color:#fff }

.links-list{ margin:12px 0 4px 0 }
.links-list ul{ list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:10px }
.links-list li a{
  display:block; width:100%; text-align:center; padding:12px 14px; border-radius:12px;
  background:#f5f9fb; border:1px solid #e3eef6; color:var(--sabb-dark); font-weight:700;
}
.links-list li a:hover{ background:#eef6f9; border-color:#d7e8f4; transform:translateY(-1px) }

.links-contact{
  display:grid; grid-template-columns:1fr; gap:10px; margin:12px 0 6px 0
}
.contact-item{ display:flex; gap:10px; align-items:center; padding:10px 12px; border:1px solid #e7edf4; border-radius:12px; background:#fbfdff }
.ci-label{ font-size:12px; color:#577; }
.contact-item a{ font-weight:700 }

.ci-ico{ width:28px; height:28px; border-radius:10px; background:var(--sabb-accent);
  -webkit-mask-size:18px; mask-size:18px; -webkit-mask-position:center; mask-position:center; -webkit-mask-repeat:no-repeat; mask-repeat:no-repeat; }
.ci-ico-phone{ -webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="%23000" d="M6.6 10.8a15.1 15.1 0 0 0 6.6 6.6l2.2-2.2c.3-.3.8-.4 1.2-.2 1.3.5 2.7.8 4.1.8.7 0 1.3.6 1.3 1.3V21c0 .7-.6 1.3-1.3 1.3C10.9 22.3 1.7 13.1 1.7 1.3 1.7.6 2.3 0 3 0h3.8c.7 0 1.3.6 1.3 1.3 0 1.4.3 2.8.8 4.1.2.4.1.9-.2 1.2l-2.1 2.2z"/></svg>'); mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="%23000" d="M6.6 10.8a15.1 15.1 0 0 0 6.6 6.6l2.2-2.2c.3-.3.8-.4 1.2-.2 1.3.5 2.7.8 4.1.8.7 0 1.3.6 1.3 1.3V21c0 .7-.6 1.3-1.3 1.3C10.9 22.3 1.7 13.1 1.7 1.3 1.7.6 2.3 0 3 0h3.8c.7 0 1.3.6 1.3 1.3 0 1.4.3 2.8.8 4.1.2.4.1.9-.2 1.2l-2.1 2.2z"/></svg>'); }
.ci-ico-mail{ -webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="%23000" d="M20 4H4a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2V6a2 2 0 0 0-2-2zm0 4l-8 5L4 8V6l8 5 8-5v2z"/></svg>'); mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="%23000" d="M20 4H4a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2V6a2 2 0 0 0-2-2zm0 4l-8 5L4 8V6l8 5 8-5v2z"/></svg>'); }
.ci-ico-map{ -webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="%23000" d="M12 2a7 7 0 0 0-7 7c0 5.2 7 13 7 13s7-7.8 7-13a7 7 0 0 0-7-7zm0 9.5A2.5 2.5 0 1 1 12 6a2.5 2.5 0 0 1 0 5.5z"/></svg>'); mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="%23000" d="M12 2a7 7 0 0 0-7 7c0 5.2 7 13 7 13s7-7.8 7-13a7 7 0 0 0-7-7zm0 9.5A2.5 2.5 0 1 1 12 6a2.5 2.5 0 0 1 0 5.5z"/></svg>'); }

.links-form{ margin:8px 0 0 0 }
.links-h2{ font-size:18px; margin:0 0 8px 0; font-weight:800; color:var(--sabb-dark) }
.links-form-box{ background:#fbfdff; border:1px solid #e7edf4; border-radius:14px; padding:12px }

.links-footer{ text-align:center; color:#667; margin-top:14px }

@media (min-width: 520px){
  .links-actions{ flex-direction:row; }
  .links-actions a{ flex:1 }
}

/* ===== Página Links 3 colunas (Sabb) ===== */
:root{
  --sabb-rose:#c63151;
  --sabb-teal:#449ca6;
}

.links3-hero{
  background:
    radial-gradient(900px 500px at 15% -10%, rgba(68,156,166,.20), transparent 60%),
    radial-gradient(900px 500px at 85% 110%, rgba(198,49,81,.18), transparent 60%),
    var(--sabb-light,#F8FAFD);
  padding: 28px 0 40px;
}
.links3-wrap{ max-width:980px; margin:0 auto; padding:0 16px; }
.links3-brand{ text-align:center; margin-bottom:12px; }
.links3-title{
  margin:0;
  font-weight:800;
  color:#2E3440;
  letter-spacing:.2px;
  font-size: clamp(22px, 4.2vw, 32px);
}
.links3-sub{ margin:6px 0 0 0; color:#5d6a73; }

.links3-grid{
  display:grid; gap:14px; margin-top:18px;
  grid-template-columns: repeat(3, minmax(0,1fr));
}
.links3-card{
  display:flex; align-items:center; gap:12px;
  background: linear-gradient(135deg, var(--sabb-teal), var(--sabb-rose));
  color:#fff;
  border-radius:16px;
  padding:16px;
  text-decoration:none;
  box-shadow:0 10px 28px rgba(0,0,0,.10);
  transition: transform .15s ease, box-shadow .2s ease, opacity .15s ease;
}
.links3-card:hover{ transform: translateY(-2px); box-shadow:0 14px 34px rgba(0,0,0,.16); }
.links3-card.alt{ background: linear-gradient(135deg, var(--sabb-rose), var(--sabb-teal)); }
.links3-card.ghost{
  background:#fff; color:#2E3440; border:1px solid #e7edf4;
}
.links3-card.ghost:hover{ box-shadow:0 12px 30px rgba(0,0,0,.08); }

.links3-ico{
  width:44px; height:44px; min-width:44px;
  border-radius:14px; display:grid; place-items:center;
  background: rgba(255,255,255,.15);
}
.links3-card.ghost .links3-ico{ background: rgba(68,156,166,.12); color: var(--sabb-teal); }
.links3-ico svg{ width:24px; height:24px; color:#fff }
.links3-card.ghost .links3-ico svg{ color: var(--sabb-teal); }

.links3-text h3{
  margin:0 0 4px 0; font-weight:800; font-size:16px; color:#fff;
}
.links3-text p{
  margin:0; opacity:.9; color:#fff;
}
.links3-card.ghost .links3-text h3{ color:#2E3440; }
.links3-card.ghost .links3-text p{ color:#445b66; opacity:1; }

.links3-foot{ text-align:center; color:#60707a; margin-top:14px; }
.links3-foot a{ color: var(--sabb-rose); font-weight:700; }

@media (max-width: 860px){
  .links3-grid{ grid-template-columns:1fr; }
}

/* ====== LINKS (3 colunas) — ajustes mobile e cores ====== */

/* Grade: 1 coluna no mobile, 3 no desktop */
.links3-grid{
  display:grid;
  gap:14px;
  grid-template-columns:1fr;
  margin:16px 0;
}
@media (min-width: 680px){
  .links3-grid{ grid-template-columns:repeat(3, 1fr); }
}

/* Cartões: centralizados, com ícone menor */
.links3-card{
  display:flex;
  align-items:center;
  gap:12px;
  padding:14px 16px;
  border:1px solid #e7edf4;
  border-radius:16px;
  background:#fff;
  text-decoration:none;
  transition:transform .08s ease, box-shadow .2s ease, border-color .2s ease;
  box-shadow:0 8px 18px rgba(0,0,0,.04);
}
.links3-card:hover{
  transform:translateY(-1px);
  border-color:#dbe7f3;
  box-shadow:0 12px 26px rgba(0,0,0,.06);
}

/* Ícone com uma cor; texto com outra */
.links3-ico{
  width:32px; height:32px;
  display:grid; place-items:center;
  flex:0 0 32px;
  color: var(--sabb-accent);         /* COR DO ÍCONE */
}
.links3-ico svg{ width:24px; height:24px; display:block }

.links3-text{ color: var(--sabb-dark); }  /* COR DO TEXTO */
.links3-text h3{
  margin:0 0 2px 0;
  font-size:16px; line-height:1.25; font-weight:800; color:var(--sabb-dark);
}
.links3-text p{
  margin:0; font-size:13px; line-height:1.35; color:#6a7d90;
}

/* Variações já usadas (se existirem) */
.links3-card.alt{ background:#fbfdff; }
.links3-card.ghost{ background:#f7fafc; }

/* Ações extras abaixo da grade (e-mail) */
.links3-actions{
  margin-top:10px;
  display:flex; justify-content:center;
}
.btn-mail{
  display:inline-block;
  width:100%;
  max-width:560px;
  text-align:center;
  padding:12px 16px;
  border-radius:12px;
  font-weight:800;
  background:var(--sabb-primary);
  color:#fff !important;
  box-shadow:0 10px 22px rgba(0,0,0,.08);
  text-decoration:none;
  transition:transform .08s ease, filter .2s ease;
}
.btn-mail:hover{ transform:translateY(-1px); filter:brightness(.95); }

/* Pequenos refinamentos no cabeçalho da Links (opcional) */
.links3-title{ font-weight:800; color:var(--sabb-dark); margin:0 }
.links3-sub{ color:#6a7d90; margin:6px 0 0 0 }

/* ===== Página Links – Ações empilhadas com ícones ===== */
.links3-hero{
  background: radial-gradient(1200px 600px at 20% -10%, rgba(47,179,181,.20), transparent 60%),
              radial-gradient(1200px 600px at 80% 110%, rgba(215,73,103,.18), transparent 60%),
              var(--sabb-light);
  padding: 24px 12px 36px;
}
.links3-wrap{ max-width:720px; margin:0 auto }
.links3-brand{ text-align:center; margin:6px 0 12px }
.links3-title{ margin:0; font-weight:800; letter-spacing:.3px; color:var(--sabb-dark); text-transform:uppercase }
.links3-sub{ margin:6px 0 0 0; color:#6a7d90 }

/* Ações empilhadas */
.linksA-actions{
  display:flex; flex-direction:column; gap:12px;
  margin-top:14px;
}
.action-btn{
  display:flex; align-items:center; gap:12px;
  padding:14px 16px;
  border:1px solid #e7edf4; border-radius:18px;
  background:#fff; text-decoration:none;
  box-shadow:0 12px 28px rgba(0,0,0,.06);
  transition:transform .08s ease, box-shadow .2s ease, border-color .2s ease, filter .2s ease;
}
.action-btn:hover{ transform:translateY(-1px); box-shadow:0 16px 34px rgba(0,0,0,.08); border-color:#dbe7f3 }

.ab-ico{
  width:38px; height:38px; border-radius:12px;
  display:grid; place-items:center;
  color:#fff; flex:0 0 38px;
}
.ab-ico svg{ width:22px; height:22px; display:block }

/* Textos */
.ab-text{ display:flex; flex-direction:column; color:var(--sabb-dark) }
.ab-text strong{ font-size:16px; line-height:1.2; font-weight:800 }
.ab-text em{ font-size:13px; color:#6a7d90; font-style:normal; margin-top:2px }

/* Variações de botão */
.action-whats{ background:#e8f9ef; border-color:#d5f0e0 }
.action-whats .ab-ico{ background:#25D366 }          /* ícone verde WhatsApp */
.action-mail{ background:#f0fbfd; border-color:#d9f1f5 }
.action-mail .ab-ico{ background:var(--sabb-primary) }/* ícone teal Sabb */
.action-alt{ background:#fff; }
.action-alt .ab-ico{ background:var(--sabb-accent) }  /* ícone rosa Sabb */
.action-ghost{ background:#fbfdff; }
.action-ghost .ab-ico{ background:var(--sabb-primary) }

/* Rodapé */
.links3-foot{ text-align:center; color:#6a7d90; margin-top:12px }
.links3-foot a{ color:var(--sabb-accent); font-weight:800 }

/* Responsivo */
@media (min-width: 680px){
  .ab-text strong{ font-size:17px }
}

/* ====== Super Menu Sabb (dropdown + mega) ====== */
.site-header{position:sticky; top:0; z-index:50; background:#fff; border-bottom:1px solid #eef2f7}
.header-inner{display:flex; align-items:center; justify-content:space-between; gap:16px; padding:10px 0}
.logo img{height:38px; display:block}

/* desktop nav */
.main-nav{display:none}
@media (min-width: 1024px){ .main-nav{display:block} }

.menu{list-style:none; margin:0; padding:0}
.menu.level-1{display:flex; gap:22px; align-items:center}
.menu.level-1 > li{position:relative}
.menu.level-1 > li > a{
  display:block; padding:10px 4px; font-weight:700; color:var(--sabb-dark); text-decoration:none;
  border-bottom:2px solid transparent;
}
.menu.level-1 > li > a:hover{ color:var(--sabb-accent); border-color:var(--sabb-accent) }

/* seta visual p/ itens com submenu */
.menu .menu-item-has-children > a::after{
  content:""; display:inline-block; margin-left:6px; width:8px; height:8px; border:2px solid currentColor;
  border-top-color:transparent; border-left-color:transparent; transform:rotate(45deg) translateY(-1px);
}

/* dropdown base */
.menu .sub-menu{
  position:absolute; left:0; top:100%;
  background:#fff; border:1px solid #e7edf4; border-radius:14px; box-shadow:0 14px 36px rgba(0,0,0,.08);
  min-width:240px; padding:10px; display:none;
}
.menu .sub-menu li a{
  display:block; padding:8px 10px; border-radius:10px; color:var(--sabb-dark); text-decoration:none; font-weight:600;
}
.menu .sub-menu li a:hover{ background:#f6f9fc; color:var(--sabb-accent) }

/* hover abre dropdown (desktop) */
@media (min-width: 1024px){
  .menu.level-1 > li:hover > .sub-menu{ display:block }
  .menu .sub-menu li.menu-item-has-children:hover > .sub-menu{
    display:block; left:100%; top:-10px;
  }
}

/* MEGA-MENU: basta colocar a classe CSS "mega" no item de 1º nível (em Aparência → Menus) */
.menu.level-1 > li.mega > .sub-menu{
  display:none;
  width:820px; max-width:90vw;
  padding:16px; left:0; right:auto;
}
@media (min-width: 1024px){
  .menu.level-1 > li.mega:hover > .sub-menu{ display:grid }
}
.menu.level-1 > li.mega > .sub-menu{
  grid-template-columns: repeat(3, minmax(180px, 1fr));
  gap:12px;
}
.menu.level-1 > li.mega > .sub-menu > li > a{
  font-weight:800; color:#223; padding:8px 10px; cursor:default;
}
.menu.level-1 > li.mega > .sub-menu > li > a:hover{ background:transparent; color:#223 }
.menu.level-1 > li.mega > .sub-menu > li > .sub-menu a{
  font-weight:600;
}

/* botão hambúrguer + offcanvas mobile */
.nav-toggle{display:inline-flex; flex-direction:column; gap:4px; background:transparent; border:0; padding:6px}
.nav-toggle .bar{width:24px; height:2px; background:#222; display:block}
@media (min-width: 1024px){ .nav-toggle{display:none} }

.offcanvas{
  position:fixed; inset:0; background:rgba(0,0,0,.35);
  opacity:0; pointer-events:none; transition:opacity .2s ease;
}
.offcanvas .offcanvas-inner{
  position:absolute; right:0; top:0; bottom:0; width:86%; max-width:360px; background:#fff;
  padding:16px; overflow:auto; transform:translateX(100%); transition:transform .2s ease;
  box-shadow:-8px 0 24px rgba(0,0,0,.18);
}
/* estado aberto (adicionado via JS) */
.offcanvas.open{opacity:1; pointer-events:auto}
.offcanvas.open .offcanvas-inner{transform:translateX(0)}

/* menu mobile: colapsável */
#offcanvas .menu.level-1{display:block}
#offcanvas .menu.level-1 > li{border-bottom:1px solid #eef2f7}
#offcanvas .menu.level-1 > li > a{display:flex; justify-content:space-between; align-items:center; padding:14px 6px}
#offcanvas .sub-menu{position:static; display:none; border:0; border-radius:0; box-shadow:none; padding:0 0 8px 12px}
#offcanvas .sub-menu a{padding:10px 6px}

/* estado aberto de submenus no mobile (classe aplicada via JS) */
#offcanvas li.open > .sub-menu{display:block}
#offcanvas li.open > a{color:var(--sabb-accent)}

/* ===== Mega-menu com 4 colunas mais largo ===== */
.menu.level-1 > li.mega-4 > .sub-menu{
  width:1080px;        /* largura total do mega */
  max-width:95vw;      /* segurança em telas menores */
  grid-template-columns: repeat(4, minmax(180px, 1fr));
}

/* ajuste mobile: empilha tudo */
@media (max-width: 1023px){
  .menu.level-1 > li.mega-4 > .sub-menu{
    width:auto; max-width:none;
    grid-template-columns: 1fr;
  }
}

