/* ===========================
STAR BUSINESS CSS OFICIAL V10
Layout industrial premium
Versão final corrigida
=========================== */


/* RESET */

*{
margin:0;
padding:0;
box-sizing:border-box;
}


/* BODY */

body{
font-family:'Montserrat', Arial, sans-serif;
font-weight:500;
color:#0b2c63;
background:#ffffff;
line-height:1.7;
letter-spacing:0.2px;
-webkit-font-smoothing:antialiased;
overflow-x:hidden;
}


/* LINKS */

a{
text-decoration:none;
}


/* HEADER */

header{

background:
linear-gradient(
95deg,
#FFFFFF 0%,
#0b2c63 46%
);

padding:20px 42px;

display:flex;
justify-content:space-between;
align-items:center;
flex-wrap:wrap;

position:sticky;
top:0;
z-index:999;

box-shadow:0 2px 18px rgba(0,0,0,0.06);

}


/* LOGO */

header img{
height:48px;
}


/* MENU */

header nav{
display:flex;
align-items:center;
flex-wrap:wrap;
}

header nav a{
color:white;
margin-left:28px;
font-weight:600;
letter-spacing:0.4px;
transition:.25s ease;
font-size:15px;
position:relative;
}

header nav a:hover{
color:#ffcc00;
}


/* HERO */

.hero{

background:url("../img/hero-caldeira-eletrica-industrial.jpg");

background-size:cover;
background-position:center center;
background-repeat:no-repeat;

height:520px;

padding:0 80px;

display:flex;
justify-content:flex-end;
align-items:center;

}


/* CONTEÚDO HERO */

.hero-content{

width:100%;
max-width:620px;

display:flex;
flex-direction:column;
align-items:flex-end;

text-align:right;

}


/* HERO TITLE */

.hero h1{

font-size:58px;
font-weight:800;
line-height:1.05;

margin-bottom:24px;

color:#ffffff;

text-shadow:0 3px 12px rgba(0,0,0,0.75);

}


/* HERO TEXT */

.hero p{

font-size:20px;
line-height:1.7;

margin-bottom:28px;

color:#ffffff;

text-shadow:0 3px 12px rgba(0,0,0,0.75);

}


/* BOTÃO HERO */

.hero .btn{
margin-top:0;
}


/* SECTION */

.section{
padding:60px 40px;
max-width:1280px;
margin:auto;
}


/* SECTION TITLES */

.section h1,
.section h2{
font-weight:800;
letter-spacing:-1px;
color:#0b2c63;
}

.section h1{
font-size:46px;
margin-bottom:28px;
}

.section h2{
font-size:36px;
margin-bottom:34px;
position:relative;
}


/* LINHA AMARELA */

.section h2::after{
content:"";
display:block;
width:70px;
height:5px;
background:#ffcc00;
border-radius:10px;
margin-top:12px;
}


/* TEXTOS */

.section p{
font-size:17px;
line-height:1.9;
margin-bottom:18px;
color:#23406f;
}


/* GRID */

.grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
gap:28px;
align-items:start;
}


/* LINK CARD */

.card-link,
.card-link:visited,
.card-link:hover,
.card-link:active,
.card-link:focus{
display:block;
color:#0b2c63;
}


/* CARD */

.card{

background:#ffffff;

padding:30px;

border-radius:18px;

box-shadow:
0 5px 18px rgba(0,0,0,0.05);

border-top:5px solid #ffcc00;

transition:
transform .30s ease,
box-shadow .30s ease;

position:relative;
overflow:hidden;

}


/* CARD HOVER */

.card:hover{

transform:translateY(-6px);

box-shadow:
0 16px 35px rgba(0,0,0,0.10);

}


/* IMAGEM CARD */

.card-img{
height:180px;
overflow:hidden;
border-radius:10px;
margin-bottom:18px;
background:#fff;
display:flex;
align-items:center;
justify-content:center;
}


/* IMG CARD */

.card-img img{
width:100%;
height:180px;
object-fit:contain;
transition:transform .35s ease;
}

.card:hover .card-img img{
transform:scale(1.03);
}


/* TITULO CARD */

.card h3{
margin-bottom:16px;
font-size:22px;
font-weight:800;
line-height:1.3;
letter-spacing:-0.3px;
}


/* TEXTO CARD */

.card p{
margin:0 0 12px;
font-weight:500;
line-height:1.8;
font-size:16px;
}

.card p:last-child{
margin-bottom:0;
}


/* BOTÃO */

.btn{

background:#0b2c63;
color:white;

padding:16px 34px;

border-radius:10px;

display:inline-block;

margin-top:22px;

font-weight:700;
font-size:15px;

letter-spacing:0.3px;

transition:.25s ease;

box-shadow:
0 6px 18px rgba(11,44,99,.18);

}


/* BOTÃO HOVER */

.btn:hover{
background:#ffcc00;
color:#0b2c63;
}


/* FORM */

form{
max-width:900px;
margin:auto;
}


/* LABEL */

label{
display:block;
margin-top:14px;
font-weight:600;
}


/* INPUTS */

input,
select,
textarea{

width:100%;

padding:12px;

margin-top:5px;

border-radius:8px;

border:1px solid #d7dce4;

font-size:15px;

transition:.2s;

background:#fff;

}


/* FOCUS */

input:focus,
select:focus,
textarea:focus{
border-color:#ffcc00;
outline:none;
}


/* FOOTER */

footer{

background:#0b2c63;

color:white;

text-align:center;

padding:28px 20px;

font-size:14px;

font-weight:500;

line-height:1.9;

margin-top:80px;

}


/* FOOTER TEXT */

footer p{
margin:4px 0;
}


/* FOOTER LINK */

footer a{
color:#ffcc00;
}

