{"id":694,"date":"2024-11-13T09:57:39","date_gmt":"2024-11-13T12:57:39","guid":{"rendered":"https:\/\/playlistsolutions.com\/?page_id=694"},"modified":"2026-04-15T10:25:58","modified_gmt":"2026-04-15T13:25:58","slug":"planner","status":"publish","type":"page","link":"https:\/\/playlistsolutions.com\/planner\/","title":{"rendered":"Planner"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"694\" class=\"elementor elementor-694\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-25ec7cb e-flex e-con-boxed e-con e-parent\" data-id=\"25ec7cb\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-4f66711 elementor-widget elementor-widget-html\" data-id=\"4f66711\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\r\n<style>\r\n\/* Neutralize only nav *\/\r\nnav { all: unset; }\r\n\r\n  \/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\r\n     DESIGN TOKENS \u2014 BRANDING OFICIAL PLAYLIST\r\n     Cores Prim\u00e1rias: #215091 \u00b7 #0f60b6 \u00b7 #009add \u00b7 #00f9ff\r\n     Cores Secund\u00e1rias (\u226420%): #012a5e \u00b7 #9c6dff \u00b7 #dfe1e1\r\n     Tipografia: Roboto Bold \/ Roboto Mono \/ Roboto Regular\r\n  \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\n  :root {\r\n    --p1: #215091;\r\n    --p2: #0f60b6;\r\n    --p3: #009add;\r\n    --p4: #00f9ff;\r\n    --s1: #012a5e;\r\n    --s2: #9c6dff;\r\n    --s3: #dfe1e1;\r\n    --white: #ffffff;\r\n    --off-white: #f4f7fb;\r\n    --text-dark: #0d1f3c;\r\n    --text-body: #2c3d5e;\r\n    --text-muted: #6b7fa3;\r\n    --text-light: rgba(255,255,255,0.85);\r\n    --text-fade: rgba(255,255,255,0.5);\r\n    --grad-brand: linear-gradient(135deg, #215091 0%, #0f60b6 50%, #009add 100%);\r\n    --grad-dark: linear-gradient(135deg, #012a5e 0%, #215091 60%, #0f60b6 100%);\r\n    --grad-vivid: linear-gradient(135deg, #0f60b6 0%, #009add 60%, #00f9ff 100%);\r\n    --grad-hero: linear-gradient(160deg, #012a5e 0%, #215091 40%, #0f60b6 75%, #009add 100%);\r\n    --surface-light: #eef3fb;\r\n    --surface-mid: rgba(33,80,145,0.06);\r\n    --border-light: rgba(33,80,145,0.14);\r\n    --border-glow: rgba(0,249,255,0.3);\r\n    --r-sm: 8px;\r\n    --r-md: 16px;\r\n    --r-lg: 24px;\r\n    --r-xl: 40px;\r\n  }\r\n\r\n  * { margin: 0; padding: 0; box-sizing: border-box; }\r\n  html { scroll-behavior: smooth; }\r\n  body {\r\n    font-family: 'Roboto', sans-serif;\r\n    color: var(--text-dark);\r\n    background: var(--white);\r\n    -webkit-font-smoothing: antialiased;\r\n    overflow-x: hidden;\r\n  }\r\n\r\n  \/* \u2550\u2550 HERO layout \u2550\u2550 *\/\r\n  .hero {\r\n    background: #0a1a33;\r\n    min-height: 100vh;\r\n    padding: 120px 5vw 0;\r\n    display: flex;\r\n    flex-direction: column;\r\n    align-items: center;\r\n    text-align: center;\r\n    position: relative;\r\n    overflow: hidden;\r\n  }\r\n\r\n  \/* \u2550\u2550 LINHAS DECORATIVAS \u2550\u2550 *\/\r\n  .hero-lines {\r\n    position: absolute;\r\n    inset: 0;\r\n    pointer-events: none;\r\n  }\r\n\r\n  .hero-content {\r\n    position: relative;\r\n    z-index: 2;\r\n    max-width: 860px;\r\n  }\r\n\r\n  \/* Eyebrow *\/\r\n  .eyebrow {\r\n    display: inline-flex;\r\n    align-items: center;\r\n    gap: 10px;\r\n    font-family: 'Roboto Mono', monospace;\r\n    font-size: 11px;\r\n    font-weight: 600;\r\n    letter-spacing: 2px;\r\n    text-transform: uppercase;\r\n    color: var(--p4);\r\n    margin-bottom: 28px;\r\n  }\r\n\r\n  .eyebrow::before,\r\n  .eyebrow::after {\r\n    content: '';\r\n    display: block;\r\n    width: 28px;\r\n    height: 1.5px;\r\n    background: var(--p4);\r\n    opacity: 0.7;\r\n  }\r\n\r\n  \/* Logo do produto no lugar do H1 *\/\r\n  .hero-logo-wrap {\r\n    margin-bottom: 28px;\r\n  }\r\n\r\n  .hero-product-logo {\r\n    max-width: 640px;\r\n    width: 100%;\r\n    height: auto;\r\n    display: block;\r\n    margin: 0 auto;\r\n  }\r\n\r\n  .hero-sub {\r\n    font-family: 'Roboto', sans-serif;\r\n    font-weight: 300;\r\n    font-size: clamp(20px, 2.5vw, 26px);\r\n    color: rgba(255,255,255,0.7);\r\n    line-height: 1.65;\r\n    max-width: 580px;\r\n    margin: 0 auto 24px;\r\n  }\r\n\r\n  \/* Pre\u00e7o *\/\r\n  .hero-price {\r\n    display: inline-flex;\r\n    align-items: center;\r\n    gap: 0;\r\n    background: rgba(255,255,255,0.08);\r\n    border: 1px solid rgba(255,255,255,0.18);\r\n    border-radius: 16px;\r\n    padding: 0;\r\n    margin-bottom: 28px;\r\n    backdrop-filter: blur(8px);\r\n    overflow: hidden;\r\n  }\r\n\r\n  .price-option {\r\n    display: flex;\r\n    flex-direction: column;\r\n    align-items: center;\r\n    gap: 2px;\r\n    padding: 12px 24px;\r\n  }\r\n\r\n  .price-divider {\r\n    width: 1px;\r\n    height: 40px;\r\n    background: rgba(255,255,255,0.15);\r\n    flex-shrink: 0;\r\n  }\r\n\r\n  .price-label {\r\n    font-family: 'Roboto Mono', monospace;\r\n    font-size: 10px;\r\n    font-weight: 600;\r\n    letter-spacing: 1.2px;\r\n    text-transform: uppercase;\r\n    color: rgba(255,255,255,0.45);\r\n  }\r\n\r\n  .price-val {\r\n    font-family: 'Roboto', sans-serif;\r\n    font-size: 20px;\r\n    font-weight: 900;\r\n    color: white;\r\n    letter-spacing: -0.5px;\r\n    line-height: 1;\r\n  }\r\n\r\n  .price-per {\r\n    font-size: 12px;\r\n    font-weight: 400;\r\n    color: rgba(255,255,255,0.5);\r\n    letter-spacing: 0;\r\n  }\r\n\r\n  .price-saving {\r\n    font-family: 'Roboto Mono', monospace;\r\n    font-size: 10px;\r\n    font-weight: 700;\r\n    color: var(--p4);\r\n    letter-spacing: 0.3px;\r\n    margin-top: 2px;\r\n  }\r\n\r\n  \/* Bot\u00f5es *\/\r\n  .hero-actions {\r\n    display: flex;\r\n    gap: 16px;\r\n    justify-content: center;\r\n    flex-wrap: wrap;\r\n    margin-bottom: 20px;\r\n  }\r\n\r\n  .btn-primary {\r\n    background: #ffffff;\r\n    color: var(--s1);\r\n    font-family: 'Roboto', sans-serif;\r\n    font-weight: 700;\r\n    font-size: 16px;\r\n    border: none;\r\n    padding: 16px 40px;\r\n    border-radius: 100px;\r\n    cursor: pointer;\r\n    text-decoration: none;\r\n    transition: all 0.25s;\r\n    display: inline-flex;\r\n    align-items: center;\r\n    gap: 10px;\r\n    box-shadow: 0 4px 20px rgba(0,0,0,0.22);\r\n  }\r\n\r\n  .btn-primary:hover {\r\n    background: var(--p4);\r\n    color: var(--s1);\r\n    transform: translateY(-3px);\r\n    box-shadow: 0 12px 32px rgba(0,249,255,0.4);\r\n  }\r\n\r\n  .btn-outline {\r\n    background: transparent;\r\n    color: var(--white);\r\n    font-family: 'Roboto', sans-serif;\r\n    font-weight: 500;\r\n    font-size: 16px;\r\n    border: 1.5px solid rgba(255,255,255,0.35);\r\n    padding: 15px 36px;\r\n    border-radius: 100px;\r\n    cursor: pointer;\r\n    text-decoration: none;\r\n    transition: all 0.25s;\r\n    display: inline-flex;\r\n    align-items: center;\r\n    gap: 10px;\r\n  }\r\n\r\n  .btn-outline:hover {\r\n    border-color: var(--p4);\r\n    color: var(--p4);\r\n    background: rgba(0,249,255,0.06);\r\n  }\r\n\r\n  .hero-proof {\r\n    font-family: 'Roboto Mono', monospace;\r\n    font-size: 17px;\r\n    color: rgba(255,255,255,0.55);\r\n    letter-spacing: 0.5px;\r\n  }\r\n\r\n  .hero-proof strong {\r\n    color: rgba(255,255,255,0.8);\r\n    font-weight: 600;\r\n  }\r\n\r\n  \/* Hero screenshot *\/\r\n  .hero-mockup-wrap {\r\n    position: relative;\r\n    z-index: 2;\r\n    max-width: 100%;\r\n    width: 100%;\r\n    margin: 60px auto 0;\r\n    padding: 0 5vw;\r\n  }\r\n\r\n  .hero-screenshot {\r\n    width: 100%;\r\n    display: block;\r\n    border-radius: 0;\r\n    border: none;\r\n    box-shadow: none;\r\n    mix-blend-mode: lighten;\r\n    filter: drop-shadow(0 20px 60px rgba(0,154,221,0.35));\r\n  }\r\n\r\n  \/* \u2550\u2550 SCROLL REVEAL \u2014 fix Elementor \u2550\u2550 *\/\r\n  [data-r] { opacity: 1 !important; transform: none !important; }\r\n\r\n  \/* \u2550\u2550 RESPONSIVE \u2550\u2550 *\/\r\n  @media (max-width: 768px) {\r\n    .hero-product-logo { max-width: 380px; }\r\n    .hero { padding: 100px 5vw 0; }\r\n  }\r\n\r\n\/* \u2550\u2550 FORCE CORRECT SIZES \u2014 override Hello Elementor theme \u2550\u2550 *\/\r\n.elementor-widget-html .hero-sub {\r\n  font-size: clamp(20px, 2.5vw, 26px) !important;\r\n  font-weight: 300 !important;\r\n  color: rgba(255,255,255,0.7) !important;\r\n}\r\n\r\n.elementor-widget-html .hero-proof {\r\n  font-size: 17px !important;\r\n  color: rgba(255,255,255,0.55) !important;\r\n}\r\n\r\n.elementor-widget-html .eyebrow {\r\n  font-size: 13px !important;\r\n  color: #00f9ff !important;\r\n}\r\n\r\n.elementor-widget-html .price-val {\r\n  font-size: 22px !important;\r\n  color: #ffffff !important;\r\n}\r\n\r\n.elementor-widget-html .price-label {\r\n  font-size: 11px !important;\r\n}\r\n\r\n.elementor-widget-html .price-saving {\r\n  font-size: 11px !important;\r\n  color: #00f9ff !important;\r\n}\r\n\r\n.elementor-widget-html .btn-primary {\r\n  font-size: 18px !important;\r\n  color: #012a5e !important;\r\n  background: #ffffff !important;\r\n  padding: 18px 48px !important;\r\n  border-radius: 100px !important;\r\n}\r\n\r\n.elementor-widget-html .btn-outline {\r\n  font-size: 18px !important;\r\n  color: #ffffff !important;\r\n  background: transparent !important;\r\n  padding: 17px 44px !important;\r\n  border-radius: 100px !important;\r\n  border: 1.5px solid rgba(255,255,255,0.35) !important;\r\n}\r\n\r\n\/* \u2550\u2550 FORCE HOVER STATES \u2550\u2550 *\/\r\n.elementor-widget-html .btn-primary:hover {\r\n  background: #00f9ff !important;\r\n  color: #012a5e !important;\r\n  transform: translateY(-3px) !important;\r\n  box-shadow: 0 12px 32px rgba(0,249,255,0.4) !important;\r\n}\r\n\r\n.elementor-widget-html .btn-outline:hover {\r\n  border-color: #00f9ff !important;\r\n  color: #00f9ff !important;\r\n  background: rgba(0,249,255,0.06) !important;\r\n}\r\n\r\n.elementor-widget-html a.btn-primary:hover,\r\n.elementor-widget-html a.btn-primary:focus,\r\n.elementor-widget-html a.btn-primary:active {\r\n  background: #00f9ff !important;\r\n  color: #012a5e !important;\r\n}\r\n\r\n.elementor-widget-html a.btn-outline:hover,\r\n.elementor-widget-html a.btn-outline:focus,\r\n.elementor-widget-html a.btn-outline:active {\r\n  border-color: #00f9ff !important;\r\n  color: #00f9ff !important;\r\n  background: rgba(0,249,255,0.06) !important;\r\n}\r\n\r\n.elementor-widget-html .hero-mockup-wrap {\r\n  position: relative !important;\r\n  z-index: 2 !important;\r\n  max-width: 1060px !important;\r\n  width: 100% !important;\r\n  margin: 20px auto 0 !important;\r\n  padding: 0 !important;\r\n}\r\n\r\n.elementor-widget-html .hero-screenshot {\r\n  width: 100% !important;\r\n  display: block !important;\r\n  border-radius: 0 !important;\r\n  border: none !important;\r\n  box-shadow: none !important;\r\n  mix-blend-mode: lighten !important;\r\n  filter: drop-shadow(0 20px 60px rgba(0,154,221,0.35)) !important;\r\n}\r\n\r\n.elementor-widget-html .hero-product-logo {\r\n  max-width: 640px !important;\r\n  width: 100% !important;\r\n  height: auto !important;\r\n  display: block !important;\r\n  margin: 0 auto !important;\r\n}\r\n\r\n\/* \u2550\u2550 REMOVE WHITE GAP between sections \u2550\u2550 *\/\r\n.elementor-widget-html {\r\n  display: block;\r\n  margin: 0 !important;\r\n  padding: 0 !important;\r\n}\r\n\r\n\/* \u2550\u2550 MASTER BACKGROUND OVERRIDE \u2014 aplicado em todos os widgets \u2550\u2550 *\/\r\n.hero                    { background: #0a1a33 !important; }\r\n.pain-section            { background: #0a1a33 !important; }\r\n.benefit-block.dark-bg   { background: #0a1a33 !important; }\r\n.benefit-block.alt       { background: #0a1a33 !important; }\r\n.benefit-block.alt-light  { background: #eef3fb !important; }\r\n.benefit-block.grad-bg   { background: #0a1a33 !important; }\r\n.features-sec            { background: var(--grad-dark) !important; }\r\n.proof-sec               { background: var(--grad-dark) !important; }\r\n.testi-sec               { background: #0a1a33 !important; }\r\n.eco-sec                 { background: #0a1a33 !important; }\r\n.cta-sec                 { background: var(--grad-dark) !important; }\r\n.resources-sec           { background: #060e1f !important; }\r\n\r\n<\/style>\r\n\r\n<!-- \u2550\u2550\u2550 HERO \u2014 PLANNER \u2550\u2550\u2550 -->\r\n<section class=\"hero\">\r\n\r\n  <!-- Linhas vetoriais derivadas do logo (conceito visual) -->\r\n  <div class=\"hero-lines\" aria-hidden=\"true\">\r\n    <svg width=\"100%\" height=\"100%\" viewBox=\"0 0 1440 900\" preserveAspectRatio=\"xMidYMid slice\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\r\n      <line x1=\"0\" y1=\"600\" x2=\"400\" y2=\"200\" stroke=\"url(#lg1)\" stroke-width=\"1\" opacity=\"0.3\"\/>\r\n      <line x1=\"200\" y1=\"900\" x2=\"700\" y2=\"100\" stroke=\"url(#lg1)\" stroke-width=\"0.8\" opacity=\"0.2\"\/>\r\n      <line x1=\"1440\" y1=\"400\" x2=\"900\" y2=\"850\" stroke=\"url(#lg2)\" stroke-width=\"1\" opacity=\"0.25\"\/>\r\n      <line x1=\"1200\" y1=\"0\" x2=\"600\" y2=\"600\" stroke=\"url(#lg2)\" stroke-width=\"0.6\" opacity=\"0.18\"\/>\r\n      <line x1=\"0\" y1=\"300\" x2=\"1440\" y2=\"600\" stroke=\"url(#lg1)\" stroke-width=\"0.5\" opacity=\"0.12\"\/>\r\n      <circle cx=\"350\" cy=\"220\" r=\"180\" stroke=\"rgba(0,249,255,0.07)\" stroke-width=\"1\" fill=\"none\"\/>\r\n      <circle cx=\"1100\" cy=\"680\" r=\"240\" stroke=\"rgba(0,154,221,0.06)\" stroke-width=\"1\" fill=\"none\"\/>\r\n      <defs>\r\n        <linearGradient id=\"lg1\" x1=\"0%\" y1=\"0%\" x2=\"100%\" y2=\"100%\">\r\n          <stop offset=\"0%\" stop-color=\"#00f9ff\" stop-opacity=\"0\"\/>\r\n          <stop offset=\"50%\" stop-color=\"#00f9ff\" stop-opacity=\"1\"\/>\r\n          <stop offset=\"100%\" stop-color=\"#00f9ff\" stop-opacity=\"0\"\/>\r\n        <\/linearGradient>\r\n        <linearGradient id=\"lg2\" x1=\"100%\" y1=\"0%\" x2=\"0%\" y2=\"100%\">\r\n          <stop offset=\"0%\" stop-color=\"#009add\" stop-opacity=\"0\"\/>\r\n          <stop offset=\"50%\" stop-color=\"#009add\" stop-opacity=\"1\"\/>\r\n          <stop offset=\"100%\" stop-color=\"#009add\" stop-opacity=\"0\"\/>\r\n        <\/linearGradient>\r\n      <\/defs>\r\n    <\/svg>\r\n  <\/div>\r\n\r\n  <div class=\"hero-content\">\r\n    <div class=\"eyebrow\">Playlist Software Solutions<\/div>\r\n\r\n    <!-- Logo do produto no lugar do H1 -->\r\n    <div class=\"hero-logo-wrap\">\r\n      <img decoding=\"async\" src=\"https:\/\/playlistsolutions.com\/wp-content\/uploads\/2026\/03\/2026-Planner-Branco.png\"\r\n           alt=\"Planner \u2014 Playlist Software Solutions\"\r\n           class=\"hero-product-logo\">\r\n    <\/div>\r\n\r\n    <p class=\"hero-sub\">Gest\u00e3o integrada de contratos, anunciantes e blocos comerciais, maximize cada minuto dispon\u00edvel da sua emissora, de qualquer lugar, a qualquer tempo.<\/p>\r\n\r\n    <!-- PRE\u00c7O -->\r\n    <div class=\"hero-price\">\r\n      <div class=\"price-option\">\r\n        <span class=\"price-label\">Mensal<\/span>\r\n        <span class=\"price-val\">R$&nbsp;528<span class=\"price-per\">\/m\u00eas<\/span><\/span>\r\n      <\/div>\r\n      <div class=\"price-divider\"><\/div>\r\n      <div class=\"price-option\">\r\n        <span class=\"price-label\">Anual<\/span>\r\n        <span class=\"price-val\">R$&nbsp;5.280<span class=\"price-per\">\/ano<\/span><\/span>\r\n        <span class=\"price-saving\">\u2726 economize 2 meses<\/span>\r\n      <\/div>\r\n    <\/div>\r\n\r\n    <div class=\"hero-actions\">\r\n      <a href=\"https:\/\/api.whatsapp.com\/send\/?phone=553121362928&text=Ol%C3%A1%21+Gostaria+de+mais+informa%C3%A7%C3%B5es+sobre+o+Planner%21&type=phone_number&app_absent=0\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"btn-primary\">\r\n        Solicitar demonstra\u00e7\u00e3o\r\n        <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\"><path d=\"M3 8h10M8 3l5 5-5 5\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><\/svg>\r\n      <\/a>\r\n      <a href=\"#benefits\" class=\"btn-outline\">Como funciona<\/a>\r\n    <\/div>\r\n    <p class=\"hero-proof\">Confiado por <strong>+2.500 emissoras<\/strong> no Brasil e no mundo \u00b7 desde 1995<\/p>\r\n  <\/div>\r\n\r\n  <!-- Screenshot do software Planner -->\r\n  <div class=\"hero-mockup-wrap\">\r\n    <img decoding=\"async\" src=\"https:\/\/playlistsolutions.com\/wp-content\/uploads\/2026\/03\/tela-planner.png\"\r\n         alt=\"Planner \u2014 interface de programa\u00e7\u00e3o comercial\"\r\n         class=\"hero-screenshot\">\r\n  <\/div>\r\n\r\n<\/section>\r\n\r\n<script>\r\n\/\/ Fix IntersectionObserver \u2014 for\u00e7a visibilidade imediata no contexto Elementor\r\ndocument.querySelectorAll('[data-r]').forEach(el => {\r\n  el.style.opacity = '1';\r\n  el.style.transform = 'none';\r\n  el.classList.add('on');\r\n});\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-de11cf9 e-flex e-con-boxed e-con e-parent\" data-id=\"de11cf9\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-29e4bb4 elementor-widget elementor-widget-html\" data-id=\"29e4bb4\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\r\n<style>\r\nnav { all: unset; }\r\n\r\n  \/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\r\n     DESIGN TOKENS \u2014 BRANDING OFICIAL PLAYLIST\r\n     Cores Prim\u00e1rias: #215091 \u00b7 #0f60b6 \u00b7 #009add \u00b7 #00f9ff\r\n     Cores Secund\u00e1rias (\u226420%): #012a5e \u00b7 #9c6dff \u00b7 #dfe1e1\r\n     Tipografia: Roboto Bold \/ Roboto Mono \/ Roboto Regular\r\n  \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\n  :root {\r\n    --p1: #215091;\r\n    --p2: #0f60b6;\r\n    --p3: #009add;\r\n    --p4: #00f9ff;\r\n    --s1: #012a5e;\r\n    --s2: #9c6dff;\r\n    --s3: #dfe1e1;\r\n    --white: #ffffff;\r\n    --off-white: #f4f7fb;\r\n    --text-dark: #0d1f3c;\r\n    --text-body: #2c3d5e;\r\n    --text-muted: #6b7fa3;\r\n    --text-light: rgba(255,255,255,0.85);\r\n    --text-fade: rgba(255,255,255,0.5);\r\n    --grad-brand: linear-gradient(135deg, #215091 0%, #0f60b6 50%, #009add 100%);\r\n    --grad-dark: linear-gradient(135deg, #012a5e 0%, #215091 60%, #0f60b6 100%);\r\n    --grad-vivid: linear-gradient(135deg, #0f60b6 0%, #009add 60%, #00f9ff 100%);\r\n    --grad-hero: linear-gradient(160deg, #012a5e 0%, #215091 40%, #0f60b6 75%, #009add 100%);\r\n    --surface-light: #eef3fb;\r\n    --surface-mid: rgba(33,80,145,0.06);\r\n    --border-light: rgba(33,80,145,0.14);\r\n    --border-glow: rgba(0,249,255,0.3);\r\n    --r-sm: 8px;\r\n    --r-md: 16px;\r\n    --r-lg: 24px;\r\n    --r-xl: 40px;\r\n  }\r\n\r\n  * { margin: 0; padding: 0; box-sizing: border-box; }\r\n  html { scroll-behavior: smooth; }\r\n  body {\r\n    font-family: 'Roboto', sans-serif;\r\n    color: var(--text-dark);\r\n    background: var(--white);\r\n    -webkit-font-smoothing: antialiased;\r\n    overflow-x: hidden;\r\n  }\r\n\r\n  \/* \u2550\u2550 SE\u00c7\u00d5ES COMPARTILHADAS \u2550\u2550 *\/\r\n  section { padding: 100px 5vw; }\r\n  .sec-inner { max-width: 1100px; margin: 0 auto; }\r\n\r\n  .sec-eyebrow {\r\n    font-family: 'Roboto Mono', monospace;\r\n    font-size: 11px; font-weight: 600;\r\n    letter-spacing: 2px; text-transform: uppercase;\r\n    color: var(--p4); margin-bottom: 16px;\r\n    display: flex; align-items: center; gap: 10px;\r\n  }\r\n\r\n  .sec-eyebrow::before {\r\n    content: '';\r\n    display: block; width: 20px; height: 2px;\r\n    background: var(--p4); border-radius: 2px;\r\n  }\r\n\r\n  \/* \u2550\u2550 SE\u00c7\u00c3O DOR \u2550\u2550 *\/\r\n  .pain-section .sec-eyebrow { color: var(--p4); }\r\n  .pain-section .sec-eyebrow::before { background: var(--p4); }\r\n\r\n  .pain-h2 {\r\n    font-family: 'Roboto', sans-serif;\r\n    font-weight: 700;\r\n    font-size: clamp(30px, 4vw, 52px);\r\n    line-height: 1.1; letter-spacing: -1px;\r\n    color: white; max-width: 640px; margin-bottom: 56px;\r\n  }\r\n\r\n  .pain-grid {\r\n    display: grid;\r\n    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));\r\n    gap: 2px;\r\n    background: rgba(0,249,255,0.06);\r\n    border-radius: var(--r-md);\r\n    overflow: hidden;\r\n    border: 1px solid rgba(0,249,255,0.1);\r\n  }\r\n\r\n  .pain-card {\r\n    background: rgba(1,42,94,0.7);\r\n    backdrop-filter: blur(8px);\r\n    padding: 36px 30px;\r\n    transition: background 0.2s;\r\n  }\r\n\r\n  .pain-card:hover { background: rgba(15,96,182,0.25); }\r\n\r\n  .pain-icon { font-size: 26px; margin-bottom: 16px; display: block; }\r\n\r\n  .pain-card h3 {\r\n    font-family: 'Roboto', sans-serif;\r\n    font-size: 18px; font-weight: 700;\r\n    color: white; margin-bottom: 10px; line-height: 1.3;\r\n  }\r\n\r\n  .pain-card p {\r\n    font-size: 14px; font-weight: 400;\r\n    color: rgba(255,255,255,0.55); line-height: 1.7;\r\n  }\r\n\r\n  \/* \u2550\u2550 SCROLL REVEAL \u2550\u2550 *\/\r\n  [data-r] { opacity: 1 !important; transform: none !important; }\r\n\r\n  \/* \u2550\u2550 RESPONSIVE \u2550\u2550 *\/\r\n  @media (max-width: 768px) {\r\n    .pain-grid { grid-template-columns: 1fr; }\r\n  }\r\n\r\n\/* \u2550\u2550 CRITICAL: Restore section padding overridden by Hello Elementor theme \u2550\u2550 *\/\r\n.elementor-widget-html section {\r\n  padding: 100px 5vw !important;\r\n  box-sizing: border-box !important;\r\n}\r\n\r\n\/* Force all data-r visible *\/\r\n[data-r] { opacity: 1 !important; transform: none !important; }\r\n\r\n\/* \u2550\u2550 MASTER BACKGROUND OVERRIDE \u2014 aplicado em todos os widgets \u2550\u2550 *\/\r\n.hero                    { background: #0a1a33 !important; }\r\n.pain-section            { background: #0a1a33 !important; }\r\n.benefit-block.dark-bg   { background: #0a1a33 !important; }\r\n.benefit-block.alt       { background: #0a1a33 !important; }\r\n.benefit-block.alt-light  { background: #eef3fb !important; }\r\n.benefit-block.grad-bg   { background: #0a1a33 !important; }\r\n.features-sec            { background: var(--grad-dark) !important; }\r\n.proof-sec               { background: var(--grad-dark) !important; }\r\n.testi-sec               { background: #0a1a33 !important; }\r\n.eco-sec                 { background: #0a1a33 !important; }\r\n.cta-sec                 { background: var(--grad-dark) !important; }\r\n.resources-sec           { background: #060e1f !important; }\r\n\r\n<\/style>\r\n\r\n<!-- \u2550\u2550\u2550 SE\u00c7\u00c3O DE DOR \u2014 PLANNER \u2550\u2550\u2550 -->\r\n<section class=\"pain-section\" id=\"benefits\">\r\n  <div class=\"sec-inner\">\r\n    <div class=\"sec-eyebrow\" data-r>O problema real<\/div>\r\n    <h2 class=\"pain-h2\" data-r>Voc\u00ea ainda gerencia sua grade comercial no modo complicado?<\/h2>\r\n    <div class=\"pain-grid\">\r\n      <div class=\"pain-card\" data-r>\r\n        <span class=\"pain-icon\">\ud83d\udccb<\/span>\r\n        <h3>Seus contratos ainda vivem em planilhas?<\/h3>\r\n        <p>Sem uma plataforma centralizada, o controle de contratos, inser\u00e7\u00f5es e anunciantes vira caos, erros, retrabalho e receita perdida.<\/p>\r\n      <\/div>\r\n      <div class=\"pain-card\" data-r>\r\n        <span class=\"pain-icon\">\ud83d\udcb8<\/span>\r\n        <h3>Quanto da sua grade comercial fica vazio todo dia?<\/h3>\r\n        <p>Sem visibilidade da ocupa\u00e7\u00e3o em tempo real, espa\u00e7os publicit\u00e1rios ficam vazios e a rentabilidade da grade nunca alcan\u00e7a seu potencial.<\/p>\r\n      <\/div>\r\n      <div class=\"pain-card\" data-r>\r\n        <span class=\"pain-icon\">\ud83c\udfe2<\/span>\r\n        <h3>Gerenciar v\u00e1rias emissoras virou uma bagun\u00e7a?<\/h3>\r\n        <p>Controlar contratos e campanhas de uma rede de r\u00e1dios sem uma plataforma unificada consome tempo, gera inconsist\u00eancias e dificulta o crescimento.<\/p>\r\n      <\/div>\r\n      <div class=\"pain-card\" data-r>\r\n        <span class=\"pain-icon\">\ud83d\udd12<\/span>\r\n        <h3>Quem tem acesso \u00e0s informa\u00e7\u00f5es financeiras da sua emissora?<\/h3>\r\n        <p>Informa\u00e7\u00f5es financeiras e comerciais expostas a toda a equipe sem perfis de permiss\u00e3o \u00e9 um risco real para a opera\u00e7\u00e3o e para a conformidade da emissora.<\/p>\r\n      <\/div>\r\n    <\/div>\r\n  <\/div>\r\n<\/section>\r\n\r\n<script>\r\ndocument.querySelectorAll('[data-r]').forEach(el => el.classList.add('on'));\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-7205882 e-flex e-con-boxed e-con e-parent\" data-id=\"7205882\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-00544f6 elementor-widget elementor-widget-html\" data-id=\"00544f6\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\r\n<style>\r\nnav { all: unset; }\r\n\r\n  \/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\r\n     DESIGN TOKENS \u2014 BRANDING OFICIAL PLAYLIST\r\n     Cores Prim\u00e1rias: #215091 \u00b7 #0f60b6 \u00b7 #009add \u00b7 #00f9ff\r\n     Cores Secund\u00e1rias (\u226420%): #012a5e \u00b7 #9c6dff \u00b7 #dfe1e1\r\n     Tipografia: Roboto Bold \/ Roboto Mono \/ Roboto Regular\r\n  \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\n  :root {\r\n    --p1: #215091;\r\n    --p2: #0f60b6;\r\n    --p3: #009add;\r\n    --p4: #00f9ff;\r\n    --s1: #012a5e;\r\n    --s2: #9c6dff;\r\n    --s3: #dfe1e1;\r\n    --white: #ffffff;\r\n    --off-white: #f4f7fb;\r\n    --text-dark: #0d1f3c;\r\n    --text-body: #2c3d5e;\r\n    --text-muted: #6b7fa3;\r\n    --text-light: rgba(255,255,255,0.85);\r\n    --text-fade: rgba(255,255,255,0.5);\r\n    --grad-brand: linear-gradient(135deg, #215091 0%, #0f60b6 50%, #009add 100%);\r\n    --grad-dark: linear-gradient(135deg, #012a5e 0%, #215091 60%, #0f60b6 100%);\r\n    --grad-vivid: linear-gradient(135deg, #0f60b6 0%, #009add 60%, #00f9ff 100%);\r\n    --grad-hero: linear-gradient(160deg, #012a5e 0%, #215091 40%, #0f60b6 75%, #009add 100%);\r\n    --surface-light: #eef3fb;\r\n    --surface-mid: rgba(33,80,145,0.06);\r\n    --border-light: rgba(33,80,145,0.14);\r\n    --border-glow: rgba(0,249,255,0.3);\r\n    --r-sm: 8px;\r\n    --r-md: 16px;\r\n    --r-lg: 24px;\r\n    --r-xl: 40px;\r\n  }\r\n\r\n  * { margin: 0; padding: 0; box-sizing: border-box; }\r\n  html { scroll-behavior: smooth; }\r\n  body {\r\n    font-family: 'Roboto', sans-serif;\r\n    color: var(--text-dark);\r\n    background: var(--white);\r\n    -webkit-font-smoothing: antialiased;\r\n    overflow-x: hidden;\r\n  }\r\n\r\n  \/* \u2550\u2550 BLOCOS DE BENEF\u00cdCIO \u2550\u2550 *\/\r\n  .benefit-block { padding: 100px 5vw; }\r\n\r\n  .benefit-inner {\r\n    max-width: 1100px; margin: 0 auto;\r\n    display: grid; grid-template-columns: 1fr 1fr;\r\n    gap: 80px; align-items: center;\r\n  }\r\n\r\n  .benefit-inner.rev { direction: rtl; }\r\n  .benefit-inner.rev > * { direction: ltr; }\r\n\r\n  .benefit-num {\r\n    font-family: 'Roboto', sans-serif;\r\n    font-size: 80px; font-weight: 900;\r\n    color: rgba(255,255,255,0.05);\r\n    line-height: 1; letter-spacing: -4px;\r\n    margin-bottom: -12px;\r\n  }\r\n\r\n  .sec-eyebrow {\r\n    font-family: 'Roboto Mono', monospace;\r\n    font-size: 11px; font-weight: 600;\r\n    letter-spacing: 2px; text-transform: uppercase;\r\n    color: var(--p3); margin-bottom: 16px;\r\n    display: flex; align-items: center; gap: 10px;\r\n  }\r\n\r\n  .benefit-text h2 {\r\n    font-family: 'Roboto', sans-serif;\r\n    font-weight: 700;\r\n    font-size: clamp(26px, 3vw, 42px);\r\n    line-height: 1.15; letter-spacing: -0.8px;\r\n    color: #ffffff; margin-bottom: 18px;\r\n  }\r\n\r\n  .benefit-text h2 .accent { color: var(--p4); }\r\n\r\n  .benefit-text p {\r\n    font-size: 17px; font-weight: 300;\r\n    color: rgba(255,255,255,0.65); line-height: 1.75; margin-bottom: 28px;\r\n  }\r\n\r\n  .tags { display: flex; flex-wrap: wrap; gap: 8px; }\r\n\r\n  .tag {\r\n    font-family: 'Roboto Mono', monospace;\r\n    font-size: 11px; font-weight: 500;\r\n    color: var(--p4);\r\n    background: rgba(0,249,255,0.08);\r\n    border: 1px solid rgba(0,249,255,0.2);\r\n    padding: 5px 13px; border-radius: 100px;\r\n    letter-spacing: 0.3px;\r\n  }\r\n\r\n\r\n  \/* \u2550\u2550 FORCE TEXT COLORS \u2014 override Hello Elementor theme \u2550\u2550 *\/\r\n.elementor-widget-html .benefit-block .benefit-num {\r\n  color: rgba(255,255,255,0.05) !important;\r\n}\r\n\r\n.elementor-widget-html .benefit-block .benefit-text h2 {\r\n  font-size: clamp(26px, 3vw, 42px) !important;\r\n  font-weight: 700 !important;\r\n  color: #ffffff !important;\r\n  letter-spacing: -0.8px !important;\r\n  line-height: 1.15 !important;\r\n}\r\n\r\n.elementor-widget-html .benefit-block .benefit-text h2 .accent {\r\n  color: #00f9ff !important;\r\n}\r\n\r\n.elementor-widget-html .benefit-block .benefit-text p {\r\n  font-size: 17px !important;\r\n  font-weight: 300 !important;\r\n  color: rgba(255,255,255,0.65) !important;\r\n  line-height: 1.75 !important;\r\n}\r\n\r\n.elementor-widget-html .benefit-block .sec-eyebrow {\r\n  font-size: 11px !important;\r\n  font-weight: 600 !important;\r\n  letter-spacing: 2px !important;\r\n  color: #0f60b6 !important;\r\n}\r\n\r\n.elementor-widget-html .benefit-block .tag {\r\n  font-size: 11px !important;\r\n  color: #00f9ff !important;\r\n  background: rgba(0,249,255,0.08) !important;\r\n  border: 1px solid rgba(0,249,255,0.2) !important;\r\n}\r\n\r\n\/* \u2550\u2550 MASTER BACKGROUND OVERRIDE \u2550\u2550 *\/\r\n.hero                    { background: #0a1a33 !important; }\r\n.pain-section            { background: #0a1a33 !important; }\r\n.benefit-block.dark-bg   { background: #0a1a33 !important; }\r\n.benefit-block.alt       { background: #0a1a33 !important; }\r\n.benefit-block.alt-light  { background: #eef3fb !important; }\r\n.benefit-block.grad-bg   { background: #0a1a33 !important; }\r\n.features-sec            { background: var(--grad-dark) !important; }\r\n.proof-sec               { background: var(--grad-dark) !important; }\r\n.testi-sec               { background: #0a1a33 !important; }\r\n.eco-sec                 { background: #0a1a33 !important; }\r\n.cta-sec                 { background: var(--grad-dark) !important; }\r\n.resources-sec           { background: #060e1f !important; }\r\n\r\n<\/style>\r\n\r\n<!-- \u2550\u2550\u2550 BENEF\u00cdCIO 01 \u2014 AUTOMA\u00c7\u00c3O DA PROGRAMA\u00c7\u00c3O COMERCIAL \u2550\u2550\u2550 -->\r\n<div class=\"benefit-block dark-bg\">\r\n  <div class=\"benefit-inner\">\r\n\r\n    <!-- TEXTO -->\r\n    <div class=\"benefit-text\" data-r>\r\n      <div class=\"benefit-num\">01<\/div>\r\n      <div class=\"sec-eyebrow\">\r\n        <span style=\"width:20px;height:2px;background:var(--p2);border-radius:2px;display:block\"><\/span>\r\n        Automa\u00e7\u00e3o Comercial\r\n      <\/div>\r\n      <h2>Sua grade preenchida automaticamente.<\/h2>\r\n      <p>Configure blocos de hor\u00e1rio, defina categorias de anunciantes e o Planner distribui as inser\u00e7\u00f5es com m\u00e1xima efici\u00eancia, sem planilhas, sem trabalho manual. Modelos de programa\u00e7\u00e3o se adaptam a dias da semana e datas sazonais com total flexibilidade.<\/p>\r\n      <div class=\"tags\">\r\n        <span class=\"tag\">Blocos autom\u00e1ticos<\/span>\r\n        <span class=\"tag\">Categorias personaliz\u00e1veis<\/span>\r\n        <span class=\"tag\">Grade sazonal<\/span>\r\n        <span class=\"tag\">Distribui\u00e7\u00e3o inteligente<\/span>\r\n      <\/div>\r\n    <\/div>\r\n\r\n    <!-- VISUAL \u2014 screenshot real do produto -->\r\n    <div data-r>\r\n      <img decoding=\"async\" src=\"https:\/\/playlistsolutions.com\/wp-content\/uploads\/2024\/12\/Planner_comerciales-768x768.png\"\r\n           alt=\"Planner \u2014 automa\u00e7\u00e3o da programa\u00e7\u00e3o comercial\"\r\n           style=\"width:100%; display:block; aspect-ratio:1\/1; object-fit:cover; border-radius:var(--r-lg); border:1px solid rgba(0,154,221,0.22); box-shadow:0 8px 48px rgba(1,42,94,0.15);\">\r\n    <\/div>\r\n\r\n  <\/div>\r\n<\/div>\r\n\r\n<script>\r\ndocument.querySelectorAll('[data-r]').forEach(el => el.classList.add('on'));\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-222242d e-flex e-con-boxed e-con e-parent\" data-id=\"222242d\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-f44dfd5 elementor-widget elementor-widget-html\" data-id=\"f44dfd5\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\r\n<style>\r\nnav { all: unset; }\r\n\r\n  :root {\r\n    --p1: #215091;\r\n    --p2: #0f60b6;\r\n    --p3: #009add;\r\n    --p4: #00f9ff;\r\n    --s1: #012a5e;\r\n    --s2: #9c6dff;\r\n    --s3: #dfe1e1;\r\n    --white: #ffffff;\r\n    --off-white: #f4f7fb;\r\n    --text-dark: #0d1f3c;\r\n    --text-body: #2c3d5e;\r\n    --text-muted: #6b7fa3;\r\n    --text-light: rgba(255,255,255,0.85);\r\n    --text-fade: rgba(255,255,255,0.5);\r\n    --grad-brand: linear-gradient(135deg, #215091 0%, #0f60b6 50%, #009add 100%);\r\n    --grad-dark: linear-gradient(135deg, #012a5e 0%, #215091 60%, #0f60b6 100%);\r\n    --grad-vivid: linear-gradient(135deg, #0f60b6 0%, #009add 60%, #00f9ff 100%);\r\n    --grad-hero: linear-gradient(160deg, #012a5e 0%, #215091 40%, #0f60b6 75%, #009add 100%);\r\n    --surface-light: #eef3fb;\r\n    --surface-mid: rgba(33,80,145,0.06);\r\n    --border-light: rgba(33,80,145,0.14);\r\n    --border-glow: rgba(0,249,255,0.3);\r\n    --r-sm: 8px;\r\n    --r-md: 16px;\r\n    --r-lg: 24px;\r\n    --r-xl: 40px;\r\n  }\r\n\r\n  * { margin: 0; padding: 0; box-sizing: border-box; }\r\n  html { scroll-behavior: smooth; }\r\n  body {\r\n    font-family: 'Roboto', sans-serif;\r\n    color: var(--text-dark);\r\n    background: var(--white);\r\n    -webkit-font-smoothing: antialiased;\r\n    overflow-x: hidden;\r\n  }\r\n\r\n  \/* \u2550\u2550 BLOCOS DE BENEF\u00cdCIO \u2550\u2550 *\/\r\n  .benefit-block { padding: 100px 5vw; }\r\n\r\n  .benefit-inner {\r\n    max-width: 1100px; margin: 0 auto;\r\n    display: grid; grid-template-columns: 1fr 1fr;\r\n    gap: 80px; align-items: center;\r\n  }\r\n\r\n  .benefit-inner.rev { direction: rtl; }\r\n  .benefit-inner.rev > * { direction: ltr; }\r\n\r\n  .benefit-num {\r\n    font-family: 'Roboto', sans-serif;\r\n    font-size: 80px; font-weight: 900;\r\n    color: rgba(255,255,255,0.05);\r\n    line-height: 1; letter-spacing: -4px;\r\n    margin-bottom: -12px;\r\n  }\r\n\r\n  .sec-eyebrow {\r\n    font-family: 'Roboto Mono', monospace;\r\n    font-size: 11px; font-weight: 600;\r\n    letter-spacing: 2px; text-transform: uppercase;\r\n    margin-bottom: 16px;\r\n    display: flex; align-items: center; gap: 10px;\r\n  }\r\n\r\n  .benefit-text h2 {\r\n    font-family: 'Roboto', sans-serif;\r\n    font-weight: 700;\r\n    font-size: clamp(26px, 3vw, 42px);\r\n    line-height: 1.15; letter-spacing: -0.8px;\r\n    color: #ffffff; margin-bottom: 18px;\r\n  }\r\n\r\n  .benefit-text h2 .accent { color: var(--p4); }\r\n\r\n  .benefit-text p {\r\n    font-size: 17px; font-weight: 300;\r\n    color: rgba(255,255,255,0.65); line-height: 1.75; margin-bottom: 28px;\r\n  }\r\n\r\n  .tags { display: flex; flex-wrap: wrap; gap: 8px; }\r\n\r\n  .tag {\r\n    font-family: 'Roboto Mono', monospace;\r\n    font-size: 11px; font-weight: 500;\r\n    color: var(--p4);\r\n    background: rgba(0,249,255,0.08);\r\n    border: 1px solid rgba(0,249,255,0.2);\r\n    padding: 5px 13px; border-radius: 100px;\r\n    letter-spacing: 0.3px;\r\n  }\r\n\r\n  \/* \u2550\u2550 FORCE TEXT COLORS \u2014 override Hello Elementor theme \u2550\u2550 *\/\r\n  .elementor-widget-html .benefit-block .benefit-num {\r\n    color: rgba(255,255,255,0.05) !important;\r\n  }\r\n\r\n  .elementor-widget-html .benefit-block .benefit-text h2 {\r\n    font-size: clamp(26px, 3vw, 42px) !important;\r\n    font-weight: 700 !important;\r\n    color: #ffffff !important;\r\n    letter-spacing: -0.8px !important;\r\n    line-height: 1.15 !important;\r\n  }\r\n\r\n  .elementor-widget-html .benefit-block .benefit-text h2 .accent {\r\n    color: #00f9ff !important;\r\n  }\r\n\r\n  .elementor-widget-html .benefit-block .benefit-text p {\r\n    font-size: 17px !important;\r\n    font-weight: 300 !important;\r\n    color: rgba(255,255,255,0.65) !important;\r\n    line-height: 1.75 !important;\r\n  }\r\n\r\n  .elementor-widget-html .benefit-block .sec-eyebrow {\r\n    font-size: 11px !important;\r\n    font-weight: 600 !important;\r\n    letter-spacing: 2px !important;\r\n    color: #0f60b6 !important;\r\n  }\r\n\r\n  .elementor-widget-html .benefit-block .tag {\r\n    font-size: 11px !important;\r\n    color: #00f9ff !important;\r\n    background: rgba(0,249,255,0.08) !important;\r\n    border: 1px solid rgba(0,249,255,0.2) !important;\r\n  }\r\n\r\n  \/* \u2550\u2550 SCROLL REVEAL \u2550\u2550 *\/\r\n  [data-r] { opacity: 1 !important; transform: none !important; }\r\n\r\n  \/* \u2550\u2550 RESPONSIVE \u2550\u2550 *\/\r\n  @media (max-width: 768px) {\r\n    .benefit-inner { grid-template-columns: 1fr; gap: 36px; }\r\n    .benefit-inner.rev { direction: ltr; }\r\n  }\r\n\r\n\/* \u2550\u2550 CRITICAL: Restore section padding \u2550\u2550 *\/\r\n.elementor-widget-html .benefit-block {\r\n  padding: 100px 5vw !important;\r\n  box-sizing: border-box !important;\r\n}\r\n\r\n\/* Force all data-r visible *\/\r\n[data-r] { opacity: 1 !important; transform: none !important; }\r\n\r\n\/* \u2550\u2550 MASTER BACKGROUND OVERRIDE \u2550\u2550 *\/\r\n.hero                    { background: #0a1a33 !important; }\r\n.pain-section            { background: #0a1a33 !important; }\r\n.benefit-block.dark-bg   { background: #0a1a33 !important; }\r\n.benefit-block.alt       { background: #0a1a33 !important; }\r\n.benefit-block.alt-light  { background: #eef3fb !important; }\r\n.benefit-block.grad-bg   { background: #0a1a33 !important; }\r\n.features-sec            { background: var(--grad-dark) !important; }\r\n.proof-sec               { background: var(--grad-dark) !important; }\r\n.testi-sec               { background: #0a1a33 !important; }\r\n.eco-sec                 { background: #0a1a33 !important; }\r\n.cta-sec                 { background: var(--grad-dark) !important; }\r\n.resources-sec           { background: #060e1f !important; }\r\n\r\n<\/style>\r\n\r\n<!-- \u2550\u2550\u2550 BENEF\u00cdCIO 02 \u2014 GEST\u00c3O DE CONTRATOS E ANUNCIANTES \u2550\u2550\u2550 -->\r\n<div class=\"benefit-block alt\">\r\n  <div class=\"benefit-inner rev\">\r\n\r\n    <!-- TEXTO -->\r\n    <div class=\"benefit-text\" data-r>\r\n      <div class=\"benefit-num\">02<\/div>\r\n      <div class=\"sec-eyebrow\" style=\"color:var(--p2)\">\r\n        <span style=\"width:20px;height:2px;background:var(--p2);border-radius:2px;display:block\"><\/span>\r\n        Gest\u00e3o de Contratos & Anunciantes\r\n      <\/div>\r\n      <h2>Todos os seus contratos. <span class=\"accent\">Um \u00fanico lugar.<\/span><\/h2>\r\n      <p>Cadastre anunciantes, acompanhe contratos e monitore cada inser\u00e7\u00e3o em tempo real, com filtros personaliz\u00e1veis e relat\u00f3rios detalhados que colocam o controle comercial nas suas m\u00e3os. O executivo de vendas disp\u00f5e de todas as informa\u00e7\u00f5es no momento da negocia\u00e7\u00e3o.<\/p>\r\n      <div class=\"tags\">\r\n        <span class=\"tag\">Cadastro centralizado<\/span>\r\n        <span class=\"tag\">Hist\u00f3rico de contratos<\/span>\r\n        <span class=\"tag\">Relat\u00f3rios customiz\u00e1veis<\/span>\r\n        <span class=\"tag\">Monitoramento de receita<\/span>\r\n      <\/div>\r\n    <\/div>\r\n\r\n    <!-- VISUAL \u2014 screenshot real do produto -->\r\n    <div data-r>\r\n      <img decoding=\"async\" src=\"https:\/\/playlistsolutions.com\/wp-content\/uploads\/2024\/12\/Planner_contratos-768x768.png\"\r\n           alt=\"Planner \u2014 gest\u00e3o centralizada de contratos e anunciantes\"\r\n           style=\"width:100%; display:block; aspect-ratio:1\/1; object-fit:cover; border-radius:var(--r-lg); border:1px solid rgba(0,154,221,0.22); box-shadow:0 8px 48px rgba(1,42,94,0.15);\">\r\n    <\/div>\r\n\r\n  <\/div>\r\n<\/div>\r\n\r\n<script>\r\ndocument.querySelectorAll('[data-r]').forEach(el => el.classList.add('on'));\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-a0e0b3a e-flex e-con-boxed e-con e-parent\" data-id=\"a0e0b3a\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-c12055e elementor-widget elementor-widget-html\" data-id=\"c12055e\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\r\n<style>\r\nnav { all: unset; }\r\n\r\n  \/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\r\n     DESIGN TOKENS \u2014 BRANDING OFICIAL PLAYLIST\r\n     Cores Prim\u00e1rias: #215091 \u00b7 #0f60b6 \u00b7 #009add \u00b7 #00f9ff\r\n     Cores Secund\u00e1rias (\u226420%): #012a5e \u00b7 #9c6dff \u00b7 #dfe1e1\r\n     Tipografia: Roboto Bold \/ Roboto Mono \/ Roboto Regular\r\n  \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\n  :root {\r\n    --p1: #215091;\r\n    --p2: #0f60b6;\r\n    --p3: #009add;\r\n    --p4: #00f9ff;\r\n    --s1: #012a5e;\r\n    --s2: #9c6dff;\r\n    --s3: #dfe1e1;\r\n    --white: #ffffff;\r\n    --off-white: #f4f7fb;\r\n    --text-dark: #0d1f3c;\r\n    --text-body: #2c3d5e;\r\n    --text-muted: #6b7fa3;\r\n    --text-light: rgba(255,255,255,0.85);\r\n    --text-fade: rgba(255,255,255,0.5);\r\n    --grad-brand: linear-gradient(135deg, #215091 0%, #0f60b6 50%, #009add 100%);\r\n    --grad-dark: linear-gradient(135deg, #012a5e 0%, #215091 60%, #0f60b6 100%);\r\n    --grad-vivid: linear-gradient(135deg, #0f60b6 0%, #009add 60%, #00f9ff 100%);\r\n    --grad-hero: linear-gradient(160deg, #012a5e 0%, #215091 40%, #0f60b6 75%, #009add 100%);\r\n    --surface-light: #eef3fb;\r\n    --surface-mid: rgba(33,80,145,0.06);\r\n    --border-light: rgba(33,80,145,0.14);\r\n    --border-glow: rgba(0,249,255,0.3);\r\n    --r-sm: 8px;\r\n    --r-md: 16px;\r\n    --r-lg: 24px;\r\n    --r-xl: 40px;\r\n  }\r\n\r\n  * { margin: 0; padding: 0; box-sizing: border-box; }\r\n  html { scroll-behavior: smooth; }\r\n  body {\r\n    font-family: 'Roboto', sans-serif;\r\n    color: var(--text-dark);\r\n    background: var(--white);\r\n    -webkit-font-smoothing: antialiased;\r\n    overflow-x: hidden;\r\n  }\r\n\r\n  \/* \u2550\u2550 BLOCOS DE BENEF\u00cdCIO \u2550\u2550 *\/\r\n  .benefit-block { padding: 100px 5vw; }\r\n\r\n  .benefit-inner {\r\n    max-width: 1100px; margin: 0 auto;\r\n    display: grid; grid-template-columns: 1fr 1fr;\r\n    gap: 80px; align-items: center;\r\n  }\r\n\r\n  .benefit-inner.rev { direction: rtl; }\r\n  .benefit-inner.rev > * { direction: ltr; }\r\n\r\n  .benefit-num {\r\n    font-family: 'Roboto', sans-serif;\r\n    font-size: 80px; font-weight: 900;\r\n    color: rgba(255,255,255,0.05);\r\n    line-height: 1; letter-spacing: -4px;\r\n    margin-bottom: -12px;\r\n  }\r\n\r\n  .sec-eyebrow {\r\n    font-family: 'Roboto Mono', monospace;\r\n    font-size: 11px; font-weight: 600;\r\n    letter-spacing: 2px; text-transform: uppercase;\r\n    margin-bottom: 16px;\r\n    display: flex; align-items: center; gap: 10px;\r\n  }\r\n\r\n  .benefit-text h2 {\r\n    font-family: 'Roboto', sans-serif;\r\n    font-weight: 700;\r\n    font-size: clamp(26px, 3vw, 42px);\r\n    line-height: 1.15; letter-spacing: -0.8px;\r\n    color: #ffffff; margin-bottom: 18px;\r\n  }\r\n\r\n  .benefit-text h2 .accent { color: var(--p4); }\r\n\r\n  .benefit-text p {\r\n    font-size: 17px; font-weight: 300;\r\n    color: rgba(255,255,255,0.65); line-height: 1.75; margin-bottom: 28px;\r\n  }\r\n\r\n  .tags { display: flex; flex-wrap: wrap; gap: 8px; }\r\n\r\n  .tag {\r\n    font-family: 'Roboto Mono', monospace;\r\n    font-size: 11px; font-weight: 500;\r\n    color: var(--p4);\r\n    background: rgba(0,249,255,0.08);\r\n    border: 1px solid rgba(0,249,255,0.2);\r\n    padding: 5px 13px; border-radius: 100px;\r\n    letter-spacing: 0.3px;\r\n  }\r\n\r\n  \/* \u2550\u2550 FORCE TEXT COLORS \u2014 override Hello Elementor theme \u2550\u2550 *\/\r\n  .elementor-widget-html .benefit-block .benefit-num {\r\n    color: rgba(255,255,255,0.05) !important;\r\n  }\r\n\r\n  .elementor-widget-html .benefit-block .benefit-text h2 {\r\n    font-size: clamp(26px, 3vw, 42px) !important;\r\n    font-weight: 700 !important;\r\n    color: #ffffff !important;\r\n    letter-spacing: -0.8px !important;\r\n    line-height: 1.15 !important;\r\n  }\r\n\r\n  .elementor-widget-html .benefit-block .benefit-text h2 .accent {\r\n    color: #00f9ff !important;\r\n  }\r\n\r\n  .elementor-widget-html .benefit-block .benefit-text p {\r\n    font-size: 17px !important;\r\n    font-weight: 300 !important;\r\n    color: rgba(255,255,255,0.65) !important;\r\n    line-height: 1.75 !important;\r\n  }\r\n\r\n  .elementor-widget-html .benefit-block .sec-eyebrow {\r\n    font-size: 11px !important;\r\n    font-weight: 600 !important;\r\n    letter-spacing: 2px !important;\r\n    color: #0f60b6 !important;\r\n  }\r\n\r\n  .elementor-widget-html .benefit-block .tag {\r\n    font-size: 11px !important;\r\n    color: #00f9ff !important;\r\n    background: rgba(0,249,255,0.08) !important;\r\n    border: 1px solid rgba(0,249,255,0.2) !important;\r\n  }\r\n\r\n  \/* \u2550\u2550 SCROLL REVEAL \u2550\u2550 *\/\r\n  [data-r] { opacity: 1 !important; transform: none !important; }\r\n\r\n  \/* \u2550\u2550 RESPONSIVE \u2550\u2550 *\/\r\n  @media (max-width: 768px) {\r\n    .benefit-inner { grid-template-columns: 1fr; gap: 36px; }\r\n    .benefit-inner.rev { direction: ltr; }\r\n  }\r\n\r\n\/* \u2550\u2550 CRITICAL: Restore section padding \u2550\u2550 *\/\r\n.elementor-widget-html .benefit-block {\r\n  padding: 100px 5vw !important;\r\n  box-sizing: border-box !important;\r\n}\r\n\r\n\/* Force all data-r visible *\/\r\n[data-r] { opacity: 1 !important; transform: none !important; }\r\n\r\n\/* \u2550\u2550 MASTER BACKGROUND OVERRIDE \u2550\u2550 *\/\r\n.hero                    { background: #0a1a33 !important; }\r\n.pain-section            { background: #0a1a33 !important; }\r\n.benefit-block.dark-bg   { background: #0a1a33 !important; }\r\n.benefit-block.alt       { background: #0a1a33 !important; }\r\n.benefit-block.alt-light  { background: #eef3fb !important; }\r\n.benefit-block.grad-bg   { background: #0a1a33 !important; }\r\n.features-sec            { background: var(--grad-dark) !important; }\r\n.proof-sec               { background: var(--grad-dark) !important; }\r\n.testi-sec               { background: #0a1a33 !important; }\r\n.eco-sec                 { background: #0a1a33 !important; }\r\n.cta-sec                 { background: var(--grad-dark) !important; }\r\n.resources-sec           { background: #060e1f !important; }\r\n\r\n<\/style>\r\n\r\n<!-- \u2550\u2550\u2550 BENEF\u00cdCIO 03 \u2014 STATION OFFICE & INTEGRA\u00c7\u00c3O \u2550\u2550\u2550 -->\r\n<div class=\"benefit-block dark-bg\">\r\n  <div class=\"benefit-inner\">\r\n\r\n    <!-- TEXTO -->\r\n    <div class=\"benefit-text\" data-r>\r\n      <div class=\"benefit-num\">03<\/div>\r\n      <div class=\"sec-eyebrow\" style=\"color:var(--p2)\">\r\n        <span style=\"width:20px;height:2px;background:var(--p2);border-radius:2px;display:block\"><\/span>\r\n        Station Office\r\n      <\/div>\r\n      <h2>Planner, Audie, Tocou 2.0 \u2014 o <span class=\"accent\">Station Office<\/span> conectado.<\/h2>\r\n      <p>O Planner integra-se nativamente com o Audie, para gest\u00e3o de ouvintes e promo\u00e7\u00f5es, com o Tocou 2.0, que transforma os dados da sua grade em relat\u00f3rios e gr\u00e1ficos anal\u00edticos em tempo real e com o Aires Cloud, onde o armazenamento da m\u00eddia \u00e9 realizado. Juntos, formam o Station Office: o conjunto de solu\u00e7\u00f5es 100% em nuvem da Playlist para uma opera\u00e7\u00e3o comercial completa.<\/p>\r\n      <div class=\"tags\">\r\n        <span class=\"tag\">Station Office<\/span>\r\n        <span class=\"tag\">Audie<\/span>\r\n        <span class=\"tag\">Tocou 2.0<\/span>\r\n        <span class=\"tag\">100% em nuvem<\/span>\r\n        <span class=\"tag\">Ecossistema unificado<\/span>\r\n      <\/div>\r\n    <\/div>\r\n\r\n    <!-- VISUAL \u2014 screenshot real do produto -->\r\n    <div data-r>\r\n      <img decoding=\"async\" src=\"https:\/\/playlistsolutions.com\/wp-content\/uploads\/2024\/12\/Planner_cloud_2-768x768.png\"\r\n           alt=\"Planner \u2014 integra\u00e7\u00e3o com Aires Cloud e ecossistema Playlist\"\r\n           style=\"width:100%; display:block; aspect-ratio:1\/1; object-fit:cover; border-radius:var(--r-lg); border:1px solid rgba(0,154,221,0.22); box-shadow:0 8px 48px rgba(1,42,94,0.15);\">\r\n    <\/div>\r\n\r\n  <\/div>\r\n<\/div>\r\n\r\n<script>\r\ndocument.querySelectorAll('[data-r]').forEach(el => el.classList.add('on'));\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-c36bfc8 e-flex e-con-boxed e-con e-parent\" data-id=\"c36bfc8\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-955905f elementor-widget elementor-widget-html\" data-id=\"955905f\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\r\n<style>\r\nnav { all: unset; }\r\n\r\n  \/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\r\n     DESIGN TOKENS \u2014 BRANDING OFICIAL PLAYLIST\r\n     Cores Prim\u00e1rias: #215091 \u00b7 #0f60b6 \u00b7 #009add \u00b7 #00f9ff\r\n     Cores Secund\u00e1rias (\u226420%): #012a5e \u00b7 #9c6dff \u00b7 #dfe1e1\r\n     Tipografia: Roboto Bold \/ Roboto Mono \/ Roboto Regular\r\n  \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\n  :root {\r\n    --p1: #215091;\r\n    --p2: #0f60b6;\r\n    --p3: #009add;\r\n    --p4: #00f9ff;\r\n    --s1: #012a5e;\r\n    --s2: #9c6dff;\r\n    --s3: #dfe1e1;\r\n    --white: #ffffff;\r\n    --off-white: #f4f7fb;\r\n    --text-dark: #0d1f3c;\r\n    --text-body: #2c3d5e;\r\n    --text-muted: #6b7fa3;\r\n    --text-light: rgba(255,255,255,0.85);\r\n    --text-fade: rgba(255,255,255,0.5);\r\n    --grad-brand: linear-gradient(135deg, #215091 0%, #0f60b6 50%, #009add 100%);\r\n    --grad-dark: linear-gradient(135deg, #012a5e 0%, #215091 60%, #0f60b6 100%);\r\n    --grad-vivid: linear-gradient(135deg, #0f60b6 0%, #009add 60%, #00f9ff 100%);\r\n    --grad-hero: linear-gradient(160deg, #012a5e 0%, #215091 40%, #0f60b6 75%, #009add 100%);\r\n    --surface-light: #eef3fb;\r\n    --surface-mid: rgba(33,80,145,0.06);\r\n    --border-light: rgba(33,80,145,0.14);\r\n    --border-glow: rgba(0,249,255,0.3);\r\n    --r-sm: 8px;\r\n    --r-md: 16px;\r\n    --r-lg: 24px;\r\n    --r-xl: 40px;\r\n  }\r\n\r\n  * { margin: 0; padding: 0; box-sizing: border-box; }\r\n  html { scroll-behavior: smooth; }\r\n  body {\r\n    font-family: 'Roboto', sans-serif;\r\n    color: var(--text-dark);\r\n    background: var(--white);\r\n    -webkit-font-smoothing: antialiased;\r\n    overflow-x: hidden;\r\n  }\r\n\r\n  \/* \u2550\u2550 BLOCOS DE BENEF\u00cdCIO \u2550\u2550 *\/\r\n  .benefit-block { padding: 100px 5vw; }\r\n\r\n  .benefit-inner {\r\n    max-width: 1100px; margin: 0 auto;\r\n    display: grid; grid-template-columns: 1fr 1fr;\r\n    gap: 80px; align-items: center;\r\n  }\r\n\r\n  .benefit-inner.rev { direction: rtl; }\r\n  .benefit-inner.rev > * { direction: ltr; }\r\n\r\n  .benefit-num {\r\n    font-family: 'Roboto', sans-serif;\r\n    font-size: 80px; font-weight: 900;\r\n    color: rgba(255,255,255,0.05);\r\n    line-height: 1; letter-spacing: -4px;\r\n    margin-bottom: -12px;\r\n  }\r\n\r\n  .sec-eyebrow {\r\n    font-family: 'Roboto Mono', monospace;\r\n    font-size: 11px; font-weight: 600;\r\n    letter-spacing: 2px; text-transform: uppercase;\r\n    margin-bottom: 16px;\r\n    display: flex; align-items: center; gap: 10px;\r\n  }\r\n\r\n  .benefit-text h2 {\r\n    font-family: 'Roboto', sans-serif;\r\n    font-weight: 700;\r\n    font-size: clamp(26px, 3vw, 42px);\r\n    line-height: 1.15; letter-spacing: -0.8px;\r\n    color: #ffffff; margin-bottom: 18px;\r\n  }\r\n\r\n  .benefit-text h2 .accent { color: var(--p4); }\r\n\r\n  .benefit-text p {\r\n    font-size: 17px; font-weight: 300;\r\n    color: rgba(255,255,255,0.65); line-height: 1.75; margin-bottom: 28px;\r\n  }\r\n\r\n  .tags { display: flex; flex-wrap: wrap; gap: 8px; }\r\n\r\n  .tag {\r\n    font-family: 'Roboto Mono', monospace;\r\n    font-size: 11px; font-weight: 500;\r\n    color: var(--p4);\r\n    background: rgba(0,249,255,0.08);\r\n    border: 1px solid rgba(0,249,255,0.2);\r\n    padding: 5px 13px; border-radius: 100px;\r\n    letter-spacing: 0.3px;\r\n  }\r\n\r\n  \/* \u2550\u2550 FORCE TEXT COLORS \u2014 override Hello Elementor theme \u2550\u2550 *\/\r\n  .elementor-widget-html .benefit-block .benefit-num {\r\n    color: rgba(255,255,255,0.05) !important;\r\n  }\r\n\r\n  .elementor-widget-html .benefit-block .benefit-text h2 {\r\n    font-size: clamp(26px, 3vw, 42px) !important;\r\n    font-weight: 700 !important;\r\n    color: #ffffff !important;\r\n    letter-spacing: -0.8px !important;\r\n    line-height: 1.15 !important;\r\n  }\r\n\r\n  .elementor-widget-html .benefit-block .benefit-text h2 .accent {\r\n    color: #00f9ff !important;\r\n  }\r\n\r\n  .elementor-widget-html .benefit-block .benefit-text p {\r\n    font-size: 17px !important;\r\n    font-weight: 300 !important;\r\n    color: rgba(255,255,255,0.65) !important;\r\n    line-height: 1.75 !important;\r\n  }\r\n\r\n  .elementor-widget-html .benefit-block .sec-eyebrow {\r\n    font-size: 11px !important;\r\n    font-weight: 600 !important;\r\n    letter-spacing: 2px !important;\r\n    color: #0f60b6 !important;\r\n  }\r\n\r\n  .elementor-widget-html .benefit-block .tag {\r\n    font-size: 11px !important;\r\n    color: #00f9ff !important;\r\n    background: rgba(0,249,255,0.08) !important;\r\n    border: 1px solid rgba(0,249,255,0.2) !important;\r\n  }\r\n\r\n  \/* \u2550\u2550 SCROLL REVEAL \u2550\u2550 *\/\r\n  [data-r] { opacity: 1 !important; transform: none !important; }\r\n\r\n  \/* \u2550\u2550 RESPONSIVE \u2550\u2550 *\/\r\n  @media (max-width: 768px) {\r\n    .benefit-inner { grid-template-columns: 1fr; gap: 36px; }\r\n    .benefit-inner.rev { direction: ltr; }\r\n  }\r\n\r\n\/* \u2550\u2550 CRITICAL: Restore section padding \u2550\u2550 *\/\r\n.elementor-widget-html .benefit-block {\r\n  padding: 100px 5vw !important;\r\n  box-sizing: border-box !important;\r\n}\r\n\r\n\/* \u2550\u2550 MASTER BACKGROUND OVERRIDE \u2550\u2550 *\/\r\n.hero                    { background: #0a1a33 !important; }\r\n.pain-section            { background: #0a1a33 !important; }\r\n.benefit-block.dark-bg   { background: #0a1a33 !important; }\r\n.benefit-block.alt       { background: #0a1a33 !important; }\r\n.benefit-block.alt-light  { background: #eef3fb !important; }\r\n.benefit-block.grad-bg   { background: #0a1a33 !important; }\r\n.features-sec            { background: var(--grad-dark) !important; }\r\n.proof-sec               { background: var(--grad-dark) !important; }\r\n.testi-sec               { background: #0a1a33 !important; }\r\n.eco-sec                 { background: #0a1a33 !important; }\r\n.cta-sec                 { background: var(--grad-dark) !important; }\r\n.resources-sec           { background: #060e1f !important; }\r\n\r\n<\/style>\r\n\r\n<!-- \u2550\u2550\u2550 BENEF\u00cdCIO 04 \u2014 INTERFACE INTUITIVA \u2550\u2550\u2550 -->\r\n<div class=\"benefit-block dark-bg\">\r\n  <div class=\"benefit-inner rev\">\r\n\r\n    <!-- TEXTO -->\r\n    <div class=\"benefit-text\" data-r>\r\n      <div class=\"benefit-num\">04<\/div>\r\n      <div class=\"sec-eyebrow\" style=\"color:var(--p2)\">\r\n        <span style=\"width:20px;height:2px;background:var(--p2);border-radius:2px;display:block\"><\/span>\r\n        Interface Intuitiva\r\n      <\/div>\r\n      <h2>Qualquer operador produtivo <span class=\"accent\">desde o primeiro dia.<\/span><\/h2>\r\n      <p>Pain\u00e9is organizados, menus claros e layout personaliz\u00e1vel, o Planner foi desenhado para que qualquer membro da equipe opere com fluidez, sem treinamento extensivo. Menos curva de aprendizado, mais tempo focado em vender.<\/p>\r\n      <div class=\"tags\">\r\n        <span class=\"tag\">Pain\u00e9is personaliz\u00e1veis<\/span>\r\n        <span class=\"tag\">Navega\u00e7\u00e3o simplificada<\/span>\r\n        <span class=\"tag\">Acesso via navegador<\/span>\r\n        <span class=\"tag\">100% em nuvem<\/span>\r\n      <\/div>\r\n    <\/div>\r\n\r\n    <!-- VISUAL \u2014 screenshot real do produto -->\r\n    <div data-r>\r\n      <img decoding=\"async\" src=\"https:\/\/playlistsolutions.com\/wp-content\/uploads\/2024\/12\/Planner_interfase-768x768.png\"\r\n           alt=\"Planner \u2014 interface intuitiva de programa\u00e7\u00e3o comercial\"\r\n           style=\"width:100%; display:block; aspect-ratio:1\/1; object-fit:cover; border-radius:var(--r-lg); border:1px solid rgba(0,154,221,0.22); box-shadow:0 8px 48px rgba(1,42,94,0.15);\">\r\n    <\/div>\r\n\r\n  <\/div>\r\n<\/div>\r\n\r\n<script>\r\ndocument.querySelectorAll('[data-r]').forEach(el => el.classList.add('on'));\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-2da2353 e-flex e-con-boxed e-con e-parent\" data-id=\"2da2353\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-5761707 elementor-widget elementor-widget-html\" data-id=\"5761707\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\r\n<style>\r\nnav { all: unset; }\r\n\r\n  \/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\r\n     DESIGN TOKENS \u2014 BRANDING OFICIAL PLAYLIST\r\n     Cores Prim\u00e1rias: #215091 \u00b7 #0f60b6 \u00b7 #009add \u00b7 #00f9ff\r\n     Cores Secund\u00e1rias (\u226420%): #012a5e \u00b7 #9c6dff \u00b7 #dfe1e1\r\n     Tipografia: Roboto Bold \/ Roboto Mono \/ Roboto Regular\r\n  \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\n  :root {\r\n    --p1: #215091;\r\n    --p2: #0f60b6;\r\n    --p3: #009add;\r\n    --p4: #00f9ff;\r\n    --s1: #012a5e;\r\n    --s2: #9c6dff;\r\n    --s3: #dfe1e1;\r\n    --white: #ffffff;\r\n    --off-white: #f4f7fb;\r\n    --text-dark: #0d1f3c;\r\n    --text-body: #2c3d5e;\r\n    --text-muted: #6b7fa3;\r\n    --text-light: rgba(255,255,255,0.85);\r\n    --text-fade: rgba(255,255,255,0.5);\r\n    --grad-brand: linear-gradient(135deg, #215091 0%, #0f60b6 50%, #009add 100%);\r\n    --grad-dark: linear-gradient(135deg, #012a5e 0%, #215091 60%, #0f60b6 100%);\r\n    --grad-vivid: linear-gradient(135deg, #0f60b6 0%, #009add 60%, #00f9ff 100%);\r\n    --grad-hero: linear-gradient(160deg, #012a5e 0%, #215091 40%, #0f60b6 75%, #009add 100%);\r\n    --surface-light: #eef3fb;\r\n    --surface-mid: rgba(33,80,145,0.06);\r\n    --border-light: rgba(33,80,145,0.14);\r\n    --border-glow: rgba(0,249,255,0.3);\r\n    --r-sm: 8px;\r\n    --r-md: 16px;\r\n    --r-lg: 24px;\r\n    --r-xl: 40px;\r\n  }\r\n\r\n  * { margin: 0; padding: 0; box-sizing: border-box; }\r\n  html { scroll-behavior: smooth; }\r\n  body {\r\n    font-family: 'Roboto', sans-serif;\r\n    color: var(--text-dark);\r\n    background: var(--white);\r\n    -webkit-font-smoothing: antialiased;\r\n    overflow-x: hidden;\r\n  }\r\n\r\n  \/* \u2550\u2550 BLOCOS DE BENEF\u00cdCIO \u2550\u2550 *\/\r\n  .benefit-block { padding: 100px 5vw; }\r\n\r\n  .benefit-inner {\r\n    max-width: 1100px; margin: 0 auto;\r\n    display: grid; grid-template-columns: 1fr 1fr;\r\n    gap: 80px; align-items: center;\r\n  }\r\n\r\n  .benefit-inner.rev { direction: rtl; }\r\n  .benefit-inner.rev > * { direction: ltr; }\r\n\r\n  .benefit-num {\r\n    font-family: 'Roboto', sans-serif;\r\n    font-size: 80px; font-weight: 900;\r\n    color: rgba(255,255,255,0.05);\r\n    line-height: 1; letter-spacing: -4px;\r\n    margin-bottom: -12px;\r\n  }\r\n\r\n  .sec-eyebrow {\r\n    font-family: 'Roboto Mono', monospace;\r\n    font-size: 11px; font-weight: 600;\r\n    letter-spacing: 2px; text-transform: uppercase;\r\n    margin-bottom: 16px;\r\n    display: flex; align-items: center; gap: 10px;\r\n  }\r\n\r\n  .benefit-text h2 {\r\n    font-family: 'Roboto', sans-serif;\r\n    font-weight: 700;\r\n    font-size: clamp(26px, 3vw, 42px);\r\n    line-height: 1.15; letter-spacing: -0.8px;\r\n    color: #ffffff; margin-bottom: 18px;\r\n  }\r\n\r\n  .benefit-text h2 .accent { color: var(--p4); }\r\n\r\n  .benefit-text p {\r\n    font-size: 17px; font-weight: 300;\r\n    color: rgba(255,255,255,0.65); line-height: 1.75; margin-bottom: 28px;\r\n  }\r\n\r\n  .tags { display: flex; flex-wrap: wrap; gap: 8px; }\r\n\r\n  .tag {\r\n    font-family: 'Roboto Mono', monospace;\r\n    font-size: 11px; font-weight: 500;\r\n    color: var(--p4);\r\n    background: rgba(0,249,255,0.08);\r\n    border: 1px solid rgba(0,249,255,0.2);\r\n    padding: 5px 13px; border-radius: 100px;\r\n    letter-spacing: 0.3px;\r\n  }\r\n\r\n  \/* \u2550\u2550 FORCE TEXT COLORS \u2014 override Hello Elementor theme \u2550\u2550 *\/\r\n  .elementor-widget-html .benefit-block .benefit-num {\r\n    color: rgba(255,255,255,0.05) !important;\r\n  }\r\n\r\n  .elementor-widget-html .benefit-block .benefit-text h2 {\r\n    font-size: clamp(26px, 3vw, 42px) !important;\r\n    font-weight: 700 !important;\r\n    color: #ffffff !important;\r\n    letter-spacing: -0.8px !important;\r\n    line-height: 1.15 !important;\r\n  }\r\n\r\n  .elementor-widget-html .benefit-block .benefit-text h2 .accent {\r\n    color: #00f9ff !important;\r\n  }\r\n\r\n  .elementor-widget-html .benefit-block .benefit-text p {\r\n    font-size: 17px !important;\r\n    font-weight: 300 !important;\r\n    color: rgba(255,255,255,0.65) !important;\r\n    line-height: 1.75 !important;\r\n  }\r\n\r\n  .elementor-widget-html .benefit-block .sec-eyebrow {\r\n    font-size: 11px !important;\r\n    font-weight: 600 !important;\r\n    letter-spacing: 2px !important;\r\n    color: #0f60b6 !important;\r\n  }\r\n\r\n  .elementor-widget-html .benefit-block .tag {\r\n    font-size: 11px !important;\r\n    color: #00f9ff !important;\r\n    background: rgba(0,249,255,0.08) !important;\r\n    border: 1px solid rgba(0,249,255,0.2) !important;\r\n  }\r\n\r\n  \/* \u2550\u2550 SCROLL REVEAL \u2550\u2550 *\/\r\n  [data-r] { opacity: 1 !important; transform: none !important; }\r\n\r\n  \/* \u2550\u2550 RESPONSIVE \u2550\u2550 *\/\r\n  @media (max-width: 768px) {\r\n    .benefit-inner { grid-template-columns: 1fr; gap: 36px; }\r\n    .benefit-inner.rev { direction: ltr; }\r\n  }\r\n\r\n\/* \u2550\u2550 CRITICAL: Restore section padding \u2550\u2550 *\/\r\n.elementor-widget-html .benefit-block {\r\n  padding: 100px 5vw !important;\r\n  box-sizing: border-box !important;\r\n}\r\n\r\n\/* \u2550\u2550 MASTER BACKGROUND OVERRIDE \u2550\u2550 *\/\r\n.hero                    { background: #0a1a33 !important; }\r\n.pain-section            { background: #0a1a33 !important; }\r\n.benefit-block.dark-bg   { background: #0a1a33 !important; }\r\n.benefit-block.alt       { background: #0a1a33 !important; }\r\n.benefit-block.alt-light  { background: #eef3fb !important; }\r\n.benefit-block.grad-bg   { background: #0a1a33 !important; }\r\n.features-sec            { background: var(--grad-dark) !important; }\r\n.proof-sec               { background: var(--grad-dark) !important; }\r\n.testi-sec               { background: #0a1a33 !important; }\r\n.eco-sec                 { background: #0a1a33 !important; }\r\n.cta-sec                 { background: var(--grad-dark) !important; }\r\n.resources-sec           { background: #060e1f !important; }\r\n\r\n<\/style>\r\n\r\n<!-- \u2550\u2550\u2550 BENEF\u00cdCIO 05 \u2014 ACESSO SEGURO EM NUVEM & PERFIS DE USU\u00c1RIO \u2550\u2550\u2550 -->\r\n<div class=\"benefit-block grad-bg\">\r\n  <div class=\"benefit-inner\">\r\n\r\n    <!-- TEXTO -->\r\n    <div class=\"benefit-text\" data-r>\r\n      <div class=\"benefit-num\">05<\/div>\r\n      <div class=\"sec-eyebrow\" style=\"color:var(--p2)\">\r\n        <span style=\"width:20px;height:2px;background:var(--p2);border-radius:2px;display:block\"><\/span>\r\n        Seguran\u00e7a & Acesso\r\n      <\/div>\r\n      <h2>Cada pessoa v\u00ea <span class=\"accent\">s\u00f3 o que precisa ver.<\/span><\/h2>\r\n      <p>Defina permiss\u00f5es espec\u00edficas por usu\u00e1rio e mantenha dados  protegidos. Tudo em nuvem, acess\u00edvel de qualquer lugar, com seguran\u00e7a de n\u00edvel corporativo e log completo de auditoria para cada a\u00e7\u00e3o realizada na plataforma.<\/p>\r\n      <div class=\"tags\">\r\n        <span class=\"tag\">Perfis de acesso<\/span>\r\n        <span class=\"tag\">Log de auditoria<\/span>\r\n        <span class=\"tag\">Acesso remoto seguro<\/span>\r\n        <span class=\"tag\">100% navegador<\/span>\r\n        <span class=\"tag\">5 Mbps ou superior<\/span>\r\n      <\/div>\r\n    <\/div>\r\n\r\n    <!-- VISUAL \u2014 screenshot real do produto -->\r\n    <div data-r>\r\n      <img decoding=\"async\" src=\"https:\/\/playlistsolutions.com\/wp-content\/uploads\/2024\/12\/Planner_perfiles_laptop-768x768.png\"\r\n           alt=\"Planner \u2014 perfis de usu\u00e1rio e acesso seguro em nuvem\"\r\n           style=\"width:100%; display:block; aspect-ratio:1\/1; object-fit:cover; border-radius:var(--r-lg); border:1px solid rgba(0,154,221,0.22); box-shadow:0 8px 48px rgba(1,42,94,0.15);\">\r\n    <\/div>\r\n\r\n  <\/div>\r\n<\/div>\r\n\r\n<script>\r\ndocument.querySelectorAll('[data-r]').forEach(el => el.classList.add('on'));\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-d24dbd4 e-flex e-con-boxed e-con e-parent\" data-id=\"d24dbd4\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-8189b02 elementor-widget elementor-widget-html\" data-id=\"8189b02\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\r\n<style>\r\nnav { all: unset; }\r\n\r\n  \/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\r\n     DESIGN TOKENS \u2014 BRANDING OFICIAL PLAYLIST\r\n     Cores Prim\u00e1rias: #215091 \u00b7 #0f60b6 \u00b7 #009add \u00b7 #00f9ff\r\n     Cores Secund\u00e1rias (\u226420%): #012a5e \u00b7 #9c6dff \u00b7 #dfe1e1\r\n     Tipografia: Roboto Bold \/ Roboto Mono \/ Roboto Regular\r\n  \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\n  :root {\r\n    --p1: #215091;\r\n    --p2: #0f60b6;\r\n    --p3: #009add;\r\n    --p4: #00f9ff;\r\n    --s1: #012a5e;\r\n    --s2: #9c6dff;\r\n    --s3: #dfe1e1;\r\n    --white: #ffffff;\r\n    --off-white: #f4f7fb;\r\n    --text-dark: #0d1f3c;\r\n    --text-body: #2c3d5e;\r\n    --text-muted: #6b7fa3;\r\n    --text-light: rgba(255,255,255,0.85);\r\n    --text-fade: rgba(255,255,255,0.5);\r\n    --grad-brand: linear-gradient(135deg, #215091 0%, #0f60b6 50%, #009add 100%);\r\n    --grad-dark: linear-gradient(135deg, #012a5e 0%, #215091 60%, #0f60b6 100%);\r\n    --grad-vivid: linear-gradient(135deg, #0f60b6 0%, #009add 60%, #00f9ff 100%);\r\n    --grad-hero: linear-gradient(160deg, #012a5e 0%, #215091 40%, #0f60b6 75%, #009add 100%);\r\n    --surface-light: #eef3fb;\r\n    --surface-mid: rgba(33,80,145,0.06);\r\n    --border-light: rgba(33,80,145,0.14);\r\n    --border-glow: rgba(0,249,255,0.3);\r\n    --r-sm: 8px;\r\n    --r-md: 16px;\r\n    --r-lg: 24px;\r\n    --r-xl: 40px;\r\n  }\r\n\r\n  * { margin: 0; padding: 0; box-sizing: border-box; }\r\n  html { scroll-behavior: smooth; }\r\n  body {\r\n    font-family: 'Roboto', sans-serif;\r\n    color: var(--text-dark);\r\n    background: var(--white);\r\n    -webkit-font-smoothing: antialiased;\r\n    overflow-x: hidden;\r\n  }\r\n\r\n  \/* \u2550\u2550 SE\u00c7\u00c3O FUNCIONALIDADES \u2550\u2550 *\/\r\n  .features-sec { background: var(--grad-dark); padding: 100px 5vw; }\r\n\r\n  .features-header { max-width: 1100px; margin: 0 auto 56px; }\r\n\r\n  .sec-eyebrow {\r\n    font-family: 'Roboto Mono', monospace;\r\n    font-size: 11px; font-weight: 600;\r\n    letter-spacing: 2px; text-transform: uppercase;\r\n    color: var(--p3); margin-bottom: 16px;\r\n    display: flex; align-items: center; gap: 10px;\r\n  }\r\n\r\n  .sec-eyebrow::before {\r\n    content: '';\r\n    display: block; width: 20px; height: 2px;\r\n    background: var(--p3); border-radius: 2px;\r\n  }\r\n\r\n  .sec-h2 {\r\n    font-family: 'Roboto', sans-serif;\r\n    font-weight: 700;\r\n    font-size: clamp(30px, 4vw, 52px);\r\n    line-height: 1.1;\r\n    letter-spacing: -1px;\r\n    color: #ffffff;\r\n    max-width: 680px;\r\n  }\r\n\r\n  \/* \u2550\u2550 GRID DE CARDS \u2550\u2550 *\/\r\n  .feat-grid {\r\n    max-width: 1100px; margin: 0 auto;\r\n    display: grid; grid-template-columns: repeat(auto-fit, minmax(290px, 1fr));\r\n    gap: 2px;\r\n    background: var(--border-light);\r\n    border-radius: var(--r-md); overflow: hidden;\r\n    border: 1px solid var(--border-light);\r\n  }\r\n\r\n  .feat-card {\r\n    background: white;\r\n    padding: 34px 30px;\r\n    transition: background 0.2s;\r\n    border-bottom: 3px solid transparent;\r\n  }\r\n\r\n  .feat-card:hover {\r\n    background: #f0f6ff;\r\n    border-bottom-color: var(--p3);\r\n  }\r\n\r\n  .fc-icon { font-size: 24px; margin-bottom: 14px; }\r\n\r\n  .feat-card h3 {\r\n    font-family: 'Roboto', sans-serif;\r\n    font-size: 16px; font-weight: 700;\r\n    color: var(--p1); margin-bottom: 8px;\r\n  }\r\n\r\n  .feat-card p {\r\n    font-size: 14px; font-weight: 400;\r\n    color: var(--text-body); line-height: 1.65;\r\n  }\r\n\r\n  \/* \u2550\u2550 FORCE COLORS \u2014 override Hello Elementor theme \u2550\u2550 *\/\r\n  .elementor-widget-html .features-sec { padding: 100px 5vw !important; }\r\n\r\n  .elementor-widget-html .features-sec .sec-h2 {\r\n    color: #ffffff !important;\r\n    font-size: clamp(30px, 4vw, 52px) !important;\r\n    font-weight: 700 !important;\r\n  }\r\n\r\n  .elementor-widget-html .features-sec .sec-eyebrow {\r\n    color: var(--p3) !important;\r\n  }\r\n\r\n  .elementor-widget-html .features-sec .feat-card h3 {\r\n    color: #215091 !important;\r\n    font-size: 16px !important;\r\n    font-weight: 700 !important;\r\n  }\r\n\r\n  .elementor-widget-html .features-sec .feat-card p {\r\n    color: #2c3d5e !important;\r\n    font-size: 14px !important;\r\n  }\r\n\r\n  \/* \u2550\u2550 SCROLL REVEAL \u2550\u2550 *\/\r\n  [data-r] { opacity: 1 !important; transform: none !important; }\r\n\r\n  \/* \u2550\u2550 RESPONSIVE \u2550\u2550 *\/\r\n  @media (max-width: 768px) {\r\n    .feat-grid { grid-template-columns: 1fr; }\r\n  }\r\n\r\n\/* \u2550\u2550 CRITICAL: Restore section padding \u2550\u2550 *\/\r\n.elementor-widget-html section {\r\n  padding: 100px 5vw !important;\r\n  box-sizing: border-box !important;\r\n}\r\n\r\n\/* \u2550\u2550 FEATURES dark override \u2014 fundo grad-dark \u2550\u2550 *\/\r\n.features-sec .sec-h2 { color: #ffffff !important; }\r\n.features-sec .sec-eyebrow { color: var(--p3) !important; }\r\n.features-sec .sec-eyebrow::before { background: var(--p3) !important; }\r\n\r\n\/* Force all data-r visible *\/\r\n[data-r] { opacity: 1 !important; transform: none !important; }\r\n\r\n\/* \u2550\u2550 MASTER BACKGROUND OVERRIDE \u2550\u2550 *\/\r\n.hero                    { background: #0a1a33 !important; }\r\n.pain-section            { background: #0a1a33 !important; }\r\n.benefit-block.dark-bg   { background: #0a1a33 !important; }\r\n.benefit-block.alt       { background: #0a1a33 !important; }\r\n.benefit-block.alt-light  { background: #eef3fb !important; }\r\n.benefit-block.grad-bg   { background: #0a1a33 !important; }\r\n.features-sec            { background: var(--grad-dark) !important; }\r\n.proof-sec               { background: var(--grad-dark) !important; }\r\n.testi-sec               { background: #0a1a33 !important; }\r\n.eco-sec                 { background: #0a1a33 !important; }\r\n.cta-sec                 { background: var(--grad-dark) !important; }\r\n.resources-sec           { background: #060e1f !important; }\r\n\r\n<\/style>\r\n\r\n<!-- \u2550\u2550\u2550 FUNCIONALIDADES \u2014 PLANNER \u2550\u2550\u2550 -->\r\n<section class=\"features-sec\" id=\"features\">\r\n  <div class=\"features-header\" data-r>\r\n    <div class=\"sec-eyebrow\">Todas as funcionalidades<\/div>\r\n    <h2 class=\"sec-h2\">Tudo o que a gest\u00e3o comercial da sua emissora precisa.<\/h2>\r\n  <\/div>\r\n  <div class=\"feat-grid\">\r\n\r\n    <div class=\"feat-card\" data-r>\r\n      <div class=\"fc-icon\">\ud83d\udcc5<\/div>\r\n      <h3>Automa\u00e7\u00e3o de Blocos Comerciais<\/h3>\r\n      <p>Configure blocos de hor\u00e1rio e categorias de anunciantes para que o Planner distribua inser\u00e7\u00f5es automaticamente, maximizando o aproveitamento de cada espa\u00e7o dispon\u00edvel.<\/p>\r\n    <\/div>\r\n\r\n    <div class=\"feat-card\" data-r>\r\n      <div class=\"fc-icon\">\ud83d\udcc4<\/div>\r\n      <h3>Gest\u00e3o Centralizada de Contratos<\/h3>\r\n      <p>Cadastre, acompanhe e gerencie todos os contratos de anunciantes em um \u00fanico lugar, com alertas de vencimento, hist\u00f3rico completo e controle de receita em tempo real.<\/p>\r\n    <\/div>\r\n\r\n    <div class=\"feat-card\" data-r>\r\n      <div class=\"fc-icon\">\ud83d\udcca<\/div>\r\n      <h3>Relat\u00f3rios Customiz\u00e1veis<\/h3>\r\n      <p>Gere relat\u00f3rios detalhados de desempenho de campanhas, contratos e blocos comerciais com filtros personaliz\u00e1veis, em poucos cliques, sempre com dados precisos.<\/p>\r\n    <\/div>\r\n\r\n    <div class=\"feat-card\" data-r>\r\n      <div class=\"fc-icon\">\ud83d\uddd3\ufe0f<\/div>\r\n      <h3>Modelos para Datas Sazonais<\/h3>\r\n      <p>Crie grades de programa\u00e7\u00e3o customiz\u00e1veis que substituem automaticamente a grade padr\u00e3o em feriados e datas especiais, com tabelas de pre\u00e7os diferenciadas para otimizar a receita.<\/p>\r\n    <\/div>\r\n\r\n    <div class=\"feat-card\" data-r>\r\n      <div class=\"fc-icon\">\ud83c\udfe2<\/div>\r\n      <h3>M\u00faltiplas Emissoras<\/h3>\r\n      <p>Gerencie centralizadamente dezenas de emissoras interligadas atrav\u00e9s de uma \u00fanica interface em nuvem. O Sync Service garante a sincroniza\u00e7\u00e3o local em cada esta\u00e7\u00e3o da rede.<\/p>\r\n    <\/div>\r\n\r\n    <div class=\"feat-card\" data-r>\r\n      <div class=\"fc-icon\">\ud83d\udd10<\/div>\r\n      <h3>Perfis e Permiss\u00f5es de Acesso<\/h3>\r\n      <p>Defina permiss\u00f5es espec\u00edficas por usu\u00e1rio para proteger dados financeiros e comerciais sens\u00edveis. Apenas pessoas autorizadas visualizam ou editam cada \u00e1rea da plataforma.<\/p>\r\n    <\/div>\r\n\r\n    <div class=\"feat-card\" data-r>\r\n      <div class=\"fc-icon\">\ud83d\udd0d<\/div>\r\n      <h3>Log de Auditoria Completo<\/h3>\r\n      <p>Acompanhe todas as opera\u00e7\u00f5es realizadas na plataforma por cada usu\u00e1rio. Transpar\u00eancia total para gestores e conformidade com as pol\u00edticas de seguran\u00e7a da emissora.<\/p>\r\n    <\/div>\r\n\r\n    <div class=\"feat-card\" data-r>\r\n      <div class=\"fc-icon\">\u2601\ufe0f<\/div>\r\n      <h3>100% em Nuvem, sem instala\u00e7\u00e3o<\/h3>\r\n      <p>Acesse e gerencie a opera\u00e7\u00e3o comercial de qualquer lugar via navegador, com banda larga de 5 Mbps ou superior. Sem servidores locais, sem instala\u00e7\u00e3o de software.<\/p>\r\n    <\/div>\r\n\r\n    <div class=\"feat-card\" data-r>\r\n      <div class=\"fc-icon\">\ud83d\udd17<\/div>\r\n      <h3>Integra\u00e7\u00e3o com o Ecossistema Playlist<\/h3>\r\n      <p>Conectado nativamente ao Aires Cloud e ao Playlist Digital, dados sincronizados em tempo real entre todos os m\u00f3dulos, eliminando retrabalho entre departamentos.<\/p>\r\n    <\/div>\r\n\r\n  <\/div>\r\n<\/section>\r\n\r\n<script>\r\ndocument.querySelectorAll('[data-r]').forEach(el => el.classList.add('on'));\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-59232cb e-flex e-con-boxed e-con e-parent\" data-id=\"59232cb\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-f4081a7 elementor-widget elementor-widget-html\" data-id=\"f4081a7\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\r\n<style>\r\nnav { all: unset; }\r\n\r\n  \/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\r\n     DESIGN TOKENS \u2014 BRANDING OFICIAL PLAYLIST\r\n     Cores Prim\u00e1rias: #215091 \u00b7 #0f60b6 \u00b7 #009add \u00b7 #00f9ff\r\n     Cores Secund\u00e1rias (\u226420%): #012a5e \u00b7 #9c6dff \u00b7 #dfe1e1\r\n     Tipografia: Roboto Bold \/ Roboto Mono \/ Roboto Regular\r\n  \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\n  :root {\r\n    \/* Cores Prim\u00e1rias *\/\r\n    --p1: #215091;   \/* Azul institucional *\/\r\n    --p2: #0f60b6;   \/* Azul m\u00e9dio *\/\r\n    --p3: #009add;   \/* Azul vivo *\/\r\n    --p4: #00f9ff;   \/* Ciano \u2014 acento energ\u00e9tico *\/\r\n\r\n    \/* Cores Secund\u00e1rias (uso \u226420%) *\/\r\n    --s1: #012a5e;   \/* Navy profundo *\/\r\n    --s2: #9c6dff;   \/* Lil\u00e1s (uso pontual) *\/\r\n    --s3: #dfe1e1;   \/* Cinza claro *\/\r\n\r\n    \/* Funcionais *\/\r\n    --white: #ffffff;\r\n    --off-white: #f4f7fb;\r\n    --text-dark: #0d1f3c;\r\n    --text-body: #2c3d5e;\r\n    --text-muted: #6b7fa3;\r\n    --text-light: rgba(255,255,255,0.85);\r\n    --text-fade: rgba(255,255,255,0.5);\r\n\r\n    \/* Gradientes de marca *\/\r\n    --grad-brand: linear-gradient(135deg, #215091 0%, #0f60b6 50%, #009add 100%);\r\n    --grad-dark: linear-gradient(135deg, #012a5e 0%, #215091 60%, #0f60b6 100%);\r\n    --grad-vivid: linear-gradient(135deg, #0f60b6 0%, #009add 60%, #00f9ff 100%);\r\n    --grad-hero: linear-gradient(160deg, #012a5e 0%, #215091 40%, #0f60b6 75%, #009add 100%);\r\n\r\n    \/* Superf\u00edcies *\/\r\n    --surface-light: #eef3fb;\r\n    --surface-mid: rgba(33,80,145,0.06);\r\n    --border-light: rgba(33,80,145,0.14);\r\n    --border-glow: rgba(0,249,255,0.3);\r\n\r\n    \/* Raios *\/\r\n    --r-sm: 8px;\r\n    --r-md: 16px;\r\n    --r-lg: 24px;\r\n    --r-xl: 40px;\r\n  }\r\n\r\n  * { margin: 0; padding: 0; box-sizing: border-box; }\r\n  html { scroll-behavior: smooth; }\r\n  body {\r\n    font-family: 'Roboto', sans-serif;\r\n    color: var(--text-dark);\r\n    background: var(--white);\r\n    -webkit-font-smoothing: antialiased;\r\n    overflow-x: hidden;\r\n  }\r\n\r\n  \/* \u2550\u2550 LINHAS DECORATIVAS (conceito visual: linhas derivadas do logo) \u2550\u2550 *\/\r\n  .brand-lines {\r\n    position: absolute;\r\n    inset: 0;\r\n    pointer-events: none;\r\n    overflow: hidden;\r\n  }\r\n\r\n  .brand-lines svg {\r\n    position: absolute;\r\n    inset: 0;\r\n    width: 100%;\r\n    height: 100%;\r\n  }\r\n\r\n  \/* \u2550\u2550 HERO \u2550\u2550 *\/\r\n  .hero {\r\n    position: relative;\r\n    min-height: 100vh;\r\n    background: var(--grad-hero);\r\n    display: flex;\r\n    flex-direction: column;\r\n    align-items: center;\r\n    justify-content: center;\r\n    padding: 140px 5vw 80px;\r\n    text-align: center;\r\n    overflow: hidden;\r\n  }\r\n\r\n  \/* Linhas vetoriais decorativas do conceito visual *\/\r\n  .hero-lines {\r\n    position: absolute;\r\n    inset: 0;\r\n    pointer-events: none;\r\n  }\r\n\r\n  .hero-content {\r\n    position: relative;\r\n    z-index: 2;\r\n    max-width: 860px;\r\n  }\r\n\r\n  .eyebrow {\r\n    display: inline-flex;\r\n    align-items: center;\r\n    gap: 10px;\r\n    font-family: 'Roboto Mono', monospace;\r\n    font-size: 11px;\r\n    font-weight: 600;\r\n    letter-spacing: 2px;\r\n    text-transform: uppercase;\r\n    color: var(--p4);\r\n    margin-bottom: 28px;\r\n  }\r\n\r\n  .eyebrow::before,\r\n  .eyebrow::after {\r\n    content: '';\r\n    display: block;\r\n    width: 28px;\r\n    height: 1.5px;\r\n    background: var(--p4);\r\n    opacity: 0.7;\r\n  }\r\n\r\n  .hero h1 {\r\n    font-family: 'Roboto', sans-serif;\r\n    font-weight: 900;\r\n    font-size: clamp(44px, 7vw, 92px);\r\n    line-height: 1.02;\r\n    letter-spacing: -2px;\r\n    color: #ffffff !important;\r\n    margin-bottom: 28px;\r\n  }\r\n\r\n  .hero h1 .highlight {\r\n    color: var(--p4);\r\n    position: relative;\r\n  }\r\n\r\n  .hero-sub {\r\n    font-family: 'Roboto', sans-serif;\r\n    font-weight: 300;\r\n    font-size: clamp(17px, 2.2vw, 22px);\r\n    color: rgba(255,255,255,0.7);\r\n    line-height: 1.65;\r\n    max-width: 580px;\r\n    margin: 0 auto 48px;\r\n  }\r\n\r\n  .hero-actions {\r\n    display: flex;\r\n    gap: 16px;\r\n    justify-content: center;\r\n    flex-wrap: wrap;\r\n    margin-bottom: 56px;\r\n  }\r\n\r\n  .btn-primary {\r\n    background: #ffffff;\r\n    color: var(--s1);\r\n    font-family: 'Roboto', sans-serif;\r\n    font-weight: 700;\r\n    font-size: 16px;\r\n    border: none;\r\n    padding: 16px 40px;\r\n    border-radius: 100px;\r\n    cursor: pointer;\r\n    text-decoration: none;\r\n    transition: all 0.25s;\r\n    display: inline-flex;\r\n    align-items: center;\r\n    gap: 10px;\r\n    box-shadow: 0 4px 20px rgba(0,0,0,0.22);\r\n  }\r\n\r\n  .btn-primary:hover {\r\n    background: var(--p4);\r\n    color: var(--s1);\r\n    transform: translateY(-3px);\r\n    box-shadow: 0 12px 32px rgba(0,249,255,0.4);\r\n  }\r\n\r\n  .btn-outline {\r\n    background: transparent;\r\n    color: #ffffff !important;\r\n    font-family: 'Roboto', sans-serif;\r\n    font-weight: 500;\r\n    font-size: 16px;\r\n    border: 1.5px solid rgba(255,255,255,0.35);\r\n    padding: 15px 36px;\r\n    border-radius: 100px;\r\n    cursor: pointer;\r\n    text-decoration: none;\r\n    transition: all 0.25s;\r\n    display: inline-flex;\r\n    align-items: center;\r\n    gap: 10px;\r\n  }\r\n\r\n  .btn-outline:hover {\r\n    border-color: var(--p4);\r\n    color: var(--p4);\r\n    background: rgba(0,249,255,0.06);\r\n  }\r\n\r\n  .hero-proof {\r\n    font-family: 'Roboto Mono', monospace;\r\n    font-size: 14px;\r\n    color: rgba(255,255,255,0.55);\r\n    letter-spacing: 0.5px;\r\n  }\r\n\r\n  .hero-proof strong {\r\n    color: rgba(255,255,255,0.8);\r\n    font-weight: 600;\r\n  }\r\n\r\n  \/* Pre\u00e7o no hero *\/\r\n  .hero-price {\r\n    display: inline-flex;\r\n    align-items: center;\r\n    gap: 0;\r\n    background: rgba(255,255,255,0.08);\r\n    border: 1px solid rgba(255,255,255,0.18);\r\n    border-radius: 16px;\r\n    padding: 0;\r\n    margin-bottom: 28px;\r\n    backdrop-filter: blur(8px);\r\n    overflow: hidden;\r\n  }\r\n\r\n  .price-option {\r\n    display: flex;\r\n    flex-direction: column;\r\n    align-items: center;\r\n    gap: 2px;\r\n    padding: 12px 24px;\r\n  }\r\n\r\n  .price-divider {\r\n    width: 1px;\r\n    height: 40px;\r\n    background: rgba(255,255,255,0.15);\r\n    flex-shrink: 0;\r\n  }\r\n\r\n  .price-label {\r\n    font-family: 'Roboto Mono', monospace;\r\n    font-size: 10px;\r\n    font-weight: 600;\r\n    letter-spacing: 1.2px;\r\n    text-transform: uppercase;\r\n    color: rgba(255,255,255,0.45);\r\n  }\r\n\r\n  .price-val {\r\n    font-family: 'Roboto', sans-serif;\r\n    font-size: 20px;\r\n    font-weight: 900;\r\n    color: white;\r\n    letter-spacing: -0.5px;\r\n    line-height: 1;\r\n  }\r\n\r\n  .price-per {\r\n    font-size: 12px;\r\n    font-weight: 400;\r\n    color: rgba(255,255,255,0.5);\r\n    letter-spacing: 0;\r\n  }\r\n\r\n  .price-saving {\r\n    font-family: 'Roboto Mono', monospace;\r\n    font-size: 10px;\r\n    font-weight: 700;\r\n    color: var(--p4);\r\n    letter-spacing: 0.3px;\r\n    margin-top: 2px;\r\n  }\r\n\r\n  \/* Hero mockup *\/\r\n  .hero-mockup-wrap {\r\n    position: relative;\r\n    z-index: 2;\r\n    max-width: 1060px;\r\n    width: 100%;\r\n    margin: 60px auto 0;\r\n    padding: 0 5vw;\r\n  }\r\n\r\n  .mockup-shell {\r\n    background: rgba(1,42,94,0.7);\r\n    border: 1px solid rgba(0,249,255,0.2);\r\n    border-radius: 20px 20px 0 0;\r\n    overflow: hidden;\r\n    backdrop-filter: blur(8px);\r\n    box-shadow:\r\n      0 -8px 60px rgba(0,154,221,0.2),\r\n      0 0 0 1px rgba(255,255,255,0.05),\r\n      inset 0 1px 0 rgba(0,249,255,0.1);\r\n  }\r\n\r\n  .mockup-bar {\r\n    background: rgba(1,42,94,0.8);\r\n    border-bottom: 1px solid rgba(0,249,255,0.1);\r\n    padding: 14px 20px;\r\n    display: flex;\r\n    align-items: center;\r\n    gap: 8px;\r\n  }\r\n\r\n  .dot { width: 12px; height: 12px; border-radius: 50%; }\r\n  .dot-r { background: #FF5F57; }\r\n  .dot-y { background: #FFBD2E; }\r\n  .dot-g { background: #27C93F; }\r\n\r\n  .mock-title {\r\n    font-family: 'Roboto Mono', monospace;\r\n    font-size: 11px;\r\n    color: rgba(255,255,255,0.35);\r\n    margin-left: 10px;\r\n    letter-spacing: 0.5px;\r\n  }\r\n\r\n  .mockup-body {\r\n    padding: 20px;\r\n    display: grid;\r\n    grid-template-columns: 240px 1fr;\r\n    gap: 14px;\r\n    min-height: 400px;\r\n  }\r\n\r\n  .mock-sidebar {\r\n    background: rgba(255,255,255,0.03);\r\n    border: 1px solid rgba(0,249,255,0.08);\r\n    border-radius: var(--r-sm);\r\n    padding: 14px;\r\n  }\r\n\r\n  .mock-slabel {\r\n    font-family: 'Roboto Mono', monospace;\r\n    font-size: 9px;\r\n    letter-spacing: 1.5px;\r\n    text-transform: uppercase;\r\n    color: rgba(255,255,255,0.25);\r\n    margin-bottom: 12px;\r\n  }\r\n\r\n  .track-row {\r\n    display: flex;\r\n    align-items: center;\r\n    gap: 10px;\r\n    padding: 8px;\r\n    border-radius: 6px;\r\n    margin-bottom: 3px;\r\n  }\r\n\r\n  .track-row.active {\r\n    background: rgba(0,154,221,0.18);\r\n    border-left: 3px solid var(--p4);\r\n    padding-left: 5px;\r\n  }\r\n\r\n  .t-thumb { width: 32px; height: 32px; border-radius: 5px; flex-shrink: 0; }\r\n  .t-thumb-1 { background: linear-gradient(135deg, #215091, #009add); }\r\n  .t-thumb-2 { background: linear-gradient(135deg, #0f60b6, #00f9ff); }\r\n  .t-thumb-3 { background: linear-gradient(135deg, #012a5e, #215091); }\r\n  .t-thumb-4 { background: linear-gradient(135deg, #009add, #9c6dff); }\r\n  .t-thumb-5 { background: linear-gradient(135deg, #0f60b6, #215091); }\r\n\r\n  .t-info { flex: 1; overflow: hidden; }\r\n  .t-name { font-size: 11px; font-weight: 500; color: rgba(255,255,255,0.82); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }\r\n  .t-artist { font-size: 10px; color: rgba(255,255,255,0.35); }\r\n  .t-dur { font-family: 'Roboto Mono', monospace; font-size: 10px; color: rgba(255,255,255,0.3); }\r\n\r\n  .mock-main { display: flex; flex-direction: column; gap: 12px; }\r\n\r\n  .now-playing {\r\n    background: linear-gradient(135deg, rgba(15,96,182,0.25), rgba(0,154,221,0.15));\r\n    border: 1px solid rgba(0,249,255,0.2);\r\n    border-radius: var(--r-sm);\r\n    padding: 16px 20px;\r\n    display: flex;\r\n    align-items: center;\r\n    gap: 16px;\r\n  }\r\n\r\n  .np-thumb {\r\n    width: 52px; height: 52px;\r\n    border-radius: 8px;\r\n    background: var(--grad-brand);\r\n    flex-shrink: 0;\r\n    display: flex; align-items: center; justify-content: center;\r\n  }\r\n\r\n  .eq { display: flex; gap: 2px; align-items: flex-end; }\r\n  .eq-b {\r\n    width: 3px; border-radius: 2px;\r\n    background: var(--p4);\r\n    animation: eqAnim 0.7s ease-in-out infinite alternate;\r\n  }\r\n  .eq-b:nth-child(1) { height: 8px; animation-delay: 0s; }\r\n  .eq-b:nth-child(2) { height: 16px; animation-delay: 0.12s; }\r\n  .eq-b:nth-child(3) { height: 10px; animation-delay: 0.25s; }\r\n  .eq-b:nth-child(4) { height: 18px; animation-delay: 0.08s; }\r\n\r\n  @keyframes eqAnim { from { transform: scaleY(0.3); } to { transform: scaleY(1); } }\r\n\r\n  .np-info { flex: 1; }\r\n  .np-status {\r\n    font-family: 'Roboto Mono', monospace;\r\n    font-size: 9px; font-weight: 600;\r\n    letter-spacing: 1px; text-transform: uppercase;\r\n    color: var(--p4); margin-bottom: 4px;\r\n  }\r\n  .np-title { font-size: 15px; font-weight: 700; color: white; }\r\n  .np-artist { font-size: 12px; color: rgba(255,255,255,0.45); }\r\n\r\n  .prog-wrap { margin-top: 10px; }\r\n  .prog-bar { height: 3px; background: rgba(255,255,255,0.1); border-radius: 2px; }\r\n  .prog-fill { height: 100%; width: 42%; background: linear-gradient(90deg, var(--p3), var(--p4)); border-radius: 2px; }\r\n  .prog-times { display: flex; justify-content: space-between; font-family: 'Roboto Mono', monospace; font-size: 9px; color: rgba(255,255,255,0.28); margin-top: 4px; }\r\n\r\n  .mock-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; flex: 1; }\r\n\r\n  .mock-card {\r\n    background: rgba(255,255,255,0.03);\r\n    border: 1px solid rgba(0,249,255,0.08);\r\n    border-radius: var(--r-sm);\r\n    padding: 14px;\r\n  }\r\n\r\n  .mc-label {\r\n    font-family: 'Roboto Mono', monospace;\r\n    font-size: 9px; font-weight: 600;\r\n    letter-spacing: 1.2px; text-transform: uppercase;\r\n    color: rgba(255,255,255,0.28); margin-bottom: 8px;\r\n  }\r\n\r\n  .mc-val {\r\n    font-family: 'Roboto', sans-serif;\r\n    font-size: 26px; font-weight: 700; color: white; line-height: 1;\r\n  }\r\n\r\n  .mc-sub { font-size: 10px; color: rgba(255,255,255,0.32); margin-top: 4px; }\r\n\r\n  .online-badge {\r\n    display: inline-flex; align-items: center; gap: 6px;\r\n    background: rgba(39,201,63,0.12);\r\n    border: 1px solid rgba(39,201,63,0.28);\r\n    color: #27C93F;\r\n    font-size: 11px; font-weight: 700; font-family: 'Roboto Mono', monospace;\r\n    padding: 5px 12px; border-radius: 100px;\r\n  }\r\n\r\n  .green-dot {\r\n    width: 6px; height: 6px; border-radius: 50%;\r\n    background: #27C93F; box-shadow: 0 0 6px #27C93F;\r\n  }\r\n\r\n  \/* \u2550\u2550 SE\u00c7\u00d5ES COMPARTILHADAS \u2550\u2550 *\/\r\n  section { padding: 100px 5vw; }\r\n  .sec-inner { max-width: 1100px; margin: 0 auto; }\r\n\r\n  .sec-eyebrow {\r\n    font-family: 'Roboto Mono', monospace;\r\n    font-size: 11px; font-weight: 600;\r\n    letter-spacing: 2px; text-transform: uppercase;\r\n    color: var(--p3); margin-bottom: 16px;\r\n    display: flex; align-items: center; gap: 10px;\r\n  }\r\n\r\n  .sec-eyebrow::before {\r\n    content: '';\r\n    display: block; width: 20px; height: 2px;\r\n    background: var(--p3); border-radius: 2px;\r\n  }\r\n\r\n  .sec-h2 {\r\n    font-family: 'Roboto', sans-serif;\r\n    font-weight: 700;\r\n    font-size: clamp(30px, 4vw, 52px);\r\n    line-height: 1.1;\r\n    letter-spacing: -1px;\r\n    color: var(--text-dark);\r\n    max-width: 680px;\r\n  }\r\n\r\n  .sec-h2 .accent { color: var(--p2); }\r\n\r\n  .sec-lead {\r\n    font-size: 18px; font-weight: 300;\r\n    color: var(--text-body);\r\n    line-height: 1.7;\r\n    max-width: 540px;\r\n    margin-top: 18px;\r\n  }\r\n\r\n  \/* \u2550\u2550 SE\u00c7\u00c3O DOR \u2550\u2550 *\/\r\n  .pain-section {\r\n    background: var(--grad-dark);\r\n    position: relative; overflow: hidden;\r\n  }\r\n\r\n  .pain-section .sec-eyebrow { color: var(--p4); }\r\n  .pain-section .sec-eyebrow::before { background: var(--p4); }\r\n\r\n  .pain-h2 {\r\n    font-family: 'Roboto', sans-serif;\r\n    font-weight: 700;\r\n    font-size: clamp(30px, 4vw, 52px);\r\n    line-height: 1.1; letter-spacing: -1px;\r\n    color: white; max-width: 640px; margin-bottom: 56px;\r\n  }\r\n\r\n  .pain-grid {\r\n    display: grid;\r\n    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));\r\n    gap: 2px;\r\n    background: rgba(0,249,255,0.06);\r\n    border-radius: var(--r-md);\r\n    overflow: hidden;\r\n    border: 1px solid rgba(0,249,255,0.1);\r\n  }\r\n\r\n  .pain-card {\r\n    background: rgba(1,42,94,0.7);\r\n    backdrop-filter: blur(8px);\r\n    padding: 36px 30px;\r\n    transition: background 0.2s;\r\n  }\r\n\r\n  .pain-card:hover { background: rgba(15,96,182,0.25); }\r\n\r\n  .pain-icon { font-size: 26px; margin-bottom: 16px; display: block; }\r\n\r\n  .pain-card h3 {\r\n    font-family: 'Roboto', sans-serif;\r\n    font-size: 18px; font-weight: 700;\r\n    color: white; margin-bottom: 10px; line-height: 1.3;\r\n  }\r\n\r\n  .pain-card p {\r\n    font-size: 14px; font-weight: 400;\r\n    color: rgba(255,255,255,0.55); line-height: 1.7;\r\n  }\r\n\r\n  \/* \u2550\u2550 BLOCOS DE BENEF\u00cdCIO \u2550\u2550 *\/\r\n  .benefit-block { padding: 100px 5vw; }\r\n  .benefit-block.alt { background: var(--surface-light); }\r\n\r\n  .benefit-inner {\r\n    max-width: 1100px; margin: 0 auto;\r\n    display: grid; grid-template-columns: 1fr 1fr;\r\n    gap: 80px; align-items: center;\r\n  }\r\n\r\n  .benefit-inner.rev { direction: rtl; }\r\n  .benefit-inner.rev > * { direction: ltr; }\r\n\r\n  .benefit-num {\r\n    font-family: 'Roboto', sans-serif;\r\n    font-size: 80px; font-weight: 900;\r\n    color: rgba(33,80,145,0.07);\r\n    line-height: 1; letter-spacing: -4px;\r\n    margin-bottom: -12px;\r\n  }\r\n\r\n  .benefit-text h2 {\r\n    font-family: 'Roboto', sans-serif;\r\n    font-weight: 700;\r\n    font-size: clamp(26px, 3vw, 42px);\r\n    line-height: 1.15; letter-spacing: -0.8px;\r\n    color: var(--text-dark); margin-bottom: 18px;\r\n  }\r\n\r\n  .benefit-text h2 .accent { color: var(--p2); }\r\n\r\n  .benefit-text p {\r\n    font-size: 17px; font-weight: 300;\r\n    color: var(--text-body); line-height: 1.75; margin-bottom: 28px;\r\n  }\r\n\r\n  .tags { display: flex; flex-wrap: wrap; gap: 8px; }\r\n\r\n  .tag {\r\n    font-family: 'Roboto Mono', monospace;\r\n    font-size: 11px; font-weight: 500;\r\n    color: var(--p2);\r\n    background: rgba(15,96,182,0.08);\r\n    border: 1px solid rgba(15,96,182,0.2);\r\n    padding: 5px 13px; border-radius: 100px;\r\n    letter-spacing: 0.3px;\r\n  }\r\n\r\n  \/* \u2550 Visuais dos benef\u00edcios \u2550 *\/\r\n  .bv-shell {\r\n    background: var(--grad-dark);\r\n    border-radius: var(--r-lg);\r\n    padding: 30px;\r\n    position: relative; overflow: hidden;\r\n    border: 1px solid rgba(0,249,255,0.12);\r\n    aspect-ratio: 1 \/ 1;\r\n    display: flex;\r\n    flex-direction: column;\r\n    justify-content: space-between;\r\n  }\r\n\r\n  .bv-shell::after {\r\n    content: '';\r\n    position: absolute; top: -100px; right: -100px;\r\n    width: 300px; height: 300px;\r\n    background: radial-gradient(ellipse, rgba(0,249,255,0.07) 0%, transparent 65%);\r\n    pointer-events: none;\r\n  }\r\n\r\n  .bv-label {\r\n    font-family: 'Roboto Mono', monospace;\r\n    font-size: 9px; font-weight: 600;\r\n    letter-spacing: 1.5px; text-transform: uppercase;\r\n    color: rgba(255,255,255,0.3); margin-bottom: 20px;\r\n  }\r\n\r\n  \/* Benef\u00edcio 1 \u2014 Timeline de recupera\u00e7\u00e3o *\/\r\n  .recovery-list { display: flex; flex-direction: column; gap: 0; position: relative; z-index: 1; flex: 1; justify-content: space-evenly; }\r\n\r\n  .rec-item {\r\n    display: flex; gap: 14px; align-items: flex-start;\r\n    padding: 16px 0;\r\n    border-bottom: 1px solid rgba(255,255,255,0.06);\r\n  }\r\n\r\n  .rec-item:last-child { border-bottom: none; }\r\n\r\n  .rec-dot-col {\r\n    display: flex; flex-direction: column; align-items: center;\r\n    padding-top: 3px;\r\n  }\r\n\r\n  .rec-dot { width: 10px; height: 10px; border-radius: 50%; flex-shrink: 0; }\r\n  .rec-line { width: 1px; flex: 1; min-height: 16px; background: rgba(255,255,255,0.08); margin-top: 4px; }\r\n\r\n  .rec-text { flex: 1; }\r\n  .rec-name { font-size: 13px; font-weight: 700; color: rgba(255,255,255,0.9); margin-bottom: 4px; }\r\n  .rec-desc { font-size: 11px; color: rgba(255,255,255,0.38); line-height: 1.5; }\r\n  .rec-time { font-family: 'Roboto Mono', monospace; font-size: 10px; color: rgba(255,255,255,0.25); flex-shrink: 0; }\r\n\r\n  \/* Benef\u00edcio 2 \u2014 Automa\u00e7\u00e3o 24\/7 *\/\r\n  .stat-big {\r\n    font-family: 'Roboto', sans-serif;\r\n    font-size: 96px; font-weight: 900;\r\n    color: white; line-height: 1; letter-spacing: -4px;\r\n    position: relative; z-index: 1;\r\n  }\r\n\r\n  .stat-big span { color: var(--p4); font-size: 48px; }\r\n\r\n  .auto-rows { display: flex; flex-direction: column; gap: 10px; margin-top: 24px; position: relative; z-index: 1; flex: 1; justify-content: flex-end; }\r\n\r\n  .auto-row {\r\n    display: flex; justify-content: space-between; align-items: center;\r\n    padding: 13px 16px;\r\n    background: rgba(255,255,255,0.04);\r\n    border: 1px solid rgba(255,255,255,0.07);\r\n    border-radius: 8px;\r\n  }\r\n\r\n  .auto-row.green { background: rgba(39,201,63,0.07); border-color: rgba(39,201,63,0.16); }\r\n\r\n  .ar-label { font-size: 13px; color: rgba(255,255,255,0.7); }\r\n  .ar-val { font-family: 'Roboto', sans-serif; font-size: 20px; font-weight: 700; color: white; }\r\n  .ar-val.ok { color: #27C93F; font-size: 13px; font-weight: 700; }\r\n\r\n  \/* Benef\u00edcio 3 \u2014 R\u00e1dio Visual *\/\r\n  .vr-shell {\r\n    background: #06071a;\r\n    border-radius: var(--r-lg);\r\n    overflow: hidden;\r\n    min-height: 340px;\r\n    position: relative;\r\n    border: 1px solid rgba(0,249,255,0.15);\r\n  }\r\n\r\n  .vr-bar {\r\n    background: rgba(0,0,0,0.5);\r\n    border-bottom: 1px solid rgba(255,255,255,0.06);\r\n    padding: 12px 16px;\r\n    display: flex; align-items: center; gap: 8px;\r\n  }\r\n\r\n  .rec-blink { width: 8px; height: 8px; border-radius: 50%; background: #FF3B30; box-shadow: 0 0 8px #FF3B30; animation: blink 1.1s ease-in-out infinite; }\r\n  @keyframes blink { 0%,100%{opacity:1} 50%{opacity:0.35} }\r\n\r\n  .vr-bar-title { font-family: 'Roboto Mono', monospace; font-size: 10px; color: rgba(255,255,255,0.4); }\r\n  .vr-auto { font-family: 'Roboto Mono', monospace; font-size: 9px; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; background: rgba(0,249,255,0.12); border: 1px solid rgba(0,249,255,0.25); color: var(--p4); padding: 2px 8px; border-radius: 4px; margin-left: auto; }\r\n\r\n  .vr-body {\r\n    display: flex; flex-direction: column;\r\n    align-items: center; justify-content: center;\r\n    gap: 14px; padding: 28px; flex: 1;\r\n    min-height: 240px;\r\n  }\r\n\r\n  .vr-art {\r\n    width: 90px; height: 90px; border-radius: 12px;\r\n    background: var(--grad-brand);\r\n    box-shadow: 0 8px 32px rgba(0,154,221,0.35);\r\n  }\r\n\r\n  .vr-song-name { font-size: 16px; font-weight: 700; color: white; text-align: center; }\r\n  .vr-artist-name { font-size: 12px; color: rgba(255,255,255,0.45); text-align: center; }\r\n\r\n  .vr-sync-badge {\r\n    display: inline-flex; align-items: center; gap: 6px;\r\n    background: rgba(15,96,182,0.25); border: 1px solid rgba(0,154,221,0.4);\r\n    border-radius: 100px; padding: 5px 14px;\r\n    font-family: 'Roboto Mono', monospace;\r\n    font-size: 10px; font-weight: 600; color: var(--p3);\r\n  }\r\n\r\n  .vr-\r\n\r\n  .vr-tool { font-family: 'Roboto Mono', monospace; font-size: 10px; color: rgba(255,255,255,0.3); }\r\n\r\n  \/* Benef\u00edcio 4 \u2014 \u00c1udio *\/\r\n  .audio-shell {\r\n    background: var(--grad-dark);\r\n    border-radius: var(--r-lg);\r\n    padding: 28px;\r\n    aspect-ratio: 1 \/ 1;\r\n    border: 1px solid rgba(0,249,255,0.12);\r\n    display: flex; flex-direction: column; gap: 16px;\r\n    position: relative; overflow: hidden;\r\n  }\r\n\r\n  .waveform-box {\r\n    background: rgba(255,255,255,0.03);\r\n    border-radius: var(--r-sm);\r\n    border: 1px solid rgba(0,249,255,0.08);\r\n    padding: 14px;\r\n  }\r\n\r\n  .wf-label { font-family: 'Roboto Mono', monospace; font-size: 9px; letter-spacing: 1.5px; text-transform: uppercase; color: rgba(255,255,255,0.28); margin-bottom: 10px; }\r\n\r\n  .waveform { display: flex; align-items: center; gap: 2px; height: 44px; }\r\n  .wf-b { flex: 1; border-radius: 2px; background: rgba(15,96,182,0.3); min-width: 3px; }\r\n  .wf-b.played { background: var(--p3); opacity: 0.7; }\r\n  .wf-b.active { background: var(--p4); }\r\n\r\n  .mix-row {\r\n    display: flex; align-items: center; gap: 10px;\r\n    background: rgba(0,249,255,0.07);\r\n    border: 1px solid rgba(0,249,255,0.18);\r\n    border-radius: 8px; padding: 10px 14px;\r\n  }\r\n\r\n  .mix-key { font-size: 11px; color: rgba(255,255,255,0.55); font-weight: 500; flex: 1; }\r\n  .mix-val { font-family: 'Roboto Mono', monospace; font-size: 13px; font-weight: 700; color: var(--p4); }\r\n  .mix-auto-tag { font-family: 'Roboto Mono', monospace; font-size: 9px; color: rgba(255,255,255,0.28); }\r\n\r\n  .markers { display: flex; gap: 6px; }\r\n  .mrkr { flex: 1; padding: 8px 6px; background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.06); border-radius: 6px; text-align: center; }\r\n  .mrkr-n { font-family: 'Roboto Mono', monospace; font-size: 9px; text-transform: uppercase; letter-spacing: 0.8px; color: rgba(255,255,255,0.28); }\r\n  .mrkr-v { font-family: 'Roboto Mono', monospace; font-size: 11px; color: rgba(255,255,255,0.65); font-weight: 600; }\r\n\r\n  \/* Benef\u00edcio 5 \u2014 Rede *\/\r\n  .net-shell {\r\n    background: var(--grad-dark);\r\n    border-radius: var(--r-lg);\r\n    padding: 28px;\r\n    aspect-ratio: 1 \/ 1;\r\n    border: 1px solid rgba(0,249,255,0.12);\r\n    position: relative; overflow: hidden;\r\n  }\r\n\r\n  .net-list { display: flex; flex-direction: column; gap: 6px; margin-top: 14px; }\r\n\r\n  .net-row {\r\n    display: flex; align-items: center; gap: 12px;\r\n    padding: 11px 14px;\r\n    background: rgba(255,255,255,0.03);\r\n    border: 1px solid rgba(255,255,255,0.06);\r\n    border-radius: 8px;\r\n  }\r\n\r\n  .net-row.head {\r\n    background: rgba(15,96,182,0.14);\r\n    border-color: rgba(0,154,221,0.22);\r\n  }\r\n\r\n  .ns-dot { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; }\r\n  .ns-dot.on { background: #27C93F; box-shadow: 0 0 6px rgba(39,201,63,0.6); }\r\n  .ns-dot.sync { background: var(--p4); box-shadow: 0 0 6px rgba(0,249,255,0.5); }\r\n\r\n  .ns-name { font-size: 12px; font-weight: 700; color: rgba(255,255,255,0.8); flex: 1; }\r\n  .ns-track { font-size: 10px; color: rgba(255,255,255,0.32); }\r\n\r\n  .ns-badge { font-family: 'Roboto Mono', monospace; font-size: 9px; font-weight: 700; padding: 3px 8px; border-radius: 4px; }\r\n  .ns-badge.matriz { background: rgba(0,154,221,0.2); color: var(--p3); }\r\n  .ns-badge.sync-b { background: rgba(0,249,255,0.1); color: var(--p4); }\r\n\r\n  \/* \u2550\u2550 GRID DE FUNCIONALIDADES \u2550\u2550 *\/\r\n  .features-sec { background: var(--surface-light); padding: 100px 5vw; }\r\n  .features-header { max-width: 1100px; margin: 0 auto 56px; }\r\n\r\n  .feat-grid {\r\n    max-width: 1100px; margin: 0 auto;\r\n    display: grid; grid-template-columns: repeat(auto-fit, minmax(290px, 1fr));\r\n    gap: 2px;\r\n    background: var(--border-light);\r\n    border-radius: var(--r-md); overflow: hidden;\r\n    border: 1px solid var(--border-light);\r\n  }\r\n\r\n  .feat-card {\r\n    background: white;\r\n    padding: 34px 30px;\r\n    transition: background 0.2s;\r\n    border-bottom: 3px solid transparent;\r\n  }\r\n\r\n  .feat-card:hover {\r\n    background: #f0f6ff;\r\n    border-bottom-color: var(--p3);\r\n  }\r\n\r\n  .fc-icon { font-size: 24px; margin-bottom: 14px; }\r\n\r\n  .feat-card h3 {\r\n    font-family: 'Roboto', sans-serif;\r\n    font-size: 16px; font-weight: 700;\r\n    color: var(--p1); margin-bottom: 8px;\r\n  }\r\n\r\n  .feat-card p {\r\n    font-size: 14px; font-weight: 400;\r\n    color: var(--text-body); line-height: 1.65;\r\n  }\r\n\r\n  \/* \u2550\u2550 PROVA SOCIAL \u2550\u2550 *\/\r\n  .proof-sec {\r\n    background: var(--grad-brand);\r\n    padding: 100px 5vw;\r\n    text-align: center;\r\n    position: relative; overflow: hidden;\r\n  }\r\n\r\n  .proof-inner { max-width: 900px; margin: 0 auto; position: relative; z-index: 1; }\r\n\r\n  .proof-eyebrow {\r\n    font-family: 'Roboto Mono', monospace;\r\n    font-size: 11px; font-weight: 600;\r\n    letter-spacing: 2px; text-transform: uppercase;\r\n    color: rgba(255,255,255,0.55); margin-bottom: 24px;\r\n  }\r\n\r\n  .proof-quote {\r\n    font-family: 'Roboto', sans-serif;\r\n    font-size: clamp(20px, 3vw, 32px);\r\n    font-weight: 300;\r\n    color: white; line-height: 1.45;\r\n    margin-bottom: 16px;\r\n    letter-spacing: -0.3px;\r\n  }\r\n\r\n  .proof-quote strong { font-weight: 700; }\r\n\r\n  .proof-src {\r\n    font-family: 'Roboto Mono', monospace;\r\n    font-size: 12px; color: rgba(255,255,255,0.45);\r\n    margin-bottom: 60px;\r\n  }\r\n\r\n  .proof-stats { display: flex; justify-content: center; gap: 64px; flex-wrap: wrap; }\r\n\r\n  .pstat { text-align: center; }\r\n  .pstat-num {\r\n    font-family: 'Roboto', sans-serif;\r\n    font-size: 56px; font-weight: 900;\r\n    color: white; line-height: 1; letter-spacing: -2px;\r\n  }\r\n  .pstat-num sup { color: var(--p4); font-size: 28px; vertical-align: super; }\r\n  .pstat-label { font-size: 13px; color: rgba(255,255,255,0.5); margin-top: 6px; font-weight: 400; }\r\n\r\n  \/* \u2550\u2550 ECOSSISTEMA \u2550\u2550 *\/\r\n  .eco-sec { padding: 100px 5vw; }\r\n  .eco-inner { max-width: 1100px; margin: 0 auto; }\r\n\r\n  .eco-grid {\r\n    display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));\r\n    gap: 12px; margin-top: 48px;\r\n  }\r\n\r\n  .eco-card {\r\n    background: var(--surface-light);\r\n    border: 1px solid var(--border-light);\r\n    border-radius: var(--r-md);\r\n    padding: 24px 20px; text-align: center;\r\n    transition: all 0.2s;\r\n    cursor: default;\r\n  }\r\n\r\n  .eco-card:hover {\r\n    border-color: var(--p3);\r\n    transform: translateY(-4px);\r\n    box-shadow: 0 8px 24px rgba(0,154,221,0.12);\r\n  }\r\n\r\n  .eco-card.current {\r\n    background: var(--grad-brand);\r\n    border-color: transparent;\r\n    position: relative;\r\n  }\r\n\r\n  .eco-card.current::before {\r\n    content: 'Este produto';\r\n    position: absolute; top: -10px; left: 50%;\r\n    transform: translateX(-50%);\r\n    font-family: 'Roboto Mono', monospace;\r\n    font-size: 9px; font-weight: 700; letter-spacing: 0.5px; text-transform: uppercase;\r\n    background: var(--p4);\r\n    color: var(--s1);\r\n    padding: 2px 10px; border-radius: 100px; white-space: nowrap;\r\n  }\r\n\r\n  .eco-icon { font-size: 26px; margin-bottom: 10px; }\r\n\r\n  .eco-card h4 {\r\n    font-family: 'Roboto', sans-serif;\r\n    font-size: 13px; font-weight: 700;\r\n    color: var(--p1); margin-bottom: 4px;\r\n  }\r\n\r\n  .eco-card.current h4 { color: white; }\r\n\r\n  .eco-card p { font-size: 11px; color: var(--text-muted); }\r\n  .eco-card.current p { color: rgba(255,255,255,0.6); }\r\n\r\n  \/* \u2550\u2550 CTA FINAL \u2550\u2550 *\/\r\n  .cta-sec {\r\n    background: var(--grad-hero);\r\n    padding: 120px 5vw;\r\n    text-align: center;\r\n    position: relative; overflow: hidden;\r\n  }\r\n\r\n  .cta-inner { max-width: 720px; margin: 0 auto; position: relative; z-index: 2; }\r\n\r\n  .cta-eyebrow {\r\n    font-family: 'Roboto Mono', monospace;\r\n    font-size: 11px; font-weight: 600;\r\n    letter-spacing: 2px; text-transform: uppercase;\r\n    color: var(--p4); margin-bottom: 24px;\r\n    display: inline-flex; align-items: center; gap: 10px;\r\n  }\r\n\r\n  .cta-eyebrow::before,.cta-eyebrow::after {\r\n    content: ''; display: block; width: 24px; height: 1.5px;\r\n    background: var(--p4); opacity: 0.6; border-radius: 2px;\r\n  }\r\n\r\n  .cta-h2 {\r\n    font-family: 'Roboto', sans-serif;\r\n    font-weight: 900;\r\n    font-size: clamp(34px, 5vw, 62px);\r\n    color: white; line-height: 1.08;\r\n    letter-spacing: -1.5px; margin-bottom: 20px;\r\n  }\r\n\r\n  .cta-sub {\r\n    font-size: 18px; font-weight: 300;\r\n    color: rgba(255,255,255,0.6); line-height: 1.65;\r\n    margin-bottom: 48px;\r\n  }\r\n\r\n  .cta-btns { display: flex; justify-content: center; gap: 16px; flex-wrap: wrap; margin-bottom: 28px; }\r\n\r\n  .btn-cta-main {\r\n    background: white;\r\n    color: var(--s1);\r\n    font-family: 'Roboto', sans-serif;\r\n    font-weight: 700; font-size: 16px;\r\n    border: none; padding: 17px 44px;\r\n    border-radius: 100px; cursor: pointer;\r\n    text-decoration: none; transition: all 0.25s;\r\n    box-shadow: 0 4px 20px rgba(0,0,0,0.22);\r\n  }\r\n\r\n  .btn-cta-main:hover {\r\n    background: var(--p4);\r\n    color: var(--s1);\r\n    transform: translateY(-2px);\r\n    box-shadow: 0 12px 32px rgba(0,249,255,0.38);\r\n  }\r\n\r\n  .btn-cta-sec {\r\n    background: rgba(255,255,255,0.08);\r\n    color: white;\r\n    font-family: 'Roboto', sans-serif;\r\n    font-weight: 500; font-size: 16px;\r\n    border: 1.5px solid rgba(255,255,255,0.4);\r\n    padding: 16px 36px; border-radius: 100px;\r\n    cursor: pointer; text-decoration: none; transition: all 0.25s;\r\n  }\r\n\r\n  .btn-cta-sec:hover {\r\n    background: rgba(255,255,255,0.16);\r\n    border-color: var(--p4); color: var(--p4);\r\n  }\r\n\r\n  .cta-note {\r\n    font-family: 'Roboto Mono', monospace;\r\n    font-size: 12px; color: rgba(255,255,255,0.3);\r\n  }\r\n\r\n  \/* \u2550\u2550 IMAGEM REAL \u2014 classe pronta para substitui\u00e7\u00e3o \u2550\u2550 *\/\r\n  .section-screenshot {\r\n    width: 100%;\r\n    display: block;\r\n    border-radius: var(--r-lg);\r\n    border: 1px solid rgba(0,154,221,0.22);\r\n    box-shadow: 0 8px 48px rgba(1,42,94,0.15);\r\n    object-fit: cover;\r\n    aspect-ratio: 1 \/ 1;\r\n  }\r\n\r\n\r\n\r\n  \/* R\u00e1dio Visual video \u2014 propor\u00e7\u00e3o 16:9 horizontal *\/\r\n  .rv-video-wrap {\r\n    padding-bottom: 100% !important;\r\n  }\r\n\r\n  \/* \u2550\u2550 TESTEMUNHOS \u2550\u2550 *\/\r\n  .testi-sec {\r\n    background: var(--s1);\r\n    padding: 100px 5vw;\r\n    position: relative;\r\n    overflow: hidden;\r\n  }\r\n\r\n  .testi-inner {\r\n    max-width: 1100px;\r\n    margin: 0 auto;\r\n  }\r\n\r\n  .testi-header {\r\n    text-align: center;\r\n    margin-bottom: 56px;\r\n  }\r\n\r\n  .testi-header .sec-eyebrow {\r\n    justify-content: center;\r\n    color: var(--p4);\r\n  }\r\n\r\n  .testi-header .sec-eyebrow::before {\r\n    background: var(--p4);\r\n  }\r\n\r\n  .testi-h2 {\r\n    font-family: 'Roboto', sans-serif;\r\n    font-weight: 700;\r\n    font-size: clamp(28px, 3.5vw, 46px);\r\n    line-height: 1.1;\r\n    letter-spacing: -1px;\r\n    color: white;\r\n    margin-top: 8px;\r\n  }\r\n\r\n  .testi-grid {\r\n    display: grid;\r\n    grid-template-columns: repeat(3, 1fr);\r\n    gap: 20px;\r\n  }\r\n\r\n  .testi-card {\r\n    display: flex;\r\n    flex-direction: column;\r\n    gap: 16px;\r\n  }\r\n\r\n  \/* Video wrapper \u2014 propor\u00e7\u00e3o 9:16 vertical *\/\r\n  .testi-video-wrap {\r\n    position: relative;\r\n    width: 100%;\r\n    padding-bottom: 177.78%;\r\n    border-radius: var(--r-lg);\r\n    overflow: hidden;\r\n    background: #0a1628;\r\n    border: 1px solid rgba(0,249,255,0.12);\r\n    box-shadow: 0 8px 32px rgba(0,0,0,0.35);\r\n  }\r\n\r\n  .testi-video-wrap video {\r\n    position: absolute;\r\n    top: 0; left: 0;\r\n    width: 100%; height: 100%;\r\n    object-fit: cover;\r\n    border-radius: var(--r-lg);\r\n  }\r\n\r\n  \/* Play button overlay *\/\r\n  .testi-play-overlay {\r\n    position: absolute;\r\n    inset: 0;\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    background: rgba(1,42,94,0.35);\r\n    transition: background 0.2s;\r\n    cursor: pointer;\r\n    border-radius: var(--r-lg);\r\n  }\r\n\r\n  .testi-video-wrap:hover .testi-play-overlay {\r\n    background: rgba(1,42,94,0.15);\r\n  }\r\n\r\n  .testi-video-wrap.playing .testi-play-overlay {\r\n    display: none;\r\n  }\r\n\r\n  .play-btn {\r\n    width: 64px;\r\n    height: 64px;\r\n    border-radius: 50%;\r\n    background: rgba(0,249,255,0.15);\r\n    border: 2px solid rgba(0,249,255,0.6);\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    transition: all 0.2s;\r\n    backdrop-filter: blur(4px);\r\n  }\r\n\r\n  .testi-video-wrap:hover .play-btn {\r\n    background: rgba(0,249,255,0.25);\r\n    border-color: var(--p4);\r\n    transform: scale(1.08);\r\n    box-shadow: 0 0 24px rgba(0,249,255,0.3);\r\n  }\r\n\r\n  .play-btn svg {\r\n    width: 24px;\r\n    height: 24px;\r\n    fill: var(--p4);\r\n    margin-left: 3px;\r\n  }\r\n\r\n  \/* Card footer *\/\r\n  .testi-\r\n\r\n  .testi-station {\r\n    font-family: 'Roboto', sans-serif;\r\n    font-size: 17px;\r\n    font-weight: 700;\r\n    color: white;\r\n  }\r\n\r\n  .testi-city {\r\n    font-family: 'Roboto Mono', monospace;\r\n    font-size: 13px;\r\n    color: rgba(255,255,255,0.5);\r\n    letter-spacing: 0.5px;\r\n  }\r\n\r\n  @media (max-width: 768px) {\r\n    .testi-grid { grid-template-columns: 1fr; max-width: 360px; margin: 0 auto; }\r\n  }\r\n\r\n\r\n  \/* \u2550\u2550 FUNDO ESCURO \u2014 Se\u00e7\u00f5es 1, 3, 5 e Ecossistema \u2550\u2550 *\/\r\n  .dark-bg {\r\n    background: #0a1a33;\r\n  }\r\n\r\n  \/* Textos principais nas se\u00e7\u00f5es escuras *\/\r\n  .dark-bg .benefit-text h2 {\r\n    color: #ffffff;\r\n  }\r\n\r\n  .dark-bg .benefit-text h2 .accent {\r\n    color: var(--p4);\r\n  }\r\n\r\n  .dark-bg .benefit-text p {\r\n    color: rgba(255,255,255,0.65);\r\n  }\r\n\r\n  \/* N\u00famero decorativo \u2014 mais vis\u00edvel no escuro *\/\r\n  .dark-bg .benefit-num {\r\n    color: rgba(255,255,255,0.05);\r\n  }\r\n\r\n  \/* Eyebrow label *\/\r\n  .dark-bg .sec-eyebrow {\r\n    color: var(--p3);\r\n  }\r\n\r\n  .dark-bg .sec-eyebrow span {\r\n    background: var(--p3);\r\n  }\r\n\r\n  \/* Tags *\/\r\n  .dark-bg .tag {\r\n    color: var(--p4);\r\n    background: rgba(0,249,255,0.08);\r\n    border-color: rgba(0,249,255,0.2);\r\n  }\r\n\r\n  \/* Ecossistema \u2014 t\u00edtulos e subt\u00edtulos *\/\r\n  .dark-bg .sec-h2 {\r\n    color: #ffffff;\r\n  }\r\n\r\n  .dark-bg .sec-h2 .accent {\r\n    color: var(--p4);\r\n  }\r\n\r\n  .dark-bg .sec-lead {\r\n    color: rgba(255,255,255,0.6);\r\n  }\r\n\r\n  \/* Eco cards sobre fundo escuro *\/\r\n  .dark-bg .eco-card {\r\n    background: rgba(255,255,255,0.05);\r\n    border-color: rgba(255,255,255,0.1);\r\n  }\r\n\r\n  .dark-bg .eco-card:hover {\r\n    background: rgba(255,255,255,0.1);\r\n    border-color: var(--p3);\r\n    box-shadow: 0 8px 24px rgba(0,154,221,0.18);\r\n  }\r\n\r\n  .dark-bg .eco-card h4 {\r\n    color: rgba(255,255,255,0.9);\r\n  }\r\n\r\n  .dark-bg .eco-card p {\r\n    color: rgba(255,255,255,0.45);\r\n  }\r\n\r\n  .dark-bg .eco-card.current {\r\n    background: var(--grad-brand);\r\n    border-color: rgba(0,249,255,0.3);\r\n  }\r\n\r\n  .dark-bg .eco-card.current::before {\r\n    background: var(--p4);\r\n    color: #0a1a33;\r\n  }\r\n\r\n  \/* Section eyebrow in eco dark *\/\r\n  .dark-bg .sec-eyebrow {\r\n    color: var(--p3);\r\n  }\r\n\r\n\r\n  \/* \u2550\u2550 FUNDO GRADIENTE \u2014 Se\u00e7\u00e3o 5 (mesmo que O Problema Real) \u2550\u2550 *\/\r\n  .grad-bg {\r\n    background: var(--grad-dark);\r\n  }\r\n\r\n  \/* Inherit all same text adaptations as dark-bg *\/\r\n  .grad-bg .benefit-text h2 {\r\n    color: #ffffff;\r\n  }\r\n\r\n  .grad-bg .benefit-text h2 .accent {\r\n    color: var(--p4);\r\n  }\r\n\r\n  .grad-bg .benefit-text p {\r\n    color: rgba(255,255,255,0.7);\r\n  }\r\n\r\n  .grad-bg .benefit-num {\r\n    color: rgba(255,255,255,0.06);\r\n  }\r\n\r\n  .grad-bg .sec-eyebrow {\r\n    color: var(--p4);\r\n  }\r\n\r\n  .grad-bg .sec-eyebrow span {\r\n    background: var(--p4);\r\n  }\r\n\r\n  .grad-bg .tag {\r\n    color: var(--p4);\r\n    background: rgba(0,249,255,0.1);\r\n    border-color: rgba(0,249,255,0.25);\r\n  }\r\n\r\n  \/* \u2550\u2550 SCROLL REVEAL \u2550\u2550 *\/\r\n  [data-r] {\r\n    opacity: 0; transform: translateY(24px);\r\n    transition: opacity 0.65s cubic-bezier(0.16,1,0.3,1), transform 0.65s cubic-bezier(0.16,1,0.3,1);\r\n  }\r\n\r\n  [data-r].on { opacity: 1; transform: none; }\r\n\r\n  \/* \u2550\u2550 RESPONSIVE \u2550\u2550 *\/\r\n  @media (max-width: 768px) {\r\n    .benefit-inner { grid-template-columns: 1fr; gap: 36px; }\r\n    .benefit-inner.rev { direction: ltr; }\r\n    .mockup-body { grid-template-columns: 1fr; }\r\n    .mock-sidebar { display: none; }\r\n    .proof-stats { gap: 36px; }\r\n    .pstat-num { font-size: 42px; }\r\n  }\r\n\r\n\r\n\/* \u2550\u2550 CRITICAL: Restore section padding overridden by Hello Elementor theme \u2550\u2550 *\/\r\n.elementor-widget-html section {\r\n  padding: 100px 5vw !important;\r\n  box-sizing: border-box !important;\r\n}\r\n\r\n.elementor-widget-html .benefit-block {\r\n  padding: 100px 5vw !important;\r\n}\r\n\r\n.elementor-widget-html .benefit-block.alt {\r\n  padding: 100px 5vw !important;\r\n}\r\n\r\n\/* Force all data-r visible *\/\r\n[data-r] { opacity: 1 !important; transform: none !important; }\r\n\r\n<\/style>\r\n\r\n<!-- \u2550\u2550\u2550 PROVA SOCIAL \u2550\u2550\u2550 -->\r\n<section class=\"proof-sec\">\r\n  <!-- Linhas decorativas -->\r\n  <div class=\"brand-lines\" aria-hidden=\"true\">\r\n    <svg width=\"100%\" height=\"100%\" viewBox=\"0 0 1440 500\" preserveAspectRatio=\"xMidYMid slice\" fill=\"none\">\r\n      <line x1=\"0\" y1=\"400\" x2=\"600\" y2=\"50\" stroke=\"rgba(255,255,255,0.06)\" stroke-width=\"1\"\/>\r\n      <line x1=\"1440\" y1=\"100\" x2=\"800\" y2=\"450\" stroke=\"rgba(255,255,255,0.06)\" stroke-width=\"1\"\/>\r\n      <line x1=\"200\" y1=\"500\" x2=\"900\" y2=\"0\" stroke=\"rgba(0,249,255,0.05)\" stroke-width=\"0.8\"\/>\r\n    <\/svg>\r\n  <\/div>\r\n  <div class=\"proof-inner\">\r\n    <div class=\"proof-eyebrow\" data-r>Por que emissoras escolhem a Playlist<\/div>\r\n    <p class=\"proof-quote\" data-r>\r\n      <strong>\"O sistema mais confi\u00e1vel do mercado.\"<\/strong><br>\r\n      Reconhecido por operadores de r\u00e1dio no Brasil e no mundo.\r\n    <\/p>\r\n    <p class=\"proof-src\" data-r>\u2014 Operadores Playlist Software Solutions<\/p>\r\n    <div class=\"proof-stats\">\r\n      <div class=\"pstat\" data-r>\r\n        <div class=\"pstat-num\">+2,5<sup>mil<\/sup><\/div>\r\n        <div class=\"pstat-label\">emissoras ativas<\/div>\r\n      <\/div>\r\n      <div class=\"pstat\" data-r>\r\n        <div class=\"pstat-num\">30<sup>+<\/sup><\/div>\r\n        <div class=\"pstat-label\">anos de experi\u00eancia<\/div>\r\n      <\/div>\r\n      <div class=\"pstat\" data-r>\r\n        <div class=\"pstat-num\">24<sup>\/7<\/sup><\/div>\r\n        <div class=\"pstat-label\">suporte t\u00e9cnico<\/div>\r\n      <\/div>\r\n    <\/div>\r\n  <\/div>\r\n<\/section>\r\n\r\n<script>\r\ndocument.querySelectorAll('[data-r]').forEach(el => el.classList.add('on'));\r\n\r\n\/\/ Waveform\r\nconst wf = document.getElementById('wf');\r\nif (wf && wf.children.length === 0) {\r\n  for (let i = 0; i < 52; i++) {\r\n    const b = document.createElement('div'); b.className = 'wf-b';\r\n    b.style.height = (6 + Math.random() * 36) + 'px';\r\n    const p = i \/ 52;\r\n    if (p < 0.42) b.classList.add('played');\r\n    if (p >= 0.41 && p < 0.44) b.classList.add('active');\r\n    wf.appendChild(b);\r\n  }\r\n}\r\n\r\nfunction playTesti(id) {\r\n  const wrap = document.getElementById(id); if (!wrap) return;\r\n  const video = wrap.querySelector('video');\r\n  document.querySelectorAll('.testi-video-wrap video').forEach(v => {\r\n    if (v !== video) { v.pause(); v.closest('.testi-video-wrap').classList.remove('playing'); }\r\n  });\r\n  video.play(); wrap.classList.add('playing');\r\n}\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-385e6ec e-flex e-con-boxed e-con e-parent\" data-id=\"385e6ec\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-cd208d8 elementor-widget elementor-widget-html\" data-id=\"cd208d8\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\r\n<style>\r\nnav { all: unset; }\r\n\r\n  \/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\r\n     DESIGN TOKENS \u2014 BRANDING OFICIAL PLAYLIST\r\n     Cores Prim\u00e1rias: #215091 \u00b7 #0f60b6 \u00b7 #009add \u00b7 #00f9ff\r\n     Cores Secund\u00e1rias (\u226420%): #012a5e \u00b7 #9c6dff \u00b7 #dfe1e1\r\n     Tipografia: Roboto Bold \/ Roboto Mono \/ Roboto Regular\r\n  \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\n  :root {\r\n    \/* Cores Prim\u00e1rias *\/\r\n    --p1: #215091;   \/* Azul institucional *\/\r\n    --p2: #0f60b6;   \/* Azul m\u00e9dio *\/\r\n    --p3: #009add;   \/* Azul vivo *\/\r\n    --p4: #00f9ff;   \/* Ciano \u2014 acento energ\u00e9tico *\/\r\n\r\n    \/* Cores Secund\u00e1rias (uso \u226420%) *\/\r\n    --s1: #012a5e;   \/* Navy profundo *\/\r\n    --s2: #9c6dff;   \/* Lil\u00e1s (uso pontual) *\/\r\n    --s3: #dfe1e1;   \/* Cinza claro *\/\r\n\r\n    \/* Funcionais *\/\r\n    --white: #ffffff;\r\n    --off-white: #f4f7fb;\r\n    --text-dark: #0d1f3c;\r\n    --text-body: #2c3d5e;\r\n    --text-muted: #6b7fa3;\r\n    --text-light: rgba(255,255,255,0.85);\r\n    --text-fade: rgba(255,255,255,0.5);\r\n\r\n    \/* Gradientes de marca *\/\r\n    --grad-brand: linear-gradient(135deg, #215091 0%, #0f60b6 50%, #009add 100%);\r\n    --grad-dark: linear-gradient(135deg, #012a5e 0%, #215091 60%, #0f60b6 100%);\r\n    --grad-vivid: linear-gradient(135deg, #0f60b6 0%, #009add 60%, #00f9ff 100%);\r\n    --grad-hero: linear-gradient(160deg, #012a5e 0%, #215091 40%, #0f60b6 75%, #009add 100%);\r\n\r\n    \/* Superf\u00edcies *\/\r\n    --surface-light: #eef3fb;\r\n    --surface-mid: rgba(33,80,145,0.06);\r\n    --border-light: rgba(33,80,145,0.14);\r\n    --border-glow: rgba(0,249,255,0.3);\r\n\r\n    \/* Raios *\/\r\n    --r-sm: 8px;\r\n    --r-md: 16px;\r\n    --r-lg: 24px;\r\n    --r-xl: 40px;\r\n  }\r\n\r\n  * { margin: 0; padding: 0; box-sizing: border-box; }\r\n  html { scroll-behavior: smooth; }\r\n  body {\r\n    font-family: 'Roboto', sans-serif;\r\n    color: var(--text-dark);\r\n    background: var(--white);\r\n    -webkit-font-smoothing: antialiased;\r\n    overflow-x: hidden;\r\n  }\r\n\r\n  \/* \u2550\u2550 LINHAS DECORATIVAS (conceito visual: linhas derivadas do logo) \u2550\u2550 *\/\r\n  .brand-lines {\r\n    position: absolute;\r\n    inset: 0;\r\n    pointer-events: none;\r\n    overflow: hidden;\r\n  }\r\n\r\n  .brand-lines svg {\r\n    position: absolute;\r\n    inset: 0;\r\n    width: 100%;\r\n    height: 100%;\r\n  }\r\n\r\n  \/* \u2550\u2550 HERO \u2550\u2550 *\/\r\n  .hero {\r\n    position: relative;\r\n    min-height: 100vh;\r\n    background: var(--grad-hero);\r\n    display: flex;\r\n    flex-direction: column;\r\n    align-items: center;\r\n    justify-content: center;\r\n    padding: 140px 5vw 80px;\r\n    text-align: center;\r\n    overflow: hidden;\r\n  }\r\n\r\n  \/* Linhas vetoriais decorativas do conceito visual *\/\r\n  .hero-lines {\r\n    position: absolute;\r\n    inset: 0;\r\n    pointer-events: none;\r\n  }\r\n\r\n  .hero-content {\r\n    position: relative;\r\n    z-index: 2;\r\n    max-width: 860px;\r\n  }\r\n\r\n  .eyebrow {\r\n    display: inline-flex;\r\n    align-items: center;\r\n    gap: 10px;\r\n    font-family: 'Roboto Mono', monospace;\r\n    font-size: 11px;\r\n    font-weight: 600;\r\n    letter-spacing: 2px;\r\n    text-transform: uppercase;\r\n    color: var(--p4);\r\n    margin-bottom: 28px;\r\n  }\r\n\r\n  .eyebrow::before,\r\n  .eyebrow::after {\r\n    content: '';\r\n    display: block;\r\n    width: 28px;\r\n    height: 1.5px;\r\n    background: var(--p4);\r\n    opacity: 0.7;\r\n  }\r\n\r\n  .hero h1 {\r\n    font-family: 'Roboto', sans-serif;\r\n    font-weight: 900;\r\n    font-size: clamp(44px, 7vw, 92px);\r\n    line-height: 1.02;\r\n    letter-spacing: -2px;\r\n    color: #ffffff !important;\r\n    margin-bottom: 28px;\r\n  }\r\n\r\n  .hero h1 .highlight {\r\n    color: var(--p4);\r\n    position: relative;\r\n  }\r\n\r\n  .hero-sub {\r\n    font-family: 'Roboto', sans-serif;\r\n    font-weight: 300;\r\n    font-size: clamp(17px, 2.2vw, 22px);\r\n    color: rgba(255,255,255,0.7);\r\n    line-height: 1.65;\r\n    max-width: 580px;\r\n    margin: 0 auto 48px;\r\n  }\r\n\r\n  .hero-actions {\r\n    display: flex;\r\n    gap: 16px;\r\n    justify-content: center;\r\n    flex-wrap: wrap;\r\n    margin-bottom: 56px;\r\n  }\r\n\r\n  .btn-primary {\r\n    background: #ffffff;\r\n    color: var(--s1);\r\n    font-family: 'Roboto', sans-serif;\r\n    font-weight: 700;\r\n    font-size: 16px;\r\n    border: none;\r\n    padding: 16px 40px;\r\n    border-radius: 100px;\r\n    cursor: pointer;\r\n    text-decoration: none;\r\n    transition: all 0.25s;\r\n    display: inline-flex;\r\n    align-items: center;\r\n    gap: 10px;\r\n    box-shadow: 0 4px 20px rgba(0,0,0,0.22);\r\n  }\r\n\r\n  .btn-primary:hover {\r\n    background: var(--p4);\r\n    color: var(--s1);\r\n    transform: translateY(-3px);\r\n    box-shadow: 0 12px 32px rgba(0,249,255,0.4);\r\n  }\r\n\r\n  .btn-outline {\r\n    background: transparent;\r\n    color: #ffffff !important;\r\n    font-family: 'Roboto', sans-serif;\r\n    font-weight: 500;\r\n    font-size: 16px;\r\n    border: 1.5px solid rgba(255,255,255,0.35);\r\n    padding: 15px 36px;\r\n    border-radius: 100px;\r\n    cursor: pointer;\r\n    text-decoration: none;\r\n    transition: all 0.25s;\r\n    display: inline-flex;\r\n    align-items: center;\r\n    gap: 10px;\r\n  }\r\n\r\n  .btn-outline:hover {\r\n    border-color: var(--p4);\r\n    color: var(--p4);\r\n    background: rgba(0,249,255,0.06);\r\n  }\r\n\r\n  .hero-proof {\r\n    font-family: 'Roboto Mono', monospace;\r\n    font-size: 14px;\r\n    color: rgba(255,255,255,0.55);\r\n    letter-spacing: 0.5px;\r\n  }\r\n\r\n  .hero-proof strong {\r\n    color: rgba(255,255,255,0.8);\r\n    font-weight: 600;\r\n  }\r\n\r\n  \/* Pre\u00e7o no hero *\/\r\n  .hero-price {\r\n    display: inline-flex;\r\n    align-items: center;\r\n    gap: 0;\r\n    background: rgba(255,255,255,0.08);\r\n    border: 1px solid rgba(255,255,255,0.18);\r\n    border-radius: 16px;\r\n    padding: 0;\r\n    margin-bottom: 28px;\r\n    backdrop-filter: blur(8px);\r\n    overflow: hidden;\r\n  }\r\n\r\n  .price-option {\r\n    display: flex;\r\n    flex-direction: column;\r\n    align-items: center;\r\n    gap: 2px;\r\n    padding: 12px 24px;\r\n  }\r\n\r\n  .price-divider {\r\n    width: 1px;\r\n    height: 40px;\r\n    background: rgba(255,255,255,0.15);\r\n    flex-shrink: 0;\r\n  }\r\n\r\n  .price-label {\r\n    font-family: 'Roboto Mono', monospace;\r\n    font-size: 10px;\r\n    font-weight: 600;\r\n    letter-spacing: 1.2px;\r\n    text-transform: uppercase;\r\n    color: rgba(255,255,255,0.45);\r\n  }\r\n\r\n  .price-val {\r\n    font-family: 'Roboto', sans-serif;\r\n    font-size: 20px;\r\n    font-weight: 900;\r\n    color: white;\r\n    letter-spacing: -0.5px;\r\n    line-height: 1;\r\n  }\r\n\r\n  .price-per {\r\n    font-size: 12px;\r\n    font-weight: 400;\r\n    color: rgba(255,255,255,0.5);\r\n    letter-spacing: 0;\r\n  }\r\n\r\n  .price-saving {\r\n    font-family: 'Roboto Mono', monospace;\r\n    font-size: 10px;\r\n    font-weight: 700;\r\n    color: var(--p4);\r\n    letter-spacing: 0.3px;\r\n    margin-top: 2px;\r\n  }\r\n\r\n  \/* Hero mockup *\/\r\n  .hero-mockup-wrap {\r\n    position: relative;\r\n    z-index: 2;\r\n    max-width: 1060px;\r\n    width: 100%;\r\n    margin: 60px auto 0;\r\n    padding: 0 5vw;\r\n  }\r\n\r\n  .mockup-shell {\r\n    background: rgba(1,42,94,0.7);\r\n    border: 1px solid rgba(0,249,255,0.2);\r\n    border-radius: 20px 20px 0 0;\r\n    overflow: hidden;\r\n    backdrop-filter: blur(8px);\r\n    box-shadow:\r\n      0 -8px 60px rgba(0,154,221,0.2),\r\n      0 0 0 1px rgba(255,255,255,0.05),\r\n      inset 0 1px 0 rgba(0,249,255,0.1);\r\n  }\r\n\r\n  .mockup-bar {\r\n    background: rgba(1,42,94,0.8);\r\n    border-bottom: 1px solid rgba(0,249,255,0.1);\r\n    padding: 14px 20px;\r\n    display: flex;\r\n    align-items: center;\r\n    gap: 8px;\r\n  }\r\n\r\n  .dot { width: 12px; height: 12px; border-radius: 50%; }\r\n  .dot-r { background: #FF5F57; }\r\n  .dot-y { background: #FFBD2E; }\r\n  .dot-g { background: #27C93F; }\r\n\r\n  .mock-title {\r\n    font-family: 'Roboto Mono', monospace;\r\n    font-size: 11px;\r\n    color: rgba(255,255,255,0.35);\r\n    margin-left: 10px;\r\n    letter-spacing: 0.5px;\r\n  }\r\n\r\n  .mockup-body {\r\n    padding: 20px;\r\n    display: grid;\r\n    grid-template-columns: 240px 1fr;\r\n    gap: 14px;\r\n    min-height: 400px;\r\n  }\r\n\r\n  .mock-sidebar {\r\n    background: rgba(255,255,255,0.03);\r\n    border: 1px solid rgba(0,249,255,0.08);\r\n    border-radius: var(--r-sm);\r\n    padding: 14px;\r\n  }\r\n\r\n  .mock-slabel {\r\n    font-family: 'Roboto Mono', monospace;\r\n    font-size: 9px;\r\n    letter-spacing: 1.5px;\r\n    text-transform: uppercase;\r\n    color: rgba(255,255,255,0.25);\r\n    margin-bottom: 12px;\r\n  }\r\n\r\n  .track-row {\r\n    display: flex;\r\n    align-items: center;\r\n    gap: 10px;\r\n    padding: 8px;\r\n    border-radius: 6px;\r\n    margin-bottom: 3px;\r\n  }\r\n\r\n  .track-row.active {\r\n    background: rgba(0,154,221,0.18);\r\n    border-left: 3px solid var(--p4);\r\n    padding-left: 5px;\r\n  }\r\n\r\n  .t-thumb { width: 32px; height: 32px; border-radius: 5px; flex-shrink: 0; }\r\n  .t-thumb-1 { background: #0a1a33; }\r\n  .t-thumb-2 { background: #0a1a33; }\r\n  .t-thumb-3 { background: #0a1a33; }\r\n  .t-thumb-4 { background: #0a1a33; }\r\n  .t-thumb-5 { background: #0a1a33; }\r\n\r\n  .t-info { flex: 1; overflow: hidden; }\r\n  .t-name { font-size: 11px; font-weight: 500; color: rgba(255,255,255,0.82); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }\r\n  .t-artist { font-size: 10px; color: rgba(255,255,255,0.35); }\r\n  .t-dur { font-family: 'Roboto Mono', monospace; font-size: 10px; color: rgba(255,255,255,0.3); }\r\n\r\n  .mock-main { display: flex; flex-direction: column; gap: 12px; }\r\n\r\n  .now-playing {\r\n    background: #0a1a33;\r\n    border: 1px solid rgba(0,249,255,0.2);\r\n    border-radius: var(--r-sm);\r\n    padding: 16px 20px;\r\n    display: flex;\r\n    align-items: center;\r\n    gap: 16px;\r\n  }\r\n\r\n  .np-thumb {\r\n    width: 52px; height: 52px;\r\n    border-radius: 8px;\r\n    background: var(--grad-brand);\r\n    flex-shrink: 0;\r\n    display: flex; align-items: center; justify-content: center;\r\n  }\r\n\r\n  .eq { display: flex; gap: 2px; align-items: flex-end; }\r\n  .eq-b {\r\n    width: 3px; border-radius: 2px;\r\n    background: var(--p4);\r\n    animation: eqAnim 0.7s ease-in-out infinite alternate;\r\n  }\r\n  .eq-b:nth-child(1) { height: 8px; animation-delay: 0s; }\r\n  .eq-b:nth-child(2) { height: 16px; animation-delay: 0.12s; }\r\n  .eq-b:nth-child(3) { height: 10px; animation-delay: 0.25s; }\r\n  .eq-b:nth-child(4) { height: 18px; animation-delay: 0.08s; }\r\n\r\n  @keyframes eqAnim { from { transform: scaleY(0.3); } to { transform: scaleY(1); } }\r\n\r\n  .np-info { flex: 1; }\r\n  .np-status {\r\n    font-family: 'Roboto Mono', monospace;\r\n    font-size: 9px; font-weight: 600;\r\n    letter-spacing: 1px; text-transform: uppercase;\r\n    color: var(--p4); margin-bottom: 4px;\r\n  }\r\n  .np-title { font-size: 15px; font-weight: 700; color: white; }\r\n  .np-artist { font-size: 12px; color: rgba(255,255,255,0.45); }\r\n\r\n  .prog-wrap { margin-top: 10px; }\r\n  .prog-bar { height: 3px; background: rgba(255,255,255,0.1); border-radius: 2px; }\r\n  .prog-fill { height: 100%; width: 42%; background: #0a1a33; border-radius: 2px; }\r\n  .prog-times { display: flex; justify-content: space-between; font-family: 'Roboto Mono', monospace; font-size: 9px; color: rgba(255,255,255,0.28); margin-top: 4px; }\r\n\r\n  .mock-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; flex: 1; }\r\n\r\n  .mock-card {\r\n    background: rgba(255,255,255,0.03);\r\n    border: 1px solid rgba(0,249,255,0.08);\r\n    border-radius: var(--r-sm);\r\n    padding: 14px;\r\n  }\r\n\r\n  .mc-label {\r\n    font-family: 'Roboto Mono', monospace;\r\n    font-size: 9px; font-weight: 600;\r\n    letter-spacing: 1.2px; text-transform: uppercase;\r\n    color: rgba(255,255,255,0.28); margin-bottom: 8px;\r\n  }\r\n\r\n  .mc-val {\r\n    font-family: 'Roboto', sans-serif;\r\n    font-size: 26px; font-weight: 700; color: white; line-height: 1;\r\n  }\r\n\r\n  .mc-sub { font-size: 10px; color: rgba(255,255,255,0.32); margin-top: 4px; }\r\n\r\n  .online-badge {\r\n    display: inline-flex; align-items: center; gap: 6px;\r\n    background: rgba(39,201,63,0.12);\r\n    border: 1px solid rgba(39,201,63,0.28);\r\n    color: #27C93F;\r\n    font-size: 11px; font-weight: 700; font-family: 'Roboto Mono', monospace;\r\n    padding: 5px 12px; border-radius: 100px;\r\n  }\r\n\r\n  .green-dot {\r\n    width: 6px; height: 6px; border-radius: 50%;\r\n    background: #27C93F; box-shadow: 0 0 6px #27C93F;\r\n  }\r\n\r\n  \/* \u2550\u2550 SE\u00c7\u00d5ES COMPARTILHADAS \u2550\u2550 *\/\r\n  section { padding: 100px 5vw; }\r\n  .sec-inner { max-width: 1100px; margin: 0 auto; }\r\n\r\n  .sec-eyebrow {\r\n    font-family: 'Roboto Mono', monospace;\r\n    font-size: 11px; font-weight: 600;\r\n    letter-spacing: 2px; text-transform: uppercase;\r\n    color: var(--p3); margin-bottom: 16px;\r\n    display: flex; align-items: center; gap: 10px;\r\n  }\r\n\r\n  .sec-eyebrow::before {\r\n    content: '';\r\n    display: block; width: 20px; height: 2px;\r\n    background: var(--p3); border-radius: 2px;\r\n  }\r\n\r\n  .sec-h2 {\r\n    font-family: 'Roboto', sans-serif;\r\n    font-weight: 700;\r\n    font-size: clamp(30px, 4vw, 52px);\r\n    line-height: 1.1;\r\n    letter-spacing: -1px;\r\n    color: var(--text-dark);\r\n    max-width: 680px;\r\n  }\r\n\r\n  .sec-h2 .accent { color: var(--p2); }\r\n\r\n  .sec-lead {\r\n    font-size: 18px; font-weight: 300;\r\n    color: var(--text-body);\r\n    line-height: 1.7;\r\n    max-width: 540px;\r\n    margin-top: 18px;\r\n  }\r\n\r\n  \/* \u2550\u2550 SE\u00c7\u00c3O DOR \u2550\u2550 *\/\r\n  .pain-section {\r\n    background: #0a1a33;\r\n    position: relative; overflow: hidden;\r\n  }\r\n\r\n  .pain-section .sec-eyebrow { color: var(--p4); }\r\n  .pain-section .sec-eyebrow::before { background: var(--p4); }\r\n\r\n  .pain-h2 {\r\n    font-family: 'Roboto', sans-serif;\r\n    font-weight: 700;\r\n    font-size: clamp(30px, 4vw, 52px);\r\n    line-height: 1.1; letter-spacing: -1px;\r\n    color: white; max-width: 640px; margin-bottom: 56px;\r\n  }\r\n\r\n  .pain-grid {\r\n    display: grid;\r\n    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));\r\n    gap: 2px;\r\n    background: rgba(0,249,255,0.06);\r\n    border-radius: var(--r-md);\r\n    overflow: hidden;\r\n    border: 1px solid rgba(0,249,255,0.1);\r\n  }\r\n\r\n  .pain-card {\r\n    background: rgba(1,42,94,0.7);\r\n    backdrop-filter: blur(8px);\r\n    padding: 36px 30px;\r\n    transition: background 0.2s;\r\n  }\r\n\r\n  .pain-card:hover { background: rgba(15,96,182,0.25); }\r\n\r\n  .pain-icon { font-size: 26px; margin-bottom: 16px; display: block; }\r\n\r\n  .pain-card h3 {\r\n    font-family: 'Roboto', sans-serif;\r\n    font-size: 18px; font-weight: 700;\r\n    color: white; margin-bottom: 10px; line-height: 1.3;\r\n  }\r\n\r\n  .pain-card p {\r\n    font-size: 14px; font-weight: 400;\r\n    color: rgba(255,255,255,0.55); line-height: 1.7;\r\n  }\r\n\r\n  \/* \u2550\u2550 BLOCOS DE BENEF\u00cdCIO \u2550\u2550 *\/\r\n  .benefit-block { padding: 100px 5vw; }\r\n  .benefit-block.alt { background: var(--surface-light); }\r\n\r\n  .benefit-inner {\r\n    max-width: 1100px; margin: 0 auto;\r\n    display: grid; grid-template-columns: 1fr 1fr;\r\n    gap: 80px; align-items: center;\r\n  }\r\n\r\n  .benefit-inner.rev { direction: rtl; }\r\n  .benefit-inner.rev > * { direction: ltr; }\r\n\r\n  .benefit-num {\r\n    font-family: 'Roboto', sans-serif;\r\n    font-size: 80px; font-weight: 900;\r\n    color: rgba(33,80,145,0.07);\r\n    line-height: 1; letter-spacing: -4px;\r\n    margin-bottom: -12px;\r\n  }\r\n\r\n  .benefit-text h2 {\r\n    font-family: 'Roboto', sans-serif;\r\n    font-weight: 700;\r\n    font-size: clamp(26px, 3vw, 42px);\r\n    line-height: 1.15; letter-spacing: -0.8px;\r\n    color: var(--text-dark); margin-bottom: 18px;\r\n  }\r\n\r\n  .benefit-text h2 .accent { color: var(--p2); }\r\n\r\n  .benefit-text p {\r\n    font-size: 17px; font-weight: 300;\r\n    color: var(--text-body); line-height: 1.75; margin-bottom: 28px;\r\n  }\r\n\r\n  .tags { display: flex; flex-wrap: wrap; gap: 8px; }\r\n\r\n  .tag {\r\n    font-family: 'Roboto Mono', monospace;\r\n    font-size: 11px; font-weight: 500;\r\n    color: var(--p2);\r\n    background: rgba(15,96,182,0.08);\r\n    border: 1px solid rgba(15,96,182,0.2);\r\n    padding: 5px 13px; border-radius: 100px;\r\n    letter-spacing: 0.3px;\r\n  }\r\n\r\n  \/* \u2550 Visuais dos benef\u00edcios \u2550 *\/\r\n  .bv-shell {\r\n    background: #0a1a33;\r\n    border-radius: var(--r-lg);\r\n    padding: 30px;\r\n    position: relative; overflow: hidden;\r\n    border: 1px solid rgba(0,249,255,0.12);\r\n    aspect-ratio: 1 \/ 1;\r\n    display: flex;\r\n    flex-direction: column;\r\n    justify-content: space-between;\r\n  }\r\n\r\n  .bv-shell::after {\r\n    content: '';\r\n    position: absolute; top: -100px; right: -100px;\r\n    width: 300px; height: 300px;\r\n    background: radial-gradient(ellipse, rgba(0,249,255,0.07) 0%, transparent 65%);\r\n    pointer-events: none;\r\n  }\r\n\r\n  .bv-label {\r\n    font-family: 'Roboto Mono', monospace;\r\n    font-size: 9px; font-weight: 600;\r\n    letter-spacing: 1.5px; text-transform: uppercase;\r\n    color: rgba(255,255,255,0.3); margin-bottom: 20px;\r\n  }\r\n\r\n  \/* Benef\u00edcio 1 \u2014 Timeline de recupera\u00e7\u00e3o *\/\r\n  .recovery-list { display: flex; flex-direction: column; gap: 0; position: relative; z-index: 1; flex: 1; justify-content: space-evenly; }\r\n\r\n  .rec-item {\r\n    display: flex; gap: 14px; align-items: flex-start;\r\n    padding: 16px 0;\r\n    border-bottom: 1px solid rgba(255,255,255,0.06);\r\n  }\r\n\r\n  .rec-item:last-child { border-bottom: none; }\r\n\r\n  .rec-dot-col {\r\n    display: flex; flex-direction: column; align-items: center;\r\n    padding-top: 3px;\r\n  }\r\n\r\n  .rec-dot { width: 10px; height: 10px; border-radius: 50%; flex-shrink: 0; }\r\n  .rec-line { width: 1px; flex: 1; min-height: 16px; background: rgba(255,255,255,0.08); margin-top: 4px; }\r\n\r\n  .rec-text { flex: 1; }\r\n  .rec-name { font-size: 13px; font-weight: 700; color: rgba(255,255,255,0.9); margin-bottom: 4px; }\r\n  .rec-desc { font-size: 11px; color: rgba(255,255,255,0.38); line-height: 1.5; }\r\n  .rec-time { font-family: 'Roboto Mono', monospace; font-size: 10px; color: rgba(255,255,255,0.25); flex-shrink: 0; }\r\n\r\n  \/* Benef\u00edcio 2 \u2014 Automa\u00e7\u00e3o 24\/7 *\/\r\n  .stat-big {\r\n    font-family: 'Roboto', sans-serif;\r\n    font-size: 96px; font-weight: 900;\r\n    color: white; line-height: 1; letter-spacing: -4px;\r\n    position: relative; z-index: 1;\r\n  }\r\n\r\n  .stat-big span { color: var(--p4); font-size: 48px; }\r\n\r\n  .auto-rows { display: flex; flex-direction: column; gap: 10px; margin-top: 24px; position: relative; z-index: 1; flex: 1; justify-content: flex-end; }\r\n\r\n  .auto-row {\r\n    display: flex; justify-content: space-between; align-items: center;\r\n    padding: 13px 16px;\r\n    background: rgba(255,255,255,0.04);\r\n    border: 1px solid rgba(255,255,255,0.07);\r\n    border-radius: 8px;\r\n  }\r\n\r\n  .auto-row.green { background: rgba(39,201,63,0.07); border-color: rgba(39,201,63,0.16); }\r\n\r\n  .ar-label { font-size: 13px; color: rgba(255,255,255,0.7); }\r\n  .ar-val { font-family: 'Roboto', sans-serif; font-size: 20px; font-weight: 700; color: white; }\r\n  .ar-val.ok { color: #27C93F; font-size: 13px; font-weight: 700; }\r\n\r\n  \/* Benef\u00edcio 3 \u2014 R\u00e1dio Visual *\/\r\n  .vr-shell {\r\n    background: #06071a;\r\n    border-radius: var(--r-lg);\r\n    overflow: hidden;\r\n    min-height: 340px;\r\n    position: relative;\r\n    border: 1px solid rgba(0,249,255,0.15);\r\n  }\r\n\r\n  .vr-bar {\r\n    background: rgba(0,0,0,0.5);\r\n    border-bottom: 1px solid rgba(255,255,255,0.06);\r\n    padding: 12px 16px;\r\n    display: flex; align-items: center; gap: 8px;\r\n  }\r\n\r\n  .rec-blink { width: 8px; height: 8px; border-radius: 50%; background: #FF3B30; box-shadow: 0 0 8px #FF3B30; animation: blink 1.1s ease-in-out infinite; }\r\n  @keyframes blink { 0%,100%{opacity:1} 50%{opacity:0.35} }\r\n\r\n  .vr-bar-title { font-family: 'Roboto Mono', monospace; font-size: 10px; color: rgba(255,255,255,0.4); }\r\n  .vr-auto { font-family: 'Roboto Mono', monospace; font-size: 9px; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; background: rgba(0,249,255,0.12); border: 1px solid rgba(0,249,255,0.25); color: var(--p4); padding: 2px 8px; border-radius: 4px; margin-left: auto; }\r\n\r\n  .vr-body {\r\n    display: flex; flex-direction: column;\r\n    align-items: center; justify-content: center;\r\n    gap: 14px; padding: 28px; flex: 1;\r\n    min-height: 240px;\r\n  }\r\n\r\n  .vr-art {\r\n    width: 90px; height: 90px; border-radius: 12px;\r\n    background: var(--grad-brand);\r\n    box-shadow: 0 8px 32px rgba(0,154,221,0.35);\r\n  }\r\n\r\n  .vr-song-name { font-size: 16px; font-weight: 700; color: white; text-align: center; }\r\n  .vr-artist-name { font-size: 12px; color: rgba(255,255,255,0.45); text-align: center; }\r\n\r\n  .vr-sync-badge {\r\n    display: inline-flex; align-items: center; gap: 6px;\r\n    background: rgba(15,96,182,0.25); border: 1px solid rgba(0,154,221,0.4);\r\n    border-radius: 100px; padding: 5px 14px;\r\n    font-family: 'Roboto Mono', monospace;\r\n    font-size: 10px; font-weight: 600; color: var(--p3);\r\n  }\r\n\r\n  .vr-\r\n\r\n  .vr-tool { font-family: 'Roboto Mono', monospace; font-size: 10px; color: rgba(255,255,255,0.3); }\r\n\r\n  \/* Benef\u00edcio 4 \u2014 \u00c1udio *\/\r\n  .audio-shell {\r\n    background: #0a1a33;\r\n    border-radius: var(--r-lg);\r\n    padding: 28px;\r\n    aspect-ratio: 1 \/ 1;\r\n    border: 1px solid rgba(0,249,255,0.12);\r\n    display: flex; flex-direction: column; gap: 16px;\r\n    position: relative; overflow: hidden;\r\n  }\r\n\r\n  .waveform-box {\r\n    background: rgba(255,255,255,0.03);\r\n    border-radius: var(--r-sm);\r\n    border: 1px solid rgba(0,249,255,0.08);\r\n    padding: 14px;\r\n  }\r\n\r\n  .wf-label { font-family: 'Roboto Mono', monospace; font-size: 9px; letter-spacing: 1.5px; text-transform: uppercase; color: rgba(255,255,255,0.28); margin-bottom: 10px; }\r\n\r\n  .waveform { display: flex; align-items: center; gap: 2px; height: 44px; }\r\n  .wf-b { flex: 1; border-radius: 2px; background: rgba(15,96,182,0.3); min-width: 3px; }\r\n  .wf-b.played { background: var(--p3); opacity: 0.7; }\r\n  .wf-b.active { background: var(--p4); }\r\n\r\n  .mix-row {\r\n    display: flex; align-items: center; gap: 10px;\r\n    background: rgba(0,249,255,0.07);\r\n    border: 1px solid rgba(0,249,255,0.18);\r\n    border-radius: 8px; padding: 10px 14px;\r\n  }\r\n\r\n  .mix-key { font-size: 11px; color: rgba(255,255,255,0.55); font-weight: 500; flex: 1; }\r\n  .mix-val { font-family: 'Roboto Mono', monospace; font-size: 13px; font-weight: 700; color: var(--p4); }\r\n  .mix-auto-tag { font-family: 'Roboto Mono', monospace; font-size: 9px; color: rgba(255,255,255,0.28); }\r\n\r\n  .markers { display: flex; gap: 6px; }\r\n  .mrkr { flex: 1; padding: 8px 6px; background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.06); border-radius: 6px; text-align: center; }\r\n  .mrkr-n { font-family: 'Roboto Mono', monospace; font-size: 9px; text-transform: uppercase; letter-spacing: 0.8px; color: rgba(255,255,255,0.28); }\r\n  .mrkr-v { font-family: 'Roboto Mono', monospace; font-size: 11px; color: rgba(255,255,255,0.65); font-weight: 600; }\r\n\r\n  \/* Benef\u00edcio 5 \u2014 Rede *\/\r\n  .net-shell {\r\n    background: #0a1a33;\r\n    border-radius: var(--r-lg);\r\n    padding: 28px;\r\n    aspect-ratio: 1 \/ 1;\r\n    border: 1px solid rgba(0,249,255,0.12);\r\n    position: relative; overflow: hidden;\r\n  }\r\n\r\n  .net-list { display: flex; flex-direction: column; gap: 6px; margin-top: 14px; }\r\n\r\n  .net-row {\r\n    display: flex; align-items: center; gap: 12px;\r\n    padding: 11px 14px;\r\n    background: rgba(255,255,255,0.03);\r\n    border: 1px solid rgba(255,255,255,0.06);\r\n    border-radius: 8px;\r\n  }\r\n\r\n  .net-row.head {\r\n    background: rgba(15,96,182,0.14);\r\n    border-color: rgba(0,154,221,0.22);\r\n  }\r\n\r\n  .ns-dot { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; }\r\n  .ns-dot.on { background: #27C93F; box-shadow: 0 0 6px rgba(39,201,63,0.6); }\r\n  .ns-dot.sync { background: var(--p4); box-shadow: 0 0 6px rgba(0,249,255,0.5); }\r\n\r\n  .ns-name { font-size: 12px; font-weight: 700; color: rgba(255,255,255,0.8); flex: 1; }\r\n  .ns-track { font-size: 10px; color: rgba(255,255,255,0.32); }\r\n\r\n  .ns-badge { font-family: 'Roboto Mono', monospace; font-size: 9px; font-weight: 700; padding: 3px 8px; border-radius: 4px; }\r\n  .ns-badge.matriz { background: rgba(0,154,221,0.2); color: var(--p3); }\r\n  .ns-badge.sync-b { background: rgba(0,249,255,0.1); color: var(--p4); }\r\n\r\n  \/* \u2550\u2550 GRID DE FUNCIONALIDADES \u2550\u2550 *\/\r\n  .features-sec { background: var(--surface-light); padding: 100px 5vw; }\r\n  .features-header { max-width: 1100px; margin: 0 auto 56px; }\r\n\r\n  .feat-grid {\r\n    max-width: 1100px; margin: 0 auto;\r\n    display: grid; grid-template-columns: repeat(auto-fit, minmax(290px, 1fr));\r\n    gap: 2px;\r\n    background: var(--border-light);\r\n    border-radius: var(--r-md); overflow: hidden;\r\n    border: 1px solid var(--border-light);\r\n  }\r\n\r\n  .feat-card {\r\n    background: white;\r\n    padding: 34px 30px;\r\n    transition: background 0.2s;\r\n    border-bottom: 3px solid transparent;\r\n  }\r\n\r\n  .feat-card:hover {\r\n    background: #f0f6ff;\r\n    border-bottom-color: var(--p3);\r\n  }\r\n\r\n  .fc-icon { font-size: 24px; margin-bottom: 14px; }\r\n\r\n  .feat-card h3 {\r\n    font-family: 'Roboto', sans-serif;\r\n    font-size: 16px; font-weight: 700;\r\n    color: var(--p1); margin-bottom: 8px;\r\n  }\r\n\r\n  .feat-card p {\r\n    font-size: 14px; font-weight: 400;\r\n    color: var(--text-body); line-height: 1.65;\r\n  }\r\n\r\n  \/* \u2550\u2550 PROVA SOCIAL \u2550\u2550 *\/\r\n  .proof-sec {\r\n    background: var(--grad-brand);\r\n    padding: 100px 5vw;\r\n    text-align: center;\r\n    position: relative; overflow: hidden;\r\n  }\r\n\r\n  .proof-inner { max-width: 900px; margin: 0 auto; position: relative; z-index: 1; }\r\n\r\n  .proof-eyebrow {\r\n    font-family: 'Roboto Mono', monospace;\r\n    font-size: 11px; font-weight: 600;\r\n    letter-spacing: 2px; text-transform: uppercase;\r\n    color: rgba(255,255,255,0.55); margin-bottom: 24px;\r\n  }\r\n\r\n  .proof-quote {\r\n    font-family: 'Roboto', sans-serif;\r\n    font-size: clamp(20px, 3vw, 32px);\r\n    font-weight: 300;\r\n    color: white; line-height: 1.45;\r\n    margin-bottom: 16px;\r\n    letter-spacing: -0.3px;\r\n  }\r\n\r\n  .proof-quote strong { font-weight: 700; }\r\n\r\n  .proof-src {\r\n    font-family: 'Roboto Mono', monospace;\r\n    font-size: 12px; color: rgba(255,255,255,0.45);\r\n    margin-bottom: 60px;\r\n  }\r\n\r\n  .proof-stats { display: flex; justify-content: center; gap: 64px; flex-wrap: wrap; }\r\n\r\n  .pstat { text-align: center; }\r\n  .pstat-num {\r\n    font-family: 'Roboto', sans-serif;\r\n    font-size: 56px; font-weight: 900;\r\n    color: white; line-height: 1; letter-spacing: -2px;\r\n  }\r\n  .pstat-num sup { color: var(--p4); font-size: 28px; vertical-align: super; }\r\n  .pstat-label { font-size: 13px; color: rgba(255,255,255,0.5); margin-top: 6px; font-weight: 400; }\r\n\r\n  \/* \u2550\u2550 ECOSSISTEMA \u2550\u2550 *\/\r\n  .eco-sec { padding: 100px 5vw; }\r\n  .eco-inner { max-width: 1100px; margin: 0 auto; }\r\n\r\n  .eco-grid {\r\n    display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));\r\n    gap: 12px; margin-top: 48px;\r\n  }\r\n\r\n  .eco-card {\r\n    background: var(--surface-light);\r\n    border: 1px solid var(--border-light);\r\n    border-radius: var(--r-md);\r\n    padding: 24px 20px; text-align: center;\r\n    transition: all 0.2s;\r\n    cursor: default;\r\n  }\r\n\r\n  .eco-card:hover {\r\n    border-color: var(--p3);\r\n    transform: translateY(-4px);\r\n    box-shadow: 0 8px 24px rgba(0,154,221,0.12);\r\n  }\r\n\r\n  .eco-card.current {\r\n    background: var(--grad-brand);\r\n    border-color: transparent;\r\n    position: relative;\r\n  }\r\n\r\n  .eco-card.current::before {\r\n    content: 'Este produto';\r\n    position: absolute; top: -10px; left: 50%;\r\n    transform: translateX(-50%);\r\n    font-family: 'Roboto Mono', monospace;\r\n    font-size: 9px; font-weight: 700; letter-spacing: 0.5px; text-transform: uppercase;\r\n    background: var(--p4);\r\n    color: var(--s1);\r\n    padding: 2px 10px; border-radius: 100px; white-space: nowrap;\r\n  }\r\n\r\n  .eco-icon { font-size: 26px; margin-bottom: 10px; }\r\n\r\n  .eco-card h4 {\r\n    font-family: 'Roboto', sans-serif;\r\n    font-size: 13px; font-weight: 700;\r\n    color: var(--p1); margin-bottom: 4px;\r\n  }\r\n\r\n  .eco-card.current h4 { color: white; }\r\n\r\n  .eco-card p { font-size: 11px; color: var(--text-muted); }\r\n  .eco-card.current p { color: rgba(255,255,255,0.6); }\r\n\r\n  \/* \u2550\u2550 CTA FINAL \u2550\u2550 *\/\r\n  .cta-sec {\r\n    background: var(--grad-hero);\r\n    padding: 120px 5vw;\r\n    text-align: center;\r\n    position: relative; overflow: hidden;\r\n  }\r\n\r\n  .cta-inner { max-width: 720px; margin: 0 auto; position: relative; z-index: 2; }\r\n\r\n  .cta-eyebrow {\r\n    font-family: 'Roboto Mono', monospace;\r\n    font-size: 11px; font-weight: 600;\r\n    letter-spacing: 2px; text-transform: uppercase;\r\n    color: var(--p4); margin-bottom: 24px;\r\n    display: inline-flex; align-items: center; gap: 10px;\r\n  }\r\n\r\n  .cta-eyebrow::before,.cta-eyebrow::after {\r\n    content: ''; display: block; width: 24px; height: 1.5px;\r\n    background: var(--p4); opacity: 0.6; border-radius: 2px;\r\n  }\r\n\r\n  .cta-h2 {\r\n    font-family: 'Roboto', sans-serif;\r\n    font-weight: 900;\r\n    font-size: clamp(34px, 5vw, 62px);\r\n    color: white; line-height: 1.08;\r\n    letter-spacing: -1.5px; margin-bottom: 20px;\r\n  }\r\n\r\n  .cta-sub {\r\n    font-size: 18px; font-weight: 300;\r\n    color: rgba(255,255,255,0.6); line-height: 1.65;\r\n    margin-bottom: 48px;\r\n  }\r\n\r\n  .cta-btns { display: flex; justify-content: center; gap: 16px; flex-wrap: wrap; margin-bottom: 28px; }\r\n\r\n  .btn-cta-main {\r\n    background: white;\r\n    color: var(--s1);\r\n    font-family: 'Roboto', sans-serif;\r\n    font-weight: 700; font-size: 16px;\r\n    border: none; padding: 17px 44px;\r\n    border-radius: 100px; cursor: pointer;\r\n    text-decoration: none; transition: all 0.25s;\r\n    box-shadow: 0 4px 20px rgba(0,0,0,0.22);\r\n  }\r\n\r\n  .btn-cta-main:hover {\r\n    background: var(--p4);\r\n    color: var(--s1);\r\n    transform: translateY(-2px);\r\n    box-shadow: 0 12px 32px rgba(0,249,255,0.38);\r\n  }\r\n\r\n  .btn-cta-sec {\r\n    background: rgba(255,255,255,0.08);\r\n    color: white;\r\n    font-family: 'Roboto', sans-serif;\r\n    font-weight: 500; font-size: 16px;\r\n    border: 1.5px solid rgba(255,255,255,0.4);\r\n    padding: 16px 36px; border-radius: 100px;\r\n    cursor: pointer; text-decoration: none; transition: all 0.25s;\r\n  }\r\n\r\n  .btn-cta-sec:hover {\r\n    background: rgba(255,255,255,0.16);\r\n    border-color: var(--p4); color: var(--p4);\r\n  }\r\n\r\n  .cta-note {\r\n    font-family: 'Roboto Mono', monospace;\r\n    font-size: 12px; color: rgba(255,255,255,0.3);\r\n  }\r\n\r\n  \/* \u2550\u2550 IMAGEM REAL \u2014 classe pronta para substitui\u00e7\u00e3o \u2550\u2550 *\/\r\n  .section-screenshot {\r\n    width: 100%;\r\n    display: block;\r\n    border-radius: var(--r-lg);\r\n    border: 1px solid rgba(0,154,221,0.22);\r\n    box-shadow: 0 8px 48px rgba(1,42,94,0.15);\r\n    object-fit: cover;\r\n    aspect-ratio: 1 \/ 1;\r\n  }\r\n\r\n\r\n\r\n  \/* R\u00e1dio Visual video \u2014 propor\u00e7\u00e3o 16:9 horizontal *\/\r\n  .rv-video-wrap {\r\n    padding-bottom: 100% !important;\r\n  }\r\n\r\n  \/* \u2550\u2550 TESTEMUNHOS \u2550\u2550 *\/\r\n  .testi-sec {\r\n    background: #0a1a33;\r\n    padding: 100px 5vw;\r\n    position: relative;\r\n    overflow: hidden;\r\n  }\r\n\r\n  .testi-inner {\r\n    max-width: 1100px;\r\n    margin: 0 auto;\r\n  }\r\n\r\n  .testi-header {\r\n    text-align: center;\r\n    margin-bottom: 56px;\r\n  }\r\n\r\n  .testi-header .sec-eyebrow {\r\n    justify-content: center;\r\n    color: var(--p4);\r\n  }\r\n\r\n  .testi-header .sec-eyebrow::before {\r\n    background: var(--p4);\r\n  }\r\n\r\n  .testi-h2 {\r\n    font-family: 'Roboto', sans-serif;\r\n    font-weight: 700;\r\n    font-size: clamp(28px, 3.5vw, 46px);\r\n    line-height: 1.1;\r\n    letter-spacing: -1px;\r\n    color: white;\r\n    margin-top: 8px;\r\n  }\r\n\r\n  .testi-grid {\r\n    display: grid;\r\n    grid-template-columns: repeat(3, 1fr);\r\n    gap: 20px;\r\n  }\r\n\r\n  .testi-card {\r\n    display: flex;\r\n    flex-direction: column;\r\n    gap: 16px;\r\n  }\r\n\r\n  \/* Video wrapper \u2014 propor\u00e7\u00e3o 9:16 vertical *\/\r\n  .testi-video-wrap {\r\n    position: relative;\r\n    width: 100%;\r\n    padding-bottom: 177.78%;\r\n    border-radius: var(--r-lg);\r\n    overflow: hidden;\r\n    background: #0a1628;\r\n    border: 1px solid rgba(0,249,255,0.12);\r\n    box-shadow: 0 8px 32px rgba(0,0,0,0.35);\r\n  }\r\n\r\n  .testi-video-wrap video {\r\n    position: absolute;\r\n    top: 0; left: 0;\r\n    width: 100%; height: 100%;\r\n    object-fit: cover;\r\n    border-radius: var(--r-lg);\r\n  }\r\n\r\n  \/* Play button overlay *\/\r\n  .testi-play-overlay {\r\n    position: absolute;\r\n    inset: 0;\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    background: rgba(1,42,94,0.35);\r\n    transition: background 0.2s;\r\n    cursor: pointer;\r\n    border-radius: var(--r-lg);\r\n  }\r\n\r\n  .testi-video-wrap:hover .testi-play-overlay {\r\n    background: rgba(1,42,94,0.15);\r\n  }\r\n\r\n  .testi-video-wrap.playing .testi-play-overlay {\r\n    display: none !important;\r\n  }\r\n\r\n  .play-btn {\r\n    width: 64px;\r\n    height: 64px;\r\n    border-radius: 50%;\r\n    background: rgba(0,249,255,0.15);\r\n    border: 2px solid rgba(0,249,255,0.6);\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    transition: all 0.2s;\r\n    backdrop-filter: blur(4px);\r\n  }\r\n\r\n  .testi-video-wrap:hover .play-btn {\r\n    background: rgba(0,249,255,0.25);\r\n    border-color: var(--p4);\r\n    transform: scale(1.08);\r\n    box-shadow: 0 0 24px rgba(0,249,255,0.3);\r\n  }\r\n\r\n  .play-btn svg {\r\n    width: 24px;\r\n    height: 24px;\r\n    fill: var(--p4);\r\n    margin-left: 3px;\r\n  }\r\n\r\n  \/* Card footer *\/\r\n  .testi-\r\n\r\n  .testi-station {\r\n    font-family: 'Roboto', sans-serif !important;\r\n    font-size: 17px !important;\r\n    font-weight: 700 !important;\r\n    color: #00f9ff !important;\r\n  }\r\n\r\n  .testi-city {\r\n    font-family: 'Roboto Mono', monospace;\r\n    font-size: 13px;\r\n    color: rgba(255,255,255,0.5);\r\n    letter-spacing: 0.5px;\r\n  }\r\n\r\n  @media (max-width: 768px) {\r\n    .testi-grid { grid-template-columns: 1fr; max-width: 360px; margin: 0 auto; }\r\n  }\r\n\r\n\r\n  \/* \u2550\u2550 FUNDO ESCURO \u2014 Se\u00e7\u00f5es 1, 3, 5 e Ecossistema \u2550\u2550 *\/\r\n  .dark-bg {\r\n    background: #0a1a33;\r\n  }\r\n\r\n  \/* Textos principais nas se\u00e7\u00f5es escuras *\/\r\n  .dark-bg .benefit-text h2 {\r\n    color: #ffffff;\r\n  }\r\n\r\n  .dark-bg .benefit-text h2 .accent {\r\n    color: var(--p4);\r\n  }\r\n\r\n  .dark-bg .benefit-text p {\r\n    color: rgba(255,255,255,0.65);\r\n  }\r\n\r\n  \/* N\u00famero decorativo \u2014 mais vis\u00edvel no escuro *\/\r\n  .dark-bg .benefit-num {\r\n    color: rgba(255,255,255,0.05);\r\n  }\r\n\r\n  \/* Eyebrow label *\/\r\n  .dark-bg .sec-eyebrow {\r\n    color: var(--p3);\r\n  }\r\n\r\n  .dark-bg .sec-eyebrow span {\r\n    background: var(--p3);\r\n  }\r\n\r\n  \/* Tags *\/\r\n  .dark-bg .tag {\r\n    color: var(--p4);\r\n    background: rgba(0,249,255,0.08);\r\n    border-color: rgba(0,249,255,0.2);\r\n  }\r\n\r\n  \/* Ecossistema \u2014 t\u00edtulos e subt\u00edtulos *\/\r\n  .dark-bg .sec-h2 {\r\n    color: #ffffff;\r\n  }\r\n\r\n  .dark-bg .sec-h2 .accent {\r\n    color: var(--p4);\r\n  }\r\n\r\n  .dark-bg .sec-lead {\r\n    color: rgba(255,255,255,0.6);\r\n  }\r\n\r\n  \/* Eco cards sobre fundo escuro *\/\r\n  .dark-bg .eco-card {\r\n    background: rgba(255,255,255,0.05);\r\n    border-color: rgba(255,255,255,0.1);\r\n  }\r\n\r\n  .dark-bg .eco-card:hover {\r\n    background: rgba(255,255,255,0.1);\r\n    border-color: var(--p3);\r\n    box-shadow: 0 8px 24px rgba(0,154,221,0.18);\r\n  }\r\n\r\n  .dark-bg .eco-card h4 {\r\n    color: rgba(255,255,255,0.9);\r\n  }\r\n\r\n  .dark-bg .eco-card p {\r\n    color: rgba(255,255,255,0.45);\r\n  }\r\n\r\n  .dark-bg .eco-card.current {\r\n    background: var(--grad-brand);\r\n    border-color: rgba(0,249,255,0.3);\r\n  }\r\n\r\n  .dark-bg .eco-card.current::before {\r\n    background: var(--p4);\r\n    color: #0a1a33;\r\n  }\r\n\r\n  \/* Section eyebrow in eco dark *\/\r\n  .dark-bg .sec-eyebrow {\r\n    color: var(--p3);\r\n  }\r\n\r\n\r\n  \/* \u2550\u2550 FUNDO GRADIENTE \u2014 Se\u00e7\u00e3o 5 (mesmo que O Problema Real) \u2550\u2550 *\/\r\n  .grad-bg {\r\n    background: #0a1a33;\r\n  }\r\n\r\n  \/* Inherit all same text adaptations as dark-bg *\/\r\n  .grad-bg .benefit-text h2 {\r\n    color: #ffffff;\r\n  }\r\n\r\n  .grad-bg .benefit-text h2 .accent {\r\n    color: var(--p4);\r\n  }\r\n\r\n  .grad-bg .benefit-text p {\r\n    color: rgba(255,255,255,0.7);\r\n  }\r\n\r\n  .grad-bg .benefit-num {\r\n    color: rgba(255,255,255,0.06);\r\n  }\r\n\r\n  .grad-bg .sec-eyebrow {\r\n    color: var(--p4);\r\n  }\r\n\r\n  .grad-bg .sec-eyebrow span {\r\n    background: var(--p4);\r\n  }\r\n\r\n  .grad-bg .tag {\r\n    color: var(--p4);\r\n    background: rgba(0,249,255,0.1);\r\n    border-color: rgba(0,249,255,0.25);\r\n  }\r\n\r\n  \/* \u2550\u2550 SCROLL REVEAL \u2550\u2550 *\/\r\n  [data-r] {\r\n    opacity: 0; transform: translateY(24px);\r\n    transition: opacity 0.65s cubic-bezier(0.16,1,0.3,1), transform 0.65s cubic-bezier(0.16,1,0.3,1);\r\n  }\r\n\r\n  [data-r].on { opacity: 1; transform: none; }\r\n\r\n  \/* \u2550\u2550 RESPONSIVE \u2550\u2550 *\/\r\n  @media (max-width: 768px) {\r\n    .benefit-inner { grid-template-columns: 1fr; gap: 36px; }\r\n    .benefit-inner.rev { direction: ltr; }\r\n    .mockup-body { grid-template-columns: 1fr; }\r\n    .mock-sidebar { display: none; }\r\n    .proof-stats { gap: 36px; }\r\n    .pstat-num { font-size: 42px; }\r\n  }\r\n\r\n\r\n\/* \u2550\u2550 CRITICAL: Restore section padding overridden by Hello Elementor theme \u2550\u2550 *\/\r\n.elementor-widget-html section {\r\n  padding: 100px 5vw !important;\r\n  box-sizing: border-box !important;\r\n}\r\n\r\n.elementor-widget-html .benefit-block {\r\n  padding: 100px 5vw !important;\r\n}\r\n\r\n.elementor-widget-html .benefit-block.alt {\r\n  padding: 100px 5vw !important;\r\n}\r\n\r\n\/* Force all data-r visible *\/\r\n[data-r] { opacity: 1 !important; transform: none !important; }\r\n\r\n\r\n\/* \u2550\u2550 FORCE testi-station color \u2550\u2550 *\/\r\n.elementor-widget-html .testi-station,\r\n.elementor-widget-html .testi-footer .testi-station {\r\n  color: #00f9ff !important;\r\n  font-size: 17px !important;\r\n  font-weight: 700 !important;\r\n}\r\n\r\n<\/style>\r\n\r\n<!-- \u2550\u2550\u2550 TESTEMUNHOS \u2550\u2550\u2550 -->\r\n<section class=\"testi-sec\">\r\n  <div class=\"brand-lines\" aria-hidden=\"true\">\r\n    <svg width=\"100%\" height=\"100%\" viewBox=\"0 0 1440 600\" preserveAspectRatio=\"xMidYMid slice\" fill=\"none\">\r\n      <line x1=\"0\" y1=\"400\" x2=\"600\" y2=\"50\" stroke=\"rgba(0,249,255,0.05)\" stroke-width=\"1\"\/>\r\n      <line x1=\"1440\" y1=\"150\" x2=\"800\" y2=\"550\" stroke=\"rgba(0,154,221,0.05)\" stroke-width=\"1\"\/>\r\n    <\/svg>\r\n  <\/div>\r\n  <div class=\"testi-inner\">\r\n    <div class=\"testi-header\" data-r>\r\n      <div class=\"sec-eyebrow\">Quem usa, recomenda<\/div>\r\n      <h2 class=\"testi-h2\">Emissoras reais.<br>Resultados reais.<\/h2>\r\n    <\/div>\r\n    <div class=\"testi-grid\">\r\n\r\n      <!-- \u2500\u2500 V\u00cdDEO 1 \u2500\u2500 -->\r\n      <!-- INSTRU\u00c7\u00c3O: substitua https:\/\/playlistsolutions.com\/wp-content\/uploads\/2026\/01\/RadioAlfa_18-anos-Playlist-digital2.mp4 pela URL do v\u00eddeo na biblioteca do WordPress -->\r\n      <!-- Exemplo: src=\"https:\/\/seusite.com\/wp-content\/uploads\/2025\/depoimento-1.mp4\" -->\r\n      <div class=\"testi-card\" data-r>\r\n        <div class=\"testi-video-wrap\" id=\"tv1\">\r\n          <video\r\n            src=\"https:\/\/playlistsolutions.com\/wp-content\/uploads\/2026\/01\/RadioAlfa_18-anos-Playlist-digital2.mp4\"\r\n            preload=\"metadata\"\r\n            controls\r\n            playsinline\r\n            poster=\"\">\r\n          <\/video>\r\n          <div class=\"testi-play-overlay\" onclick=\"playTesti('tv1')\">\r\n            <div class=\"play-btn\">\r\n              <svg viewBox=\"0 0 24 24\"><polygon points=\"5,3 19,12 5,21\"\/><\/svg>\r\n            <\/div>\r\n          <\/div>\r\n        <\/div>\r\n        <div class=\"testi-footer\">\r\n          <span class=\"testi-station\" style=\"color:#00f9ff !important; font-family:'Roboto',sans-serif; font-size:17px; font-weight:700; display:block; margin-bottom:4px;\">Alfa - 105.3 FM<\/span>\r\n          \r\n        <\/div>\r\n      <\/div>\r\n\r\n      <!-- \u2500\u2500 V\u00cdDEO 2 \u2500\u2500 -->\r\n      <!-- INSTRU\u00c7\u00c3O: substitua https:\/\/playlistsolutions.com\/wp-content\/uploads\/2026\/01\/RadioFolha_20anos.mp4 pela URL do v\u00eddeo na biblioteca do WordPress -->\r\n      <div class=\"testi-card\" data-r>\r\n        <div class=\"testi-video-wrap\" id=\"tv2\">\r\n          <video\r\n            src=\"https:\/\/playlistsolutions.com\/wp-content\/uploads\/2026\/01\/RadioFolha_20anos.mp4\"\r\n            preload=\"metadata\"\r\n            controls\r\n            playsinline\r\n            poster=\"\">\r\n          <\/video>\r\n          <div class=\"testi-play-overlay\" onclick=\"playTesti('tv2')\">\r\n            <div class=\"play-btn\">\r\n              <svg viewBox=\"0 0 24 24\"><polygon points=\"5,3 19,12 5,21\"\/><\/svg>\r\n            <\/div>\r\n          <\/div>\r\n        <\/div>\r\n        <div class=\"testi-footer\">\r\n          <span class=\"testi-station\" style=\"color:#00f9ff !important; font-family:'Roboto',sans-serif; font-size:17px; font-weight:700; display:block; margin-bottom:4px;\">Folha - 101.3 FM<\/span>\r\n          \r\n        <\/div>\r\n      <\/div>\r\n\r\n      <!-- \u2500\u2500 V\u00cdDEO 3 \u2500\u2500 -->\r\n      <!-- INSTRU\u00c7\u00c3O: substitua https:\/\/playlistsolutions.com\/wp-content\/uploads\/2026\/01\/Reels_Radio-Vida-Nova_legenda.mp4 pela URL do v\u00eddeo na biblioteca do WordPress -->\r\n      <div class=\"testi-card\" data-r>\r\n        <div class=\"testi-video-wrap\" id=\"tv3\">\r\n          <video\r\n            src=\"https:\/\/playlistsolutions.com\/wp-content\/uploads\/2026\/01\/Reels_Radio-Vida-Nova_legenda.mp4\"\r\n            preload=\"metadata\"\r\n            controls\r\n            playsinline\r\n            poster=\"\">\r\n          <\/video>\r\n          <div class=\"testi-play-overlay\" onclick=\"playTesti('tv3')\">\r\n            <div class=\"play-btn\">\r\n              <svg viewBox=\"0 0 24 24\"><polygon points=\"5,3 19,12 5,21\"\/><\/svg>\r\n            <\/div>\r\n          <\/div>\r\n        <\/div>\r\n        <div class=\"testi-footer\">\r\n          <span class=\"testi-station\" style=\"color:#00f9ff !important; font-family:'Roboto',sans-serif; font-size:17px; font-weight:700; display:block; margin-bottom:4px;\">Vida Nova FM - 91.5<\/span>\r\n          \r\n        <\/div>\r\n      <\/div>\r\n\r\n    <\/div>\r\n  <\/div>\r\n<\/section>\r\n\r\n<script>\r\ndocument.querySelectorAll('[data-r]').forEach(el => el.classList.add('on'));\r\n\r\nfunction playTesti(id) {\r\n  const wrap = document.getElementById(id);\r\n  if (!wrap) return;\r\n  const video = wrap.querySelector('video');\r\n  \r\n  \/\/ Pause all other videos\r\n  document.querySelectorAll('.testi-video-wrap video').forEach(v => {\r\n    if (v !== video) {\r\n      v.pause();\r\n      v.closest('.testi-video-wrap').classList.remove('playing');\r\n    }\r\n  });\r\n  \r\n  video.play();\r\n  wrap.classList.add('playing');\r\n  \r\n  \/\/ When video ends, show overlay again\r\n  video.onended = () => wrap.classList.remove('playing');\r\n}\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-d586a98 e-flex e-con-boxed e-con e-parent\" data-id=\"d586a98\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-d1edbfe elementor-widget elementor-widget-html\" data-id=\"d1edbfe\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\r\n<style>\r\nnav { all: unset; }\r\n\r\n  \/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\r\n     DESIGN TOKENS \u2014 BRANDING OFICIAL PLAYLIST\r\n     Cores Prim\u00e1rias: #215091 \u00b7 #0f60b6 \u00b7 #009add \u00b7 #00f9ff\r\n     Cores Secund\u00e1rias (\u226420%): #012a5e \u00b7 #9c6dff \u00b7 #dfe1e1\r\n     Tipografia: Roboto Bold \/ Roboto Mono \/ Roboto Regular\r\n  \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\n  :root {\r\n    --p1: #215091;\r\n    --p2: #0f60b6;\r\n    --p3: #009add;\r\n    --p4: #00f9ff;\r\n    --s1: #012a5e;\r\n    --s2: #9c6dff;\r\n    --s3: #dfe1e1;\r\n    --white: #ffffff;\r\n    --off-white: #f4f7fb;\r\n    --text-dark: #0d1f3c;\r\n    --text-body: #2c3d5e;\r\n    --text-muted: #6b7fa3;\r\n    --text-light: rgba(255,255,255,0.85);\r\n    --text-fade: rgba(255,255,255,0.5);\r\n    --grad-brand: linear-gradient(135deg, #215091 0%, #0f60b6 50%, #009add 100%);\r\n    --grad-dark: linear-gradient(135deg, #012a5e 0%, #215091 60%, #0f60b6 100%);\r\n    --grad-vivid: linear-gradient(135deg, #0f60b6 0%, #009add 60%, #00f9ff 100%);\r\n    --grad-hero: linear-gradient(160deg, #012a5e 0%, #215091 40%, #0f60b6 75%, #009add 100%);\r\n    --surface-light: #eef3fb;\r\n    --surface-mid: rgba(33,80,145,0.06);\r\n    --border-light: rgba(33,80,145,0.14);\r\n    --border-glow: rgba(0,249,255,0.3);\r\n    --r-sm: 8px;\r\n    --r-md: 16px;\r\n    --r-lg: 24px;\r\n    --r-xl: 40px;\r\n  }\r\n\r\n  * { margin: 0; padding: 0; box-sizing: border-box; }\r\n  html { scroll-behavior: smooth; }\r\n  body {\r\n    font-family: 'Roboto', sans-serif;\r\n    color: var(--text-dark);\r\n    background: var(--white);\r\n    -webkit-font-smoothing: antialiased;\r\n    overflow-x: hidden;\r\n  }\r\n\r\n  \/* \u2550\u2550 SE\u00c7\u00d5ES COMPARTILHADAS \u2550\u2550 *\/\r\n  .sec-eyebrow {\r\n    font-family: 'Roboto Mono', monospace;\r\n    font-size: 11px; font-weight: 600;\r\n    letter-spacing: 2px; text-transform: uppercase;\r\n    color: var(--p3); margin-bottom: 16px;\r\n    display: flex; align-items: center; gap: 10px;\r\n  }\r\n\r\n  .sec-eyebrow::before {\r\n    content: '';\r\n    display: block; width: 20px; height: 2px;\r\n    background: var(--p3); border-radius: 2px;\r\n  }\r\n\r\n  .sec-h2 {\r\n    font-family: 'Roboto', sans-serif;\r\n    font-weight: 700;\r\n    font-size: clamp(30px, 4vw, 52px);\r\n    line-height: 1.1;\r\n    letter-spacing: -1px;\r\n    color: #ffffff;\r\n    max-width: 680px;\r\n  }\r\n\r\n  .sec-h2 .accent { color: var(--p4); }\r\n\r\n  .sec-lead {\r\n    font-size: 18px; font-weight: 300;\r\n    color: rgba(255,255,255,0.6);\r\n    line-height: 1.7;\r\n    max-width: 600px;\r\n    margin-top: 18px;\r\n  }\r\n\r\n  \/* \u2550\u2550 ECOSSISTEMA \u2550\u2550 *\/\r\n  .eco-sec { padding: 100px 5vw; }\r\n  .eco-inner { max-width: 1100px; margin: 0 auto; }\r\n\r\n  \/* Grid de 3 colunas fixas para Station Office *\/\r\n  .eco-grid {\r\n    display: grid;\r\n    grid-template-columns: repeat(3, 1fr);\r\n    gap: 12px;\r\n    margin-top: 48px;\r\n    max-width: 720px;\r\n  }\r\n\r\n  .eco-card {\r\n    background: rgba(255,255,255,0.05);\r\n    border: 1px solid rgba(255,255,255,0.1);\r\n    border-radius: var(--r-md);\r\n    padding: 28px 20px;\r\n    text-align: center;\r\n    transition: all 0.2s;\r\n    cursor: default;\r\n    position: relative;\r\n  }\r\n\r\n  .eco-card:hover {\r\n    background: rgba(255,255,255,0.1);\r\n    border-color: var(--p3);\r\n    transform: translateY(-4px);\r\n    box-shadow: 0 8px 24px rgba(0,154,221,0.18);\r\n  }\r\n\r\n  \/* Card do produto atual \u2014 destaque com gradiente de marca *\/\r\n  .eco-card.current {\r\n    background: var(--grad-brand);\r\n    border-color: rgba(0,249,255,0.3);\r\n  }\r\n\r\n  .eco-card.current::before {\r\n    content: 'Este produto';\r\n    position: absolute; top: -10px; left: 50%;\r\n    transform: translateX(-50%);\r\n    font-family: 'Roboto Mono', monospace;\r\n    font-size: 9px; font-weight: 700;\r\n    letter-spacing: 0.5px; text-transform: uppercase;\r\n    background: var(--p4);\r\n    color: var(--s1);\r\n    padding: 2px 10px; border-radius: 100px; white-space: nowrap;\r\n  }\r\n\r\n  .eco-icon {\r\n    margin-bottom: 14px;\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    min-height: 110px;\r\n  }\r\n\r\n  .eco-icon img {\r\n    width: auto;\r\n    max-width: 160px;\r\n    min-width: 80px;\r\n    height: 110px;\r\n    object-fit: contain;\r\n    display: block;\r\n    margin: 0 auto;\r\n  }\r\n\r\n  .eco-sub {\r\n    font-family: 'Roboto Mono', monospace;\r\n    font-size: 11px;\r\n    color: rgba(255,255,255,0.55);\r\n    text-align: center;\r\n    margin-top: 10px;\r\n    letter-spacing: 0.3px;\r\n    line-height: 1.5;\r\n  }\r\n\r\n  .eco-card.current .eco-sub {\r\n    color: rgba(255,255,255,0.75);\r\n  }\r\n\r\n  \/* \u2550\u2550 FORCE COLORS \u2014 override Hello Elementor theme \u2550\u2550 *\/\r\n  .elementor-widget-html .eco-sec { padding: 100px 5vw !important; }\r\n\r\n  .elementor-widget-html .eco-sec .sec-h2 {\r\n    color: #ffffff !important;\r\n    font-size: clamp(30px, 4vw, 52px) !important;\r\n    font-weight: 700 !important;\r\n  }\r\n\r\n  .elementor-widget-html .eco-sec .sec-h2 .accent {\r\n    color: #00f9ff !important;\r\n  }\r\n\r\n  .elementor-widget-html .eco-sec .sec-eyebrow {\r\n    color: #009add !important;\r\n  }\r\n\r\n  .elementor-widget-html .eco-sec .sec-lead {\r\n    color: rgba(255,255,255,0.6) !important;\r\n    font-size: 18px !important;\r\n  }\r\n\r\n  .elementor-widget-html .eco-card {\r\n    background: rgba(255,255,255,0.05) !important;\r\n    border-color: rgba(255,255,255,0.1) !important;\r\n  }\r\n\r\n  .elementor-widget-html .eco-card.current {\r\n    background: var(--grad-brand) !important;\r\n    border-color: rgba(0,249,255,0.3) !important;\r\n  }\r\n\r\n  .elementor-widget-html .eco-icon img {\r\n    width: auto !important;\r\n    max-width: 160px !important;\r\n    min-width: 80px !important;\r\n    height: 110px !important;\r\n    object-fit: contain !important;\r\n    display: block !important;\r\n    margin: 0 auto !important;\r\n  }\r\n\r\n  .elementor-widget-html .eco-sub {\r\n    font-family: 'Roboto Mono', monospace !important;\r\n    font-size: 11px !important;\r\n    color: rgba(255,255,255,0.55) !important;\r\n    letter-spacing: 0.3px !important;\r\n  }\r\n\r\n  .elementor-widget-html .eco-card.current .eco-sub {\r\n    color: rgba(255,255,255,0.75) !important;\r\n  }\r\n\r\n  \/* \u2550\u2550 SCROLL REVEAL \u2550\u2550 *\/\r\n  [data-r] { opacity: 1 !important; transform: none !important; }\r\n\r\n  \/* \u2550\u2550 RESPONSIVE \u2550\u2550 *\/\r\n  @media (max-width: 600px) {\r\n    .eco-grid { grid-template-columns: 1fr; max-width: 280px; }\r\n  }\r\n\r\n\/* \u2550\u2550 CRITICAL: Restore section padding \u2550\u2550 *\/\r\n.elementor-widget-html section {\r\n  padding: 100px 5vw !important;\r\n  box-sizing: border-box !important;\r\n}\r\n\r\n\/* Force all data-r visible *\/\r\n[data-r] { opacity: 1 !important; transform: none !important; }\r\n\r\n\/* \u2550\u2550 MASTER BACKGROUND OVERRIDE \u2550\u2550 *\/\r\n.hero                    { background: #0a1a33 !important; }\r\n.pain-section            { background: #0a1a33 !important; }\r\n.benefit-block.dark-bg   { background: #0a1a33 !important; }\r\n.benefit-block.alt       { background: #0a1a33 !important; }\r\n.benefit-block.alt-light  { background: #eef3fb !important; }\r\n.benefit-block.grad-bg   { background: #0a1a33 !important; }\r\n.features-sec            { background: var(--grad-dark) !important; }\r\n.proof-sec               { background: var(--grad-dark) !important; }\r\n.testi-sec               { background: #0a1a33 !important; }\r\n.eco-sec                 { background: #0a1a33 !important; }\r\n.cta-sec                 { background: var(--grad-dark) !important; }\r\n.resources-sec           { background: #060e1f !important; }\r\n\r\n<\/style>\r\n\r\n<!-- \u2550\u2550\u2550 ECOSSISTEMA \u2014 PLANNER \/ STATION OFFICE \u2550\u2550\u2550 -->\r\n<section class=\"eco-sec dark-bg\" id=\"ecosystem\">\r\n  <div class=\"eco-inner\">\r\n\r\n    <div class=\"sec-eyebrow\" data-r>Ecossistema Playlist<\/div>\r\n    <h2 class=\"sec-h2\" data-r>Parte do <span class=\"accent\">Station Office.<\/span><br>Gest\u00e3o completa na nuvem.<\/h2>\r\n    <p class=\"sec-lead\" data-r>O Planner \u00e9 o m\u00f3dulo comercial do Station Office, conjunto de produtos 100% em nuvem que conecta programa\u00e7\u00e3o, engajamento de ouvintes e an\u00e1lise de dados para uma opera\u00e7\u00e3o fluida e sem retrabalho.<\/p>\r\n\r\n    <div class=\"eco-grid\">\r\n\r\n      <!-- Planner \u2014 Este Produto -->\r\n      <div class=\"eco-card current\" data-r>\r\n        <div class=\"eco-icon\">\r\n          <img decoding=\"async\" src=\"https:\/\/playlistsolutions.com\/wp-content\/uploads\/2026\/03\/planner-pqn.png\"\r\n               alt=\"Planner\"\r\n               style=\"width:auto !important; max-width:160px !important; min-width:80px !important; height:110px !important; object-fit:contain !important; display:block !important; margin:0 auto !important;\">\r\n        <\/div>\r\n        <p class=\"eco-sub\">M\u00f3dulo de programa\u00e7\u00e3o<br>e controle do OPEC<\/p>\r\n      <\/div>\r\n\r\n      <!-- Audie -->\r\n      <div class=\"eco-card\" data-r>\r\n        <div class=\"eco-icon\">\r\n          <img decoding=\"async\" src=\"https:\/\/playlistsolutions.com\/wp-content\/uploads\/2026\/03\/audie-pqn.png\"\r\n               alt=\"Audie\"\r\n               style=\"width:auto !important; max-width:160px !important; min-width:80px !important; height:110px !important; object-fit:contain !important; display:block !important; margin:0 auto !important;\">\r\n        <\/div>\r\n        <p class=\"eco-sub\">M\u00f3dulo de gerenciamento<br>de ouvinte e promo\u00e7\u00f5es<\/p>\r\n      <\/div>\r\n\r\n      <!-- Tocou 2.0 -->\r\n      <div class=\"eco-card\" data-r>\r\n        <div class=\"eco-icon\">\r\n          <img decoding=\"async\" src=\"https:\/\/playlistsolutions.com\/wp-content\/uploads\/2026\/03\/tocou-20-pqn.png\"\r\n               alt=\"Tocou 2.0\"\r\n               style=\"width:auto !important; max-width:160px !important; min-width:80px !important; height:110px !important; object-fit:contain !important; display:block !important; margin:0 auto !important;\">\r\n        <\/div>\r\n        <p class=\"eco-sub\">M\u00f3dulo de relat\u00f3rios<br>e gr\u00e1ficos anal\u00edticos<\/p>\r\n      <\/div>\r\n\r\n    <\/div>\r\n  <\/div>\r\n<\/section>\r\n\r\n<script>\r\ndocument.querySelectorAll('[data-r]').forEach(el => el.classList.add('on'));\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-b74bd27 e-flex e-con-boxed e-con e-parent\" data-id=\"b74bd27\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-3fc7354 elementor-widget elementor-widget-html\" data-id=\"3fc7354\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\r\n<style>\r\nnav { all: unset; }\r\n\r\n  \/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\r\n     DESIGN TOKENS \u2014 BRANDING OFICIAL PLAYLIST\r\n     Cores Prim\u00e1rias: #215091 \u00b7 #0f60b6 \u00b7 #009add \u00b7 #00f9ff\r\n     Cores Secund\u00e1rias (\u226420%): #012a5e \u00b7 #9c6dff \u00b7 #dfe1e1\r\n     Tipografia: Roboto Bold \/ Roboto Mono \/ Roboto Regular\r\n  \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\n  :root {\r\n    --p1: #215091;\r\n    --p2: #0f60b6;\r\n    --p3: #009add;\r\n    --p4: #00f9ff;\r\n    --s1: #012a5e;\r\n    --s2: #9c6dff;\r\n    --s3: #dfe1e1;\r\n    --white: #ffffff;\r\n    --text-dark: #0d1f3c;\r\n    --text-body: #2c3d5e;\r\n    --grad-brand: linear-gradient(135deg, #215091 0%, #0f60b6 50%, #009add 100%);\r\n    --grad-dark: linear-gradient(135deg, #012a5e 0%, #215091 60%, #0f60b6 100%);\r\n    --grad-hero: linear-gradient(160deg, #012a5e 0%, #215091 40%, #0f60b6 75%, #009add 100%);\r\n    --surface-light: #eef3fb;\r\n    --border-light: rgba(33,80,145,0.14);\r\n    --r-sm: 8px;\r\n    --r-md: 16px;\r\n    --r-lg: 24px;\r\n    --r-xl: 40px;\r\n  }\r\n\r\n  * { margin: 0; padding: 0; box-sizing: border-box; }\r\n  html { scroll-behavior: smooth; }\r\n  body {\r\n    font-family: 'Roboto', sans-serif;\r\n    color: var(--text-dark);\r\n    background: var(--white);\r\n    -webkit-font-smoothing: antialiased;\r\n    overflow-x: hidden;\r\n  }\r\n\r\n  \/* \u2550\u2550 LINHAS DECORATIVAS \u2550\u2550 *\/\r\n  .brand-lines {\r\n    position: absolute;\r\n    inset: 0;\r\n    pointer-events: none;\r\n    overflow: hidden;\r\n  }\r\n\r\n  \/* \u2550\u2550 CTA FINAL \u2550\u2550 *\/\r\n  .cta-sec {\r\n    background: var(--grad-hero);\r\n    padding: 120px 5vw;\r\n    text-align: center;\r\n    position: relative; overflow: hidden;\r\n  }\r\n\r\n  .cta-inner { max-width: 720px; margin: 0 auto; position: relative; z-index: 2; }\r\n\r\n  .cta-eyebrow {\r\n    font-family: 'Roboto Mono', monospace;\r\n    font-size: 11px; font-weight: 600;\r\n    letter-spacing: 2px; text-transform: uppercase;\r\n    color: var(--p4); margin-bottom: 24px;\r\n    display: inline-flex; align-items: center; gap: 10px;\r\n  }\r\n\r\n  .cta-eyebrow::before, .cta-eyebrow::after {\r\n    content: ''; display: block; width: 24px; height: 1.5px;\r\n    background: var(--p4); opacity: 0.6; border-radius: 2px;\r\n  }\r\n\r\n  .cta-h2 {\r\n    font-family: 'Roboto', sans-serif;\r\n    font-weight: 900;\r\n    font-size: clamp(34px, 5vw, 62px);\r\n    color: white; line-height: 1.08;\r\n    letter-spacing: -1.5px; margin-bottom: 20px;\r\n  }\r\n\r\n  .cta-sub {\r\n    font-size: 18px; font-weight: 300;\r\n    color: rgba(255,255,255,0.6); line-height: 1.65;\r\n    margin-bottom: 48px;\r\n  }\r\n\r\n  .cta-btns {\r\n    display: flex; justify-content: center;\r\n    gap: 16px; flex-wrap: wrap; margin-bottom: 28px;\r\n  }\r\n\r\n  .btn-cta-main {\r\n    background: white;\r\n    color: var(--s1);\r\n    font-family: 'Roboto', sans-serif;\r\n    font-weight: 700; font-size: 16px;\r\n    border: none; padding: 17px 44px;\r\n    border-radius: 100px; cursor: pointer;\r\n    text-decoration: none; transition: all 0.25s;\r\n    box-shadow: 0 4px 20px rgba(0,0,0,0.22);\r\n    display: inline-flex; align-items: center; gap: 10px;\r\n  }\r\n\r\n  .btn-cta-main:hover {\r\n    background: var(--p4);\r\n    color: var(--s1);\r\n    transform: translateY(-2px);\r\n    box-shadow: 0 12px 32px rgba(0,249,255,0.38);\r\n  }\r\n\r\n  .btn-cta-sec {\r\n    background: rgba(255,255,255,0.08);\r\n    color: #ffffff;\r\n    font-family: 'Roboto', sans-serif;\r\n    font-weight: 500; font-size: 16px;\r\n    border: 1.5px solid rgba(255,255,255,0.4);\r\n    padding: 16px 36px; border-radius: 100px;\r\n    cursor: pointer; text-decoration: none; transition: all 0.25s;\r\n    display: inline-flex; align-items: center; gap: 10px;\r\n  }\r\n\r\n  .btn-cta-sec:hover {\r\n    background: rgba(255,255,255,0.16);\r\n    border-color: var(--p4);\r\n    color: var(--p4);\r\n  }\r\n\r\n  .cta-note {\r\n    font-family: 'Roboto Mono', monospace;\r\n    font-size: 12px; color: rgba(255,255,255,0.3);\r\n  }\r\n\r\n  \/* \u2550\u2550 SCROLL REVEAL \u2550\u2550 *\/\r\n  [data-r] { opacity: 1 !important; transform: none !important; }\r\n\r\n  \/* \u2550\u2550 RESPONSIVE \u2550\u2550 *\/\r\n  @media (max-width: 768px) {\r\n    .cta-btns { flex-direction: column; align-items: center; }\r\n  }\r\n\r\n\/* \u2550\u2550 CRITICAL: Restore section padding \u2550\u2550 *\/\r\n.elementor-widget-html section {\r\n  padding: 120px 5vw !important;\r\n  box-sizing: border-box !important;\r\n}\r\n\r\n\/* \u2550\u2550 CTA buttons color fix \u2550\u2550 *\/\r\n.elementor-widget-html .btn-cta-main,\r\n.elementor-widget-html a.btn-cta-main {\r\n  color: #012a5e !important;\r\n  background: #ffffff !important;\r\n  font-size: 18px !important;\r\n  padding: 18px 48px !important;\r\n  border-radius: 100px !important;\r\n}\r\n\r\n.elementor-widget-html .btn-cta-main:hover,\r\n.elementor-widget-html a.btn-cta-main:hover {\r\n  background: #00f9ff !important;\r\n  color: #012a5e !important;\r\n}\r\n\r\n.elementor-widget-html .btn-cta-sec,\r\n.elementor-widget-html a.btn-cta-sec {\r\n  color: #ffffff !important;\r\n  font-size: 17px !important;\r\n  padding: 17px 40px !important;\r\n  border-radius: 100px !important;\r\n  border: 1.5px solid rgba(255,255,255,0.4) !important;\r\n}\r\n\r\n.elementor-widget-html .btn-cta-sec:hover,\r\n.elementor-widget-html a.btn-cta-sec:hover {\r\n  border-color: #00f9ff !important;\r\n  color: #00f9ff !important;\r\n}\r\n\r\n.elementor-widget-html .cta-h2 {\r\n  color: #ffffff !important;\r\n  font-size: clamp(34px, 5vw, 62px) !important;\r\n  font-weight: 900 !important;\r\n}\r\n\r\n.elementor-widget-html .cta-eyebrow {\r\n  color: #00f9ff !important;\r\n  font-size: 11px !important;\r\n}\r\n\r\n.elementor-widget-html .cta-sub {\r\n  color: rgba(255,255,255,0.6) !important;\r\n  font-size: 18px !important;\r\n}\r\n\r\n.elementor-widget-html .cta-note {\r\n  color: rgba(255,255,255,0.3) !important;\r\n  font-size: 12px !important;\r\n}\r\n\r\n\/* Force all data-r visible *\/\r\n[data-r] { opacity: 1 !important; transform: none !important; }\r\n\r\n\/* \u2550\u2550 MASTER BACKGROUND OVERRIDE \u2550\u2550 *\/\r\n.hero                    { background: #0a1a33 !important; }\r\n.pain-section            { background: #0a1a33 !important; }\r\n.benefit-block.dark-bg   { background: #0a1a33 !important; }\r\n.benefit-block.alt       { background: #0a1a33 !important; }\r\n.benefit-block.alt-light  { background: #eef3fb !important; }\r\n.benefit-block.grad-bg   { background: #0a1a33 !important; }\r\n.features-sec            { background: var(--grad-dark) !important; }\r\n.proof-sec               { background: var(--grad-dark) !important; }\r\n.testi-sec               { background: #0a1a33 !important; }\r\n.eco-sec                 { background: #0a1a33 !important; }\r\n.cta-sec                 { background: var(--grad-dark) !important; }\r\n.resources-sec           { background: #060e1f !important; }\r\n\r\n<\/style>\r\n\r\n<!-- \u2550\u2550\u2550 CTA FINAL \u2014 PLANNER \u2550\u2550\u2550 -->\r\n<section class=\"cta-sec\" id=\"cta\">\r\n\r\n  <!-- Linhas decorativas -->\r\n  <div class=\"brand-lines\" aria-hidden=\"true\">\r\n    <svg width=\"100%\" height=\"100%\" viewBox=\"0 0 1440 700\" preserveAspectRatio=\"xMidYMid slice\" fill=\"none\">\r\n      <line x1=\"0\" y1=\"500\" x2=\"500\" y2=\"100\" stroke=\"rgba(0,249,255,0.08)\" stroke-width=\"1\"\/>\r\n      <line x1=\"1440\" y1=\"200\" x2=\"850\" y2=\"650\" stroke=\"rgba(0,154,221,0.07)\" stroke-width=\"1\"\/>\r\n      <circle cx=\"200\" cy=\"350\" r=\"200\" stroke=\"rgba(0,249,255,0.05)\" stroke-width=\"1\" fill=\"none\"\/>\r\n      <circle cx=\"1240\" cy=\"350\" r=\"260\" stroke=\"rgba(0,154,221,0.04)\" stroke-width=\"1\" fill=\"none\"\/>\r\n    <\/svg>\r\n  <\/div>\r\n\r\n  <div class=\"cta-inner\">\r\n    <div class=\"cta-eyebrow\" data-r>Comece hoje<\/div>\r\n    <h2 class=\"cta-h2\" data-r>Sua grade comercial cheia.<br>Todo dia.<\/h2>\r\n    <p class=\"cta-sub\" data-r>Solicite uma demonstra\u00e7\u00e3o e veja como o Planner transforma a gest\u00e3o de contratos, anunciantes e blocos comerciais da sua emissora em uma opera\u00e7\u00e3o eficiente, segura e 100% em nuvem.<\/p>\r\n    <div class=\"cta-btns\" data-r>\r\n      <a href=\"https:\/\/api.whatsapp.com\/send\/?phone=553121362928&text=Ol%C3%A1%21+Gostaria+de+mais+informa%C3%A7%C3%B5es+sobre+o+Planner%21&type=phone_number&app_absent=0\"\r\n         target=\"_blank\" rel=\"noopener noreferrer\"\r\n         class=\"btn-cta-main\">\r\n        Solicitar demonstra\u00e7\u00e3o\r\n        <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\"><path d=\"M3 8h10M8 3l5 5-5 5\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><\/svg>\r\n      <\/a>\r\n      <a href=\"https:\/\/api.whatsapp.com\/send\/?phone=553121362928&text=Ol%C3%A1%21+Gostaria+de+mais+informa%C3%A7%C3%B5es+sobre+o+Planner%21&type=phone_number&app_absent=0\"\r\n         target=\"_blank\" rel=\"noopener noreferrer\"\r\n         class=\"btn-cta-sec\">\r\n        Falar com um especialista\r\n      <\/a>\r\n    <\/div>\r\n    <p class=\"cta-note\" data-r>Sem compromisso. Nosso time entra em contato em at\u00e9 24 horas.<\/p>\r\n  <\/div>\r\n\r\n<\/section>\r\n\r\n<script>\r\ndocument.querySelectorAll('[data-r]').forEach(el => el.classList.add('on'));\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-0cfeedf e-flex e-con-boxed e-con e-parent\" data-id=\"0cfeedf\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-d949c23 elementor-widget elementor-widget-html\" data-id=\"d949c23\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<style>\r\n@import url('https:\/\/fonts.googleapis.com\/css2?family=Roboto:wght@300;400;500;700;900&family=Roboto+Mono:wght@400;500;600&display=swap');\r\n\r\n:root {\r\n  --p1: #215091;\r\n  --p2: #0f60b6;\r\n  --p3: #009add;\r\n  --p4: #00f9ff;\r\n  --s1: #012a5e;\r\n  --grad-dark: linear-gradient(135deg, #012a5e 0%, #215091 60%, #0f60b6 100%);\r\n  --r-lg: 24px;\r\n  --r-xl: 40px;\r\n}\r\n\r\n\/* \u2550\u2550 SECTION BACKGROUND OVERRIDE \u2550\u2550 *\/\r\n.hero { background: #0a1a33 !important; }\r\n.pain-section { background: #0a1a33 !important; }\r\n.benefit-block.dark-bg { background: #0a1a33 !important; }\r\n.benefit-block.alt { background: #0a1a33 !important; }\r\n.benefit-block.alt-light  { background: #eef3fb !important; }\r\n.benefit-block.grad-bg { background: #0a1a33 !important; }\r\n.features-sec { background: var(--grad-dark) !important; }\r\n.proof-sec { background: var(--grad-dark) !important; }\r\n.testi-sec { background: #0a1a33 !important; }\r\n.eco-sec { background: #0a1a33 !important; }\r\n.cta-sec { background: var(--grad-dark) !important; }\r\n.resources-sec { background: #060e1f !important; }\r\n\r\n\/* \u2550\u2550 RESOURCES SECTION \u2550\u2550 *\/\r\n.resources-sec {\r\n  background: #060e1f;\r\n  padding: 120px 5vw;\r\n  position: relative;\r\n  overflow: hidden;\r\n}\r\n\r\n\/* Ambient glow top *\/\r\n.resources-sec::before {\r\n  content: '';\r\n  position: absolute;\r\n  top: -200px;\r\n  left: 50%;\r\n  transform: translateX(-50%);\r\n  width: 900px;\r\n  height: 500px;\r\n  background: radial-gradient(ellipse, rgba(0,154,221,0.07) 0%, transparent 70%);\r\n  pointer-events: none;\r\n}\r\n\r\n\/* Ambient glow bottom *\/\r\n.resources-sec::after {\r\n  content: '';\r\n  position: absolute;\r\n  bottom: -150px;\r\n  right: -100px;\r\n  width: 600px;\r\n  height: 400px;\r\n  background: radial-gradient(ellipse, rgba(0,249,255,0.04) 0%, transparent 70%);\r\n  pointer-events: none;\r\n}\r\n\r\n.res-inner {\r\n  max-width: 1160px;\r\n  margin: 0 auto;\r\n  position: relative;\r\n  z-index: 2;\r\n}\r\n\r\n\/* \u2500\u2500 Header *\/\r\n.res-header {\r\n  text-align: center;\r\n  margin-bottom: 72px;\r\n}\r\n\r\n.res-eyebrow {\r\n  font-family: 'Roboto Mono', monospace;\r\n  font-size: 11px;\r\n  font-weight: 600;\r\n  letter-spacing: 2.5px;\r\n  text-transform: uppercase;\r\n  color: var(--p4);\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  gap: 12px;\r\n  margin-bottom: 20px;\r\n  opacity: 0.85;\r\n}\r\n\r\n.res-eyebrow::before,\r\n.res-eyebrow::after {\r\n  content: '';\r\n  display: block;\r\n  width: 32px;\r\n  height: 1px;\r\n  background: var(--p4);\r\n  opacity: 0.5;\r\n}\r\n\r\n.res-title {\r\n  font-family: 'Roboto', sans-serif;\r\n  font-weight: 700;\r\n  font-size: clamp(32px, 4vw, 52px);\r\n  line-height: 1.1;\r\n  letter-spacing: -1px;\r\n  color: #ffffff;\r\n  margin: 0 0 16px;\r\n}\r\n\r\n.res-lead {\r\n  font-family: 'Roboto', sans-serif;\r\n  font-size: 18px;\r\n  font-weight: 300;\r\n  color: rgba(255,255,255,0.5);\r\n  margin: 0;\r\n  line-height: 1.6;\r\n}\r\n\r\n\/* \u2500\u2500 Cards grid *\/\r\n.res-grid {\r\n  display: grid;\r\n  grid-template-columns: repeat(3, 1fr);\r\n  gap: 20px;\r\n}\r\n\r\n\/* \u2500\u2500 Individual card *\/\r\n.res-card {\r\n  position: relative;\r\n  background: rgba(255,255,255,0.03);\r\n  border: 1px solid rgba(255,255,255,0.07);\r\n  border-radius: var(--r-lg);\r\n  padding: 48px 40px 40px;\r\n  display: flex;\r\n  flex-direction: column;\r\n  gap: 0;\r\n  text-decoration: none;\r\n  color: inherit;\r\n  overflow: hidden;\r\n  transition: transform 0.35s cubic-bezier(.22,1,.36,1),\r\n              border-color 0.3s,\r\n              background 0.3s;\r\n  cursor: pointer;\r\n}\r\n\r\n.res-card::before {\r\n  content: '';\r\n  position: absolute;\r\n  inset: 0;\r\n  background: radial-gradient(ellipse at top center,\r\n    rgba(0,154,221,0.06) 0%,\r\n    transparent 65%);\r\n  opacity: 0;\r\n  transition: opacity 0.4s;\r\n  pointer-events: none;\r\n}\r\n\r\n.res-card:hover {\r\n  transform: translateY(-6px);\r\n  border-color: rgba(0,249,255,0.2);\r\n  background: rgba(255,255,255,0.055);\r\n}\r\n\r\n.res-card:hover::before { opacity: 1; }\r\n\r\n\/* Card accent line top *\/\r\n.res-card-accent {\r\n  position: absolute;\r\n  top: 0; left: 40px; right: 40px;\r\n  height: 2px;\r\n  background: linear-gradient(90deg, transparent, var(--p3), transparent);\r\n  opacity: 0;\r\n  transition: opacity 0.35s;\r\n  border-radius: 2px;\r\n}\r\n\r\n.res-card:hover .res-card-accent { opacity: 0.6; }\r\n\r\n\/* Icon area *\/\r\n.res-icon-wrap {\r\n  width: 56px;\r\n  height: 56px;\r\n  border-radius: 16px;\r\n  background: rgba(0,154,221,0.1);\r\n  border: 1px solid rgba(0,154,221,0.2);\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  margin-bottom: 28px;\r\n  transition: background 0.3s, border-color 0.3s;\r\n}\r\n\r\n.res-card:hover .res-icon-wrap {\r\n  background: rgba(0,249,255,0.12);\r\n  border-color: rgba(0,249,255,0.3);\r\n}\r\n\r\n.res-icon-wrap svg { width: 26px; height: 26px; }\r\n\r\n\/* Card type tag *\/\r\n.res-type {\r\n  font-family: 'Roboto Mono', monospace;\r\n  font-size: 10px;\r\n  font-weight: 600;\r\n  letter-spacing: 1.5px;\r\n  text-transform: uppercase;\r\n  color: var(--p3);\r\n  margin-bottom: 10px;\r\n  opacity: 0.8;\r\n}\r\n\r\n\/* Card title *\/\r\n.res-card-title {\r\n  font-family: 'Roboto', sans-serif;\r\n  font-weight: 700;\r\n  font-size: 22px;\r\n  color: #ffffff;\r\n  margin-bottom: 12px;\r\n  line-height: 1.2;\r\n}\r\n\r\n\/* Card description *\/\r\n.res-card-desc {\r\n  font-family: 'Roboto', sans-serif;\r\n  font-size: 15px;\r\n  font-weight: 300;\r\n  color: rgba(255,255,255,0.45);\r\n  line-height: 1.65;\r\n  flex: 1;\r\n  margin-bottom: 36px;\r\n}\r\n\r\n\/* Card CTA *\/\r\n.res-card-cta {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  gap: 8px;\r\n  font-family: 'Roboto', sans-serif;\r\n  font-size: 14px;\r\n  font-weight: 500;\r\n  color: var(--p4);\r\n  text-decoration: none;\r\n  letter-spacing: 0.2px;\r\n  transition: gap 0.2s;\r\n  margin-top: auto;\r\n}\r\n\r\n.res-card:hover .res-card-cta { gap: 12px; }\r\n\r\n.res-card-cta svg {\r\n  width: 16px;\r\n  height: 16px;\r\n  transition: transform 0.25s;\r\n}\r\n\r\n.res-card:hover .res-card-cta svg { transform: translateX(3px); }\r\n\r\n\/* Format badge bottom-right *\/\r\n.res-format {\r\n  position: absolute;\r\n  bottom: 40px;\r\n  right: 40px;\r\n  font-family: 'Roboto Mono', monospace;\r\n  font-size: 10px;\r\n  font-weight: 600;\r\n  letter-spacing: 1px;\r\n  text-transform: uppercase;\r\n  color: rgba(255,255,255,0.18);\r\n  background: rgba(255,255,255,0.04);\r\n  border: 1px solid rgba(255,255,255,0.08);\r\n  padding: 4px 10px;\r\n  border-radius: 6px;\r\n}\r\n\r\n\/* \u2500\u2500 Responsive *\/\r\n@media (max-width: 900px) {\r\n  .res-grid {\r\n    grid-template-columns: 1fr;\r\n    max-width: 480px;\r\n    margin: 0 auto;\r\n  }\r\n}\r\n\r\n@media (max-width: 600px) {\r\n  .resources-sec { padding: 80px 5vw; }\r\n  .res-card { padding: 36px 28px 32px; }\r\n  .res-format { bottom: 32px; right: 28px; }\r\n}\r\n\r\n\/* \u2550\u2550 PREVENT WHITE BLEED \u2014 Hello Elementor body override \u2550\u2550 *\/\r\n.elementor-widget-html:has(.resources-sec) {\r\n  background: #060e1f !important;\r\n}\r\n\r\n\/* \u2550\u2550 FORCE TEXT COLORS \u2014 override Hello Elementor theme \u2550\u2550 *\/\r\n.elementor-widget-html .res-title  { color: #ffffff !important; }\r\n.elementor-widget-html .res-lead   { color: rgba(255,255,255,0.5) !important; }\r\n.elementor-widget-html .res-eyebrow { color: #00f9ff !important; }\r\n.elementor-widget-html .res-card-title { color: #ffffff !important; }\r\n.elementor-widget-html .res-card-desc  { color: rgba(255,255,255,0.45) !important; }\r\n.elementor-widget-html .res-type       { color: #009add !important; }\r\n.elementor-widget-html .res-card-cta   { color: #00f9ff !important; }\r\n\r\n<\/style>\r\n\r\n<!-- \u2550\u2550\u2550 RECURSOS \u2014 PLANNER \u2550\u2550\u2550 -->\r\n<section class=\"resources-sec\" style=\"background:#060e1f !important;\">\r\n  <div class=\"res-inner\">\r\n\r\n    <!-- Header -->\r\n    <div class=\"res-header\">\r\n      <div class=\"res-eyebrow\">Recursos<\/div>\r\n      <h2 class=\"res-title\">Tudo que voc\u00ea precisa<br>para come\u00e7ar.<\/h2>\r\n      <p class=\"res-lead\">Documenta\u00e7\u00e3o completa, materiais t\u00e9cnicos e treinamento<br>em v\u00eddeo para sua equipe operar com total confian\u00e7a.<\/p>\r\n    <\/div>\r\n\r\n    <!-- Cards -->\r\n    <div class=\"res-grid\">\r\n\r\n      <!-- Card 1: Manual -->\r\n      <a class=\"res-card\"\r\n         href=\"https:\/\/planner.playlistsolutions.com\/help?_gl=1*16gy7jc*_gcl_au*MjAyNzM1NTc4OC4xNzY4MjUwNzEx*_ga*NzY2MDMzODg3LjE3NjgyNTA3MTE.*_ga_JFYY5EBX9G*czE3NzQ0NDg1ODIkbzg4JGcxJHQxNzc0NDUxNDU5JGo2MCRsMCRoMA..\"\r\n         target=\"_blank\" rel=\"noopener\">\r\n        <div class=\"res-card-accent\"><\/div>\r\n        <div class=\"res-icon-wrap\">\r\n          <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"var(--p4)\" stroke-width=\"1.6\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\r\n            <path d=\"M4 19.5A2.5 2.5 0 0 1 6.5 17H20\"\/>\r\n            <path d=\"M6.5 2H20v20H6.5A2.5 2.5 0 0 1 4 19.5v-15A2.5 2.5 0 0 1 6.5 2z\"\/>\r\n            <line x1=\"8\" y1=\"7\" x2=\"16\" y2=\"7\"\/>\r\n            <line x1=\"8\" y1=\"11\" x2=\"13\" y2=\"11\"\/>\r\n          <\/svg>\r\n        <\/div>\r\n        <div class=\"res-type\">Documenta\u00e7\u00e3o<\/div>\r\n        <div class=\"res-card-title\">Manual do Produto<\/div>\r\n        <div class=\"res-card-desc\">Guia completo com todas as funcionalidades, configura\u00e7\u00f5es e fluxos operacionais do Planner. Consulte diretamente na plataforma, sempre atualizado.<\/div>\r\n        <div class=\"res-card-cta\">\r\n          Acessar manual\r\n          <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\r\n            <line x1=\"5\" y1=\"12\" x2=\"19\" y2=\"12\"\/>\r\n            <polyline points=\"12 5 19 12 12 19\"\/>\r\n          <\/svg>\r\n        <\/div>\r\n        <div class=\"res-format\">Online<\/div>\r\n      <\/a>\r\n\r\n      <!-- Card 2: Descritivo -->\r\n      <a class=\"res-card\"\r\n         href=\"https:\/\/playlistsolutions.com\/arquivos\/descritivos\/planner\/DescritivoPlanner(PT).pdf\"\r\n         target=\"_blank\" rel=\"noopener\">\r\n        <div class=\"res-card-accent\"><\/div>\r\n        <div class=\"res-icon-wrap\">\r\n          <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"var(--p4)\" stroke-width=\"1.6\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\r\n            <path d=\"M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z\"\/>\r\n            <polyline points=\"14 2 14 8 20 8\"\/>\r\n            <line x1=\"16\" y1=\"13\" x2=\"8\" y2=\"13\"\/>\r\n            <line x1=\"16\" y1=\"17\" x2=\"8\" y2=\"17\"\/>\r\n            <polyline points=\"10 9 9 9 8 9\"\/>\r\n          <\/svg>\r\n        <\/div>\r\n        <div class=\"res-type\">Ficha t\u00e9cnica<\/div>\r\n        <div class=\"res-card-title\">Descritivo do Produto<\/div>\r\n        <div class=\"res-card-desc\">Vis\u00e3o t\u00e9cnica e comercial completa do Planner: especifica\u00e7\u00f5es, requisitos de sistema e diferenciais para apresenta\u00e7\u00e3o a clientes e parceiros.<\/div>\r\n        <div class=\"res-card-cta\">\r\n          Baixar descritivo\r\n          <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\r\n            <path d=\"M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4\"\/>\r\n            <polyline points=\"7 10 12 15 17 10\"\/>\r\n            <line x1=\"12\" y1=\"15\" x2=\"12\" y2=\"3\"\/>\r\n          <\/svg>\r\n        <\/div>\r\n        <div class=\"res-format\">PDF<\/div>\r\n      <\/a>\r\n\r\n      <!-- Card 3: Video -->\r\n      <a class=\"res-card\"\r\n         href=\"https:\/\/youtu.be\/-dMemlEX2A4?si=HIm95Z-6_LirE7OK\"\r\n         target=\"_blank\" rel=\"noopener\">\r\n        <div class=\"res-card-accent\"><\/div>\r\n        <div class=\"res-icon-wrap\">\r\n          <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"var(--p4)\" stroke-width=\"1.6\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\r\n            <circle cx=\"12\" cy=\"12\" r=\"10\"\/>\r\n            <polygon points=\"10 8 16 12 10 16 10 8\" fill=\"var(--p4)\" stroke=\"none\"\/>\r\n          <\/svg>\r\n        <\/div>\r\n        <div class=\"res-type\">V\u00eddeo<\/div>\r\n        <div class=\"res-card-title\">V\u00eddeo de Treinamento<\/div>\r\n        <div class=\"res-card-desc\">Treinamento em v\u00eddeo com demonstra\u00e7\u00e3o pr\u00e1tica das principais funcionalidades do Planner. Ideal para onboarding de toda a equipe comercial.<\/div>\r\n        <div class=\"res-card-cta\">\r\n          Assistir treinamento\r\n          <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\r\n            <line x1=\"5\" y1=\"12\" x2=\"19\" y2=\"12\"\/>\r\n            <polyline points=\"12 5 19 12 12 19\"\/>\r\n          <\/svg>\r\n        <\/div>\r\n        <div class=\"res-format\">YouTube<\/div>\r\n      <\/a>\r\n\r\n    <\/div><!-- \/res-grid -->\r\n  <\/div><!-- \/res-inner -->\r\n<\/section>\r\n\r\n<script>\r\ndocument.querySelectorAll('[data-r]').forEach(el => el.classList.add('on'));\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>O Planner \u00e9 a solu\u00e7\u00e3o em nuvem da Playlist para gest\u00e3o completa da programa\u00e7\u00e3o comercial da sua emissora, contratos, anunciantes e blocos em um \u00fanico lugar, com automa\u00e7\u00e3o inteligente e acesso de qualquer dispositivo.<\/p>\n","protected":false},"author":1,"featured_media":9011,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-694","page","type-page","status-publish","has-post-thumbnail","hentry"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.4 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Planner - Software de Gest\u00e3o Comercial para R\u00e1dio | Playlist<\/title>\n<meta name=\"description\" content=\"Planner: gerencie contratos, anunciantes e blocos comerciais da sua r\u00e1dio em nuvem. Automa\u00e7\u00e3o completa da grade, relat\u00f3rios em tempo real e acesso de qualquer lugar. Solicite uma demo.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/playlistsolutions.com\/planner\/\" \/>\n<meta property=\"og:locale\" content=\"pt_BR\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Planner - Gerencie a grade comercial da sua r\u00e1dio em nuvem\" \/>\n<meta property=\"og:description\" content=\"Contratos, anunciantes e blocos comerciais automatizados. O Planner maximiza a rentabilidade de cada minuto dispon\u00edvel da sua emissora. Parte do Station Office da Playlist.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/playlistsolutions.com\/planner\/\" \/>\n<meta property=\"og:site_name\" content=\"Playlist Software Solutions\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/PlaylistSoftwareSolutions\" \/>\n<meta property=\"article:modified_time\" content=\"2026-04-15T13:25:58+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/playlistsolutions.com\/wp-content\/uploads\/2026\/03\/Planner-preview.png\" \/>\n\t<meta property=\"og:image:width\" content=\"300\" \/>\n\t<meta property=\"og:image:height\" content=\"300\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Est. tempo de leitura\" \/>\n\t<meta name=\"twitter:data1\" content=\"8 minutos\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/playlistsolutions.com\\\/planner\\\/\",\"url\":\"https:\\\/\\\/playlistsolutions.com\\\/planner\\\/\",\"name\":\"Planner - Software de Gest\u00e3o Comercial para R\u00e1dio | Playlist\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/playlistsolutions.com\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/playlistsolutions.com\\\/planner\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/playlistsolutions.com\\\/planner\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/playlistsolutions.com\\\/wp-content\\\/uploads\\\/2026\\\/03\\\/Planner-preview.png\",\"datePublished\":\"2024-11-13T12:57:39+00:00\",\"dateModified\":\"2026-04-15T13:25:58+00:00\",\"description\":\"Planner: gerencie contratos, anunciantes e blocos comerciais da sua r\u00e1dio em nuvem. Automa\u00e7\u00e3o completa da grade, relat\u00f3rios em tempo real e acesso de qualquer lugar. Solicite uma demo.\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/playlistsolutions.com\\\/planner\\\/#breadcrumb\"},\"inLanguage\":\"pt-BR\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/playlistsolutions.com\\\/planner\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"pt-BR\",\"@id\":\"https:\\\/\\\/playlistsolutions.com\\\/planner\\\/#primaryimage\",\"url\":\"https:\\\/\\\/playlistsolutions.com\\\/wp-content\\\/uploads\\\/2026\\\/03\\\/Planner-preview.png\",\"contentUrl\":\"https:\\\/\\\/playlistsolutions.com\\\/wp-content\\\/uploads\\\/2026\\\/03\\\/Planner-preview.png\",\"width\":300,\"height\":300,\"caption\":\"planner\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/playlistsolutions.com\\\/planner\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"In\u00edcio\",\"item\":\"https:\\\/\\\/playlistsolutions.com\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Planner\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/playlistsolutions.com\\\/#website\",\"url\":\"https:\\\/\\\/playlistsolutions.com\\\/\",\"name\":\"Playlist Software Solutions\",\"description\":\"Software de automa\u00e7\u00e3o de r\u00e1dio\",\"publisher\":{\"@id\":\"https:\\\/\\\/playlistsolutions.com\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/playlistsolutions.com\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"pt-BR\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/playlistsolutions.com\\\/#organization\",\"name\":\"Playlist Software Solutions\",\"url\":\"https:\\\/\\\/playlistsolutions.com\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"pt-BR\",\"@id\":\"https:\\\/\\\/playlistsolutions.com\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/playlistsolutions.com\\\/wp-content\\\/uploads\\\/2024\\\/10\\\/logo-playlist_home.webp\",\"contentUrl\":\"https:\\\/\\\/playlistsolutions.com\\\/wp-content\\\/uploads\\\/2024\\\/10\\\/logo-playlist_home.webp\",\"width\":352,\"height\":48,\"caption\":\"Playlist Software Solutions\"},\"image\":{\"@id\":\"https:\\\/\\\/playlistsolutions.com\\\/#\\\/schema\\\/logo\\\/image\\\/\"},\"sameAs\":[\"https:\\\/\\\/www.facebook.com\\\/PlaylistSoftwareSolutions\",\"https:\\\/\\\/www.instagram.com\\\/playlist.solutions\\\/\",\"https:\\\/\\\/www.linkedin.com\\\/company\\\/playlist-software-solutions\\\/\"]}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Planner - Software de Gest\u00e3o Comercial para R\u00e1dio | Playlist","description":"Planner: gerencie contratos, anunciantes e blocos comerciais da sua r\u00e1dio em nuvem. Automa\u00e7\u00e3o completa da grade, relat\u00f3rios em tempo real e acesso de qualquer lugar. Solicite uma demo.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/playlistsolutions.com\/planner\/","og_locale":"pt_BR","og_type":"article","og_title":"Planner - Gerencie a grade comercial da sua r\u00e1dio em nuvem","og_description":"Contratos, anunciantes e blocos comerciais automatizados. O Planner maximiza a rentabilidade de cada minuto dispon\u00edvel da sua emissora. Parte do Station Office da Playlist.","og_url":"https:\/\/playlistsolutions.com\/planner\/","og_site_name":"Playlist Software Solutions","article_publisher":"https:\/\/www.facebook.com\/PlaylistSoftwareSolutions","article_modified_time":"2026-04-15T13:25:58+00:00","og_image":[{"width":300,"height":300,"url":"https:\/\/playlistsolutions.com\/wp-content\/uploads\/2026\/03\/Planner-preview.png","type":"image\/png"}],"twitter_card":"summary_large_image","twitter_misc":{"Est. tempo de leitura":"8 minutos"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/playlistsolutions.com\/planner\/","url":"https:\/\/playlistsolutions.com\/planner\/","name":"Planner - Software de Gest\u00e3o Comercial para R\u00e1dio | Playlist","isPartOf":{"@id":"https:\/\/playlistsolutions.com\/#website"},"primaryImageOfPage":{"@id":"https:\/\/playlistsolutions.com\/planner\/#primaryimage"},"image":{"@id":"https:\/\/playlistsolutions.com\/planner\/#primaryimage"},"thumbnailUrl":"https:\/\/playlistsolutions.com\/wp-content\/uploads\/2026\/03\/Planner-preview.png","datePublished":"2024-11-13T12:57:39+00:00","dateModified":"2026-04-15T13:25:58+00:00","description":"Planner: gerencie contratos, anunciantes e blocos comerciais da sua r\u00e1dio em nuvem. Automa\u00e7\u00e3o completa da grade, relat\u00f3rios em tempo real e acesso de qualquer lugar. Solicite uma demo.","breadcrumb":{"@id":"https:\/\/playlistsolutions.com\/planner\/#breadcrumb"},"inLanguage":"pt-BR","potentialAction":[{"@type":"ReadAction","target":["https:\/\/playlistsolutions.com\/planner\/"]}]},{"@type":"ImageObject","inLanguage":"pt-BR","@id":"https:\/\/playlistsolutions.com\/planner\/#primaryimage","url":"https:\/\/playlistsolutions.com\/wp-content\/uploads\/2026\/03\/Planner-preview.png","contentUrl":"https:\/\/playlistsolutions.com\/wp-content\/uploads\/2026\/03\/Planner-preview.png","width":300,"height":300,"caption":"planner"},{"@type":"BreadcrumbList","@id":"https:\/\/playlistsolutions.com\/planner\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"In\u00edcio","item":"https:\/\/playlistsolutions.com\/"},{"@type":"ListItem","position":2,"name":"Planner"}]},{"@type":"WebSite","@id":"https:\/\/playlistsolutions.com\/#website","url":"https:\/\/playlistsolutions.com\/","name":"Playlist Software Solutions","description":"Software de automa\u00e7\u00e3o de r\u00e1dio","publisher":{"@id":"https:\/\/playlistsolutions.com\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/playlistsolutions.com\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"pt-BR"},{"@type":"Organization","@id":"https:\/\/playlistsolutions.com\/#organization","name":"Playlist Software Solutions","url":"https:\/\/playlistsolutions.com\/","logo":{"@type":"ImageObject","inLanguage":"pt-BR","@id":"https:\/\/playlistsolutions.com\/#\/schema\/logo\/image\/","url":"https:\/\/playlistsolutions.com\/wp-content\/uploads\/2024\/10\/logo-playlist_home.webp","contentUrl":"https:\/\/playlistsolutions.com\/wp-content\/uploads\/2024\/10\/logo-playlist_home.webp","width":352,"height":48,"caption":"Playlist Software Solutions"},"image":{"@id":"https:\/\/playlistsolutions.com\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/PlaylistSoftwareSolutions","https:\/\/www.instagram.com\/playlist.solutions\/","https:\/\/www.linkedin.com\/company\/playlist-software-solutions\/"]}]}},"_links":{"self":[{"href":"https:\/\/playlistsolutions.com\/wp-json\/wp\/v2\/pages\/694","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/playlistsolutions.com\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/playlistsolutions.com\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/playlistsolutions.com\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/playlistsolutions.com\/wp-json\/wp\/v2\/comments?post=694"}],"version-history":[{"count":110,"href":"https:\/\/playlistsolutions.com\/wp-json\/wp\/v2\/pages\/694\/revisions"}],"predecessor-version":[{"id":10024,"href":"https:\/\/playlistsolutions.com\/wp-json\/wp\/v2\/pages\/694\/revisions\/10024"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/playlistsolutions.com\/wp-json\/wp\/v2\/media\/9011"}],"wp:attachment":[{"href":"https:\/\/playlistsolutions.com\/wp-json\/wp\/v2\/media?parent=694"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}