:root{
    --orange:#E65621;
    --yellow:#FFCB05;
    --text:#4A4A4A;
    --black:#000000;
    --bg:#F8F6F2;
}

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

body{
    font-family:'Open Sans',sans-serif;
    color:var(--text);
    background:#fff;
    line-height:1.4;
}

img{
    border-radius:8px;
}


.page-content img{
    max-width:100%;
    height:auto;
    display:block;
}



.container{
    width:90%;
    max-width:1200px;
    margin:auto;
}

/*a{
    text-decoration:none;
}*/


a{
              color:#B98460;
    text-decoration:none;
         transition:all .3s ease;
}

a:hover{
              color:#B55424;
    text-decoration:underline;
}


header{
    background:#fff;
    position:fixed;
    width:100%;
    top:0;
    z-index:1000;
    box-shadow:0 2px 10px rgba(0,0,0,.05);
}

.nav-wrapper{
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:20px 0;
}

.logo a{
    display:flex;
    align-items:center;
    gap:15px;
    color:#222;
}

.logo-circle{
    width:48px;
    height:48px;
    border:2px solid var(--orange);
    border-radius:50%;
    position:relative;
}

.logo-circle::after{
    content:"";
    width:10px;
    height:10px;
    background:var(--yellow);
    border-radius:50%;
    position:absolute;
    bottom:3px;
    right:3px;
}

.logo h2{
    font-size:32px;
    font-weight:400;
    letter-spacing:2px;
}

.logo p{
    font-size:12px;
}

nav ul{
    list-style:none;
    display:flex;
    gap:30px;
}

nav a{
    color:var(--black);
    transition:.3s;
}

nav a:hover{
    color:var(--orange);
}

.btn{
    background:var(--orange);
    color:#fff;
    padding:14px 24px;
    border-radius:40px;
    transition:.3s;
}

.btn:hover{
    background:#cf4918;
}

.hero{
    min-height:100vh;
    background:url('../images/hero.jpg') center center/cover;
    position:relative;
    display:flex;
    align-items:center;
    margin-top:80px;
}

.overlay{
    position:absolute;
    inset:0;
    background:rgba(255,255,255,.55);
}

.hero-content{
    position:relative;
     z-index:2;
}

.hero-text{
    max-width:650px;
}

.hero h1{
    font-family:'Playfair Display',serif;
      font-size:72px;
          color:#222;
}

.hero h2{
      font-family:'Playfair Display',serif;
        font-size:54px;
      font-weight:400;
    margin-bottom:18px;
}

.hero h2 span{
    color:var(--orange);
}

.hero p{
        max-width:550px;
        font-size:18px;
    margin-bottom:27px;
}

.hero-buttons{
    display:flex;
    gap:25px;
    align-items:center;
}

.link-btn{
    color:var(--orange);
    font-weight:600;
}

.intro{
    padding:80px 0;
    background:#faf8f5;
}

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

.cards3{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:30px;
}

.cards2{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:30px;
}



.card{
    text-align:center;
    padding:40px 25px;
    background:#fff;
    border-radius:15px;
}

.card h3{
    font-family:'Playfair Display',serif;
    margin-bottom:15px;
    font-size:32px;
}

.programs{
    padding:100px 0;
}

.programs h2{
    font-family:'Playfair Display',serif;
    font-size:48px;
    margin-bottom:40px;
}

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

.program{
    background:#fff;
    padding:35px;
    border-radius:15px;
    box-shadow:0 10px 30px rgba(0,0,0,.06);
}

.program h3{
    margin-bottom:15px;
    color:#222;
}

footer{
    background:#f4f1eb;
    padding:60px 0;
}

.footer-content{
            display:flex;
    justify-content:space-between;
}

.footer-content h3{
      font-size:36px;
    font-family:'Playfair Display',serif;
}



@media(max-width:768px){

    .hero{
        text-align:center;
    }

    .hero-buttons{
        flex-direction:column;
    }

    .cards{
        grid-template-columns:1fr;
    }
    
    .cards2{
        grid-template-columns:1fr;
    }
    
    .cards3{
        grid-template-columns:1fr;
    }


    .program-grid{
        grid-template-columns:1fr;
    }

    .footer-content{
        flex-direction:column;
        gap:30px;
    }

    .hero h1{
        font-size:36px;
    }

    .hero h2{
        font-size:29px;
    }

    .hero p{
        font-size:15px;
    }
    
    .info-grid{
	    grid-template-columns:1fr;
	}
	
	.info-box{
	    border-right:none;
	    border-bottom:1px solid #e8e8e8;
	}
	
	.info-box:last-child{
	    border-bottom:none;
	}
	
	.quote-box h3{
	    font-size:25px;
	}
	
	.info-box h4{
	    font-size:21px;
	}
}

/* MOBILE */
@media (max-width: 992px){

    .burger{
        display:block;
        z-index:1002;
    }

    .desktop-btn{
        display:none;
    }

    nav{
        position:fixed;
        top:0;
        right:-100%;
        width:280px;
        height:100vh;
        background:#fff;
        padding-top:100px;
        transition:right .3s ease;
        z-index:1001;
    }

    nav.active{
        right:0;
    }

    nav ul{
        display:flex;
        flex-direction:column;
        gap:0;
    }

    nav li{
        width:100%;
    }

    nav a{
        display:block;
        padding:18px 30px;
    }
    
    .nav-wrapper{
    	position:relative;
	}
	
	.burger{
	    position:absolute;
	    right:0;
	    top:50%;
	    transform:translateY(-50%);
	}

}


