
:root{
--gold:#c89a47;
--text:#1d1d1d;
--muted:#6f6f6f;
--soft:#faf6f3;
--border:#e8e0d5;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
margin:0;
font-family:Inter,sans-serif;
color:var(--text);
background:#fff;
line-height:1.4;
}
.container{
width:min(1280px,calc(100% - 40px));
margin:auto;
}
header{
position:sticky;
top:0;
background:rgba(255,255,255,.96);
backdrop-filter:blur(12px);
border-bottom:1px solid var(--border);
z-index:99;
}
.header{
display:flex;
align-items:center;
justify-content:space-between;
padding:20px 0;
gap:20px;
}

.logo { background: url('../img/logo.jpg') no-repeat 0 7px; width: 300px; height: 60px; background-size: contain; }

nav{
display:flex;
gap:44px;
}
nav a{
text-decoration:none;
color:var(--text);
font-size:20px;
}


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

.btn{
background:var(--gold);
color:#fff;
padding:25px 32px;
border-radius:12px;
text-decoration:none;
display:inline-block;
font-size: 20px;
transition: all 0.4s;
transform: scale(1);
}


.btn:hover { transform: scale(1.06) !important; }


.hero{
padding:70px 0 0;

background:linear-gradient(to right,#f8f4ef,white);
background:url('../img/top.jpg') no-repeat center top; 

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

#slider { height: 400px; }

.hero h1{
font-family:"Cormorant Garamond",serif;
font-size:78px;
line-height:.92;
margin:20px 0;
}
.hero p{
font-size:20px;
color:var(--muted);
max-width:520px;
}
.hero img{
width:100%;
border-radius:28px;
display:block;
}
.subtitle{
color:var(--gold);
text-transform:uppercase;
letter-spacing:.06em;
font-size: 14px;
}
.stats{
background:linear-gradient(90deg,#bb8d3d,#cfa55a);
color:#fff;
padding:35px 0;
margin-top:50px;
}
.stats-grid {
display:grid;
grid-template-columns:repeat(4,1fr);
gap:24px;

}
.stat b{
display:block;
font-size:48px;
padding-left: 86px;
}


.stat div { padding-left: 86px; color: #ebcfa3; font-size: 15px; line-height: 1.2; }


.section { padding:70px 0; }

.section-title{
font-family:"Cormorant Garamond",serif;
font-size:60px;
text-align:center;
margin-bottom:50px;
}


#features { margin-top: -36px; }
#features .section-title { font-size: 40px; }
#features .section-title span { color: var(--gold); }
#features .section-title p { font-size: 24px; }

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


#podhod { display: none; }

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


#cases { margin-top: -45px; }

.cases {
    display: grid;
    grid-template-columns: repeat(2,2fr);
    gap: 18px;
}



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


#block_round p { width: 400px; height: 400px; margin: 0; padding: 0; margin: 0 auto; position: relative; }
#block_round p img { display: block; width: 100%; height: 100%; object-fit: contain; overflow: hidden; border-radius: 100%; z-index: 2; position: relative; }

#block_round p:before { content: ""; position: absolute; left: -10px; top: -10px; background: #fff; width: 430px; height: 430px; border-radius: 100%; z-index: 1; }

.card{
padding:28px;
border:1px solid var(--border);
border-radius:22px;
text-align:center;
}
.icon{
width:60px;
height:60px;
/*color:var(--gold); */
color: #e4c189;
margin-bottom:18px;
}
.teacher{
background:var(--soft);
}


#teacher { overflow: hidden; }
#teacher div div { float: left; width: 50%; }

#teacher_about img { float: left; width:200px;
border-radius:30px; margin-right: 64px; margin-bottom: 32px; }

#teacher_about p {  }

#teacher_text h2 { font-size: 44px; font-family:"Cormorant Garamond",serif; margin-top: 0; line-height: 1.2; }
#teacher_text h2 span { color: var(--gold); }

#teacher_text h3 { font-size: 18px; font-weight: normal; margin-bottom: 32px; }

#teacher_text b { position: relative; margin-bottom: 32px; font-weight: normal; }
#teacher_text b .icon { position: absolute; left: -5px; top: 0; width: 44px; height: 44px; }
#teacher_text b p { padding-left: 48px; padding-right: 94px; font-size: 18px; min-height: 44px; }


#teacher_about { background: #f4ece7; padding: 16px; border-radius: 32px; border: 1px solid #ccc; margin-top: 16px; }


#teacher_about h2{
font-family:"Cormorant Garamond",serif;
font-size:44px;
margin:0 0 10px;
line-height: 1.2;
margin-top: 32px;
}
.teacher-role{
color:var(--gold);
margin-bottom:20px;
}
.cases{
display:grid;
grid-template-columns:repeat(5,1fr);
gap:18px;
}
.case{
border:1px solid var(--border);
border-radius:18px;
overflow:hidden;
background:#fff;
}
.case img{
width:100%;
display:block;
}
.case div{
padding:18px;
font-weight:600;
padding-bottom: 6px;
}

.case p{
padding:18px;
font-weight:400;
font-size: 14px;
padding-top: 0;
color: #666;
}



footer { padding:32px 0; }

.footer{
display:grid;
grid-template-columns:repeat(4,1fr);
gap:30px;
}
.footer h3{
margin-top:0;
}
.footer p { font-size: 15px; color: #666; }
.footer p a { color: #666; text-decoration: none; }



@media(max-width:1200px){
.features,.cases{
grid-template-columns:repeat(2,1fr);
}
.hero-grid,.teacher-grid,.footer{
grid-template-columns:1fr;
}
.hero h1{
font-size:64px;
}
}



@media(max-width:1024px){
.features,.cases, .stats-grid {
grid-template-columns:repeat(2,2fr);
}
.hero-grid,.teacher-grid,.footer{
grid-template-columns:2fr;
}
.hero h1{ font-size:44px; }

.hero p { font-size: 17px; color: var(--muted); }
.subtitle { font-size: 14px; }

}



@media(max-width:768px){

#teacher_text { margin-bottom: 64px; }
.hero p { font-size: 15px; }
.stats { margin-top: 16px; }

.btn { padding: 16px 24px; font-size: 17px; }

nav { display:none; }
,.stats-grid,.footer, .podhod { grid-template-columns:1fr; }

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

.section-title { font-size:40px; }

.hero { padding: 30px 0 0; background-size: 110%; }

.subtitle { width: 50%; font-size: 13px; }


#teacher div div { float: none; width: auto; }
.section { padding: 36px 0; }

#teacher_about img { width: 120px; border-radius: 16px; margin-right: 32px; }

#teacher_about h2 { font-size: 36px; line-height: 1; margin-top: 0; }


.stats { padding-top: 0; }
.stats .stat svg { top: 0; }

.stat b { font-size: 36px; padding-top: 76px; }
.stat b, .stat div { padding-left: 0; }


#teacher_about p { margin-top: 48px; color: #666; font-size: 15px; }
#teacher_text h2 { font-size: 30px !important; }

.case div, .case p { padding: 10px; margin: 0; }
.case p { padding-top: 0; padding-bottom: 32px; }

#features .section-title { font-size: 32px; line-height: 1; margin-top: 32px; }


.card { padding: 16px; border-radius: 10px; }


.contacts_top {  display: grid; grid-template-columns: repeat(1,1fr); }
#block_round p { width: 192px; height: 192px; margin-left: 0; }


#block_round p:before {
    width: 210px;
    height: 210px;
    left: -7px;
    top: -6px;
}

#contacts_top span { font-size: 16px !important; }


#contacts_top h1 { margin: 0; line-height: 0.9 !important; margin-top: 16px; font-size: 48px !important; }
#contacts_top p { font-size: 18px !important; }

#footer_social { padding-left: 0 !important; }

}














.stats .stat { position: relative; }
.stats .stat svg { position: absolute; left: 0; top: 10px; width: 74px; height: 74px; }

#footer_social { padding-left: 64px; }
#footer_social p { position: relative; line-height: 44px; padding-left: 48px; }
#footer_social .icon-vk { position: absolute; left: 0; top: 0; width: 44px; height: 44px; }

#teacher_text ul li {
    display: flex;
    align-items: center;
    gap: 18px;
    font-size: 28px;
    color: #333;
}


#contacts_top { background: var(--gold); padding-bottom: 84px; }
#contacts_top h1  { color: #fff; font-family: "Cormorant Garamond",serif; font-size: 56px; line-height: 1; }
#contacts_top p { font-size: 20px; color: #fff; }

#contacts_top span { display: block; color: #ebcfa3; font-size: 18px; line-height: 1.2; }


#contacts_top a  { color: #fff; }

#contacts_top svg { position: absolute; left: 0; top: 0; width: 24px; height: 24px; color: #fff; }

#welt { line-height: 44px; }