/* =====================================================================
   CreativeNext — responsive.css
   Sobrescreve os estilos inline das páginas em telas menores.
   Os seletores usam [style*="..."] para casar com o CSS inline existente.
   Breakpoints: 1024 (tablet paisagem) · 860 (tablet) · 600 (celular) · 400 (celular pequeno)
   ===================================================================== */

html { -webkit-text-size-adjust: 100%; }
img, video { max-width: 100%; }
body { overflow-x: hidden; }

/* ---------- Menu (hambúrguer) ---------- */
.cn-burger-toggle { position: absolute; opacity: 0; width: 0; height: 0; }
.cn-burger { display: none; width: 44px; height: 44px; border-radius: 12px; border: 1.5px solid rgba(20,21,15,.18); align-items: center; justify-content: center; cursor: pointer; flex-direction: column; gap: 5px; background: transparent; }
.cn-burger span { display: block; width: 20px; height: 2px; background: #14150F; border-radius: 2px; transition: transform .25s, opacity .25s; }

/* ---------- Botão flutuante WhatsApp (só mobile) ---------- */
.cn-wa-float { display: none; }

/* ============ ≤ 1024px ============ */
@media (max-width: 1024px) {
  [style*="grid-template-columns: repeat(4, 1fr)"] { grid-template-columns: repeat(2, 1fr) !important; }
  [style*="grid-template-columns: 1.4fr 1fr 1fr 1fr"] { grid-template-columns: 1fr 1fr !important; }
  h1[style*="font-size: 78px"], h1[style*="font-size: 76px"], h1[style*="font-size: 74px"] { font-size: 56px !important; }
  [style*="font-size: 118px"] { font-size: 72px !important; }
  h2[style*="font-size: 54px"] { font-size: 44px !important; }
  h2[style*="font-size: 50px"], h2[style*="font-size: 48px"], h2[style*="font-size: 46px"] { font-size: 40px !important; }
  [style*="gap: 70px"] { gap: 40px !important; }
  [style*="gap: 60px"] { gap: 36px !important; }
}

/* ============ ≤ 860px (tablet retrato / celular grande) ============ */
@media (max-width: 860px) {
  /* Header: logo + burger + CTA */
  .cn-burger { display: flex; }
  .cn-nav { display: none !important; position: absolute; left: 0; right: 0; top: 100%; flex-direction: column; gap: 0 !important; background: #F4F1EA; border-bottom: 1px solid rgba(20,21,15,.12); padding: 8px 20px 16px; box-shadow: 0 20px 40px rgba(20,21,15,.12); }
  .cn-nav a { display: block; padding: 14px 8px; border-bottom: 1px solid rgba(20,21,15,.08); font-size: 16px !important; }
  .cn-nav a:last-child { border-bottom: 0; }
  .cn-header-inner:has(.cn-burger-toggle:checked) .cn-nav { display: flex !important; }
  .cn-burger:has(.cn-burger-toggle:checked) span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
  .cn-burger:has(.cn-burger-toggle:checked) span:nth-child(2) { opacity: 0; }
  .cn-burger:has(.cn-burger-toggle:checked) span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
  .cn-header-inner { position: relative; gap: 12px; }
  .cn-cta { padding: 10px 16px !important; font-size: 13.5px !important; white-space: nowrap; }

  /* Grids → 1 coluna */
  [style*="grid-template-columns: repeat(3, 1fr)"],
  [style*="grid-template-columns: repeat(2, 1fr)"],
  [style*="grid-template-columns: 1fr 1fr"],
  [style*="grid-template-columns: 1fr 1.4fr"],
  [style*="grid-template-columns: 1fr 1.35fr"],
  [style*="grid-template-columns: 1fr 1.5fr"],
  [style*="grid-template-columns: 1fr 1.3fr"],
  [style*="grid-template-columns: 1.4fr 1fr"],
  [style*="grid-template-columns: 1.2fr 1fr"],
  [style*="grid-template-columns: 1.1fr 1fr"],
  [style*="grid-template-columns: 1.1fr .9fr"],
  [style*="grid-template-columns: 1.3fr 1fr auto"],
  [style*="grid-template-columns: 1.4fr 1fr 1fr 1fr"] { grid-template-columns: 1fr !important; }
  [style*="grid-template-columns: repeat(4, 1fr)"] { grid-template-columns: repeat(2, 1fr) !important; }
  [style*="grid-template-columns: 80px 1fr 1.2fr auto"] { grid-template-columns: 1fr !important; gap: 8px !important; padding: 24px 8px !important; }
  [style*="grid-template-columns: 80px 1fr 1.2fr auto"] > div:first-child { font-size: 15px !important; color: #0F7A4F !important; }
  [style*="grid-template-columns: 80px 1fr 1.2fr auto"] > div:nth-child(2) { font-size: 24px !important; }
  [style*="grid-column: span 2"] { grid-column: span 2 !important; }

  /* Sticky laterais viram fluxo normal */
  [style*="position: sticky; top: 110px"] { position: static !important; }

  /* Colunas de stats (hero) */
  [style*="border-right: 1px solid rgba(20, 21, 15, 0.12)"] { border-right: 0 !important; border-bottom: 1px solid rgba(20,21,15,.12); }

  /* Paddings de seção */
  [style*="padding: 80px 32px 0px"], [style*="padding: 88px 32px 60px"] { padding: 44px 20px 0 !important; }
  [style*="padding: 96px 32px 0px"], [style*="padding: 100px 32px 0px"], [style*="padding: 110px 32px 0px"], [style*="padding: 90px 32px 0px"] { padding: 64px 20px 0 !important; }
  [style*="padding: 96px 32px;"], [style*="padding: 100px 32px;"], [style*="padding: 110px 32px;"], [style*="padding: 90px 32px;"] { padding: 64px 20px !important; }
  [style*="padding: 60px 32px 40px"] { padding: 44px 20px 32px !important; }
  [style*="padding: 24px 32px;"] { padding: 20px !important; flex-direction: column; gap: 8px; text-align: center; }
  [style*="padding: 20px 32px;"] { padding: 14px 18px !important; }
  [style*="padding: 60px;"] { padding: 32px 22px !important; }
  [style*="padding: 56px;"] { padding: 28px 20px !important; }
  [style*="padding: 40px;"] { padding: 26px 20px !important; }
  [style*="padding: 36px 32px"], [style*="padding: 34px 30px"], [style*="padding: 32px 36px"], [style*="padding: 32px 28px"] { padding: 24px 20px !important; }
  [style*="padding: 30px 34px"], [style*="padding: 26px 34px"] { padding: 22px 20px !important; }
  [style*="margin: 0px 52px"] { margin: 0 20px !important; }

  /* Tipografia */
  h1[style*="font-size: 78px"], h1[style*="font-size: 76px"], h1[style*="font-size: 74px"] { font-size: 40px !important; line-height: 1.08 !important; }
  h1[style*="font-size: 58px"] { font-size: 36px !important; }
  [style*="font-size: 118px"] { font-size: 54px !important; }
  h2[style*="font-size: 54px"], h2[style*="font-size: 50px"], h2[style*="font-size: 48px"], h2[style*="font-size: 46px"], h2[style*="font-size: 44px"], h2[style*="font-size: 42px"] { font-size: 32px !important; line-height: 1.12 !important; }
  [style*="font-size: 52px"] { font-size: 40px !important; }
  div[style*="font-size: 44px"] { font-size: 34px !important; }
  [style*="font-size: 40px"] { font-size: 30px !important; }
  [style*="font-size: 30px"] { font-size: 24px !important; }
  [style*="font-size: 29px"] { font-size: 25px !important; }
  [style*="font-size: 26px"] { font-size: 22px !important; }
  p[style*="font-size: 19px"], p[style*="font-size: 20px"] { font-size: 16.5px !important; }
  p[style*="font-size: 18px"] { font-size: 16px !important; }

  /* Alturas fixas de imagem/hero */
  [style*="height: 440px"] { height: 240px !important; }
  [style*="height: 420px"] { height: 300px !important; }
  [style*="height: 300px"] { height: 220px !important; }

  /* Linhas flex que devem quebrar/empilhar */
  [style*="justify-content: flex-end; flex-wrap: wrap"] { justify-content: flex-start !important; }
  [style*="align-items: flex-end; justify-content: space-between"] { align-items: flex-start !important; }
  [style*="display: flex; align-items: center; justify-content: space-between; gap: 32px"] { flex-direction: column; align-items: flex-start !important; }
  [style*="text-align: right"] { text-align: left !important; }
  [style*="justify-content: flex-end;"] [style*="font-size: 52px"] { justify-content: flex-start !important; }

  /* Chat do agente */
  .ag-msgs { height: 360px; padding: 16px; }
  .ag-b { max-width: 90%; }

  /* Lightbox */
  .lp-box { padding: 64px 10px 24px; }
  .lp-card { height: 320px !important; }

  /* Portfólio de criativos: 2 colunas, CTA ocupa a linha */
  .tile { aspect-ratio: 4/5; }

  /* Botão flutuante */
  .cn-wa-float { display: flex; position: fixed; right: 16px; bottom: 16px; z-index: 60; width: 56px; height: 56px; border-radius: 50%; background: #25D366; color: #fff; align-items: center; justify-content: center; box-shadow: 0 10px 30px rgba(0,0,0,.25); }
  .cn-wa-float svg { width: 28px; height: 28px; }

  /* Botões grandes: ocupar largura */
  a[style*="padding: 16px 30px"], a[style*="padding: 18px 34px"], a[style*="padding: 15px 28px"] { padding: 14px 22px !important; font-size: 15px !important; }
  [style*="display: flex; gap: 14px; justify-content: flex-end; flex-wrap: wrap"] a,
  [style*="display: flex; gap: 16px; justify-content: center; flex-wrap: wrap"] a { flex: 1 1 100%; text-align: center; }

  /* Tabelas/planos: nunca estourar */
  [style*="white-space: nowrap"] { white-space: normal !important; }
  .cn-cta { white-space: nowrap !important; }
}

/* ============ ≤ 600px (celular) ============ */
@media (max-width: 600px) {
  [style*="grid-template-columns: repeat(4, 1fr)"] { grid-template-columns: 1fr 1fr !important; gap: 10px !important; }
  [style*="grid-template-columns: repeat(4, 1fr)"][style*="gap: 1px"] { grid-template-columns: 1fr !important; gap: 1px !important; }
  [style*="grid-template-columns: repeat(3, 1fr)"][style*="border-top: 1px solid"] > div { padding: 18px 8px !important; }
  h1[style*="font-size: 78px"], h1[style*="font-size: 76px"], h1[style*="font-size: 74px"] { font-size: 34px !important; }
  h2[style*="font-size: 54px"], h2[style*="font-size: 50px"], h2[style*="font-size: 48px"], h2[style*="font-size: 46px"], h2[style*="font-size: 44px"] { font-size: 28px !important; }
  div[style*="font-size: 44px"] { font-size: 28px !important; }
  [style*="font-size: 52px"] { font-size: 36px !important; }
  [style*="max-width: 1240px"][style*="padding: 20px 32px"] { padding: 12px 14px !important; }
  .cn-cta { display: none !important; }
  [style*="height: 440px"] { height: 200px !important; }
  [style*="height: 420px"] { height: 240px !important; }
  [style*="margin-top: -56px"] { margin-top: -48px !important; }
  [style*="display: flex; gap: 14px; flex-wrap: wrap"] a { flex: 1 1 100%; text-align: center; }
  [style*="display: grid; grid-template-columns: 1fr 1fr; gap: 12px"] { grid-template-columns: 1fr 1fr !important; }
  .ag-msgs { height: 320px; }
  .ag-chip { font-size: 12px; padding: 7px 11px; }
  .ag-in { padding: 12px 14px; font-size: 14px; }
  .ag-send { padding: 12px 16px; }
  .tile { aspect-ratio: 4/5; }
  [style*="grid-column: span 2"] { grid-column: span 2 !important; min-height: 160px !important; }
}

/* ============ ≤ 400px ============ */
@media (max-width: 400px) {
  h1[style*="font-size: 78px"], h1[style*="font-size: 76px"], h1[style*="font-size: 74px"] { font-size: 30px !important; }
  [style*="grid-template-columns: repeat(4, 1fr)"] { grid-template-columns: 1fr !important; }
  [style*="grid-column: span 2"] { grid-column: auto !important; }
}

/* Impressão e movimento reduzido */
@media (prefers-reduced-motion: reduce) { * { animation: none !important; transition: none !important; } }