:root{
--ink:#071624;
--ink-2:#102235;
--muted:#5d6f82;
--line:#dbe5ee;
--surface:#ffffff;
--soft:#f3f7fb;
--gold:#c9a24a;
--gold-2:#f2d47d;
--green:#14b86a;
--red:#bf2626;
--red-2:#971d1d;
--blue:#176b87;
--aqua:#48b7b0;
--shadow:0 24px 70px rgba(7,22,36,.12);
--shadow-soft:0 14px 42px rgba(7,22,36,.08);
--radius:8px;
}
*{
box-sizing:border-box;
margin:0;
padding:0;
}
html{
scroll-behavior:smooth;
}
body{
font-family:'Inter',Arial,sans-serif;
background:var(--soft);
color:var(--ink);
line-height:1.5;
overflow-x:hidden;
}
body:before{
content:"";
position:fixed;
inset:0;
z-index:-2;
background:
linear-gradient(120deg,rgba(255,255,255,.95),rgba(238,247,250,.9)),
url("logo.png");
background-size:auto,360px;
background-repeat:no-repeat;
background-position:center top,calc(100% + 80px) 160px;
opacity:1;
}
a{
color:inherit;
text-decoration:none;
}
button,
input,
select,
textarea{
font:inherit;
}
img{
display:block;
max-width:100%;
}
.site-shell{
min-height:100vh;
}
.topbar{
display:flex;
align-items:center;
justify-content:center;
gap:22px;
padding:7px 18px;
background:var(--ink);
color:#fff;
font-size:12px;
font-weight:800;
letter-spacing:.01em;
}
.topbar span{
display:inline-flex;
align-items:center;
gap:8px;
white-space:nowrap;
}
.topbar span:before{
content:"";
width:7px;
height:7px;
border-radius:50%;
background:var(--gold-2);
}
.main-header{
position:sticky;
top:0;
z-index:100;
display:grid;
grid-template-columns:auto 1fr auto;
align-items:center;
gap:24px;
padding:9px clamp(20px,6vw,86px);
background:rgba(255,255,255,.86);
backdrop-filter:blur(20px);
border-bottom:1px solid rgba(219,229,238,.75);
}
.brand{
display:inline-flex;
align-items:center;
}
.brand img{
width:132px;
height:auto;
}
.nav-links{
display:flex;
align-items:center;
justify-content:center;
gap:26px;
font-size:13px;
font-weight:800;
color:var(--ink-2);
}
.nav-links a{
position:relative;
padding:8px 0;
}
.nav-links a:after{
content:"";
position:absolute;
left:0;
right:0;
bottom:0;
height:2px;
background:var(--gold);
transform:scaleX(0);
transform-origin:left;
transition:transform .25s ease;
}
.nav-links a:hover:after{
transform:scaleX(1);
}
.header-cta,
.primary-btn,
.secondary-btn,
.mobile-sticky-cta{
display:inline-flex;
align-items:center;
justify-content:center;
min-height:48px;
padding:0 18px;
border-radius:var(--radius);
font-weight:900;
border:1px solid transparent;
transition:transform .24s ease,box-shadow .24s ease,background .24s ease;
}
.header-cta,
.primary-btn,
.mobile-sticky-cta{
background:linear-gradient(180deg,var(--red),var(--red-2));
color:#fff;
box-shadow:0 16px 32px rgba(191,38,38,.24);
}
.secondary-btn{
background:#fff;
color:var(--ink);
border-color:rgba(16,34,53,.16);
box-shadow:var(--shadow-soft);
}
.header-cta:hover,
.primary-btn:hover,
.secondary-btn:hover,
.mobile-sticky-cta:hover{
transform:translateY(-2px);
}
.hero{
position:relative;
isolation:isolate;
padding:0 clamp(20px,6vw,86px) 34px;
background:
radial-gradient(circle at 78% 18%,rgba(72,183,176,.24),transparent 30%),
radial-gradient(circle at 18% 78%,rgba(201,162,74,.22),transparent 32%),
linear-gradient(135deg,#eef8f8,#f7fbff 42%,#eef2f7);
}
.hero-bg{
position:relative;
max-width:1240px;
margin:0 auto;
padding:82px 0 58px;
}
.hero-bg:after{
content:"";
position:absolute;
right:0;
bottom:26px;
width:min(42vw,520px);
height:min(42vw,520px);
z-index:-1;
background:
linear-gradient(145deg,rgba(7,22,36,.96),rgba(23,107,135,.88)),
linear-gradient(45deg,rgba(201,162,74,.7),transparent);
clip-path:polygon(18% 0,100% 10%,86% 88%,0 100%);
opacity:.18;
}
.hero-grid{
display:grid;
grid-template-columns:minmax(0,1.06fr) minmax(360px,.78fr);
gap:54px;
align-items:center;
}
.eyebrow,
.section-kicker{
display:inline-flex;
align-items:center;
gap:10px;
padding:9px 13px;
border:1px solid rgba(201,162,74,.42);
border-radius:999px;
background:rgba(255,255,255,.66);
color:#725819;
font-size:12px;
font-weight:900;
text-transform:uppercase;
letter-spacing:.08em;
}
.eyebrow:before,
.section-kicker:before{
content:"";
width:7px;
height:7px;
border-radius:50%;
background:var(--gold);
}
.hero h1{
max-width:780px;
margin:24px 0 22px;
font-size:clamp(48px,6.4vw,84px);
line-height:.96;
font-weight:900;
letter-spacing:0;
color:var(--ink);
}
.hero-lead{
max-width:680px;
font-size:19px;
line-height:1.75;
color:var(--muted);
}
.hero-actions{
display:flex;
flex-wrap:wrap;
gap:14px;
margin:34px 0;
}
.trust-row{
display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
max-width:680px;
gap:12px;
}
.trust-row div{
padding:18px;
border-radius:var(--radius);
background:rgba(255,255,255,.62);
border:1px solid rgba(255,255,255,.7);
box-shadow:0 12px 32px rgba(7,22,36,.06);
backdrop-filter:blur(16px);
}
.trust-row strong{
display:block;
font-size:26px;
line-height:1;
color:var(--ink);
}
.trust-row span{
display:block;
margin-top:7px;
font-size:13px;
font-weight:700;
color:var(--muted);
}
.glass-card{
background:linear-gradient(145deg,rgba(255,255,255,.78),rgba(255,255,255,.48));
border:1px solid rgba(255,255,255,.82);
box-shadow:var(--shadow);
backdrop-filter:blur(22px);
}
.hero-panel{
position:relative;
padding:28px;
border-radius:var(--radius);
overflow:hidden;
}
.hero-panel:before{
content:"";
position:absolute;
inset:0;
background:
linear-gradient(145deg,rgba(23,107,135,.12),transparent),
radial-gradient(circle at 90% 0,rgba(201,162,74,.24),transparent 34%);
pointer-events:none;
}
.panel-top,
.panel-metrics,
.panel-progress,
.hero-panel p,
.approval-ring{
position:relative;
}
.panel-top{
display:flex;
align-items:center;
justify-content:space-between;
margin-bottom:28px;
font-size:14px;
font-weight:900;
color:var(--muted);
}
.panel-top strong{
color:var(--green);
}
.approval-ring{
width:190px;
height:190px;
margin:0 auto 28px;
display:grid;
place-items:center;
border-radius:50%;
background:
conic-gradient(var(--green) 0 78%,rgba(16,34,53,.1) 78% 100%);
box-shadow:inset 0 0 0 16px rgba(255,255,255,.86);
}
.approval-ring span{
width:122px;
height:122px;
display:grid;
place-items:center;
border-radius:50%;
background:#fff;
font-size:34px;
font-weight:900;
color:var(--ink);
}
.panel-metrics{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:10px;
}
.panel-metrics div{
padding:14px 10px;
border-radius:var(--radius);
background:rgba(255,255,255,.7);
border:1px solid rgba(219,229,238,.75);
}
.panel-metrics small,
.panel-metrics strong{
display:block;
text-align:center;
}
.panel-metrics small{
font-size:11px;
font-weight:800;
color:var(--muted);
}
.panel-metrics strong{
margin-top:4px;
font-size:14px;
color:var(--ink);
}
.panel-progress{
height:10px;
margin:22px 0;
border-radius:999px;
background:rgba(16,34,53,.12);
overflow:hidden;
}
.panel-progress span{
display:block;
width:78%;
height:100%;
border-radius:999px;
background:linear-gradient(90deg,var(--green),var(--aqua));
}
.hero-panel p{
font-size:13px;
font-weight:700;
color:var(--muted);
}
.brand-strip{
display:grid;
grid-template-columns:repeat(4,1fr);
gap:1px;
background:var(--line);
border-top:1px solid var(--line);
border-bottom:1px solid var(--line);
}
.brand-strip div{
padding:22px 18px;
background:#fff;
text-align:center;
font-size:14px;
font-weight:900;
color:var(--ink-2);
}
.section{
padding:92px clamp(20px,6vw,86px);
}
.section-heading{
max-width:780px;
margin:0 auto 46px;
text-align:center;
}
.section-heading.left{
margin:0;
text-align:left;
}
.section-heading h2,
.form-copy h2,
.security-layout h2{
margin-top:18px;
font-size:clamp(34px,4.5vw,58px);
line-height:1.04;
font-weight:900;
letter-spacing:0;
color:var(--ink);
}
.section-heading p,
.form-copy p,
.security-layout p{
margin-top:18px;
font-size:17px;
line-height:1.75;
color:var(--muted);
}
.calculator-section{
background:
linear-gradient(180deg,#fff,#f3f8fb);
}
.calculator-layout{
max-width:1120px;
margin:0 auto;
display:grid;
grid-template-columns:minmax(0,1fr) 360px;
gap:24px;
align-items:stretch;
}
.calculator-card{
padding:30px;
border-radius:var(--radius);
}
.range-group{
padding:20px 0;
border-bottom:1px solid rgba(219,229,238,.82);
}
.range-group:last-child{
border-bottom:0;
}
.range-group label{
display:block;
font-weight:900;
color:var(--ink);
}
.range-value{
margin:8px 0 14px;
font-size:26px;
font-weight:900;
color:var(--blue);
}
.fixed-rate-value{
margin-bottom:4px;
}
.rate-note{
font-size:13px;
font-weight:700;
color:var(--muted);
}
input[type="range"]{
width:100%;
accent-color:var(--red);
}
.calculator-result{
display:flex;
flex-direction:column;
justify-content:center;
padding:30px;
border-radius:var(--radius);
background:linear-gradient(145deg,var(--ink),#12334d);
color:#fff;
box-shadow:var(--shadow);
}
.calculator-result span{
font-size:13px;
font-weight:900;
text-transform:uppercase;
letter-spacing:.08em;
color:var(--gold-2);
}
.calculator-result strong{
display:block;
margin:14px 0 12px;
font-size:38px;
line-height:1.05;
}
.calculator-result p{
margin-bottom:24px;
color:rgba(255,255,255,.72);
}
.benefits-section{
background:#f7fbff;
}
.benefits-grid{
max-width:1180px;
margin:0 auto;
display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
gap:18px;
}
.benefit-card,
.testimonial-card,
.comparison-grid article{
padding:28px;
border-radius:var(--radius);
background:#fff;
border:1px solid var(--line);
box-shadow:var(--shadow-soft);
transition:transform .25s ease,box-shadow .25s ease;
}
.benefit-card:hover,
.testimonial-card:hover,
.comparison-grid article:hover{
transform:translateY(-5px);
box-shadow:var(--shadow);
}
.icon-box{
display:grid;
place-items:center;
width:48px;
height:48px;
margin-bottom:22px;
border-radius:var(--radius);
background:linear-gradient(145deg,var(--ink),var(--blue));
color:#fff;
font-weight:900;
}
.benefit-card h3,
.step-item h3,
.comparison-grid h3{
font-size:22px;
margin-bottom:10px;
color:var(--ink);
}
.benefit-card p,
.step-item p,
.comparison-grid li{
color:var(--muted);
line-height:1.7;
}
.process-section{
background:
radial-gradient(circle at 100% 20%,rgba(72,183,176,.16),transparent 28%),
linear-gradient(180deg,#fff,#eef6f8);
}
.process-layout{
max-width:1180px;
margin:0 auto;
display:grid;
grid-template-columns:.86fr 1fr;
gap:56px;
align-items:start;
}
.steps-list{
display:grid;
gap:16px;
}
.step-item{
display:grid;
grid-template-columns:64px 1fr;
gap:18px;
align-items:start;
padding:22px;
border-radius:var(--radius);
background:rgba(255,255,255,.82);
border:1px solid rgba(219,229,238,.9);
box-shadow:var(--shadow-soft);
backdrop-filter:blur(14px);
}
.step-item span{
display:grid;
place-items:center;
width:56px;
height:56px;
border-radius:50%;
background:linear-gradient(180deg,var(--gold-2),var(--gold));
font-size:20px;
font-weight:900;
color:var(--ink);
}
.form-section{
background:linear-gradient(135deg,#071624,#12334d 58%,#176b87);
color:#fff;
}
.form-layout{
max-width:1180px;
margin:0 auto;
display:grid;
grid-template-columns:.82fr 1.08fr;
gap:40px;
align-items:center;
}
.form-copy h2,
.form-copy p{
color:#fff;
}
.form-copy p{
color:rgba(255,255,255,.74);
}
.mini-security{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:12px;
margin-top:30px;
}
.mini-security div{
padding:18px;
border-radius:var(--radius);
background:rgba(255,255,255,.08);
border:1px solid rgba(255,255,255,.14);
}
.mini-security strong,
.mini-security span{
display:block;
}
.mini-security strong{
font-size:24px;
color:var(--gold-2);
}
.mini-security span{
margin-top:4px;
font-size:13px;
font-weight:700;
color:rgba(255,255,255,.74);
}
.form-card{
padding:30px;
border-radius:var(--radius);
color:var(--ink);
}
.form-card h3{
font-size:28px;
margin-bottom:20px;
}
form{
display:grid;
gap:16px;
}
label{
display:grid;
gap:8px;
font-weight:800;
font-size:14px;
color:var(--ink);
}
input,
select,
textarea{
width:100%;
border:1px solid #cfdbe6;
border-radius:var(--radius);
background:#fff;
color:var(--ink);
padding:15px 16px;
outline:none;
transition:border-color .2s ease,box-shadow .2s ease;
}
textarea{
min-height:116px;
resize:vertical;
}
input:focus,
select:focus,
textarea:focus{
border-color:var(--blue);
box-shadow:0 0 0 4px rgba(23,107,135,.14);
}
.form-row{
display:grid;
grid-template-columns:1fr 1fr;
gap:14px;
}
.consent-line{
display:grid;
grid-template-columns:18px 1fr;
align-items:start;
gap:10px;
font-size:13px;
line-height:1.55;
color:var(--muted);
}
.consent-line input{
width:18px;
height:18px;
margin-top:2px;
accent-color:var(--red);
}
button[type="submit"]{
min-height:54px;
border:0;
border-radius:var(--radius);
background:linear-gradient(180deg,var(--red),var(--red-2));
color:#fff;
font-weight:900;
cursor:pointer;
box-shadow:0 16px 32px rgba(191,38,38,.24);
}
.form-note{
font-size:12px;
color:var(--muted);
text-align:center;
}
.comparison-section{
background:#fff;
}
.comparison-grid{
max-width:1180px;
margin:0 auto;
display:grid;
grid-template-columns:repeat(3,1fr);
gap:18px;
}
.comparison-grid ul{
display:grid;
gap:12px;
margin-top:18px;
list-style:none;
}
.comparison-grid li{
position:relative;
padding-left:24px;
font-weight:700;
}
.comparison-grid li:before{
content:"";
position:absolute;
left:0;
top:.62em;
width:9px;
height:9px;
border-radius:50%;
background:var(--green);
}
.testimonials-section{
background:#f3f8fb;
}
.testimonials-grid{
max-width:1180px;
margin:0 auto;
display:grid;
grid-template-columns:repeat(3,1fr);
gap:18px;
align-items:stretch;
}
.testimonial-card{
display:flex;
flex-direction:column;
min-height:310px;
}
.testimonial-card.featured{
background:linear-gradient(145deg,#fff,#f8fbff);
border-color:rgba(201,162,74,.42);
}
.stars{
letter-spacing:2px;
color:var(--gold);
font-size:18px;
}
.testimonial-card p{
margin:22px 0;
font-size:17px;
line-height:1.72;
color:var(--ink-2);
}
.person{
display:grid;
grid-template-columns:48px 1fr;
column-gap:12px;
align-items:center;
margin-top:auto;
}
.person span,
.person img{
grid-row:1 / span 2;
display:grid;
place-items:center;
width:48px;
height:48px;
border-radius:50%;
background:var(--ink);
color:#fff;
font-weight:900;
}
.person img{
object-fit:cover;
border:2px solid #fff;
box-shadow:0 8px 18px rgba(7,22,36,.16);
}
.person strong,
.person small{
display:block;
}
.person small{
font-weight:700;
color:var(--muted);
}
.security-section{
background:linear-gradient(180deg,#fff,#f6fbfb);
}
.security-layout{
max-width:1180px;
margin:0 auto;
display:grid;
grid-template-columns:1fr .9fr;
gap:44px;
align-items:center;
}
.security-points{
display:grid;
grid-template-columns:1fr 1fr;
gap:12px;
margin-top:28px;
}
.security-points span{
padding:14px;
border-radius:var(--radius);
background:#fff;
border:1px solid var(--line);
font-size:14px;
font-weight:800;
color:var(--ink-2);
}
.security-logos{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:12px;
align-items:center;
}
.security-logos div{
width:100%;
height:118px;
padding:14px;
border-radius:var(--radius);
background:#fff;
border:1px solid var(--line);
box-shadow:var(--shadow-soft);
display:grid;
place-items:center;
text-align:center;
}
.security-logos img,
.security-logos span{
display:block;
}
.security-logos img{
max-width:100%;
max-height:58px;
object-fit:contain;
}
.security-logos span{
margin-top:6px;
font-size:13px;
font-weight:900;
color:var(--muted);
}
.faq-section{
background:#f7fbff;
}
.faq-list{
max-width:900px;
margin:0 auto;
display:grid;
gap:12px;
}
.faq-item{
border:1px solid var(--line);
border-radius:var(--radius);
background:#fff;
box-shadow:0 10px 26px rgba(7,22,36,.05);
overflow:hidden;
}
.faq-item summary{
list-style:none;
cursor:pointer;
padding:22px 24px;
font-size:18px;
font-weight:900;
color:var(--ink);
display:flex;
justify-content:space-between;
gap:18px;
}
.faq-item summary::-webkit-details-marker{
display:none;
}
.faq-item summary:after{
content:"+";
display:grid;
place-items:center;
width:26px;
height:26px;
border-radius:50%;
background:var(--soft);
color:var(--blue);
flex:0 0 auto;
}
.faq-item[open] summary:after{
content:"−";
background:var(--blue);
color:#fff;
}
.faq-item p{
padding:0 24px 24px;
color:var(--muted);
line-height:1.75;
}
.success-page{
display:none;
min-height:78vh;
padding:110px clamp(20px,6vw,86px);
background:
radial-gradient(circle at 28% 18%,rgba(72,183,176,.22),transparent 30%),
linear-gradient(135deg,#eef8f8,#fff);
}
.success-page:target{
display:grid;
place-items:center;
}
.success-card{
max-width:640px;
padding:42px;
border-radius:var(--radius);
text-align:center;
}
.success-icon{
display:grid;
place-items:center;
width:74px;
height:74px;
margin:0 auto 20px;
border-radius:50%;
background:var(--green);
color:#fff;
font-size:36px;
font-weight:900;
}
.success-card h2{
font-size:42px;
line-height:1;
}
.success-card p{
margin:18px 0 28px;
color:var(--muted);
line-height:1.75;
}
.success-actions{
display:flex;
justify-content:center;
flex-wrap:wrap;
gap:12px;
}
.privacy-site{
background:linear-gradient(180deg,#f7fbff,#eef6f8);
}
.privacy-hero{
padding:70px clamp(20px,6vw,86px) 34px;
background:
radial-gradient(circle at 82% 18%,rgba(72,183,176,.18),transparent 30%),
linear-gradient(135deg,#eef8f8,#fff);
}
.privacy-hero-card{
max-width:980px;
margin:0 auto;
padding:34px;
border-radius:var(--radius);
text-align:center;
}
.privacy-logo{
width:132px;
height:auto;
margin:0 auto 18px;
}
.privacy-hero h1{
margin-top:18px;
font-size:clamp(34px,4.8vw,58px);
line-height:1.04;
font-weight:900;
letter-spacing:0;
color:var(--ink);
}
.privacy-hero p{
max-width:680px;
margin:18px auto 0;
font-size:17px;
line-height:1.75;
color:var(--muted);
}
.privacy-content{
max-width:1040px;
margin:0 auto;
padding:34px clamp(20px,6vw,46px) 88px;
}
.privacy-block{
padding:28px;
margin-bottom:16px;
border-radius:var(--radius);
background:#fff;
border:1px solid var(--line);
box-shadow:var(--shadow-soft);
}
.privacy-block h2{
margin-bottom:16px;
font-size:24px;
line-height:1.2;
color:var(--ink);
}
.privacy-block p,
.privacy-block li{
font-size:15px;
line-height:1.82;
color:var(--muted);
}
.privacy-block p + p,
.privacy-block p + ul,
.privacy-block ul + p{
margin-top:14px;
}
.privacy-block ul{
padding-left:22px;
}
.privacy-block li{
margin-bottom:8px;
}
.site-footer{
padding:58px clamp(20px,6vw,86px) 24px;
background:var(--ink);
color:#fff;
}
.footer-grid{
max-width:1180px;
margin:0 auto;
display:grid;
grid-template-columns:1.2fr .7fr 1fr;
gap:34px;
}
.footer-brand{
display:inline-flex;
align-items:center;
gap:12px;
font-size:26px;
font-weight:900;
}
.footer-brand img{
width:42px;
height:42px;
object-fit:contain;
}
.site-footer h3{
font-size:15px;
margin-bottom:14px;
color:var(--gold-2);
text-transform:uppercase;
letter-spacing:.08em;
}
.site-footer p,
.site-footer a,
.footer-bottom{
color:rgba(255,255,255,.74);
font-size:14px;
line-height:1.7;
}
.site-footer a{
display:block;
margin-bottom:8px;
}
.site-footer a:hover{
color:#fff;
}
.footer-bottom{
max-width:1180px;
margin:34px auto 0;
padding-top:18px;
border-top:1px solid rgba(255,255,255,.12);
display:flex;
justify-content:space-between;
gap:20px;
}
.cookie-banner{
position:fixed;
left:50%;
bottom:22px;
z-index:1000;
width:min(1120px,calc(100% - 32px));
transform:translateX(-50%);
display:grid;
grid-template-columns:1fr auto;
gap:18px;
align-items:center;
padding:18px;
border-radius:var(--radius);
background:rgba(7,22,36,.94);
color:#fff;
box-shadow:0 24px 70px rgba(7,22,36,.35);
backdrop-filter:blur(18px);
}
.cookie-banner.is-hidden{
display:none;
}
.cookie-banner strong{
display:block;
margin-bottom:4px;
font-size:16px;
}
.cookie-banner p{
color:rgba(255,255,255,.74);
font-size:13px;
line-height:1.6;
}
.cookie-banner a{
color:var(--gold-2);
font-weight:900;
}
.cookie-banner button{
min-height:44px;
padding:0 20px;
border:0;
border-radius:var(--radius);
background:var(--gold-2);
color:var(--ink);
font-weight:900;
cursor:pointer;
}
.whatsapp-float{
position:fixed;
right:22px;
bottom:106px;
z-index:999;
display:inline-flex;
align-items:center;
gap:10px;
min-height:54px;
padding:0 18px;
border-radius:999px;
background:#25d366;
color:#fff;
font-weight:900;
box-shadow:0 18px 40px rgba(37,211,102,.34);
}
.whatsapp-float svg{
width:28px;
height:28px;
}
.whatsapp-float:hover{
transform:translateY(-2px);
background:#1fbd5a;
}
.mobile-sticky-cta{
display:none;
position:fixed;
left:14px;
right:14px;
bottom:14px;
z-index:998;
min-height:54px;
}
@media(max-width:1080px){
.nav-links{
gap:16px;
font-size:13px;
}
.hero-grid,
.calculator-layout,
.process-layout,
.form-layout,
.security-layout{
grid-template-columns:1fr;
}
.hero-panel{
max-width:560px;
}
.benefits-grid,
.comparison-grid,
.testimonials-grid{
grid-template-columns:1fr 1fr;
}
.calculator-result{
min-height:250px;
}
}
@media(max-width:780px){
body{
padding-bottom:74px;
}
.topbar{
justify-content:flex-start;
overflow:auto;
gap:16px;
}
.main-header{
position:relative;
grid-template-columns:1fr;
justify-items:center;
gap:12px;
}
.brand img{
width:128px;
}
.nav-links{
width:100%;
justify-content:flex-start;
overflow:auto;
padding-bottom:4px;
}
.header-cta{
display:none;
}
.hero{
padding:0 18px 24px;
}
.hero-bg{
padding:54px 0 30px;
}
.hero-grid{
gap:30px;
}
.hero h1{
font-size:46px;
}
.hero-lead{
font-size:16px;
}
.hero-actions{
display:grid;
grid-template-columns:1fr;
}
.trust-row{
grid-template-columns:1fr;
}
.brand-strip{
grid-template-columns:1fr 1fr;
}
.section{
padding:64px 18px;
}
.section-heading{
margin-bottom:32px;
}
.benefits-grid,
.comparison-grid,
.testimonials-grid,
.footer-grid,
.security-points,
.security-logos,
.mini-security,
.form-row{
grid-template-columns:1fr;
}
.step-item{
grid-template-columns:52px 1fr;
padding:18px;
}
.step-item span{
width:46px;
height:46px;
}
.form-card,
.calculator-card,
.calculator-result{
padding:22px;
}
.footer-bottom{
flex-direction:column;
}
.cookie-banner{
bottom:78px;
grid-template-columns:1fr;
}
.whatsapp-float{
right:16px;
bottom:146px;
width:58px;
height:58px;
padding:0;
justify-content:center;
}
.whatsapp-float span{
display:none;
}
.mobile-sticky-cta{
display:flex;
}
}
@media(max-width:520px){
.hero h1{
font-size:40px;
}
.section-heading h2,
.form-copy h2,
.security-layout h2{
font-size:34px;
}
.brand-strip{
grid-template-columns:1fr;
}
.panel-metrics{
grid-template-columns:1fr;
}
.approval-ring{
width:164px;
height:164px;
}
.approval-ring span{
width:104px;
height:104px;
}
.calculator-result strong{
font-size:32px;
}
.faq-item summary{
font-size:16px;
padding:18px;
}
.faq-item p{
padding:0 18px 18px;
}
}