:root{
--fh4-bg:#020917;
--fh4-bg-2:#041226;
--fh4-panel:#07182f;
--fh4-panel-2:#0a203e;
--fh4-line:rgba(87,180,255,.16);
--fh4-line-strong:rgba(87,190,255,.28);
--fh4-text:#f7fbff;
--fh4-soft:#a4b8d2;
--fh4-muted:#6e86a5;
--fh4-blue:#347cff;
--fh4-cyan:#28c8ff;
--fh4-green:#36dc88;
}

*{
box-sizing:border-box;
}

html{
margin:0;
overflow-x:hidden;
background:var(--fh4-bg);
scroll-behavior:smooth;
}

body.fh4-home{
min-height:100svh;
margin:0;
overflow-x:hidden;
background:
radial-gradient(circle at 10% 15%,rgba(42,115,255,.15),transparent 310px),
radial-gradient(circle at 88% 67%,rgba(25,198,255,.10),transparent 300px),
linear-gradient(180deg,#030d20 0%,#020916 100%);
color:var(--fh4-text);
font-family:
Inter,
ui-sans-serif,
system-ui,
-apple-system,
BlinkMacSystemFont,
"Segoe UI",
sans-serif;
-webkit-font-smoothing:antialiased;
}

a{
color:inherit;
text-decoration:none;
}

img{
display:block;
max-width:100%;
}

button,
a,
summary{
-webkit-tap-highlight-color:transparent;
}

.fh4-home header,
.fh4-home main{
position:relative;
z-index:2;
}

.fh4-container{
width:calc(100% - 28px);
max-width:1180px;
margin:0 auto;
}

/* FUNDO TECNOLOGICO */
.fh4-grid{
position:fixed;
inset:0;
z-index:0;
pointer-events:none;
opacity:.28;
background-image:
linear-gradient(rgba(75,151,255,.035) 1px,transparent 1px),
linear-gradient(90deg,rgba(75,151,255,.035) 1px,transparent 1px);
background-size:34px 34px;
mask-image:linear-gradient(to bottom,#000 0%,rgba(0,0,0,.72) 70%,transparent 100%);
-webkit-mask-image:linear-gradient(to bottom,#000 0%,rgba(0,0,0,.72) 70%,transparent 100%);
}

.fh4-glow{
position:fixed;
z-index:0;
pointer-events:none;
border-radius:50%;
filter:blur(100px);
}

.fh4-glow-a{
width:260px;
height:260px;
top:80px;
left:-160px;
background:rgba(38,114,255,.22);
}

.fh4-glow-b{
width:240px;
height:240px;
right:-150px;
bottom:40px;
background:rgba(29,198,255,.14);
}

/* COMPONENTES */
.fh4-btn{
min-height:46px;
display:inline-flex;
align-items:center;
justify-content:center;
gap:8px;
padding:10px 17px;
border:1px solid transparent;
border-radius:12px;
font-size:13px;
line-height:1;
font-weight:850;
white-space:nowrap;
}

.fh4-btn-primary{
color:#fff;
background:
linear-gradient(135deg,var(--fh4-blue) 0%,#248dfb 55%,var(--fh4-cyan) 100%);
box-shadow:
0 12px 28px rgba(34,126,255,.23),
inset 0 1px 0 rgba(255,255,255,.18);
}

.fh4-btn-ghost{
color:#d5e3f4;
border-color:var(--fh4-line);
background:rgba(7,25,54,.58);
}

.fh4-link{
display:inline-flex;
align-items:center;
gap:7px;
color:#68d8ff;
font-size:12px;
font-weight:800;
}

/* HEADER MOBILE */
.fh4-header{
position:sticky;
top:0;
z-index:50;
border-bottom:1px solid rgba(100,181,255,.09);
background:rgba(2,9,23,.84);
backdrop-filter:blur(18px);
-webkit-backdrop-filter:blur(18px);
}

.fh4-header-inner{
height:64px;
display:flex;
align-items:center;
justify-content:space-between;
gap:10px;
}

.fh4-brand{
min-width:0;
display:flex;
align-items:center;
gap:8px;
}

.fh4-brand img{
width:38px;
height:38px;
flex:0 0 auto;
object-fit:contain;
filter:drop-shadow(0 5px 14px rgba(41,146,255,.16));
}

.fh4-brand span{
min-width:0;
display:block;
}

.fh4-brand strong{
display:block;
font-size:14px;
line-height:1;
font-weight:950;
letter-spacing:-.025em;
white-space:nowrap;
}

.fh4-brand strong em{
color:#39caff;
font-style:normal;
}

.fh4-brand small{
display:none;
}

.fh4-nav,
.fh4-actions{
display:none;
}

.fh4-mobile-actions{
display:flex;
align-items:center;
justify-content:flex-end;
gap:3px;
flex:0 0 auto;
}

.fh4-mobile-actions>a{
min-height:36px;
display:flex;
align-items:center;
padding:8px 7px;
border-radius:9px;
color:#b6c9e0;
font-size:11px;
font-weight:800;
}

.fh4-mobile-menu{
position:relative;
}

.fh4-mobile-menu>summary{
width:36px;
height:36px;
display:grid;
place-items:center;
cursor:pointer;
list-style:none;
border:1px solid rgba(100,185,255,.17);
border-radius:10px;
background:rgba(8,26,54,.72);
color:#e7f4ff;
font-size:20px;
}

.fh4-mobile-menu>summary::-webkit-details-marker{
display:none;
}

.fh4-mobile-menu nav{
position:absolute;
top:43px;
right:0;
width:178px;
display:grid;
gap:3px;
padding:7px;
border:1px solid rgba(98,184,255,.18);
border-radius:13px;
background:#061429;
box-shadow:0 20px 50px rgba(0,0,0,.42);
}

.fh4-mobile-menu nav a{
min-height:40px;
display:flex;
align-items:center;
padding:9px 11px;
border-radius:9px;
color:#c5d6e9;
font-size:11px;
font-weight:800;
}

.fh4-mobile-menu .fh4-menu-cta{
color:#fff;
background:linear-gradient(135deg,#347cff,#27bff2);
}

/* =========================================================
   HERO MOBILE
   ========================================================= */

.fh4-hero{
min-height:calc(100svh - 64px);
display:flex;
align-items:flex-start;
padding:30px 0 38px;
}

.fh4-hero-grid{
display:grid;
grid-template-columns:1fr;
gap:30px;
}

.fh4-hero-copy{
min-width:0;
text-align:left;
}

.fh4-eyebrow{
display:inline-flex;
align-items:center;
gap:7px;
padding:7px 11px;
border:1px solid rgba(77,184,255,.20);
border-radius:999px;
background:rgba(23,94,180,.10);
color:#78dcff;
font-size:9px;
line-height:1;
font-weight:850;
letter-spacing:.055em;
text-transform:uppercase;
}

.fh4-eyebrow i{
font-size:11px;
}

.fh4-hero h1{
max-width:390px;
margin:16px 0 0;
font-size:clamp(38px,10.5vw,47px);
line-height:.99;
font-weight:950;
letter-spacing:-.052em;
}

.fh4-hero h1 span{
display:block;
margin-top:4px;
background:linear-gradient(95deg,#f8fbff 0%,#68d8ff 38%,#3187ff 100%);
-webkit-background-clip:text;
background-clip:text;
color:transparent;
}

.fh4-hero-copy>p{
max-width:385px;
margin:17px 0 0;
color:var(--fh4-soft);
font-size:14px;
line-height:1.55;
}

.fh4-hero-actions{
display:flex;
align-items:center;
gap:9px;
margin-top:21px;
}

.fh4-hero-actions .fh4-btn-primary{
min-width:164px;
}

.fh4-hero-actions .fh4-btn-ghost{
min-width:92px;
}

.fh4-hero-copy>.fh4-link{
margin-top:13px;
}

/* =========================================================
   REDE VISUAL FRA HUB
   ========================================================= */

.fh4-hero-visual{
min-width:0;
display:flex;
justify-content:center;
}

.fh4-network{
position:relative;
width:100%;
max-width:410px;
height:340px;
margin:0 auto;
overflow:visible;
}

.fh4-network::before{
content:"";
position:absolute;
left:50%;
top:50%;
width:240px;
height:240px;
transform:translate(-50%,-50%);
border-radius:50%;
background:
radial-gradient(circle,rgba(31,143,255,.17) 0%,rgba(22,104,211,.07) 42%,transparent 72%);
filter:blur(4px);
pointer-events:none;
}

.fh4-network::after{
content:"";
position:absolute;
inset:40px 54px;
border:1px solid rgba(73,168,255,.07);
border-radius:50%;
pointer-events:none;
}

.fh4-network-lines{
position:absolute;
inset:0;
width:100%;
height:100%;
overflow:visible;
pointer-events:none;
}

.fh4-network-lines path{
fill:none;
stroke:rgba(81,183,255,.30);
stroke-width:1.5;
stroke-linecap:round;
stroke-dasharray:4 7;
filter:drop-shadow(0 0 5px rgba(38,166,255,.20));
}

/* NODOS */
.fh4-network-node{
position:absolute;
z-index:3;
width:92px;
min-height:52px;
display:flex;
align-items:center;
justify-content:center;
gap:7px;
padding:7px 9px;
transform:translate(-50%,-50%);
border:1px solid rgba(87,185,255,.19);
border-radius:14px;
background:
linear-gradient(145deg,rgba(9,31,63,.94),rgba(5,18,40,.94));
box-shadow:
0 10px 26px rgba(0,0,0,.28),
inset 0 1px 0 rgba(255,255,255,.03);
backdrop-filter:blur(8px);
-webkit-backdrop-filter:blur(8px);
}

.fh4-network-node strong{
min-width:0;
font-size:10px;
line-height:1;
font-weight:850;
white-space:nowrap;
}

.fh4-node-icon{
width:27px;
height:27px;
display:grid;
place-items:center;
flex:0 0 auto;
border:1px solid rgba(83,183,255,.18);
border-radius:9px;
background:rgba(34,117,221,.12);
color:#62d4ff;
font-size:13px;
font-weight:900;
}

.fh4-node-icon-green{
color:#4fe49a;
background:rgba(48,205,127,.10);
border-color:rgba(75,224,145,.18);
}

/* POSICOES */
.fh4-node-sigma{
left:20%;
top:19%;
}

.fh4-node-xcloud{
left:80%;
top:19%;
}

.fh4-node-client{
left:15%;
top:50%;
}

.fh4-node-whatsapp{
left:85%;
top:50%;
}

.fh4-node-billing{
left:21%;
top:82%;
}

.fh4-node-automation{
left:79%;
top:82%;
}

/* NUCLEO FRA HUB */
.fh4-network-core{
position:absolute;
left:50%;
top:50%;
z-index:5;
width:126px;
height:126px;
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
transform:translate(-50%,-50%);
border:1px solid rgba(78,192,255,.32);
border-radius:31px;
background:
linear-gradient(145deg,rgba(8,37,78,.97),rgba(5,21,49,.98));
box-shadow:
0 0 0 7px rgba(42,132,255,.035),
0 0 60px rgba(33,137,255,.20),
0 22px 50px rgba(0,0,0,.34),
inset 0 1px 0 rgba(255,255,255,.08);
}

.fh4-core-glow{
position:absolute;
inset:13px;
border-radius:24px;
background:
radial-gradient(circle at 50% 35%,rgba(51,181,255,.19),transparent 62%);
pointer-events:none;
}

.fh4-core-logo{
position:relative;
z-index:2;
width:65px;
height:65px;
display:grid;
place-items:center;
}

.fh4-core-logo img{
width:65px;
height:65px;
object-fit:contain;
filter:
drop-shadow(0 7px 14px rgba(24,125,255,.24))
drop-shadow(0 0 12px rgba(41,194,255,.10));
}

.fh4-network-core>strong{
position:relative;
z-index:2;
margin-top:-2px;
font-size:12px;
line-height:1;
font-weight:950;
letter-spacing:-.02em;
}

.fh4-network-core>strong em{
color:#45ccff;
font-style:normal;
}

.fh4-network-core>small{
position:relative;
z-index:2;
margin-top:4px;
color:#7590b0;
font-size:7px;
font-weight:750;
}

/* =========================================================
   DESKTOP
   ========================================================= */

@media (min-width:768px){

.fh4-container{
width:calc(100% - 52px);
max-width:1180px;
}

/* HEADER */
.fh4-header-inner{
height:74px;
gap:26px;
}

.fh4-brand{
gap:10px;
}

.fh4-brand img{
width:44px;
height:44px;
}

.fh4-brand strong{
font-size:16px;
}

.fh4-brand small{
display:block;
margin-top:4px;
color:#7289a7;
font-size:8px;
font-weight:700;
white-space:nowrap;
}

.fh4-nav{
display:flex;
align-items:center;
gap:4px;
margin-left:auto;
}

.fh4-nav a{
padding:9px 12px;
border-radius:9px;
color:#a0b4cd;
font-size:11px;
font-weight:800;
}

.fh4-nav a:hover{
color:#fff;
background:rgba(45,125,225,.10);
}

.fh4-actions{
display:flex;
align-items:center;
gap:8px;
}

.fh4-actions .fh4-btn{
min-height:40px;
padding:9px 14px;
font-size:11px;
}

.fh4-mobile-actions{
display:none;
}

/* HERO DESKTOP */
.fh4-hero{
min-height:calc(100svh - 74px);
align-items:center;
padding:42px 0 50px;
}

.fh4-hero-grid{
grid-template-columns:minmax(0,1.02fr) minmax(470px,.98fr);
align-items:center;
gap:54px;
}

.fh4-eyebrow{
padding:8px 12px;
font-size:10px;
}

.fh4-hero h1{
max-width:660px;
margin-top:18px;
font-size:clamp(54px,5vw,68px);
line-height:.97;
letter-spacing:-.055em;
}

.fh4-hero h1 span{
margin-top:6px;
}

.fh4-hero-copy>p{
max-width:540px;
margin-top:20px;
font-size:16px;
line-height:1.6;
}

.fh4-hero-actions{
gap:10px;
margin-top:25px;
}

.fh4-hero-actions .fh4-btn{
min-height:48px;
font-size:12px;
}

.fh4-hero-actions .fh4-btn-primary{
min-width:174px;
}

.fh4-hero-actions .fh4-btn-ghost{
min-width:98px;
}

.fh4-hero-copy>.fh4-link{
margin-top:14px;
font-size:11px;
}

/* REDE DESKTOP */
.fh4-network{
max-width:540px;
height:440px;
}

.fh4-network::before{
width:340px;
height:340px;
}

.fh4-network::after{
inset:49px 63px;
}

.fh4-network-lines path{
stroke-width:1.6;
stroke-dasharray:5 8;
}

.fh4-network-node{
width:112px;
min-height:60px;
gap:8px;
padding:9px 11px;
border-radius:15px;
}

.fh4-network-node strong{
font-size:11px;
}

.fh4-node-icon{
width:32px;
height:32px;
border-radius:10px;
font-size:15px;
}

.fh4-node-sigma{
left:19%;
top:18%;
}

.fh4-node-xcloud{
left:81%;
top:18%;
}

.fh4-node-client{
left:14%;
top:50%;
}

.fh4-node-whatsapp{
left:86%;
top:50%;
}

.fh4-node-billing{
left:20%;
top:82%;
}

.fh4-node-automation{
left:80%;
top:82%;
}

.fh4-network-core{
width:158px;
height:158px;
border-radius:38px;
box-shadow:
0 0 0 9px rgba(42,132,255,.035),
0 0 85px rgba(33,137,255,.22),
0 28px 65px rgba(0,0,0,.36),
inset 0 1px 0 rgba(255,255,255,.08);
}

.fh4-core-glow{
inset:16px;
border-radius:29px;
}

.fh4-core-logo{
width:84px;
height:84px;
}

.fh4-core-logo img{
width:84px;
height:84px;
}

.fh4-network-core>strong{
font-size:14px;
}

.fh4-network-core>small{
margin-top:5px;
font-size:8px;
}

}

@media (min-width:1200px){

.fh4-hero-grid{
gap:70px;
}

.fh4-network{
max-width:570px;
height:455px;
}

}

/* =========================================================
   V4-F1 - REFINAMENTO VISUAL MOBILE
   ========================================================= */

/* titulo: quebra natural, mas nunca separa "para clientes" */
.fh4-hero h1 span{
display:inline;
margin-top:0;
}

/* CTAs: Entrar fica apenas no header */
.fh4-hero-actions .fh4-btn-primary{
min-width:164px;
}

.fh4-hero-actions .fh4-btn-ghost{
min-width:136px;
padding-left:12px;
padding-right:12px;
}

/* sobe discretamente a composicao apos retirar o link redundante */
.fh4-hero-visual{
margin-top:-4px;
}

/* quadros mais largos para nenhum texto escapar */
.fh4-network-node{
width:112px;
padding-left:8px;
padding-right:8px;
overflow:hidden;
}

.fh4-network-node strong{
min-width:0;
flex:1 1 auto;
font-size:9px;
overflow:hidden;
white-space:nowrap;
text-overflow:clip;
}

/* traz os quadros externos alguns pixels para dentro */
.fh4-node-sigma{
left:21%;
}

.fh4-node-xcloud{
left:79%;
}

.fh4-node-client{
left:16%;
}

.fh4-node-whatsapp{
left:84%;
}

.fh4-node-billing{
left:22%;
}

.fh4-node-automation{
left:78%;
}

@media (min-width:768px){

.fh4-hero h1 span{
display:inline;
margin-top:0;
}

.fh4-hero-actions .fh4-btn-ghost{
min-width:140px;
}

.fh4-network-node{
width:116px;
}

.fh4-network-node strong{
font-size:10px;
}

}


/* V4-F2 - TITLE EDGE FIX */
.fh4-hero h1 span{
-webkit-box-decoration-break:clone;
box-decoration-break:clone;
padding-right:.035em;
}

@media (max-width:767px){
.fh4-hero h1{
font-size:37px;
line-height:1;
}
}

/* V4-F3A - HEADER MOBILE PRESENCA */
@media (max-width:767px){

.fh4-mobile-actions{
gap:5px;
}

.fh4-mobile-actions>a{
min-height:40px;
padding:9px 9px;
font-size:13px;
font-weight:850;
}

.fh4-mobile-menu>summary{
width:40px;
height:40px;
font-size:21px;
}

}

/* V4-F3B - LOGOS INTEGRACOES */
.fh4-node-logo{
overflow:hidden;
padding:4px;
}

.fh4-node-logo img{
width:100%;
height:100%;
display:block;
object-fit:contain;
}

.fh4-node-logo-xcloud{
padding:2px;
}


/* desktop: acompanha discretamente o aumento do ícone */
@media (min-width:768px){
.fh4-node-logo-xcloud img{
width:42px;
}
}

/*
 * O PNG original contém:
 * símbolo XCloud na parte superior
 * + palavra Cloud na parte inferior.
 *
 * A caixa abaixo mostra somente a região do símbolo.
 */
.fh4-xcloud-logo-direct{
display:block;
width:42px;
height:27px;
max-width:42px;
flex:0 0 42px;
object-fit:cover;
object-position:center top;
overflow:hidden;
}

@media (min-width:768px){
.fh4-xcloud-logo-direct{
width:46px;
height:30px;
max-width:46px;
flex-basis:46px;
}
}

/* V4-F4G - XCLOUD LOGO INTEIRO SEM CLOUD */
.fh4-node-xcloud{
display:flex;
align-items:center;
justify-content:center;
gap:10px;
}

.fh4-xcloud-logo-direct{
display:block;
width:42px;
height:auto;
max-width:42px;
flex:0 0 42px;

/*
 * Mantém o PNG em sua proporção original.
 * Esconde somente a faixa inferior onde está escrito "Cloud".
 */
clip-path:inset(0 0 20% 0);
margin-top:7px;
margin-bottom:-7px;
}

@media (min-width:768px){
.fh4-xcloud-logo-direct{
width:46px;
max-width:46px;
flex-basis:46px;
margin-top:8px;
margin-bottom:-8px;
}
}
/* V4-F4I - XCLOUD FINAL COM JANELA */
.fh4-node-xcloud{
display:flex;
align-items:center;
justify-content:center;
gap:9px;
}

.fh4-xcloud-mark{
position:relative;
display:block;
width:32px;
height:32px;
flex:0 0 32px;
overflow:hidden;
}

.fh4-xcloud-mark img{
position:absolute;
display:block;
width:32px;
height:auto;
max-width:none;
left:50%;
top:0;
transform:translateX(-50%);
}

@media (min-width:768px){
.fh4-xcloud-mark{
width:34px;
height:34px;
flex-basis:34px;
}

.fh4-xcloud-mark img{
width:34px;
}
}

/* V4-F4J - XCLOUD MASCARA FINAL */
.fh4-xcloud-mark{
width:34px !important;
height:25px !important;
flex:0 0 34px !important;
position:relative !important;
display:block !important;
overflow:hidden !important;
}

.fh4-xcloud-mark img{
position:absolute !important;
display:block !important;
width:36px !important;
height:auto !important;
max-width:none !important;
left:50% !important;
top:1px !important;
transform:translateX(-50%) !important;
clip-path:inset(0 0 42% 0) !important;
}

@media (min-width:768px){
.fh4-xcloud-mark{
width:36px !important;
height:27px !important;
flex-basis:36px !important;
}

.fh4-xcloud-mark img{
width:38px !important;
}
}

/* =========================================================
   V4-D1 - DESKTOP EXPERIENCE
   MOBILE PERMANECE INTOCADO
   ========================================================= */

.fh4-desktop-showcase,
.fh4-desktop-benefits{
display:none;
}

@media (min-width:900px){

.fh4-desktop-showcase,
.fh4-desktop-benefits{
display:block;
}

.fh4-desktop-showcase{
position:relative;
padding:80px 0 54px;
border-top:1px solid rgba(72,167,255,.16);
background:
radial-gradient(circle at 50% 0%,rgba(26,96,225,.16),transparent 42%),
linear-gradient(180deg,rgba(4,17,37,.72),rgba(2,9,23,.96));
}

.fh4-desktop-showcase-head{
width:min(520px,100%);
margin-bottom:36px;
}

.fh4-desktop-showcase-head>span{
display:block;
margin-bottom:10px;
color:#34c8ff;
font-size:12px;
font-weight:850;
letter-spacing:.08em;
text-transform:uppercase;
}

.fh4-desktop-showcase-head h2{
margin:0;
color:#fff;
font-size:42px;
line-height:1.04;
letter-spacing:-.035em;
}

.fh4-desktop-showcase-head p{
margin:18px 0 0;
color:#9eb4cf;
font-size:16px;
line-height:1.65;
}

.fh4-product-stage{
position:relative;
min-height:610px;
}

.fh4-product-browser{
position:relative;
z-index:2;
width:min(850px,72%);
margin:0 auto;
border:1px solid rgba(79,174,255,.28);
border-radius:24px;
overflow:hidden;
background:#07162d;
box-shadow:
0 34px 90px rgba(0,0,0,.48),
0 0 65px rgba(31,118,255,.10);
}

.fh4-product-browser-top{
height:34px;
display:flex;
align-items:center;
gap:7px;
padding:0 14px;
border-bottom:1px solid rgba(91,176,255,.12);
background:#061123;
}

.fh4-product-browser-top span{
width:8px;
height:8px;
border-radius:50%;
background:#24405f;
}

.fh4-product-layout{
display:grid;
grid-template-columns:180px minmax(0,1fr);
min-height:470px;
}

.fh4-product-sidebar{
padding:18px 12px;
border-right:1px solid rgba(98,178,255,.10);
background:#061329;
}

.fh4-product-sidebar-brand{
margin-bottom:18px;
padding:0 10px;
color:#fff;
font-size:13px;
}

.fh4-product-sidebar nav{
display:grid;
gap:4px;
}

.fh4-product-sidebar nav span{
display:flex;
align-items:center;
gap:9px;
padding:9px 10px;
border-radius:9px;
color:#829ab8;
font-size:11px;
font-weight:700;
}

.fh4-product-sidebar nav span.active{
color:#fff;
background:linear-gradient(90deg,rgba(39,119,255,.24),rgba(37,191,244,.08));
}

.fh4-product-sidebar nav i{
font-size:13px;
color:#4fcaff;
}

.fh4-product-content{
padding:22px;
background:
linear-gradient(180deg,#091a33,#07152a);
}

.fh4-product-topbar{
display:flex;
align-items:center;
justify-content:space-between;
margin-bottom:18px;
}

.fh4-product-topbar>div{
display:grid;
gap:2px;
}

.fh4-product-topbar small{
color:#6f87a6;
font-size:10px;
}

.fh4-product-topbar strong{
color:#fff;
font-size:20px;
}

.fh4-product-status{
display:flex;
align-items:center;
gap:7px;
color:#87a1bd;
font-size:10px;
font-weight:700;
}

.fh4-product-status i{
width:7px;
height:7px;
border-radius:50%;
background:#36dc88;
box-shadow:0 0 10px rgba(54,220,136,.7);
}

.fh4-product-metrics{
display:grid;
grid-template-columns:repeat(4,minmax(0,1fr));
gap:10px;
}

.fh4-product-metrics article{
min-width:0;
padding:14px;
border:1px solid rgba(82,168,255,.11);
border-radius:12px;
background:rgba(11,35,70,.64);
}

.fh4-product-metrics small,
.fh4-product-metrics span{
display:block;
color:#7188a5;
font-size:9px;
}

.fh4-product-metrics strong{
display:block;
margin:5px 0;
color:#fff;
font-size:22px;
}

.fh4-product-panels{
display:grid;
grid-template-columns:minmax(0,1.45fr) minmax(220px,.55fr);
gap:12px;
margin-top:12px;
}

.fh4-product-panel{
min-height:188px;
padding:15px;
border:1px solid rgba(82,168,255,.11);
border-radius:14px;
background:rgba(8,28,58,.72);
}

.fh4-product-panel-head{
display:flex;
align-items:center;
justify-content:space-between;
gap:10px;
}

.fh4-product-panel-head strong{
color:#fff;
font-size:12px;
}

.fh4-product-panel-head span{
color:#65809f;
font-size:8px;
}

.fh4-product-bars{
height:135px;
display:flex;
align-items:flex-end;
gap:9px;
padding-top:20px;
}

.fh4-product-bars i{
flex:1;
height:var(--h);
min-width:10px;
border-radius:6px 6px 2px 2px;
background:linear-gradient(180deg,#28c9ff,#286cff);
opacity:.82;
}

.fh4-product-panel-side ul{
list-style:none;
margin:18px 0 0;
padding:0;
display:grid;
gap:9px;
}

.fh4-product-panel-side li{
display:flex;
justify-content:space-between;
gap:12px;
padding:9px 0;
border-bottom:1px solid rgba(85,163,239,.09);
}

.fh4-product-panel-side li span{
color:#758ca9;
font-size:9px;
}

.fh4-product-panel-side li strong{
color:#dcecff;
font-size:9px;
}

.fh4-floating-card{
position:absolute;
z-index:3;
width:205px;
display:flex;
align-items:center;
gap:11px;
padding:14px;
border:1px solid rgba(57,190,255,.28);
border-radius:15px;
background:rgba(5,22,47,.94);
box-shadow:0 20px 45px rgba(0,0,0,.34);
}

.fh4-floating-card>i,
.fh4-mini-sigma{
width:34px;
height:34px;
display:grid;
place-items:center;
flex:0 0 34px;
border-radius:9px;
font-size:20px;
color:#3ed1ff;
background:#082650;
}

.fh4-floating-card img{
width:34px;
height:34px;
object-fit:contain;
flex:0 0 34px;
}

.fh4-floating-card span:last-child{
display:grid;
gap:3px;
}

.fh4-floating-card strong{
color:#fff;
font-size:11px;
}

.fh4-floating-card small{
color:#758eab;
font-size:8px;
line-height:1.35;
}

.fh4-floating-whatsapp{
left:0;
top:270px;
}

.fh4-floating-whatsapp>i{
color:#3be38b;
}

.fh4-floating-sigma{
left:85px;
bottom:8px;
}

.fh4-floating-xcloud{
right:0;
top:210px;
}

.fh4-floating-billing{
right:45px;
bottom:20px;
}

.fh4-floating-billing>i{
color:#ffcf38;
background:#2b2308;
}

.fh4-desktop-benefits{
padding:34px 0 70px;
background:#020917;
}

.fh4-benefits-grid{
display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
gap:14px;
}

.fh4-benefits-grid article{
display:flex;
align-items:flex-start;
gap:15px;
padding:20px;
border:1px solid rgba(71,167,255,.14);
border-radius:15px;
background:rgba(5,22,47,.62);
}

.fh4-benefits-grid article>i{
font-size:30px;
color:#36bfff;
}

.fh4-benefits-grid strong{
display:block;
margin-bottom:6px;
color:#fff;
font-size:16px;
text-transform:uppercase;
}

.fh4-benefits-grid p{
margin:0;
color:#8da3bf;
font-size:12px;
line-height:1.5;
}

.fh4-desktop-final{
margin-top:16px;
display:flex;
align-items:center;
justify-content:space-between;
gap:24px;
padding:22px 28px;
border:1px solid rgba(75,173,255,.18);
border-radius:16px;
background:
linear-gradient(90deg,rgba(12,44,94,.88),rgba(4,22,48,.78));
}

.fh4-desktop-final>div{
display:grid;
gap:4px;
}

.fh4-desktop-final small{
color:#55d4ff;
font-size:10px;
font-weight:850;
letter-spacing:.06em;
text-transform:uppercase;
}

.fh4-desktop-final strong{
color:#fff;
font-size:22px;
}

}

@media (min-width:1200px){

.fh4-product-browser{
width:830px;
}

.fh4-product-stage{
min-height:620px;
}

}

/* =========================================================
   V4-D2 - DESKTOP ONE SCREEN
   SOMENTE DESKTOP GRANDE
   MOBILE APROVADO PERMANECE INTOCADO
   ========================================================= */

@media (min-width:1200px){

/* ---------------------------------------------------------
   HEADER
   --------------------------------------------------------- */

.fh4-header-inner{
height:68px;
}

.fh4-brand img{
width:38px;
height:38px;
}

/* ---------------------------------------------------------
   HERO
   --------------------------------------------------------- */

.fh4-hero{
min-height:0;
padding:38px 0 34px;
}

.fh4-hero-grid{
min-height:360px;
grid-template-columns:minmax(0,1fr) minmax(500px,.95fr);
gap:58px;
align-items:center;
}

.fh4-hero-copy{
align-self:center;
}

.fh4-eyebrow{
margin-bottom:16px;
}

.fh4-hero h1{
max-width:610px;
margin-bottom:16px;
font-size:clamp(48px,3.6vw,62px);
line-height:.97;
}

.fh4-hero-copy>p{
max-width:560px;
margin-bottom:20px;
font-size:16px;
line-height:1.55;
}

.fh4-hero-actions{
margin-top:0;
}

.fh4-hero-actions .fh4-btn{
min-height:48px;
padding:12px 24px;
}

.fh4-network{
width:510px;
height:350px;
margin:0 auto;
}

.fh4-network-core{
width:130px;
height:130px;
}

.fh4-network-core img{
width:82px;
height:82px;
}

.fh4-network-node{
min-height:58px;
padding:10px 13px;
}

/* ---------------------------------------------------------
   SHOWCASE
   --------------------------------------------------------- */

.fh4-desktop-showcase{
padding:34px 0 24px;
}

.fh4-desktop-showcase>.fh4-container{
display:grid;
grid-template-columns:270px minmax(0,1fr);
column-gap:34px;
align-items:start;
}

.fh4-desktop-showcase-head{
width:auto;
margin:14px 0 0;
}

.fh4-desktop-showcase-head>span{
margin-bottom:8px;
font-size:10px;
}

.fh4-desktop-showcase-head h2{
font-size:30px;
line-height:1.06;
}

.fh4-desktop-showcase-head p{
margin-top:13px;
font-size:13px;
line-height:1.55;
}

.fh4-product-stage{
min-height:385px;
}

.fh4-product-browser{
width:min(760px,78%);
margin:0 auto;
border-radius:18px;
}

.fh4-product-browser-top{
height:28px;
}

.fh4-product-layout{
grid-template-columns:150px minmax(0,1fr);
min-height:330px;
}

.fh4-product-sidebar{
padding:13px 9px;
}

.fh4-product-sidebar-brand{
margin-bottom:11px;
font-size:11px;
}

.fh4-product-sidebar nav{
gap:2px;
}

.fh4-product-sidebar nav span{
gap:7px;
padding:6px 8px;
font-size:9px;
}

.fh4-product-sidebar nav i{
font-size:11px;
}

.fh4-product-content{
padding:15px;
}

.fh4-product-topbar{
margin-bottom:11px;
}

.fh4-product-topbar strong{
font-size:17px;
}

.fh4-product-metrics{
gap:7px;
}

.fh4-product-metrics article{
padding:9px 10px;
border-radius:9px;
}

.fh4-product-metrics strong{
margin:3px 0;
font-size:18px;
}

.fh4-product-panels{
gap:8px;
margin-top:8px;
}

.fh4-product-panel{
min-height:138px;
padding:11px;
border-radius:10px;
}

.fh4-product-bars{
height:92px;
gap:6px;
padding-top:14px;
}

/* ---------------------------------------------------------
   CARDS FLUTUANTES
   mais próximos da dashboard
   --------------------------------------------------------- */

.fh4-floating-card{
width:178px;
padding:10px 11px;
gap:9px;
border-radius:12px;
}

.fh4-floating-card>i,
.fh4-mini-sigma{
width:30px;
height:30px;
flex-basis:30px;
font-size:17px;
}

.fh4-floating-card img{
width:30px;
height:30px;
flex-basis:30px;
}

.fh4-floating-card strong{
font-size:10px;
}

.fh4-floating-card small{
font-size:7px;
}

.fh4-floating-whatsapp{
left:0;
top:155px;
}

.fh4-floating-sigma{
left:52px;
bottom:4px;
}

.fh4-floating-xcloud{
right:0;
top:112px;
}

.fh4-floating-billing{
right:18px;
bottom:6px;
}

/* ---------------------------------------------------------
   BENEFÍCIOS + CTA
   --------------------------------------------------------- */

.fh4-desktop-benefits{
padding:20px 0 28px;
}

.fh4-benefits-grid{
gap:10px;
}

.fh4-benefits-grid article{
min-height:82px;
gap:12px;
padding:14px 17px;
border-radius:12px;
}

.fh4-benefits-grid article>i{
font-size:25px;
}

.fh4-benefits-grid strong{
margin-bottom:4px;
font-size:14px;
}

.fh4-benefits-grid p{
font-size:11px;
line-height:1.42;
}

.fh4-desktop-final{
margin-top:10px;
padding:14px 20px;
border-radius:12px;
}

.fh4-desktop-final small{
font-size:8px;
}

.fh4-desktop-final strong{
font-size:18px;
}

.fh4-desktop-final .fh4-btn{
min-height:42px;
padding:10px 21px;
}

/* ---------------------------------------------------------
   CONTINUIDADE VISUAL
   --------------------------------------------------------- */

.fh4-desktop-showcase,
.fh4-desktop-benefits{
border-color:rgba(74,171,255,.11);
}

}


/* =========================================================
   V4-D3 - DESKTOP WIDE
   MELHOR APROVEITAMENTO HORIZONTAL
   SOMENTE DESKTOP
   MOBILE APROVADO INTOCADO
   ========================================================= */

@media (min-width:1200px){

    /*
     * Container principal:
     * ocupa de verdade monitores desktop sem encostar nas bordas.
     */
    .fh4-container{
        width:min(92vw, 1560px) !important;
        max-width:1560px !important;
        margin-left:auto !important;
        margin-right:auto !important;
    }

    /*
     * HERO
     * Aumenta área útil das duas metades sem aumentar
     * desnecessariamente a altura.
     */
    .fh4-hero-inner{
        width:min(92vw, 1560px) !important;
        max-width:1560px !important;
        grid-template-columns:minmax(500px, .92fr) minmax(570px, 1.08fr) !important;
        column-gap:72px !important;
    }

    .fh4-hero-copy{
        max-width:650px !important;
    }

    .fh4-network{
        width:min(100%, 650px) !important;
        max-width:650px !important;
        margin-left:auto !important;
        margin-right:auto !important;
    }

    /*
     * BLOCO DA PLATAFORMA
     * O print mostra que este é o ponto que mais precisa
     * aproveitar a largura disponível.
     */
    .fh4-desktop-showcase{
        width:min(92vw, 1560px) !important;
        max-width:1560px !important;
        margin-left:auto !important;
        margin-right:auto !important;
    }

    .fh4-product-browser{
        width:100% !important;
        max-width:none !important;
        grid-template-columns:minmax(300px, .52fr) minmax(720px, 1.48fr) !important;
        gap:54px !important;
        align-items:center !important;
    }

    /*
     * Dashboard maior e protagonista.
     */
    .fh4-browser-stage{
        width:100% !important;
        max-width:none !important;
    }

    /*
     * Benefícios e CTA usando a mesma largura visual
     * do restante da composição.
     */
    .fh4-desktop-benefits{
        width:min(92vw, 1560px) !important;
        max-width:1560px !important;
        margin-left:auto !important;
        margin-right:auto !important;
    }

    .fh4-benefit-grid{
        width:100% !important;
        max-width:none !important;
        grid-template-columns:repeat(3, minmax(0,1fr)) !important;
        gap:18px !important;
    }

    .fh4-final-cta{
        width:100% !important;
        max-width:none !important;
    }
}

/*
 * Full HD e monitores largos:
 * mantém uma pequena margem de respiro, sem desperdiçar tela.
 */
@media (min-width:1600px){

    .fh4-container,
    .fh4-hero-inner,
    .fh4-desktop-showcase,
    .fh4-desktop-benefits{
        width:min(90vw, 1580px) !important;
        max-width:1580px !important;
    }

    .fh4-hero-inner{
        column-gap:88px !important;
    }
}


/* V4-D3B - DESKTOP WIDE REAL */
@media (min-width:1200px){

.fh4-container{
width:92vw !important;
max-width:1580px !important;
}

/* HERO */
.fh4-hero-grid{
width:100% !important;
max-width:none !important;
grid-template-columns:minmax(520px,.9fr) minmax(610px,1.1fr) !important;
gap:68px !important;
}

.fh4-hero-copy{
max-width:680px !important;
}

.fh4-network{
width:620px !important;
max-width:100% !important;
}

/* SHOWCASE */
.fh4-desktop-showcase>.fh4-container{
width:92vw !important;
max-width:1580px !important;
grid-template-columns:310px minmax(0,1fr) !important;
column-gap:42px !important;
}

.fh4-desktop-showcase-head{
width:100% !important;
max-width:310px !important;
}

.fh4-product-stage{
width:100% !important;
}

.fh4-product-browser{
width:88% !important;
max-width:1080px !important;
}

.fh4-product-layout{
grid-template-columns:175px minmax(0,1fr) !important;
}

/* Cards laterais mais próximos */
.fh4-floating-whatsapp{
left:0 !important;
}

.fh4-floating-sigma{
left:5% !important;
}

.fh4-floating-xcloud{
right:0 !important;
}

.fh4-floating-billing{
right:2% !important;
}

/* BENEFÍCIOS */
.fh4-desktop-benefits>.fh4-container{
width:92vw !important;
max-width:1580px !important;
}

.fh4-benefits-grid{
width:100% !important;
grid-template-columns:repeat(3,minmax(0,1fr)) !important;
gap:16px !important;
}

.fh4-desktop-final{
width:100% !important;
}

}

@media (min-width:1600px){

.fh4-container,
.fh4-desktop-showcase>.fh4-container,
.fh4-desktop-benefits>.fh4-container{
width:90vw !important;
max-width:1620px !important;
}

.fh4-product-browser{
width:90% !important;
max-width:1120px !important;
}

}

/* =========================================================
   V4-D4 - REFINAMENTO DESKTOP
   AJUSTE FINO DE DENSIDADE E PROPORCAO
   SOMENTE DESKTOP
   ========================================================= */

@media (min-width:1200px){

/* HERO MAIS COMPACTO SEM MINIATURIZAR */
.fh4-hero{
padding-top:28px !important;
padding-bottom:24px !important;
}

.fh4-hero-grid{
min-height:325px !important;
gap:62px !important;
}

.fh4-hero h1{
font-size:clamp(50px,3.75vw,64px) !important;
}

.fh4-network{
width:600px !important;
height:365px !important;
}

/* SHOWCASE SOBE E FICA MAIS EQUILIBRADO */
.fh4-desktop-showcase{
padding-top:24px !important;
padding-bottom:18px !important;
}

.fh4-desktop-showcase>.fh4-container{
grid-template-columns:350px minmax(0,1fr) !important;
column-gap:28px !important;
align-items:center !important;
}

.fh4-desktop-showcase-head{
max-width:350px !important;
margin-top:0 !important;
}

.fh4-desktop-showcase-head h2{
font-size:32px !important;
line-height:1.03 !important;
}

.fh4-desktop-showcase-head p{
font-size:13px !important;
line-height:1.5 !important;
}

/* DASHBOARD MAIS PRESENTE */
.fh4-product-stage{
min-height:365px !important;
}

.fh4-product-browser{
width:92% !important;
max-width:1120px !important;
}

/* CARDS FLUTUANTES MAIS COLADOS AO PRODUTO */
.fh4-floating-whatsapp{
left:2% !important;
top:145px !important;
}

.fh4-floating-sigma{
left:8% !important;
bottom:2px !important;
}

.fh4-floating-xcloud{
right:1% !important;
top:105px !important;
}

.fh4-floating-billing{
right:3% !important;
bottom:2px !important;
}

/* BASE MAIS PROXIMA DO SHOWCASE */
.fh4-desktop-benefits{
padding-top:14px !important;
padding-bottom:24px !important;
}

.fh4-benefits-grid article{
min-height:76px !important;
}

.fh4-desktop-final{
margin-top:8px !important;
}

}

@media (min-width:1600px){

.fh4-desktop-showcase>.fh4-container{
grid-template-columns:365px minmax(0,1fr) !important;
column-gap:32px !important;
}

.fh4-product-browser{
width:94% !important;
max-width:1160px !important;
}

}

/* =========================================================
   V4-D5 - REFINAMENTO TIPOGRAFICO
   REMOVE FAIXA FINAL + MELHORA LEGIBILIDADE
   SOMENTE DESKTOP
   ========================================================= */

@media (min-width:1200px){

/* ---------------------------------------------------------
   REMOVE SOMENTE A ÚLTIMA FAIXA
   --------------------------------------------------------- */

.fh4-desktop-final{
display:none !important;
}


/* ---------------------------------------------------------
   HEADER
   estava visualmente pequeno para Full HD
   --------------------------------------------------------- */

.fh4-brand strong{
font-size:16px !important;
}

.fh4-brand small{
font-size:9px !important;
}

.fh4-nav a{
font-size:13px !important;
}

.fh4-actions .fh4-btn{
font-size:13px !important;
font-weight:800 !important;
}


/* ---------------------------------------------------------
   HERO
   mantém título forte e melhora textos auxiliares
   --------------------------------------------------------- */

.fh4-eyebrow{
font-size:11px !important;
}

.fh4-hero-copy>p{
font-size:17px !important;
line-height:1.55 !important;
color:#a9bdd5 !important;
}

.fh4-hero-actions .fh4-btn{
font-size:14px !important;
font-weight:850 !important;
}


/* ---------------------------------------------------------
   MAPA FRA HUB
   nomes estavam pequenos demais
   --------------------------------------------------------- */

.fh4-network-node strong{
font-size:12px !important;
}

.fh4-network-node small{
font-size:9px !important;
}

.fh4-network-core strong{
font-size:15px !important;
}

.fh4-network-core small{
font-size:9px !important;
}


/* ---------------------------------------------------------
   TEXTO DA SEÇÃO "TUDO EM UM SÓ LUGAR"
   --------------------------------------------------------- */

.fh4-desktop-showcase-head>span{
font-size:11px !important;
}

.fh4-desktop-showcase-head h2{
font-size:35px !important;
line-height:1.05 !important;
}

.fh4-desktop-showcase-head p{
font-size:15px !important;
line-height:1.58 !important;
color:#9fb4cd !important;
}


/* ---------------------------------------------------------
   DASHBOARD
   aumenta textos sem aumentar o componente
   --------------------------------------------------------- */

.fh4-product-sidebar-brand{
font-size:13px !important;
}

.fh4-product-sidebar nav span{
font-size:11px !important;
}

.fh4-product-sidebar nav i{
font-size:13px !important;
}

.fh4-product-topbar small{
font-size:10px !important;
}

.fh4-product-topbar strong{
font-size:20px !important;
}

.fh4-product-status{
font-size:10px !important;
}

.fh4-product-metrics small{
font-size:10px !important;
}

.fh4-product-metrics strong{
font-size:21px !important;
}

.fh4-product-metrics span{
font-size:9px !important;
}

.fh4-product-panel-head strong{
font-size:13px !important;
}

.fh4-product-panel-head span{
font-size:9px !important;
}

.fh4-product-panel-side li span,
.fh4-product-panel-side li strong{
font-size:10px !important;
}


/* ---------------------------------------------------------
   CARDS FLUTUANTES
   --------------------------------------------------------- */

.fh4-floating-card strong{
font-size:12px !important;
}

.fh4-floating-card small{
font-size:9px !important;
line-height:1.35 !important;
}


/* ---------------------------------------------------------
   AUTOMATIZE / CENTRALIZE / CRESÇA
   --------------------------------------------------------- */

.fh4-benefits-grid article{
padding:17px 20px !important;
}

.fh4-benefits-grid article>i{
font-size:29px !important;
}

.fh4-benefits-grid strong{
font-size:16px !important;
letter-spacing:.01em !important;
}

.fh4-benefits-grid p{
font-size:13px !important;
line-height:1.45 !important;
color:#9eb2ca !important;
}


/* ---------------------------------------------------------
   FECHAMENTO LIMPO DA PÁGINA
   --------------------------------------------------------- */

.fh4-desktop-benefits{
padding-bottom:30px !important;
}

}


/* =========================================================
   V4-D6 - MAPA MENTAL DESKTOP
   AUMENTA PRESENCA SEM ALTERAR HERO / MOBILE
   ========================================================= */

@media (min-width:1200px){

/* área geral do ecossistema */
.fh4-hero-visual{
display:flex !important;
align-items:center !important;
justify-content:center !important;
overflow:visible !important;
}

/* mapa maior */
.fh4-network{
width:690px !important;
height:405px !important;
max-width:100% !important;
margin:0 auto !important;
overflow:visible !important;
}

/* núcleo FRA HUB mais protagonista */
.fh4-network-core{
width:150px !important;
height:150px !important;
border-radius:30px !important;
}

.fh4-network-core img{
width:92px !important;
height:92px !important;
}

.fh4-network-core strong{
font-size:16px !important;
}

.fh4-network-core small{
font-size:9.5px !important;
}

/* cards periféricos */
.fh4-network-node{
min-width:148px !important;
min-height:62px !important;
padding:11px 15px !important;
gap:10px !important;
border-radius:14px !important;
overflow:visible !important;
}

/* garante que textos não fiquem cortados */
.fh4-network-node strong{
font-size:13px !important;
line-height:1.15 !important;
white-space:nowrap !important;
overflow:visible !important;
}

.fh4-network-node small{
font-size:9px !important;
line-height:1.25 !important;
}

/* ícones um pouco maiores */
.fh4-network-node .fh4-node-icon{
width:38px !important;
height:38px !important;
flex:0 0 38px !important;
}

.fh4-network-node .fh4-node-icon i{
font-size:18px !important;
}

/* Sigma */
.fh4-node-sigma .fh4-node-logo,
.fh4-node-sigma img{
max-width:38px !important;
max-height:38px !important;
}

/* XCloud */
.fh4-node-xcloud .fh4-node-icon,
.fh4-node-xcloud .fh4-xcloud-mark{
width:38px !important;
height:38px !important;
flex:0 0 38px !important;
}

.fh4-node-xcloud img{
max-width:30px !important;
max-height:30px !important;
object-fit:contain !important;
}

/* WhatsApp */
.fh4-node-whatsapp .fh4-node-icon{
width:38px !important;
height:38px !important;
}

/* brilho do núcleo discretamente mais presente */
.fh4-network-core{
box-shadow:
0 0 0 1px rgba(68,184,255,.28),
0 0 34px rgba(26,125,255,.18),
0 18px 46px rgba(0,0,0,.35) !important;
}

}


/* Full HD largo */
@media (min-width:1600px){

.fh4-network{
width:730px !important;
height:420px !important;
}

.fh4-network-node{
min-width:154px !important;
}

}

/* =========================================================
   V4-D7 - ACABAMENTO FINAL DESKTOP
   REFINAMENTO DE DENSIDADE, HIERARQUIA E PROPORCAO
   MOBILE APROVADO INTOCADO
   ========================================================= */

@media (min-width:1200px){

/* ---------------------------------------------------------
   1. HERO
   Mantém composição aprovada e melhora equilíbrio vertical
   --------------------------------------------------------- */

.fh4-hero{
padding-bottom:18px !important;
}

.fh4-hero-grid{
align-items:center !important;
}

/* mapa mental já está no tamanho correto;
   apenas melhora seu posicionamento visual */
.fh4-hero-visual{
transform:translateX(-1.5%) !important;
}


/* ---------------------------------------------------------
   2. TRANSIÇÃO HERO -> SHOWCASE
   Reduz vazio sem colar as duas áreas
   --------------------------------------------------------- */

.fh4-desktop-showcase{
margin-top:0 !important;
padding-top:18px !important;
}


/* ---------------------------------------------------------
   3. TEXTO DO BLOCO "PLATAFORMA COMPLETA"
   Recupera presença visual
   --------------------------------------------------------- */

.fh4-showcase-copy{
padding-top:22px !important;
}

.fh4-showcase-copy h2{
font-size:clamp(30px,2vw,38px) !important;
line-height:1.04 !important;
letter-spacing:-.035em !important;
max-width:330px !important;
}

.fh4-showcase-copy p{
font-size:15px !important;
line-height:1.55 !important;
max-width:350px !important;
}

.fh4-showcase-eyebrow{
font-size:11px !important;
letter-spacing:.10em !important;
}


/* ---------------------------------------------------------
   4. DASHBOARD
   Um pouco mais de presença sem aumentar a seção
   --------------------------------------------------------- */

.fh4-product-browser{
width:100% !important;
max-width:none !important;
}

.fh4-product-window{
transform:scale(1.025) !important;
transform-origin:center top !important;
}


/* ---------------------------------------------------------
   5. BADGES FLUTUANTES
   Mantém efeito premium mas evita invasão excessiva
   --------------------------------------------------------- */

.fh4-product-badge{
z-index:4 !important;
}

.fh4-product-badge-whatsapp{
transform:translateX(-10px) !important;
}

.fh4-product-badge-xcloud{
transform:translateX(12px) !important;
}

.fh4-product-badge-sigma{
transform:translate(4px,-2px) !important;
}

.fh4-product-badge-billing{
transform:translate(-4px,-2px) !important;
}


/* ---------------------------------------------------------
   6. BENEFÍCIOS
   Compactos, porém com leitura mais confortável
   --------------------------------------------------------- */

.fh4-desktop-benefits{
margin-top:16px !important;
}

.fh4-benefit-card{
padding-top:18px !important;
padding-bottom:18px !important;
}

.fh4-benefit-card strong{
font-size:16px !important;
}

.fh4-benefit-card p{
font-size:13px !important;
line-height:1.45 !important;
}


/* ---------------------------------------------------------
   7. ACABAMENTO DO FINAL
   Última faixa continua removida pelo D5
   --------------------------------------------------------- */

.fh4-desktop-final{
display:none !important;
}

}

