/*
Theme Name: ReserveShield
Theme URI: https://www.reserveshield.com
Author: ReserveShield
Description: Custom WordPress theme for ReserveShield
Version: 1.0
*/

:root{
--navy:#0B1F36;
--navy2:#102F4E;
--green:#1F6B4A;
--charcoal:#26313D;
--muted:#64717F;
--silver:#D8DEE6;
--light:#F6F8FA;
--white:#fff;
--max:1180px
}

*{
box-sizing:border-box
}

html{
scroll-behavior:smooth
}

body{
margin:0;
font-family:Arial,Helvetica,sans-serif;
color:var(--charcoal);
line-height:1.55;
background:#fff
}

a{
color:inherit
}

.container{
width:min(var(--max),calc(100% - 40px));
margin:auto
}

/* TOP BAR */

.topbar{
background:var(--navy);
color:#dbe5ee;
font-size:14px;
padding:8px 0
}

.topbar .container{
display:flex;
justify-content:space-between;
gap:20px;
flex-wrap:wrap
}

/* HEADER */

.header{
position:sticky;
top:0;
background:#fff;
z-index:100;
box-shadow:0 2px 18px rgba(0,0,0,.08)
}

.nav{
display:flex;
align-items:center;
justify-content:space-between;
gap:24px;
padding:16px 0
}

.logo{
width:285px;
max-width:60vw
}

.menu{
display:flex;
align-items:center;
gap:28px;
font-weight:700;
font-size:14px;
letter-spacing:.03em
}

.menu a{
text-decoration:none
}

.menu a:hover{
color:var(--green)
}

/* BUTTONS */

.btn{
display:inline-block;
background:var(--green);
color:#fff;
text-decoration:none;
font-weight:800;
border-radius:4px;
padding:13px 22px;
border:2px solid var(--green);
transition:.2s
}

.btn:hover{
background:#165238;
border-color:#165238
}

.btn.outline{
background:transparent;
border-color:#fff;
color:#fff
}

/* HERO */

.hero{
position:relative;
color:#fff;
background:var(--navy) url('https://reserveshield.com/wp-content/uploads/2026/05/reserveshield-home-image.png') center/cover no-repeat
}

.hero:before{
content:"";
position:absolute;
inset:0;
background:linear-gradient(90deg,rgba(5,23,42,.90),rgba(5,23,42,.62),rgba(5,23,42,.25))
}

.hero .container{
position:relative;
padding:105px 0 92px
}

.eyebrow{
color:#9fd0af;
font-weight:800;
letter-spacing:.08em;
text-transform:uppercase;
font-size:14px
}

.hero h1{
font-family:Georgia,'Times New Roman',serif;
font-size:clamp(44px,7vw,82px);
line-height:1;
margin:18px 0 10px;
letter-spacing:.02em
}

.hero h2{
font-size:clamp(21px,3vw,29px);
font-weight:500;
color:#c9f1d4;
margin:0 0 18px
}

.hero p{
max-width:650px;
font-size:19px
}

.actions{
display:flex;
gap:18px;
flex-wrap:wrap;
margin-top:28px
}

/* TRUST BAR */

