/* =========================



ANOTHER CHANCE LLC



CALM + MODERN THEME



========================= */



:root{



--navy:#143B72;



--green:#7CA86B;



--cream:#F8F7F4;



--white:#FFFFFF;



--text:#2E2E2E;



}



/* GLOBAL */



body{



background:var(--cream);



color:var(--text);



font-family:'Inter',sans-serif;



line-height:1.8;



}



/* HEADINGS */



h1,h2,h3,h4{



font-family:'Playfair Display',serif;



color:var(--navy);



font-weight:600;



}



h1{



font-size:64px;



line-height:1.1;



}



h2{



font-size:42px;



margin-bottom:20px;



}



/* HEADER */



header{



background:white;



box-shadow:0 4px 20px rgba(0,0,0,.05);



padding:20px 60px;



}



header a{



color:var(--navy);



text-decoration:none;



font-weight:500;



}



header a:hover{



color:var(--green);



}



/* HERO */



.hero{



padding:120px 10%;



display:flex;



align-items:center;



gap:60px;



background:



linear-gradient(



90deg,



rgba(248,247,244,.96),



rgba(248,247,244,.75)



);



}



.hero h1{



max-width:600px;



}



.hero p{



font-size:20px;



max-width:650px;



}



/* BUTTONS */



.btn,



button{



background:var(--navy);



color:white;



padding:16px 34px;



border-radius:14px;



border:none;



font-size:16px;



font-weight:600;



transition:.3s;



}



.btn:hover,



button:hover{



background:var(--green);



transform:translateY(-2px);



}



.secondary{



background:white;



color:var(--navy);



border:2px solid var(--green);



}



/* PROGRAM CARDS */



.card{



background:white;



padding:40px;



border-radius:24px;



box-shadow:0 15px 50px rgba(0,0,0,.06);



transition:.3s;



}



.card:hover{



transform:translateY(-6px);



}



.card h3{



color:var(--green);



}



/* ABOUT */



.about{



padding:100px 10%;



}



.about p{



max-width:900px;



}



/* FORM */



form{



background:white;



padding:50px;



border-radius:26px;



box-shadow:0 10px 40px rgba(0,0,0,.05);



}



input,



select,



textarea{



width:100%;



padding:18px;



margin-bottom:18px;



border:1px solid #ddd;



border-radius:12px;



font-size:16px;



}



input:focus,



textarea:focus{



border-color:var(--green);



outline:none;



}



/* GALLERY */



.gallery img{



border-radius:22px;



transition:.3s;



}



.gallery img:hover{



transform:scale(1.02);



}



/* FOOTER */



footer{



background:var(--navy);



color:white;



padding:60px;



}



footer h3{



color:white;



}



footer a{



color:#d8e7d0;



}



footer a:hover{



color:white;



}



/* MOBILE */



@media(max-width:768px){



.hero{



flex-direction:column;



padding:60px 30px;



}



h1{



font-size:44px;



}



h2{



font-size:32px;



}



header{



padding:20px;



}



}