.menu-overlay{
    position:fixed;
       inset:0;
  background:rgba(0,0,0,.4);
     opacity:0;
  visibility:hidden;
  transition:.3s;
     z-index:1000;
}

.menu-overlay.active{
    opacity:1;
    visibility:visible;
}



/* BURGER */
.burger{
       /*display:none;*/
    background:none;
        border:none;
        cursor:poOpen Sans;
         width:40px;
        height:30px;
      position:relative;
}

.burger span{
    display:block;
     height:3px;
      width:100%;
 background:#333;
     margin:7px 0;
 transition:.3s;
}

.burger.active span:nth-child(1){
    transform:rotate(45deg) translate(7px,7px);
}

.burger.active span:nth-child(2){
    opacity:0;
}

.burger.active span:nth-child(3){
    transform:rotate(-45deg) translate(7px,-7px);
}





.info-strip{
    background:#faf8f5;
    padding:70px 0;
    border-top:1px solid #eee;
}

.info-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:0;
}

.info-box{
    padding:40px;
    border-right:1px solid #e8e8e8;
}

.info-box:last-child{
    border-right:none;
}

.quote-box{
    display:flex;
    flex-direction:column;
    justify-content:center;
}

.quote-mark{
    font-size:60px;
    color:#E65621;
    line-height:1;
    margin-bottom:20px;
}

.quote-box h3{
    font-family:'Playfair Display', serif;
    font-size:36px;
    font-weight:400;
    line-height:1.3;
    color:#333;
}

.line{
    width:70px;
    height:2px;
    background:#E65621;
    margin-top:25px;
}

.icon{
    font-size:42px;
    color:#E65621;
    margin-bottom:20px;
}

.info-box h4{
    font-family:'Playfair Display', serif;
    font-size:29px;
    font-weight:400;
    margin-bottom:15px;
    color:#333;
}

.info-box p{
    font-size:16px;
    line-height:1.7;
    margin-bottom:20px;
}

.info-box a{
    color:#E65621;
    font-weight:600;
}

.info-box a:hover{
    color:#000;
}




@media screen and (max-width:768px){

    .info-grid{
        display:grid !important;
        grid-template-columns:1fr !important;
        gap:0;
    }

    .info-box{
        width:100%;
        border-right:none;
        border-bottom:1px solid #e8e8e8;
    }

    .info-box:last-child{
        border-bottom:none;
    }

}













/* PODSTRANI */

.page-hero{
    position:relative;
    height:480px;
    margin-top:80px;
    background:url('../images/h2.jpg') center center/cover no-repeat;
    display:flex;
    align-items:center;
}

.page-hero3{
    position:relative;
    height:480px;
    margin-top:80px;
    background:url('../images/h3.jpg') center center/cover no-repeat;
    display:flex;
    align-items:center;
}

.page-hero4{
    position:relative;
    height:480px;
    margin-top:80px;
    background:url('../images/h4.jpg') center center/cover no-repeat;
    display:flex;
    align-items:center;
}

.page-hero5{
    position:relative;
    height:480px;
    margin-top:80px;
    background:url('../images/h5.jpg') center center/cover no-repeat;
    display:flex;
    align-items:center;
}

.page-hero6{
    position:relative;
    height:480px;
    margin-top:80px;
    background:url('../images/h6.jpg') center center/cover no-repeat;
    display:flex;
    align-items:center;
}




.page-overlay{
    position:absolute;
    inset:0;
    background:rgba(255,255,255,.55);
}

.page-hero-content{
    position:relative;
    z-index:2;
    max-width:700px;
}

.page-hero-content h1{
    font-family:'Playfair Display', serif;
    font-size:56px;
    color:#222;
    margin-bottom:15px;
}

.page-hero-content p{
    font-size:20px;
    color:#4A4A4A;
}

.page-content{
    padding:70px 0;
}

.page-content h2{
    font-family:'Playfair Display', serif;
    font-size:40px;
    margin-bottom:25px;
    color:#222;
}

.page-content p{
    font-size:18px;
    line-height:1.8;
    margin-bottom:20px;
}

/* MOBILE */

@media(max-width:768px){

    .page-hero{
        height:240px;
        text-align:center;
    }

    .page-hero-content h1{
        font-size:40px;
    }

    .page-hero-content p{
        font-size:18px;
    }

    .page-content{
        padding:50px 0;
    }

    .page-content h2{
        font-size:30px;
    }

    .page-content p{
        font-size:17px;
    }
}







input, select{
         height:29px;
        padding:4px 10px;
         border:1px solid #cfcfcf;
  border-radius:5px;
      font-size:16px;
    font-family:'Inter', sans-serif;
          color:#4A4A4A;
     background:#fff;
     transition:all .25s ease;
        outline:none;
}

textarea{
     min-height:140px;
        padding:10px;
         border:1px solid #cfcfcf;
  border-radius:5px;
      font-size:16px;
    font-family:'Inter', sans-serif;
          color:#4A4A4A;
     background:#fff;
         resize:vertical;
     transition:all .25s ease;
        outline:none;
}

input:focus, textarea:focus{
    border-color:#B98460;
      box-shadow:0 0 6px rgba(185,132,96,.15);
}