.trust{
background:linear-gradient(90deg,#071827,#0B2A4A);
color:#fff;
padding:34px 0;
border-top:1px solid rgba(255,255,255,.12)
}

.trust-grid{
display:grid;
grid-template-columns:repeat(5,1fr);
gap:0;
text-align:center
}

.trust-item{
padding:0 20px;
border-left:1px solid rgba(255,255,255,.18)
}

.trust-item:first-child{
border-left:0
}

.trust-icon{
height:58px;
margin-bottom:12px;
display:flex;
align-items:center;
justify-content:center
}

.trust-icon svg{
width:52px;
height:52px;
fill:none;
stroke:#9fd0af;
stroke-width:2.6;
stroke-linecap:round;
stroke-linejoin:round
}

.trust-title{
font-weight:800;
font-size:14px;
line-height:1.35;
letter-spacing:.04em;
text-transform:uppercase;
color:#fff
}

/* SECTIONS */

.section{
padding:72px 0
}

.section.alt{
background:var(--light)
}

.section-title{
text-align:center;
margin:0 auto 42px
}

.section-title h2{
font-family:Georgia,'Times New Roman',serif;
font-size:38px;
color:var(--navy);
margin:0
}

.rule{
width:70px;
height:3px;
background:var(--green);
margin:13px auto 0
}

/* SERVICES */

.services{
display:grid;
grid-template-columns:repeat(4,1fr);
gap:22px
}

.card{
background:#fff;
border:1px solid #E3E8EE;
border-radius:10px;
padding:30px 24px;
box-shadow:0 8px 25px rgba(10,31,54,.06)
}

.card .icon{
margin-bottom:16px
}

.card .icon svg{
width:58px;
height:58px;
stroke:#1F6B4A;
stroke-width:2.6;
fill:none;
stroke-linecap:round;
stroke-linejoin:round
}

.card h3{
color:var(--navy);
font-size:20px;
line-height:1.4;
margin:0 0 14px
}

.card p{
font-size:16px;
line-height:1.7;
margin:0
}

/* SPLIT SECTION */

.split{
display:grid;
grid-template-columns:1fr 1fr;
gap:54px;
align-items:center
}

.image-card{
border-radius:20px;
overflow:hidden;
box-shadow:0 12px 30px rgba(0,0,0,.16)
}

.image-card img{
width:100%;
display:block
}

/* CHECKLIST */

.checklist{
list-style:none;
padding:0;
margin:22px 0
}

.checklist li{
margin:12px 0;
padding-left:34px;
position:relative
}

.checklist li:before{
content:"✓";
position:absolute;
left:0;
top:0;
background:var(--green);
color:#fff;
width:22px;
height:22px;
border-radius:50%;
display:grid;
place-items:center;
font-weight:800;
font-size:14px
}

/* DARK SECTION */

.section.dark{
background:linear-gradient(90deg,#071827,#0B2A4A);
color:#fff;
padding:80px 0
}

.section.dark h2,
.section.dark h3{
color:#fff
}

.section.dark .case{
display:grid;
grid-template-columns:1.1fr 1fr;
gap:60px;
align-items:center
}

.section.dark .quote{
font-size:24px;
line-height:1.7;
font-family:Georgia,serif;
font-style:italic;
color:#ffffff;
max-width:700px
}

.section.dark .image-card img{
width:100%;
display:block;
border-radius:20px
}

/* CTA */

.cta{
background:#ffffff;
text-align:center;
padding:70px 0 60px
}

.cta h2{
font-family:Georgia,serif;
font-size:44px;
line-height:1.2;
margin:0 0 16px;
color:#0B1F36
}

.cta p{
max-width:760px;
margin:0 auto 26px;
font-size:20px;
line-height:1.7;
color:#26313D
}

/* FOOTER */

.footer{
background:#06121F;
color:#dce5ee;
padding:42px 0 24px;
border-top:1px solid rgba(255,255,255,.08)
}

.footer-grid{
display:grid;
grid-template-columns:1.5fr 1fr 1fr;
gap:60px;
align-items:flex-start
}

.footer img{
width:220px;
background:#fff;
border-radius:8px;
padding:8px;
margin-bottom:18px
}

.footer h3{
font-size:18px;
margin:0 0 18px;
color:#fff
}

.footer p,
.footer a{
font-size:17px;
line-height:1.9;
color:#dce5ee;
text-decoration:none
}

.footer a:hover{
color:#9fd0af
}

.small{
font-size:13px;
color:#aeb9c6;
margin-top:40px;
line-height:1.7
}

/* PAGE HERO */

.page-hero{
background:linear-gradient(90deg,#071827,#0B2A4A);
color:#fff;
padding:78px 0
}

.page-hero h1{
font-family:Georgia,serif;
font-size:54px;
margin:0
}

/* CONTACT */

.contact-box{
background:#fff;
border:1px solid #E3E8EE;
border-radius:10px;
padding:34px
}

.contact-form input,
.contact-form textarea{
width:100%;
padding:13px;
margin:8px 0 14px;
border:1px solid #CAD3DD;
border-radius:5px;
font-size:16px
}

.contact-form button{
cursor:pointer
}

.disclaimer{
background:#fff7e6;
border-left:4px solid #c68b2d;
padding:16px;
margin-top:22px;
color:#4d3b1d
}

.wp-content{
max-width:900px;
margin:0 auto;
padding:60px 20px
}

/* MOBILE */

@media(max-width:1100px){

.services{
grid-template-columns:repeat(2,1fr)
}

}

@media(max-width:980px){

.section.dark{
padding:60px 0
}

.section.dark .case{
grid-template-columns:1fr;
gap:40px
}

}

@media(max-width:900px){

.menu{
display:none
}

.trust-grid,
.split,
.footer-grid{
grid-template-columns:1fr
}

.trust-item{
border-left:0;
border-top:1px solid rgba(255,255,255,.18);
padding-top:22px
}

.trust-item:first-child{
border-top:0;
padding-top:0
}

.hero .container{
padding:75px 0
}

.logo{
width:245px
}

}

@media(max-width:700px){

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

.cta h2{
font-size:36px
}

.cta p{
font-size:18px
}

}
/* Sticky header spacing fix */

.page-hero{
padding-top:110px;
padding-bottom:90px;
}

.section-title{
padding-top:20px;
}