/* GLOBAL */

body{
background:#f6f7f8;
font-family:Inter,system-ui,sans-serif;
color:#0f172a;
}

.wp-block-group.alignfull{
margin-left:auto;
margin-right:auto;
}

/* HERO SECTION */

.wpdev-hero{
padding:120px 20px;
}

.wpdev-hero-grid{
max-width:1200px;
margin:auto;
align-items:center;
}

.wpdev-hero-left{
display:flex;
flex-direction:column;
gap:28px;
}

.wpdev-hero-badge{
display:inline-block;
font-size:12px;
font-weight:700;
letter-spacing:.05em;
text-transform:uppercase;
background:#137fec10;
border:1px solid #137fec30;
color:#137fec;
padding:6px 14px;
border-radius:999px;
width:max-content;
}

.wpdev-hero-title{
font-size:56px;
font-weight:900;
line-height:1.1;
letter-spacing:-.02em;
max-width:700px;
}

.wpdev-hero-title span{
color:#137fec;
}

.wpdev-hero-desc{
font-size:18px;
line-height:1.7;
color:#64748b;
max-width:520px;
}

.wpdev-hero-buttons{
margin-top:10px;
}

.wpdev-hero-buttons .wp-block-button__link{
height:56px;
padding:0 32px;
border-radius:14px;
font-size:16px;
font-weight:700;
display:flex;
align-items:center;
justify-content:center;
transition:all .25s ease;
}

.wpdev-hero-buttons .wp-block-button:first-child .wp-block-button__link{
background:#137fec;
color:white;
}

.wpdev-hero-buttons .wp-block-button:first-child .wp-block-button__link:hover{
background:#106fd0;
}

.wpdev-hero-buttons .wp-block-button:last-child .wp-block-button__link{
background:#e2e8f0;
color:#0f172a;
}

.wpdev-hero-buttons .wp-block-button:last-child .wp-block-button__link:hover{
background:#cbd5e1;
}

/* HERO PREVIEW */

.wpdev-hero-preview{
position:relative;
}

.wpdev-preview-card{
background:#f1f5f9;
border:1px solid #e2e8f0;
border-radius:18px;
padding:40px;
text-align:center;
box-shadow:0 20px 50px rgba(0,0,0,.08);
font-weight:600;
}

/* PLUGINS SECTION */

.wpdev-plugins{
padding:100px 20px;
background:#f8fafc;
}

.wpdev-plugins h2{
font-size:36px;
font-weight:800;
margin-bottom:10px;
}

.wpdev-plugins p{
color:#64748b;
max-width:700px;
margin:auto;
margin-bottom:40px;
}

.wpdev-plugin-grid{
max-width:1200px;
margin:auto;
gap:30px;
}

.wpdev-plugin-card{
background:white;
padding:30px;
border-radius:16px;
border:1px solid #e2e8f0;
transition:all .3s ease;
display:flex;
flex-direction:column;
gap:14px;
}

.wpdev-plugin-card:hover{
border-color:#137fec;
transform:translateY(-6px);
box-shadow:0 20px 40px rgba(0,0,0,.08);
}

.wpdev-plugin-card h3{
font-size:20px;
font-weight:700;
}

.wpdev-plugin-card p{
font-size:14px;
color:#64748b;
}

.wpdev-plugin-tag{
color:#137fec;
font-weight:700;
margin-top:auto;
}

/* SERVICES SECTION */

.wpdev-services{
padding:110px 20px;
}

.wpdev-services-layout{
max-width:1200px;
margin:auto;
gap:60px;
}

.wpdev-services-text h2{
font-size:34px;
font-weight:800;
margin-bottom:20px;
}

.wpdev-services-text p{
color:#64748b;
line-height:1.8;
margin-bottom:28px;
}

/* BULLET FEATURES */

.wpdev-services-text ul{
list-style:none;
padding:0;
margin:0;
display:flex;
flex-direction:column;
gap:14px;
}

.wpdev-services-text li{
display:flex;
align-items:center;
gap:10px;
font-weight:600;
}

.wpdev-services-text li::before{
content:"✔";
display:inline-flex;
align-items:center;
justify-content:center;
width:22px;
height:22px;
border-radius:50%;
background:#137fec20;
color:#137fec;
font-size:12px;
font-weight:bold;
}

/* SERVICE CARDS */

.wpdev-services-grid{
display:flex;
flex-direction:column;
gap:20px;
}

.wpdev-service-card{
background:white;
padding:30px;
border-radius:18px;
border:1px solid #e2e8f0;
transition:.25s;
}

.wpdev-service-card:hover{
box-shadow:0 20px 40px rgba(0,0,0,.08);
transform:translateY(-4px);
}

.wpdev-service-card h4{
font-size:20px;
font-weight:700;
margin-bottom:10px;
}

.wpdev-service-card p{
font-size:14px;
color:#64748b;
}

/* CTA SECTION */

.wpdev-cta{
padding:120px 20px;
background:#137fec;
border-radius:24px;
max-width:1200px;
margin:120px auto;
text-align:center;
color:white;
position:relative;
overflow:hidden;
}

.wpdev-cta h2{
font-size:40px;
font-weight:900;
margin-bottom:20px;
}

.wpdev-cta p{
font-size:18px;
opacity:.9;
max-width:720px;
margin:auto;
margin-bottom:40px;
}

.wpdev-cta-buttons{
justify-content:center;
gap:16px;
}

.wpdev-cta-buttons .wp-block-button__link{
height:56px;
padding:0 34px;
border-radius:14px;
font-size:16px;
font-weight:700;
}

.wpdev-cta-buttons .wp-block-button:first-child .wp-block-button__link{
background:white;
color:#137fec;
}

.wpdev-cta-buttons .wp-block-button:first-child .wp-block-button__link:hover{
background:#f1f5f9;
}

.wpdev-cta-buttons .wp-block-button:last-child .wp-block-button__link{
background:rgba(255,255,255,.2);
color:white;
border:1px solid rgba(255,255,255,.4);
}

/* RESPONSIVE */

@media (max-width:900px){

.wpdev-hero-title{
font-size:42px;
}

.wpdev-hero-grid{
flex-direction:column;
}

.wpdev-services-layout{
flex-direction:column;
}

.wpdev-plugin-grid{
flex-direction:column;
}

}