/* ======================
   HERO NEO — ITA DIGITAL
   ====================== */

   .hero { position: relative; isolation: isolate; overflow: hidden; }

   /* Versão dark com colagem */
   .hero--neo {
     padding-block: clamp(56px, 9vw, 120px);
     color: #f8fafc;
   }
   .hero--neo .hero-ink {
     position: absolute; inset: 0; z-index: -2;
     background:
       radial-gradient(900px 420px at 88% 18%, rgba(59,130,246,.28) 0%, transparent 60%),
       radial-gradient(700px 420px at 12% 100%, rgba(16,185,129,.24) 0%, transparent 60%),
       linear-gradient(180deg, #0b1222 0%, #0a0f1d 100%);
   }
   .hero--neo .hero-noise {
     position: absolute; inset: 0; z-index: -1;
     background-image: url("../img/noise.png");
     opacity: .06; mix-blend-mode: soft-light; pointer-events: none;
   }
   
   /* GRID */
   .hero--neo .hero-grid{
     display: grid;
     grid-template-columns: minmax(0, 1.04fr) .96fr;
     gap: clamp(16px, 2.6vw, 28px);
     align-items: center;
   }
   
   /* Card de copy */
   .hero--neo .hero-copy{
     border-radius: 20px;
     padding: clamp(20px, 3vw, 28px);
     background: linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.06));
     border: 1px solid rgba(148,163,184,.22);
     box-shadow:
       inset 0 1px 0 rgba(255,255,255,.06),
       0 20px 60px rgba(2,6,23,.45);
     backdrop-filter: blur(8px);
   }
   .hero--neo .eyebrow{
     color:#34d399; text-transform:uppercase; letter-spacing:.08em; font-weight:700; margin:0 0 6px;
   }
   .hero--neo .title-wrap{ position: relative; display:inline-block; }
   .hero--neo .beam{
     position:absolute; left:-6px; right:-6px; bottom:4px; height:10px; border-radius:1000px;
     background: radial-gradient(40% 120% at 50% 50%, rgba(59,130,246,.30), rgba(16,185,129,.24) 60%, transparent 70%);
     filter: blur(8px);
   }
   .hero--neo .title{
     margin:0 0 10px; line-height:1.05;
     font-size: clamp(2.1rem, 4vw, 3rem);
     color:#ffffff;
   }
   .hero--neo .subtitle{ margin:0 0 14px; color:#d1d7e6; }
   .hero--neo .cta-row{ display:flex; gap:10px; flex-wrap:wrap; margin-bottom: 12px; }
   
   /* Chips com ícone */
   .hero--neo .feature-strip{
     list-style:none; padding:0; margin:0 0 14px;
     display:flex; gap:10px; flex-wrap:wrap;
   }
   .hero--neo .feature-strip li{
     display:inline-flex; align-items:center; gap:8px;
     padding:7px 12px; border-radius:999px;
     background: rgba(255,255,255,.09);
     border:1px solid rgba(148,163,184,.28);
     font-weight:600; color:#e2e8f0;
     transition: transform .18s ease, background .18s ease, border-color .18s ease;
   }
   .hero--neo .feature-strip li:hover{
     transform: translateY(-1px);
     background: rgba(255,255,255,.12);
     border-color: rgba(148,163,184,.34);
   }
   .hero--neo .feature-strip .i{ display:inline-flex; color:#34d399; }
   
   /* Métricas */
   .hero--neo .stats{
     display:flex; gap:12px; flex-wrap:wrap;
   }
   .hero--neo .stats .s{
     background: rgba(255,255,255,.08);
     border:1px solid rgba(148,163,184,.22);
     border-radius:12px; padding:10px 12px;
     display:grid; gap:2px; align-content:center;
     min-width: 190px;
     box-shadow: inset 0 1px 0 rgba(255,255,255,.06);
   }
   .hero--neo .stats .s strong{ font-size:1.05rem; line-height:1; }
   .hero--neo .stats .s span{ color:#cbd5e1; font-size:.93rem; }
   
   /* Colagem visual (lado direito) */
   .hero--neo .hero-collage{ position: relative; min-height: 360px; }
   .hero--neo .tile{
     position:absolute; border-radius:16px;
     background: rgba(255,255,255,.08);
     border:1px solid rgba(148,163,184,.22);
     backdrop-filter: blur(8px);
     box-shadow: 0 10px 40px rgba(0,0,0,.25);
     will-change: transform;
   }
   .hero--neo .tile:hover{ transform: translateY(-2px); }
   
   /* App preview */
   .hero--neo .tile.app{
     top: -116px; right: 0; width: 420px;
     animation: floatA 7s ease-in-out infinite;
   }
   .hero--neo .tile.app .bar{ display:flex; gap:6px; padding:10px 12px; border-bottom:1px solid rgba(148,163,184,.18);}
   .hero--neo .tile.app .bar span{ width:10px; height:10px; border-radius:999px; background:#94a3b8; opacity:.7; }
   .hero--neo .tile.app .list{ list-style:none; margin:0; padding:8px 10px; display:grid; gap:8px;}
   .hero--neo .tile.app .list li{
     display:grid; grid-template-columns: 32px 1fr 24px; gap:8px; align-items:center;
     padding:8px; border-radius:10px; background: rgba(255,255,255,.06); border:1px solid rgba(148,163,184,.18);
   }
   .hero--neo .tile.app .avatar{ width:32px; height:32px; border-radius:10px; background: linear-gradient(135deg,#60a5fa,#8b5cf6); }
   .hero--neo .tile.app .avatar.alt{ background: linear-gradient(135deg,#22d3ee,#06b6d4); }
   .hero--neo .tile.app .line b{ display:block; color:#fff; font-size:.98rem; }
   .hero--neo .tile.app .line span{ display:block; color:#cbd5e1; font-size:.85rem; opacity:.9; }
   .hero--neo .tile.app button{
     border:0; background:transparent; color:#cbd5e1; font-size:18px; cursor:pointer;
   }
   
   /* Fluxo n8n */
   .hero--neo .tile.flow{
     bottom: -140px; left: 10px; padding:10px;
     color:#60a5fa; animation: floatB 6.5s ease-in-out infinite;
   }
   
   /* Chat */
   .hero--neo .tile.chat{
     top: 160px; left: -20px; width: 260px; padding:12px;
     animation: floatC 7.3s ease-in-out infinite;
   }
   .hero--neo .tile.chat .wapp{ display:flex; align-items:center; gap:8px; color:#e2e8f0; font-weight:700; margin-bottom:6px; }
   .hero--neo .tile.chat .bubble{
     background:#0ea5e9; color:#082f49; border-radius:12px; padding:8px 10px; margin-bottom:6px;
     font-weight:700; box-shadow: 0 8px 24px rgba(14,165,233,.25);
   }
   .hero--neo .tile.chat .bubble.alt{ background:#22c55e; color:#052e16; }
   
   @keyframes floatA { 0%,100%{ transform: translateY(0) } 50%{ transform: translateY(-8px) } }
   @keyframes floatB { 0%,100%{ transform: translateY(0) } 50%{ transform: translateY(-6px) } }
   @keyframes floatC { 0%,100%{ transform: translateY(0) } 50%{ transform: translateY(-7px) } }
   
   /* Gradientes de texto */
   .grad-text{
     background: linear-gradient(90deg, #10b981, #22d3ee);
     -webkit-background-clip:text; background-clip:text; color: transparent;
   }
   .grad-text-2{
     background: linear-gradient(90deg, #60a5fa, #8b5cf6);
     -webkit-background-clip:text; background-clip:text; color: transparent;
   }
   .grad-text-3{
     background: linear-gradient(90deg, #22d3ee, #06b6d4);
     -webkit-background-clip:text; background-clip:text; color: transparent;
   }
   
   /* Responsivo */
   @media (max-width: 1160px){
     .hero--neo .hero-grid{ grid-template-columns: 1fr; }
     .hero--neo .hero-collage{ order: 2; min-height: 420px; }
     .hero--neo .tile.app{ top: 0; right: auto; left: 40px; }
     .hero--neo .tile.chat{ left: 0; top: 180px; }
     .hero--neo .tile.flow{ left: auto; right: 20px; bottom: 0; }
   }
   @media (max-width: 560px){
     .hero--neo{ padding-block: 46px; }
     .hero--neo .tile.app{ width: calc(100% - 40px); left: 20px; }
     .hero--neo .tile.flow{ display:none; }
   }