.page-hero{
padding:95px 0 75px;
background:
radial-gradient(circle at 82% 12%,rgba(35,103,230,.09),transparent 28rem),
linear-gradient(180deg,#fff,#f8faff);
border-bottom:1px solid #edf1f6
}

.page-hero-inner{
max-width:900px;
text-align:center
}

.page-eyebrow{
display:inline-flex;
align-items:center;
gap:7px;
padding:7px 12px;
border:1px solid #cfe0ff;
border-radius:50px;
background:#f8fbff;
color:#1556d8;
font-size:10px;
font-weight:800;
letter-spacing:.6px
}

.page-hero h1{
max-width:850px;
margin:20px auto 18px;
font-size:56px;
line-height:1.07;
letter-spacing:-2.6px
}

.page-hero h1 strong{
color:#1556d8
}

.page-hero p{
max-width:680px;
margin:auto;
font-size:15px;
line-height:1.8;
color:#667085
}

.page-hero-actions{
display:flex;
justify-content:center;
gap:12px;
margin-top:29px
}

.page-section{
padding:78px 0
}

.page-section.soft{
background:#f8faff
}

.page-title{
max-width:700px;
margin:0 auto 40px;
text-align:center
}

.page-title small{
font-size:9px;
font-weight:800;
letter-spacing:1px;
color:#1556d8
}

.page-title h2{
margin:9px 0 12px;
font-size:34px;
letter-spacing:-1.3px
}

.page-title p{
margin:0;
color:#727e8f;
font-size:13px;
line-height:1.75
}

.page-card-grid{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:18px
}

.page-card{
position:relative;
min-height:220px;
padding:27px;
overflow:hidden;
background:#fff;
border:1px solid #e3e9f2;
border-radius:14px;
transition:.28s ease
}

.page-card:hover{
transform:translateY(-6px);
border-color:#cbdaf5;
box-shadow:0 21px 45px rgba(24,64,136,.09)
}

.page-card-icon{
width:48px;
height:48px;
display:grid;
place-items:center;
border-radius:12px;
background:#edf4ff;
color:#1556d8;
font-size:19px
}

.page-card h3{
margin:20px 0 9px;
font-size:17px
}

.page-card p{
margin:0;
font-size:11px;
line-height:1.75;
color:#737f90
}

.page-card-link{
position:absolute;
left:27px;
bottom:22px;
font-size:10px;
font-weight:800;
color:#1556d8
}

.status{
display:inline-flex;
align-items:center;
gap:7px;
margin-top:17px;
padding:6px 9px;
border-radius:30px;
font-size:9px;
font-weight:800
}

.status.ready{
color:#08724c;
background:#eaf8f2
}

.status.sandbox{
color:#946200;
background:#fff6da
}

.status.pending{
color:#475467;
background:#f2f4f7
}

.contact-layout{
display:grid;
grid-template-columns:.8fr 1.2fr;
gap:65px;
align-items:start
}

.contact-info h2{
font-size:37px;
letter-spacing:-1.4px;
margin:0 0 15px
}

.contact-info>p{
font-size:13px;
line-height:1.8;
color:#687588
}

.contact-method{
display:flex;
gap:13px;
margin-top:22px
}

.contact-method i{
width:39px;
height:39px;
display:grid;
place-items:center;
border-radius:10px;
background:#edf4ff;
color:#1556d8
}

.contact-method div{
display:flex;
flex-direction:column
}

.contact-method b{
font-size:11px
}

.contact-method span{
font-size:10px;
margin-top:4px;
color:#7b8798
}

.legal-shell{
max-width:880px;
margin:auto;
padding:80px 0
}

.legal-shell h1{
font-size:43px;
letter-spacing:-1.7px
}

.legal-shell h2{
margin-top:40px;
font-size:21px
}

.legal-shell p{
font-size:13px;
line-height:1.9;
color:#5d697a
}

.legal-back{
display:inline-flex;
align-items:center;
gap:7px;
color:#1556d8;
font-size:11px;
font-weight:750
}

.route-cta{
padding:30px 0 80px
}

.route-cta-box{
padding:42px;
display:flex;
align-items:center;
justify-content:space-between;
border-radius:16px;
color:#fff;
background:
radial-gradient(circle at 80% 0,rgba(80,145,255,.38),transparent 20rem),
linear-gradient(120deg,#165dd9,#061e55)
}

.route-cta-box h2{
margin:0 0 8px;
font-size:26px
}

.route-cta-box p{
margin:0;
font-size:11px;
color:#d9e6ff
}

@media(max-width:900px){
.page-card-grid{grid-template-columns:1fr 1fr}
.contact-layout{grid-template-columns:1fr}
}

@media(max-width:650px){
.page-hero{padding:65px 0 55px}
.page-hero h1{font-size:39px;letter-spacing:-1.8px}
.page-hero-actions{flex-direction:column}
.page-card-grid{grid-template-columns:1fr}
.route-cta-box{flex-direction:column;align-items:flex-start;gap:25px}
}