:root{
	--blue:#0A66C2;
	--blue2:#084b91;
	--navy:#081d36;
	--ink:#14253d;
	--muted:#65758b;
	--orange:#ff8a3d;
	--pale:#f2f7fc;
	--line:#dce6f0;
	--white:#fff;
	--radius:22px;
	--shadow:0 18px 55px rgba(13,47,83,.10)
}
*{
	box-sizing:border-box
}
html{
	scroll-behavior:smooth
}
body{
	margin:0;
	font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
	color:var(--ink);
	line-height:1.65;
	background:#fff
}
a{
	color:inherit;
	text-decoration:none
}
img{
	max-width:100%;
	display:block
}
.wrap{
	width:min(1160px,calc(100% - 40px));
	margin:auto
}
.topline{
	background:var(--navy);
	color:#c8d7e9;
	font-size:12px;
	letter-spacing:.02em
}
.topline-inner{
	display:flex;
	justify-content:space-between;
	padding:8px 0;
	gap:16px
}
.site-header{
	position:sticky;
	top:0;
	z-index:50;
	background:rgba(255,255,255,.94);
	backdrop-filter:blur(14px);
	border-bottom:1px solid rgba(220,230,240,.8)
}
.nav-wrap{
	height:82px;
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:25px
}
.brand{
	display:flex;
	align-items:center;
	gap:10px;
	font-weight:850;
	letter-spacing:-.03em;
	color:var(--navy);
	line-height:1.15
}
.brand img{
	width:49px;
	height:49px;
	object-fit:contain
}
.brand small{
	display:block;
	font-size:10px;
	color:var(--blue);
	font-weight:750;
	letter-spacing:.12em;
	text-transform:uppercase;
	margin-top:5px
}
.nav-links{
	display:flex;
	align-items:center;
	gap:25px;
	font-size:13px;
	font-weight:700
}
.nav-links>a:not(.nav-cta){
	color:#44566d
}
.nav-links>a.active,.nav-links>a:hover{
	color:var(--blue)
}
.nav-cta,.btn{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	gap:10px;
	border-radius:999px;
	padding:13px 20px;
	background:var(--blue);
	color:#fff!important;
	font-weight:800;
	font-size:13px;
	box-shadow:0 8px 20px #0a66c22a;
	transition:.2s
}
.nav-cta:hover,.btn:hover{
	background:var(--blue2);
	transform:translateY(-2px)
}
.btn-light{
	background:#fff;
	color:var(--navy)!important;
	box-shadow:none
}
.btn-outline{
	background:transparent;
	color:var(--blue)!important;
	border:1px solid #b8d5f0;
	box-shadow:none
}
.menu-toggle{
	display:none;
	background:none;
	border:0;
	font-size:24px;
	color:var(--navy)
}
.eyebrow{
	display:inline-flex;
	align-items:center;
	gap:9px;
	color:var(--blue);
	font-size:11px;
	text-transform:uppercase;
	letter-spacing:.14em;
	font-weight:900
}
.eyebrow:before{
	content:"";
	height:2px;
	width:24px;
	background:var(--orange)
}
h1,h2,h3,h4,p{
	margin-top:0
}
h1{
	font-size:clamp(40px,5.4vw,68px);
	line-height:1.04;
	letter-spacing:-.055em;
	color:var(--navy);
	margin:18px 0 20px
}
h2{
	font-size:clamp(30px,3.5vw,45px);
	line-height:1.12;
	letter-spacing:-.04em;
	color:var(--navy);
	margin:12px 0 17px
}
h3{
	font-size:20px;
	line-height:1.25;
	letter-spacing:-.025em;
	color:var(--navy);
	margin-bottom:10px
}
p{
	color:var(--muted)
}
.lead{
	font-size:17px;
	max-width:650px;
	line-height:1.8
}
.hero{
	position:relative;
	overflow:hidden;
	background:radial-gradient(ellipse at 85% 20%,#d9ecff 0,transparent 34%),linear-gradient(135deg,#f6faff 0%,#fff 58%,#fff5ed 100%);
	padding:78px 0 70px
}
.hero-grid{
	display:grid;
	grid-template-columns:1.05fr .95fr;
	align-items:center;
	gap:55px
}
.hero-copy{
	position:relative;
	z-index:2
}
.hero h1 span{
	color:var(--orange)
}
.hero-actions{
	display:flex;
	gap:12px;
	flex-wrap:wrap;
	margin:28px 0
}
.trust-row{
	display:flex;
	gap:20px;
	flex-wrap:wrap;
	margin-top:25px;
	font-size:12px;
	font-weight:750;
	color:#52657c
}
.trust-row span:before{
	content:"✓";
	color:#16a078;
	font-weight:900;
	margin-right:7px
}
.hero-visual{
	position:relative;
	min-height:460px;
	display:flex;
	align-items:center;
	justify-content:center
}
.hero-visual>img{
	width:100%;
	max-height:470px;
	object-fit:contain;
	filter:drop-shadow(0 25px 35px #0a37651b)
}
.floating-card{
	position:absolute;
	background:#fff;
	border:1px solid #e5edf5;
	border-radius:16px;
	padding:14px 17px;
	box-shadow:var(--shadow);
	font-size:12px;
	color:var(--muted)
}
.floating-card strong{
	display:block;
	color:var(--navy);
	font-size:17px
}
.floating-card.one{
	left:-8px;
	bottom:45px
}
.floating-card.two{
	right:-8px;
	top:35px
}
.mini-bars{
	display:flex;
	align-items:end;
	gap:5px;
	height:28px;
	margin-top:6px
}
.mini-bars i{
	display:block;
	width:8px;
	border-radius:5px 5px 1px 1px;
	background:var(--blue)
}
.mini-bars i:nth-child(1){
	height:10px
}
.mini-bars i:nth-child(2){
	height:17px
}
.mini-bars i:nth-child(3){
	height:14px
}
.mini-bars i:nth-child(4){
	height:25px
}
.mini-bars i:nth-child(5){
	height:21px;
	background:var(--orange)
}
.section{
	padding:84px 0
}
.section.soft{
	background:var(--pale)
}
.section-head{
	max-width:720px;
	margin-bottom:38px
}
.section-head.center{
	text-align:center;
	margin-left:auto;
	margin-right:auto
}
.section-head.center .eyebrow{
	justify-content:center
}
.section-head p{
	font-size:15px;
	line-height:1.8
}
.grid-3{
	display:grid;
	grid-template-columns:repeat(3,1fr);
	gap:20px
}
.grid-2{
	display:grid;
	grid-template-columns:repeat(2,1fr);
	gap:24px
}
.service-card,.feature-card,.blog-card,.review-card,.plan-card{
	border:1px solid var(--line);
	border-radius:var(--radius);
	background:#fff;
	padding:27px;
	transition:.25s
}
.service-card:hover,.blog-card:hover{
	transform:translateY(-5px);
	box-shadow:var(--shadow);
	border-color:#b5d6f5
}
.service-icon{
	width:48px;
	height:48px;
	border-radius:15px;
	background:#e8f3ff;
	color:var(--blue);
	display:grid;
	place-items:center;
	font-size:23px;
	margin-bottom:22px
}
.service-card p{
	font-size:13px;
	line-height:1.8
}
.text-link{
	display:inline-flex;
	gap:8px;
	color:var(--blue);
	font-size:13px;
	font-weight:850;
	margin-top:8px
}
.text-link:hover{
	gap:13px
}
.split{
	display:grid;
	grid-template-columns:.95fr 1.05fr;
	gap:60px;
	align-items:center
}
.split-image{
	position:relative
}
.split-image img{
	width:100%;
	max-height:490px;
	object-fit:cover;
	border-radius:26px
}
.image-tag{
	position:absolute;
	bottom:20px;
	left:-15px;
	background:var(--navy);
	color:#fff;
	border-radius:15px;
	padding:16px 20px;
	font-size:12px;
	box-shadow:var(--shadow)
}
.image-tag strong{
	display:block;
	font-size:23px;
	color:#fff
}
.check-list{
	padding:0;
	margin:24px 0;
	list-style:none;
	display:grid;
	gap:13px
}
.check-list li{
	display:flex;
	gap:12px;
	color:#40536b;
	font-size:14px
}
.check-list li:before{
	content:"✓";
	flex:0 0 23px;
	height:23px;
	border-radius:50%;
	display:grid;
	place-items:center;
	background:#e4f6ef;
	color:#15966c;
	font-weight:900
}
.stats{
	background:var(--navy);
	color:#fff;
	padding:34px 0
}
.stats-grid{
	display:grid;
	grid-template-columns:repeat(4,1fr);
	gap:20px
}
.stat{
	padding:10px 18px;
	border-right:1px solid #ffffff25
}
.stat:last-child{
	border:0
}
.stat strong{
	display:block;
	font-size:31px;
	letter-spacing:-.04em
}
.stat span{
	color:#b8c9dc;
	font-size:12px
}
.process-grid{
	display:grid;
	grid-template-columns:repeat(4,1fr);
	gap:18px
}
.process-step{
	padding:25px;
	border-radius:18px;
	background:#fff;
	border:1px solid var(--line)
}
.step-no{
	font-size:12px;
	font-weight:900;
	color:var(--orange);
	letter-spacing:.1em;
	margin-bottom:20px
}
.process-step p{
	font-size:13px
}
.review-card .stars{
	color:#f5a623;
	letter-spacing:3px;
	margin-bottom:12px
}
.review-card p{
	font-size:14px
}
.review-card small{
	font-size:12px;
	color:var(--muted)
}
.review-note{
	font-size:11px;
	color:#8b99aa;
	margin-top:15px
}
.pricing-grid{
	display:grid;
	grid-template-columns:repeat(3,1fr);
	gap:20px;
	align-items:stretch
}
.plan-card{
	padding:30px;
	position:relative
}
.plan-card.featured{
	border:2px solid var(--blue);
	box-shadow:var(--shadow)
}
.popular{
	position:absolute;
	top:-13px;
	right:22px;
	background:var(--orange);
	color:#fff;
	padding:5px 12px;
	border-radius:99px;
	font-size:10px;
	font-weight:900;
	text-transform:uppercase;
	letter-spacing:.08em
}
.plan-card .plan-label{
	font-size:11px;
	color:var(--blue);
	text-transform:uppercase;
	letter-spacing:.12em;
	font-weight:900
}
.plan-card h3{
	font-size:25px;
	margin:10px 0
}
.plan-card p{
	font-size:13px
}
.plan-card ul{
	padding:0;
	list-style:none;
	display:grid;
	gap:10px;
	margin:22px 0 28px
}
.plan-card li{
	font-size:13px;
	color:#52657c
}
.plan-card li:before{
	content:"✓";
	color:#14976d;
	font-weight:900;
	margin-right:9px
}
.blog-card{
	padding:0;
	overflow:hidden
}
.blog-card img{
	width:100%;
	height:205px;
	object-fit:cover;
	background:#e8f1fa
}
.blog-content{
	padding:23px
}
.blog-meta{
	font-size:11px;
	color:var(--blue);
	font-weight:850;
	text-transform:uppercase;
	letter-spacing:.07em
}
.blog-content p{
	font-size:13px
}
.cta-band{
	padding:54px 0;
	background:linear-gradient(120deg,var(--blue2),var(--blue));
	color:#fff;
	position:relative;
	overflow:hidden
}
.cta-inner{
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:30px
}
.cta-band h2{
	color:#fff;
	margin:8px 0;
	font-size:clamp(28px,3.5vw,40px)
}
.cta-band p{
	color:#d9eaff;
	margin:0
}
.cta-band .eyebrow{
	color:#c9e4ff
}
.cta-band .eyebrow:before{
	background:var(--orange)
}
.page-hero{
	padding:65px 0 55px;
	background:radial-gradient(ellipse at 90% 10%,#dceeff 0,transparent 35%),linear-gradient(135deg,#f5faff,#fff)
}
.page-hero h1{
	font-size:clamp(38px,5vw,57px);
	max-width:850px
}
.breadcrumbs{
	font-size:12px;
	color:#74869b;
	margin-bottom:25px
}
.breadcrumbs a{
	color:var(--blue)
}
.page-hero .lead{
	max-width:760px
}
.service-detail{
	display:grid;
	grid-template-columns:minmax(0,1fr) 300px;
	gap:55px;
	align-items:start
}
.article-body h2{
	font-size:30px;
	margin-top:35px
}
.article-body p,.article-body li{
	font-size:15px;
	line-height:1.9
}
.article-body ul{
	padding-left:22px;
	color:var(--muted)
}
.sidebar{
	position:sticky;
	top:115px;
	border:1px solid var(--line);
	border-radius:20px;
	padding:24px;
	background:#f8fbff
}
.sidebar a{
	display:block;
	padding:10px 0;
	border-bottom:1px solid var(--line);
	font-size:13px;
	color:#43576e
}
.sidebar a:last-child{
	border:0
}
.sidebar h3{
	font-size:18px
}
.callout{
	background:#eaf4ff;
	border-left:4px solid var(--blue);
	border-radius:0 14px 14px 0;
	padding:22px;
	margin:25px 0
}
.callout p{
	margin:0
}
.faq-list{
	max-width:850px;
	margin:auto;
	display:grid;
	gap:12px
}
.faq-item{
	border:1px solid var(--line);
	border-radius:15px;
	padding:20px 22px;
	background:#fff
}
.faq-item summary{
	font-weight:800;
	color:var(--navy);
	cursor:pointer
}
.faq-item p{
	margin:14px 0 0;
	font-size:14px
}
.contact-grid{
	display:grid;
	grid-template-columns:.8fr 1.2fr;
	gap:30px
}
.contact-panel{
	background:var(--navy);
	color:#fff;
	padding:32px;
	border-radius:24px
}
.contact-panel h2{
	color:#fff;
	font-size:31px
}
.contact-panel p{
	color:#c2d0df
}
.contact-item{
	padding:15px 0;
	border-bottom:1px solid #ffffff24
}
.contact-item strong{
	display:block;
	font-size:12px;
	color:#9ccfff;
	text-transform:uppercase;
	letter-spacing:.1em
}
.contact-item a,.contact-item span{
	font-size:14px
}
.contact-form{
	border:1px solid var(--line);
	border-radius:24px;
	padding:32px;
	background:#fff
}
.form-grid{
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:17px
}
.field{
	display:grid;
	gap:7px
}
.field.full{
	grid-column:1/-1
}
.field label{
	font-size:12px;
	font-weight:800;
	color:#465a70
}
.field input,.field textarea,.field select{
	width:100%;
	border:1px solid #d5e1ec;
	border-radius:11px;
	padding:13px 14px;
	font:inherit;
	font-size:13px;
	outline:none;
	background:#fbfdff
}
.field input:focus,.field textarea:focus{
	border-color:var(--blue);
	box-shadow:0 0 0 3px #0a66c215
}
.field textarea{
	min-height:130px;
	resize:vertical
}
.form-note{
	font-size:11px;
	margin-top:10px
}
.footer{
	background:#07172a;
	color:#fff;
	padding:60px 0 0
}
.footer-grid{
	display:grid;
	grid-template-columns:1.4fr .7fr 1fr 1.1fr;
	gap:35px;
	padding-bottom:42px
}
.brand-light{
	color:#fff
}
.brand-light small{
	color:#9bcfff
}
.footer p{
	color:#9fb0c4;
	font-size:13px;
	max-width:300px;
	margin-top:20px
}
.footer h4{
	font-size:13px;
	margin:7px 0 18px
}
.footer-grid>div:not(:first-child){
	display:flex;
	flex-direction:column;
	align-items:flex-start;
	gap:11px
}
.footer-grid a:not(.brand){
	font-size:12px;
	color:#aebdd0
}
.footer-grid a:hover{
	color:#fff
}
.footer-grid span{
	font-size:12px;
	color:#aebdd0
}
.footer-whatsapp{
	color:#a5e5c8!important
}
.footer-bottom{
	display:flex;
	justify-content:space-between;
	gap:20px;
	border-top:1px solid #ffffff1b;
	padding:20px 0;
	font-size:10px;
	color:#7f91a8
}
.article-hero-image{
	width:100%;
	max-height:430px;
	object-fit:cover;
	border-radius:24px;
	margin:28px 0
}
.article-layout{
	max-width:850px;
	margin:auto
}
.article-layout .article-body h2{
	font-size:27px
}
.empty-state{
	padding:35px;
	border:1px dashed #b9cfe3;
	border-radius:18px;
	color:var(--muted)
}
@media(max-width:900px){
	.nav-links{
		gap:14px
}
	.hero-grid,.split,.contact-grid{
		grid-template-columns:1fr
}
	.hero{
		padding-top:55px
}
	.hero-visual{
		min-height:340px
}
	.hero-visual>img{
		max-height:350px
}
	.grid-3,.pricing-grid{
		grid-template-columns:repeat(2,1fr)
}
	.service-detail{
		grid-template-columns:1fr
}
	.sidebar{
		position:static
}
	.footer-grid{
		grid-template-columns:repeat(2,1fr)
}
	.process-grid{
		grid-template-columns:repeat(2,1fr)
}
}
@media(max-width:680px){
	.wrap{
		width:min(100% - 30px,1160px)
}
	.topline-inner{
		justify-content:center
}
	.topline-inner span:last-child{
		display:none
}
	.nav-wrap{
		height:72px
}
	.brand img{
		width:42px;
		height:42px
}
	.brand{
		font-size:13px
}
	.menu-toggle{
		display:block
}
	.nav-links{
		display:none;
		position:absolute;
		top:72px;
		left:0;
		right:0;
		background:#fff;
		padding:18px 22px 25px;
		box-shadow:var(--shadow);
		align-items:stretch;
		flex-direction:column;
		gap:16px
}
	.nav-links.open{
		display:flex
}
	.nav-cta{
		align-self:flex-start
}
	.hero{
		padding:45px 0 50px
}
	.hero-grid{
		gap:10px
}
	.hero-visual{
		min-height:260px
}
	.floating-card{
		padding:10px 12px
}
	.floating-card.one{
		left:0;
		bottom:10px
}
	.floating-card.two{
		right:0;
		top:10px
}
	h1{
		font-size:42px
}
	.lead{
		font-size:15px
}
	.section{
		padding:60px 0
}
	.grid-3,.grid-2,.pricing-grid,.process-grid,.stats-grid{
		grid-template-columns:1fr
}
	.stats-grid{
		gap:4px
}
	.stat{
		border-right:0;
		border-bottom:1px solid #ffffff25;
		padding:13px 0
}
	.stat:last-child{
		border:0
}
	.cta-inner{
		align-items:flex-start;
		flex-direction:column
}
	.footer-grid{
		grid-template-columns:1fr;
		gap:28px
}
	.footer-bottom{
		flex-direction:column;
		gap:6px
}
	.form-grid{
		grid-template-columns:1fr
}
	.field.full{
		grid-column:auto
}
	.contact-form,.contact-panel{
		padding:24px
}
	.page-hero{
		padding:45px 0
}
	.image-tag{
		left:8px;
		bottom:8px
}
	.split{
		gap:30px
}
}
