:root{
  --gold:#ffd700;
  --deep-blue:#001f54;
  --panel-width:300px;
  --bg-top:#ffffff;
  --bg-bottom:#e6eef5;
  --muted:#6b7280;
  --ease-out: cubic-bezier(.22,.9,.26,1);
}

*{
  box-sizing:border-box;
}

html,body{
  height:100%;
}

body{
  margin:0;
  font-family:'Montserrat',sans-serif;
  background:linear-gradient(135deg, var(--bg-bottom), var(--bg-top));
  color:#112;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}

/* sidebar + arc */
.sidebar{
  position:fixed;
  top:0;
  left:0;
  width:var(--panel-width);
  height:100%;
  z-index:220;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  align-items:stretch;
}

.sidebar-shape{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
}

.menu{
  position:relative;
  z-index:2;
  display:flex;
  flex-direction:column;
  padding:72px 22px 20px;
  gap:10px;
  min-height:100%;
}

.menu-btn{
  display:flex;
  align-items:center;
  gap:12px;
  background:transparent;
  border:none;
  color:rgba(255,255,255,0.96);
  font-weight:600;
  font-size:16px;
  padding:12px 8px;
  cursor:pointer;
  transition:transform .36s var(--ease-out), color .22s, text-shadow .22s;
  border-radius:8px;
  width:100%;
  overflow:visible;
  position:relative;
}

.menu-btn .icon{
  font-size:18px;
  display:inline-block;
  transition:opacity .4s ease, transform .3s ease;
  position:absolute;
  left:8px;
  opacity:0;
  transform:translateX(-20px);
}

.menu-btn .label{
  flex:1;
  text-align:left;
  display:inline-block;
  transform:translateX(0);
  transition:transform .36s var(--ease-out);
  position:relative;
  z-index:2;
}

.menu-btn:hover{
  transform:translateX(8px);
  color:var(--gold);
  text-shadow:0 0 10px rgba(255,215,0,0.5);
}

.menu-btn:hover .label{
  transform:translateX(30px);
}

.menu-btn:hover .icon{
  opacity:1;
  transform:translateX(0);
  animation:iconGlow 1.5s ease-in-out infinite;
}

@keyframes iconGlow{
  0%,100%{text-shadow:0 0 8px rgba(255,215,0,0.6)}
  50%{text-shadow:0 0 15px rgba(255,215,0,1)}
}

.menu-btn.active{
  color:#fff;
  text-shadow:0 0 14px rgba(255,215,0,0.9);
}

.menu-btn.active .icon{
  animation:blink 1.2s ease-in-out 0s 4;
}

@keyframes blink{
  0%{opacity:1;transform:scale(1)}
  50%{opacity:.6;transform:scale(1.05)}
  100%{opacity:1;transform:scale(1)}
}

/* oval CTA */
.sidebar-cta{
  margin-top:auto;
  margin-bottom:22px;
  background:linear-gradient(135deg,#d4af37,#b8860b,#d4af37);
  color:var(--deep-blue);
  font-weight:800;
  border:none;
  padding:24px 40px;
  border-radius:999px;
  cursor:pointer;
  font-size:15px;
  align-self:center;
  margin-left:-73px;
  box-shadow:0 10px 36px rgba(0,0,0,0.14);
  transition:transform .18s ease,box-shadow .18s ease, filter .2s ease;
  overflow:hidden;
  display:flex;
  align-items:center;
  justify-content:center;
  position:relative;
  z-index:1;
}

.menu .back-to-top{
  background:linear-gradient(135deg,#0f172a,#1e293b,#0f172a);
  color:#fff;
  font-weight:600;
  border:none;
  padding:14px 6px;
  border-radius:999px;
  cursor:pointer;
  font-size:16px;
  align-self:center;
  margin-left:-60px;
  margin-bottom:8px;
  box-shadow:0 8px 24px rgba(0,0,0,0.12);
  transition:transform .18s ease,box-shadow .18s ease, filter .2s ease;
  overflow:hidden;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
}

.menu .back-to-top:hover{
  background:linear-gradient(135deg,#1e3a8a,#3b82f6,#1e40af);
  box-shadow:0 12px 32px rgba(0,0,0,0.18);
  transform:translateY(-1px);
}

.menu .back-to-top:active{
  transform:translateY(2px) scale(.998);
  box-shadow:0 4px 16px rgba(0,0,0,0.15);
}

.menu .back-to-top::after{
  content:"";
  position:absolute;
  top:-100%;
  left:-150%;
  width:60%;
  height:300%;
  background:linear-gradient(60deg, rgba(255,255,255,0) 0%, rgba(255,255,255,.3) 50%, rgba(255,255,255,0) 100%);
  transform:rotate(10deg);
  transition:left 2.1s var(--ease-out);
}

.menu .back-to-top:hover::after{
  left:130%;
}

.sidebar-cta:active{
  transform:translateY(3px) scale(.997);
  box-shadow:0 6px 20px rgba(0,0,0,0.18);
}

.sidebar-cta:hover{
  background:linear-gradient(135deg,#f5d66a,#ffd700,#ffec8a);
  box-shadow:0 16px 48px rgba(0,0,0,0.22);
}

.sidebar-cta::after{
  content:"";
  position:absolute;
  top:-100%;
  left:-150%;
  width:60%;
  height:300%;
  background:linear-gradient(60deg, rgba(255,255,255,0) 0%, rgba(255,255,255,.55) 50%, rgba(255,255,255,0) 100%);
  transform:rotate(10deg);
  transition:left 2.1s var(--ease-out);
}

.sidebar-cta:hover::after{
  left:130%;
}

/* main content */
.content{
  margin-left:calc(var(--panel-width) + 24px);
  padding:40px;
  transition:margin-left .36s var(--ease-out);
}

.section{
  max-width:980px;
  margin:0 auto;
  padding:42px 0;
  border-bottom:1px solid rgba(0,0,0,0.04);
}

.lead{
  font-size:18px;
  line-height:1.6;
  color:#223;
}

/* about grid (photo right) */
.about-grid{
  display:grid;
  grid-template-columns:1fr 360px;
  gap:28px;
  align-items:start;
}

.about-photo{
  position:relative;
  top:-40px;
}

.about-photo img{
  width:85%;
  height:auto;
  border-radius:6px;
  box-shadow:0 12px 48px rgba(0,0,0,0.12);
  transition:transform .28s ease, filter .28s ease;
  margin:0 auto;
}

/* Улучшенная галерерия дипломов и сертификатов */
.edu-photos, .cert-photos{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:16px;
  margin:20px 0;
}

.edu-photos img, .cert-photos img{
  width:100%;
  height:180px;
  object-fit:contain;
  background:white;
  border-radius:8px;
  box-shadow:0 4px 12px rgba(0,0,0,0.1);
  cursor:pointer;
  transition:all 0.3s ease;
  border:1px solid #e0e0e0;
  padding:8px;
}

/* Увеличение при наведении */
.edu-photos img:hover, .cert-photos img:hover{
  transform:scale(2.4);
  z-index:10;
  position:relative;
  box-shadow:0 8px 25px rgba(0,0,0,0.2);
  filter:none;
}

/* certificates layout with caption */
.cert-photos figure{
  margin:0;
  text-align:center;
}

.cert-photos figcaption{
  font-size:13px;
  color:var(--muted);
  margin-top:8px;
}

/* Для мобильных устройств */
@media (max-width:768px){
  .edu-photos, .cert-photos{
    grid-template-columns:repeat(2,1fr);
  }
  
  .edu-photos img, .cert-photos img{
    height:150px;
  }
  
  .edu-photos img:hover, .cert-photos img:hover{
    transform:scale(1.3);
  }
}

@media (max-width:480px){
  .edu-photos, .cert-photos{
    grid-template-columns:1fr;
  }
  
  .edu-photos img, .cert-photos img{
    height:200px;
  }
}

/* typography and widows handling */
p,li{
  widows:2;
  orphans:2;
}

/* forms - make large and same width */
.large-form{
  max-width:640px;
  display:flex;
  flex-direction:column;
  gap:12px;
}

input[type="text"],select,textarea{
  padding:12px;
  border-radius:8px;
  border:1px solid #d5dbe3;
  font-size:15px;
}

textarea{
  min-height:120px;
  resize:vertical;
}

label.consent{
  font-size:13px;
  color:var(--muted);
  display:flex;
  gap:8px;
  align-items:center;
}

.form-btn{
  position:relative;
  background:var(--deep-blue);
  color:#fff;
  border:none;
  padding:12px 18px;
  font-weight:700;
  border-radius:8px;
  cursor:pointer;
  max-width:360px;
  overflow:hidden;
  transition:filter .2s ease, opacity .2s ease;
}

.form-btn:hover{
  opacity:0.98;
}

.form-btn::after{
  content:"";
  position:absolute;
  top:-120%;
  left:-160%;
  width:60%;
  height:340%;
  background:linear-gradient(60deg, rgba(255,255,255,0) 0%, rgba(255,255,255,.35) 50%, rgba(255,255,255,0) 100%);
  transform:rotate(10deg);
}

.form-btn:hover::after{
  animation:shine 4.2s ease-in-out;
}

@keyframes shine{
  0%{left:-160%}
  60%{left:80%}
  100%{left:120%}
}

.form-btn:disabled{
  opacity:.55;
  filter:grayscale(1);
  cursor:not-allowed;
}

/* animated text (soft lift on show) */
.anim-title, .anim-text{
  opacity:0;
  transform:translateY(10px);
  transition:opacity .52s ease, transform .52s cubic-bezier(.2,.8,.2,1);
}

.section.show .anim-title, .section.show .anim-text{
  opacity:1;
  transform:translateY(0);
}

/* hamburger (mobile) */
.hamburger{
  display:none;
  position:fixed;
  top:16px;
  left:16px;
  z-index:440;
  background:transparent;
  border:none;
  width:32px;
  height:24px;
  padding:0;
  border-radius:0;
  cursor:pointer;
}

.hamburger::before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:2px;
  height:3px;
  background:var(--deep-blue);
  box-shadow:0 8px 0 0 var(--deep-blue), 0 16px 0 0 var(--deep-blue);
}

.footer{
  padding:24px 0;
  color:#667;
  text-align:center;
  font-size:14px;
}

/* responsive */
@media(max-width:980px){
  .about-grid{
    grid-template-columns:1fr 300px;
  }
  
  :root{
    --panel-width:260px;
  }
  
  .content{
    margin-left:calc(var(--panel-width) + 20px);
  }
}

@media(max-width:680px){
  .hamburger{
    display:block;
  }
  
  .sidebar{
    transform:translateX(-115%);
    position:fixed;
    transition:transform .7s var(--ease-out);
  }
  
  .sidebar.open{
    transform:translateX(0);
  }
  
  .content{
    margin-left:0;
    padding:20px;
  }
  
  .menu{
    padding:72px 18px 18px;
  }
  
  .about-grid{
    grid-template-columns:1fr;
    gap:16px;
    align-items:center;
  }
  
  .about-photo img{
    height:260px;
    object-fit:cover;
  }
  
  .form-btn{
    max-width:100%;
  }
}

.form-btn.force-disabled{
  opacity:.55 !important;
  filter:grayscale(1) !important;
  cursor:not-allowed !important;
  pointer-events:none !important;
}

.form-btn.force-disabled[disabled]{
  opacity:.55 !important;
  filter:grayscale(1) !important;
  cursor:not-allowed !important;
  pointer-events:none !important;
  background:#cccccc !important;
  color:#666666 !important;
}

/* Стили для таблицы цен */
.prices-table{
  border-collapse:collapse !important;
  width:100% !important;
  margin:20px 0 !important;
  font-size:15px !important;
  box-shadow:0 4px 12px rgba(0,0,0,0.08) !important;
  border-radius:8px !important;
  overflow:hidden !important;
  background:white !important;
}

.prices-table th{
  background:#001f54 !important;
  color:white !important;
  font-weight:700 !important;
  padding:16px 12px !important;
  text-align:center !important;
  border:none !important;
  font-size:16px !important;
}

.prices-table td{
  padding:14px 12px !important;
  text-align:center !important;
  border-bottom:1px solid #eaeaea !important;
}

.prices-table td:first-child{
  text-align:left !important;
  font-weight:600 !important;
  color:#001f54 !important;
  font-size:16px !important;
}

.prices-table td:not(:first-child){
  font-weight:600 !important;
  color:#2d3748 !important;
}

.prices-table td:empty::before{
  content:"—" !important;
  color:#a0aec0 !important;
}

/* Мобильная версия таблицы */
@media(max-width:680px){
  .prices-table{
    font-size:14px !important;
  }
  
  .prices-table th, .prices-table td{
    padding:12px 8px !important;
  }
}

.back-to-top{
  margin-top:8px;
}

/* Стили для галереи отзывов - как дипломы */
.reviews-gallery{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:16px;
  margin:20px 0;
}

.review-item{
  display:flex;
  flex-direction:column;
  gap:15px;
  background:white;
  padding:15px;
  border-radius:8px;
  box-shadow:0 4px 12px rgba(0,0,0,0.1);
  border:1px solid #e0e0e0;
  cursor:pointer;
  transition:all 0.3s ease;
  text-align:center;
}

.review-item:hover{
  transform:scale(1.4);
  z-index:10;
  position:relative;
  box-shadow:0 8px 25px rgba(0,0,0,0.2);
}

.review-photo{
  width:100%;
  height:120px;
}

.review-photo img{
  width:100%;
  height:100%;
  object-fit:contain;
  border-radius:6px;
  background:white;
  padding:5px;
}

.review-text p{
  font-style:italic;
  margin-bottom:8px;
  line-height:1.4;
  font-size:14px;
}

.review-text span{
  color:var(--muted);
  font-size:12px;
  font-weight:600;
}

/* Стиль для текстовых отзывов БЕЗ фото */
.review-item.text-only{
  text-align:left;
  padding:20px;
  grid-column:span 2;
  justify-content:center;
}

.review-item.text-only:hover{
  transform:scale(1.1);
}

/* Адаптивность для отзывов */
@media(max-width:1200px){
  .reviews-gallery{
    grid-template-columns:repeat(2,1fr);
  }
  
  .review-item.text-only{
    grid-column:1/-1;
  }
}

@media(max-width:680px){
  .reviews-gallery{
    grid-template-columns:1fr;
  }
  
  .review-item:hover{
    transform:scale(1.2);
  }
  
  .review-item.text-only:hover{
    transform:scale(1.05);
  }
  /* ← ДОБАВЬТЕ ЭТИ 3 СТРОКИ ДЛЯ МОБИЛЬНЫХ */
  .review-item:active .review-photo img {
    transform: scale(3.0);
  }
}

/* Увеличение фото внутри отзывов как у дипломов */
.review-photo img {
  transition: transform 0.3s ease;
}

.review-item:hover .review-photo img {
  transform: scale(4.4); /* Увеличение на 340% */
}

/* Отключить увеличение всей карточки, чтобы работало только фото */
.review-item:hover {
  transform: none;
  z-index: 10;
  position: relative;
  box-shadow: 0 8px 25px rgba(0,0,0,0.2);
}
}