footer a:hover{
text-decoration:underline;
}


/* WHATSAPP FLOAT */

.whatsapp-float{

position:fixed;

bottom:22px;
right:22px;

width:58px;
height:58px;

background:#25D366;

border-radius:50%;

display:flex;
align-items:center;
justify-content:center;

box-shadow:
0 5px 18px rgba(0,0,0,0.28);

z-index:999;

transition:.3s;

animation:pulse 2s infinite;

}


/* SVG */

.whatsapp-float svg{
width:30px;
height:30px;
}


/* HOVER */

.whatsapp-float:hover{
transform:scale(1.08);
background:#1ebe5d;
}


/* ANIMAÇÃO */

@keyframes pulse{

0%{
box-shadow:0 0 0 0 rgba(37,211,102,.6);
}

70%{
box-shadow:0 0 0 12px rgba(37,211,102,0);
}

100%{
box-shadow:0 0 0 0 rgba(37,211,102,0);
}

}


/* ===========================
CARACTERÍSTICAS TÉCNICAS
=========================== */

.sb-caracteristicas{
padding:100px 40px;
background:#ffffff;
}

.sb-caracteristicas .container{
max-width:1280px;
margin:auto;
}

.sb-caracteristicas h2{
font-size:42px;
font-weight:800;
color:#0b2c63;
margin-bottom:30px;
letter-spacing:-1px;
position:relative;
}

.sb-caracteristicas h2::after{
content:"";
display:block;
width:90px;
height:5px;
background:#ffcc00;
border-radius:10px;
margin-top:14px;
}

.sb-caracteristicas .intro{
font-size:18px;
line-height:2;
color:#23406f;
max-width:1100px;
margin-bottom:80px;
font-weight:500;
}


/* FEATURE CARD */

.feature-card{

display:flex;
align-items:center;
justify-content:space-between;

gap:60px;

margin-bottom:120px;

}

.feature-card.reverse{
flex-direction:row-reverse;
}


/* FEATURE IMAGE */

.feature-image{

flex:0 0 52%;

display:flex;
justify-content:center;
align-items:center;

}

.feature-image img{

max-width:100%;

display:block;

border-radius:22px;

box-shadow:
0 15px 40px rgba(0,0,0,0.12);

background:#ffffff;

}


/* STEP CONTROL */

.step-control-img{

max-width:580px;

width:100%;

display:block;

margin:auto;

}


/* FEATURE CONTENT */

.feature-content{
flex:1;
}

.feature-content h3{

font-size:18px;

font-weight:900;

letter-spacing:2.5px;

text-transform:uppercase;

color:#0A3D62;

margin-bottom:18px;

position:relative;

display:inline-block;

}

.feature-content h3::after{

content:"";

position:absolute;

left:0;
bottom:-6px;

width:65px;
height:3px;

background:#FFD43B;

border-radius:10px;

}

.feature-content h4{

font-size:34px;

font-weight:800;

line-height:1.3;

letter-spacing:-0.5px;

color:#0b2c63;

margin-bottom:28px;

}

.feature-content p{

font-size:17px;

line-height:1.95;

color:#23406f;

margin-bottom:22px;

}


/* ===========================
OPCIONAIS
=========================== */

.opcionais-box{

margin-top:-20px;

padding:45px;

background:#ffffff;

border-radius:22px;

box-shadow:
0 10px 35px rgba(0,0,0,0.06);

border-top:5px solid #FFD43B;

}

.opcionais-box h3{

font-size:42px;

font-weight:900;

letter-spacing:1px;

color:#0A3D62;

margin-bottom:35px;

position:relative;

display:inline-block;

}

.opcionais-box h3::after{

content:"";

position:absolute;

left:0;
bottom:-8px;

width:70px;
height:4px;

background:#FFD43B;

border-radius:10px;

}

.opcionais-grid{

display:grid;

grid-template-columns:1fr 1fr;

gap:50px;

margin-top:20px;

}

.opcionais-grid ul{
list-style:none;
padding:0;
margin:0;
}

.opcionais-grid li{

position:relative;

padding-left:28px;

margin-bottom:18px;

font-size:28px;

line-height:1.35;

font-weight:600;

color:#0A3D62;

}

.opcionais-grid li::before{

content:"•";

position:absolute;

left:0;
top:0;

color:#FFD43B;

font-size:36px;

line-height:1;

}


/* RESPONSIVO */

@media(max-width:980px){

header{
flex-direction:column;
text-align:center;
padding:20px;
}

header nav{
margin-top:12px;
justify-content:center;
}

header nav a{
display:inline-block;
margin:8px 10px;
font-size:14px;
}

.hero{
padding:90px 25px;
justify-content:center;
text-align:center;
min-height:auto;
height:auto;
}

.hero-content{
max-width:100%;
text-align:center;
align-items:center;
margin:auto;
}

.hero h1{
font-size:34px;
line-height:1.15;
}

.hero p{
font-size:17px;
}

.section{
padding:45px 24px;
}

.section h1{
font-size:34px;
}

.section h2{
font-size:30px;
}

.grid{
grid-template-columns:1fr;
}

.card{
padding:24px;
}

.whatsapp-float{
width:54px;
height:54px;
}

/* FEATURE RESPONSIVO */

.feature-card,
.feature-card.reverse{

flex-direction:column;

gap:40px;

margin-bottom:90px;

}

.feature-image{
flex:1;
width:100%;
}

.step-control-img{
max-width:100%;
}

.feature-content h4{
font-size:28px;
}


/* OPCIONAIS RESPONSIVO */

.opcionais-grid{
grid-template-columns:1fr;
gap:10px;
}

.opcionais-box{
padding:30px;
}

.opcionais-box h3{
font-size:32px;
}

.opcionais-grid li{
font-size:22px;
}

}