html {
  scroll-behavior: smooth;
  scroll-padding-top: 100px
}

.dropdown-menu {
  opacity: 0;
  visibility: hidden;
  transform: translateY(10px);
  transition: all .25s
}

.dropdown:hover .dropdown-menu {
  opacity: 1;
  visibility: visible;
  transform: none
}

.sec-title {
  font-family: Merriweather, serif;
  font-weight: 900;
  color: #0f5b43;
  font-size: 2rem;
  position: relative;
  padding-bottom: 1rem;
  margin-bottom: 2rem
}

.sec-title::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 70px;
  height: 4px;
  background: #c8a24a
}

.sec-title.center {
  text-align: center
}

.sec-title.center::after {
  left: 50%;
  transform: translateX(-50%)
}

.btn {
  display: inline-block;
  padding: .8rem 1.8rem;
  font-weight: 700;
  border-radius: 4px;
  transition: all .3s
}

.btn-gold {
  background: #c8a24a;
  color: #0a3d2d
}

.btn-gold:hover {
  background: #fff;
  transform: translateY(-2px)
}

.btn-brand {
  background: #0f5b43;
  color: #fff
}

.btn-brand:hover {
  background: #c8a24a;
  color: #0a3d2d
}

.btn-line {
  border: 2px solid #fff;
  color: #fff
}

.btn-line:hover {
  background: #fff;
  color: #0f5b43
}

.box {
  background: #fff;
  border: 1px solid #e3ebe6;
  border-bottom: 4px solid #0f5b43;
  padding: 1.5rem;
  transition: all .3s
}

.box:hover {
  border-bottom-color: #c8a24a;
  transform: translateY(-6px);
  box-shadow: 0 14px 30px rgba(15, 91, 67, .15)
}

.reveal {
  opacity: 0;
  transform: translateY(24px);
  transition: all .7s ease
}

.reveal.in {
  opacity: 1;
  transform: none
}

.slider {
  overflow: hidden
}

.slides {
  display: flex;
  transition: transform .6s ease
}

.slide {
  min-width: 100%;
  padding: 0 .5rem
}

.dot {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: #cbd8d1;
  transition: .3s
}

.dot.on {
  background: #0f5b43;
  width: 30px;
  border-radius: 6px
}

.ph {
  background: repeating-linear-gradient(45deg, #e8f0ec, #e8f0ec 12px, #dfe9e3 12px, #dfe9e3 24px)
}

@media(prefers-reduced-motion:reduce) {
  * {
    animation: none !important;
    transition: none !important
  }

  .reveal {
    opacity: 1;
    transform: none
  }
}

/* Video hero */
.vhero {
  background: linear-gradient(135deg, #0a3d2d, #137a5c)
}

.vhero-overlay {
  background: linear-gradient(180deg, rgba(5, 35, 27, .85) 0, rgba(5, 35, 27, 0) 28%), linear-gradient(100deg, rgba(5, 35, 27, .92) 0%, rgba(5, 35, 27, .72) 55%, rgba(5, 35, 27, .45) 100%)
}

.vhero p,
.vhero h1,
.vhero h2 {
  text-shadow: 0 2px 12px rgba(0, 0, 0, .45)
}

.vglass {
  background: rgba(255, 255, 255, .12);
  border: 1px solid rgba(255, 255, 255, .3);
  border-top: 4px solid #c8a24a;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px)
}

.vstats {
  background: linear-gradient(0deg, rgba(5, 35, 27, .92), rgba(5, 35, 27, .55));
  border-top: 1px solid rgba(255, 255, 255, .2)
}

.h-line {
  opacity: 0;
  transform: translateY(30px);
  animation: hUp .9s cubic-bezier(.2, .7, .2, 1) forwards;
  animation-delay: var(--d, 0s)
}

@keyframes hUp {
  to {
    opacity: 1;
    transform: none
  }
}

/* Transparent header over hero (index only) */
.overlay-mode #site-header {
  background: transparent;
  border-bottom-color: rgba(255, 255, 255, .25)
}

.overlay-mode #site-header nav {
  color: #fff
}

.overlay-mode #site-header .dropdown-menu {
  color: #0f5b43
}

.overlay-mode #site-header img {
  background: #fff;
  border-radius: 6px;
  padding: 3px
}

.overlay-mode #burger {
  color: #fff
}

.overlay-mode.scrolled #topbar {
  display: none
}

.overlay-mode.scrolled #site-header {
  background: #fff;
  border-bottom-color: #0f5b43;
  box-shadow: 0 6px 20px rgba(0, 0, 0, .15)
}

.overlay-mode.scrolled #site-header nav {
  color: #0f5b43
}

.overlay-mode.scrolled #burger {
  color: #0f5b43
}

/* Our History section */
.hist-bg-year {
  position: absolute;
  right: -2%;
  top: -30px;
  font-family: Merriweather, serif;
  font-weight: 900;
  font-size: clamp(8rem, 22vw, 20rem);
  line-height: 1;
  color: #0f5b43;
  opacity: .05;
  pointer-events: none;
  user-select: none
}

.hframe {
  box-shadow: 0 20px 40px rgba(15, 91, 67, .18);
  overflow: hidden
}

.hframe:first-child {
  outline: 4px solid #c8a24a;
  outline-offset: 14px
}

.hbadge {
  background: #0f5b43;
  color: #fff;
  padding: 1.1rem 1.4rem;
  display: flex;
  align-items: center;
  gap: .9rem;
  box-shadow: 0 14px 30px rgba(15, 91, 67, .35);
  border-left: 5px solid #c8a24a
}

.hmini {
  background: #f4f7f5;
  border-top: 3px solid #c8a24a;
  padding: 1rem;
  transition: .3s
}

.hmini:hover {
  background: #0f5b43;
  color: #fff;
  transform: translateY(-5px)
}

.hmini b {
  display: block;
  font-family: Merriweather, serif;
  font-size: 1.5rem;
  color: #0f5b43
}

.hmini:hover b {
  color: #c8a24a
}

.hmini span {
  font-size: .78rem;
  line-height: 1.35;
  display: block;
  margin-top: .25rem
}

.reveal-left,
.reveal-right {
  opacity: 0;
  transition: all .9s ease
}

.reveal-left {
  transform: translateX(-60px)
}

.reveal-right {
  transform: translateX(60px)
}

.reveal-left.in,
.reveal-right.in {
  opacity: 1;
  transform: none
}

.mline {
  position: relative;
  padding-top: 1.5rem
}

.mline-bar {
  position: absolute;
  top: 2.1rem;
  left: 6%;
  right: 6%;
  height: 3px;
  background: #dfe9e3
}

.mline-bar span {
  display: block;
  height: 100%;
  width: 0;
  background: #c8a24a;
  transition: width 2.2s ease .3s
}

.mline.in .mline-bar span {
  width: 100%
}

.mdot {
  position: relative;
  padding-top: 1.6rem
}

.mdot i {
  position: absolute;
  top: .35rem;
  left: 50%;
  transform: translateX(-50%);
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: #fff;
  border: 4px solid #0f5b43;
  transition: .3s
}

.mdot:hover i {
  background: #c8a24a;
  transform: translateX(-50%) scale(1.4)
}

@media(max-width:639px) {
  .mline-bar {
    display: none
  }
}


/* Facts: scroll puzzle */
.pz {
  position: relative;
  height: 480vh;
  background: #f4f7f5
}

.pz-stage {
  position: sticky;
  top: 0;
  height: 100vh;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 118px 1rem 1.5rem
}

.pz-head {
  text-align: center;
  max-width: 46rem;
  margin-bottom: 1.2rem
}

.pz-board {
  position: relative;
  flex: none
}

.pz-piece {
  position: absolute;
  will-change: transform;
  background-image: url('https://www.riaoverseas.com/wp-content/uploads/2021/08/Volgograd-State-Medical-University.jpg'), linear-gradient(135deg, #0f5b43 0%, #0a3d2d 55%, #137a5c 100%);
  background-repeat: no-repeat;
  filter: drop-shadow(0 8px 14px rgba(0, 0, 0, .25))
}

.pz-piece span {
  position: absolute;
  left: calc(var(--t) + 16px);
  top: calc(var(--t) + 14px);
  right: calc(var(--t) + 10px);
  color: #fff;
  font-weight: 600;
  font-size: var(--fs, 15px);
  text-shadow: 0 2px 8px rgba(0, 0, 0, .6);
  transition: opacity .5s
}

/* solved state */
.pz.solved .pz-piece span {
  opacity: 0
}

.pz.solved .pz-board {
  animation: pzpop .9s ease
}

@keyframes pzpop {
  0% {
    transform: scale(1)
  }

  35% {
    transform: scale(1.04)
  }

  100% {
    transform: scale(1)
  }
}

@media(prefers-reduced-motion:reduce) {
  .pz {
    height: auto
  }

  .pz-stage {
    position: static;
    height: auto;
    padding-top: 120px
  }

}

/* video layer (expands to full screen) */
.pz-video {
  position: absolute;
  z-index: 5;
  left: 0;
  top: 0;
  width: 0;
  height: 0;
  overflow: hidden;
  opacity: 0;
  pointer-events: none;
  border-radius: 14px;
  background: linear-gradient(135deg, #0f5b43, #0a3d2d);
  transition: opacity .7s ease;
  box-shadow: 0 30px 60px rgba(10, 61, 45, .35)
}

.pz-video video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block
}

.pz-video::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(0deg, rgba(5, 35, 27, .35), transparent 50%)
}

.pz.solved .pz-video {
  opacity: 1
}

/* hide header when video is full screen */
#site-header {
  transition: transform .4s, background .35s, box-shadow .35s, border-color .35s
}

body.pz-full #site-header {
  transform: translateY(-110%)
}

/* why volgmu */
/* Why VolGMU */
.wy-item{display:flex;align-items:center;gap:1rem;padding:.9rem 1.1rem;background:#f4f7f5;border-left:4px solid #c8a24a;transition:transform .35s,background .35s,color .35s,box-shadow .35s}
.wy-item:hover{background:#0f5b43;color:#fff;transform:translateX(10px);box-shadow:0 12px 26px rgba(15,91,67,.25)}
.wy-ic{flex:none;width:46px;height:46px;border-radius:50%;background:#fff;color:#0f5b43;display:grid;place-items:center;border:2px solid #c8a24a;transition:.35s}
.wy-ic svg{width:22px;height:22px}
.wy-item:hover .wy-ic{background:#c8a24a;color:#0a3d2d}
.wy-panel{position:relative;overflow:hidden;color:#fff;padding:2.5rem;border-top:6px solid #c8a24a;
  background:radial-gradient(500px 300px at 100% 0%,rgba(19,122,92,.6),transparent 65%),linear-gradient(135deg,#072e24,#0a3d2d);box-shadow:0 30px 60px rgba(10,61,45,.25)}
.wy-panel::after{content:"✚";position:absolute;right:-40px;bottom:-90px;font-size:18rem;line-height:1;opacity:.05;pointer-events:none}
.wy-tile{position:relative;padding:1.4rem 1.2rem;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);opacity:0;transform:translateY(24px);transition:opacity .7s ease,transform .7s ease,background .3s}
.wy-tile:hover{background:rgba(255,255,255,.14)}
.wy-tile::before{content:"";position:absolute;left:0;top:0;height:3px;width:0;background:#c8a24a;transition:width 1s ease .5s}
.wy-panel.in .wy-tile{opacity:1;transform:none}
.wy-panel.in .wy-tile::before{width:100%}
.wy-ring{position:absolute;right:.6rem;top:.6rem;width:58px;height:58px;transform:rotate(-90deg)}
.wy-ring circle{fill:none;stroke-width:9}
.wy-ring .bg{stroke:rgba(255,255,255,.15)}
.wy-ring .fg{stroke:#c8a24a;stroke-linecap:round;stroke-dasharray:326.7;stroke-dashoffset:326.7;transition:stroke-dashoffset 1.8s ease .6s}
.wy-panel.in .wy-ring .fg{stroke-dashoffset:215.6} /* 34% */
@media(prefers-reduced-motion:reduce){.wy-tile{opacity:1;transform:none}}

/* Why Study: expanding panels */
.ws-row{display:flex;gap:14px;height:430px;margin-top:1rem}
.ws-card{position:relative;flex:1;overflow:hidden;cursor:pointer;color:#fff;padding:1.4rem;display:flex;flex-direction:column;justify-content:space-between;outline:none;
  background:linear-gradient(0deg,rgba(5,35,27,.88),rgba(5,35,27,.3)),var(--img,none),linear-gradient(135deg,#0f5b43,#0a3d2d);
  background-size:cover;background-position:center;border-bottom:5px solid #c8a24a;transition:flex .65s cubic-bezier(.2,.7,.2,1),filter .4s}
.ws-card:nth-child(2n){background-color:#0c4a3a}
.ws-card.active{flex:3.4}
.ws-ic{width:54px;height:54px;border-radius:50%;border:2px solid #c8a24a;color:#c8a24a;display:grid;place-items:center;background:rgba(5,35,27,.5);transition:.4s}
.ws-ic svg{width:26px;height:26px}
.ws-card.active .ws-ic{background:#c8a24a;color:#0a3d2d;transform:scale(1.1)}
.ws-v{writing-mode:vertical-rl;transform:rotate(180deg);font-weight:700;font-size:1rem;letter-spacing:.03em;align-self:flex-start;max-height:260px;overflow:hidden;opacity:.9;transition:opacity .3s}
.ws-h{font-family:Merriweather,serif;font-weight:900;font-size:clamp(1.3rem,2.2vw,1.9rem);line-height:1.25;max-width:22rem;position:absolute;left:1.4rem;bottom:1.4rem;right:1.4rem;opacity:0;transform:translateY(20px);transition:opacity .4s,transform .5s}
.ws-card.active .ws-v{opacity:0}
.ws-card.active .ws-h{opacity:1;transform:none;transition-delay:.25s}
.ws-h::before{content:"";display:block;width:50px;height:4px;background:#c8a24a;margin-bottom:.9rem}
@media(max-width:1023px){
  .ws-row{flex-direction:column;height:auto}
  .ws-card,.ws-card.active{flex:none;min-height:130px;flex-direction:row;align-items:center;gap:1rem;justify-content:flex-start}
  .ws-v{display:none}
  .ws-h{position:static;opacity:1;transform:none;font-size:1.05rem}
  .ws-h::before{display:none}
}

/* footer section */
/* Footer (premium) */
.ft{background:radial-gradient(800px 400px at 100% 0%,rgba(19,122,92,.45),transparent 65%),radial-gradient(600px 300px at 0% 100%,rgba(200,162,74,.12),transparent 60%),#072e24}
.ft-ecg{position:absolute;top:0;left:0;width:100%;height:60px;opacity:.8}
.ft-ecg path{fill:none;stroke:#c8a24a;stroke-width:2;stroke-dasharray:1500;stroke-dashoffset:1500;animation:ftdraw 6s linear infinite}
@keyframes ftdraw{60%{stroke-dashoffset:0}100%{stroke-dashoffset:0;opacity:0}}
/* rotating badge */
.ft-badge{position:relative;display:block;width:200px;height:200px;border-radius:50%;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.15);transition:transform .4s}
.ft-badge:hover{transform:scale(1.07)}
.ft-spin{position:absolute;inset:0;animation:ftspin 18s linear infinite}
.ft-spin text{fill:#c8a24a;font-size:15.5px;font-weight:700;letter-spacing:.14em;font-family:'Open Sans',sans-serif}
@keyframes ftspin{to{transform:rotate(360deg)}}
.ft-arrow{position:absolute;inset:50px;border-radius:50%;background:#c8a24a;color:#0a3d2d;font-size:2.4rem;font-weight:700;display:grid;place-items:center;transition:.4s}
.ft-badge:hover .ft-arrow{background:#fff;transform:rotate(45deg)}
/* columns */
.ft-h{font-family:Merriweather,serif;color:#fff;font-size:1.05rem;font-weight:700;margin-bottom:1.3rem;padding-bottom:.7rem;position:relative}
.ft-h::after{content:"";position:absolute;left:0;bottom:0;width:36px;height:3px;background:#c8a24a}
.ft-link{display:inline-block;transition:color .25s,transform .25s}
.ft-link::before{content:"›";color:#c8a24a;margin-right:.5rem}
.ft-link:hover{color:#c8a24a;transform:translateX(5px)}
.ft-contact{display:flex;align-items:center;gap:.8rem;transition:color .25s}
.ft-contact i{font-style:normal;width:38px;height:38px;border-radius:50%;border:1.5px solid rgba(200,162,74,.6);color:#c8a24a;display:grid;place-items:center;transition:.3s}
.ft-contact:hover{color:#c8a24a}.ft-contact:hover i{background:#c8a24a;color:#0a3d2d}
.ft-soc{width:42px;height:42px;border-radius:50%;border:1.5px solid rgba(255,255,255,.35);display:grid;place-items:center;font-weight:700;font-size:.8rem;color:#fff;transition:.3s}
.ft-soc:hover{background:#c8a24a;border-color:#c8a24a;color:#0a3d2d;transform:translateY(-4px)}
/* giant name */
.ft-giant{font-family:Merriweather,serif;font-weight:900;text-align:center;line-height:.78;font-size:clamp(5rem,22vw,20rem);white-space:nowrap;user-select:none;margin-bottom:-.12em;
  -webkit-text-stroke:1.5px rgba(200,162,74,.45);color:transparent;
  background:linear-gradient(0deg,rgba(200,162,74,.28),transparent 75%);-webkit-background-clip:text;background-clip:text}
/* back to top */
.ft-top{position:fixed;right:20px;bottom:20px;width:46px;height:46px;border-radius:50%;background:#0f5b43;color:#fff;font-size:1.3rem;border:2px solid #c8a24a;z-index:40;opacity:0;pointer-events:none;transform:translateY(20px);transition:all .35s;box-shadow:0 8px 20px rgba(0,0,0,.25)}
.ft-top.show{opacity:1;pointer-events:auto;transform:none}
.ft-top:hover{background:#c8a24a;color:#0a3d2d}
@media(prefers-reduced-motion:reduce){.ft-spin,.ft-ecg path{animation:none}.ft-ecg path{stroke-dashoffset:0}}


/* CTA band */
.cta{background:linear-gradient(135deg,rgba(7,46,36,.93),rgba(15,91,67,.88)),url('../img/cta.jpg') center/cover fixed,linear-gradient(135deg,#072e24,#0f5b43)}
.cta::before{content:"✚";position:absolute;right:-60px;top:-100px;font-size:26rem;line-height:1;opacity:.05;pointer-events:none}
.cta-track{display:flex;align-items:center;justify-content:center;gap:0;margin:2.8rem auto 2.8rem;max-width:520px}
.cta-node{flex:none;width:72px;height:72px;border-radius:50%;border:2px solid rgba(255,255,255,.7);display:grid;place-items:center;color:#fff;background:rgba(255,255,255,.08)}
.cta-node svg{width:32px;height:32px}
.cta-node-gold{border-color:#c8a24a;background:#c8a24a;color:#0a3d2d;animation:ctapulse 2.4s ease-out infinite}
@keyframes ctapulse{0%{box-shadow:0 0 0 0 rgba(200,162,74,.6)}100%{box-shadow:0 0 0 26px rgba(200,162,74,0)}}
.cta-line{position:relative;flex:1;height:0;border-top:2px dashed rgba(255,255,255,.5)}
.cta-line i{position:absolute;top:-7px;left:0;width:12px;height:12px;border-radius:50%;background:#c8a24a;box-shadow:0 0 12px #c8a24a;animation:ctamove 2.4s ease-in-out infinite}
@keyframes ctamove{0%{left:0;opacity:0}15%{opacity:1}85%{opacity:1}100%{left:calc(100% - 12px);opacity:0}}

/* Reviews */
.rv-bigquote{position:absolute;left:2%;top:-40px;font-family:Merriweather,serif;font-weight:900;font-size:26rem;line-height:1;color:#0f5b43;opacity:.06;pointer-events:none}
.rv-btn{width:52px;height:52px;border-radius:50%;border:2px solid #0f5b43;color:#0f5b43;font-size:1.3rem;font-weight:700;transition:.3s;background:#fff}
.rv-btn:hover{background:#0f5b43;color:#fff;transform:scale(1.08)}
.rv-bar{height:4px;background:#d6e2db;margin-top:2rem;max-width:280px}
.rv-bar span{display:block;height:100%;background:#c8a24a;width:0;transition:width .6s ease}
.rv-view{overflow:hidden;padding:1rem 0 2rem;margin:-1rem 0 -2rem}
.rv-track{display:flex;gap:24px;transition:transform .7s cubic-bezier(.2,.7,.2,1)}
.rv-card{flex:0 0 88%;background:#fff;padding:2.4rem 2.2rem;border-top:6px solid #c8a24a;box-shadow:0 20px 45px rgba(15,91,67,.12);position:relative;opacity:.45;transform:scale(.96);transition:opacity .6s,transform .6s}
.rv-card.on{opacity:1;transform:none}
.rv-q{width:44px;height:44px;color:#c8a24a;margin-bottom:1.1rem}
.rv-av{width:58px;height:58px;border-radius:50%;background:#0f5b43;color:#c8a24a;font-family:Merriweather,serif;font-weight:900;font-size:1.5rem;display:grid;place-items:center;border:3px solid #c8a24a;flex:none}
.rv-fac{display:inline-block;margin-top:.3rem;font-size:.75rem;font-weight:700;background:#eaf2ee;color:#0f5b43;padding:.25rem .7rem;border-radius:999px}
@media(max-width:639px){.rv-card{flex-basis:100%;padding:1.8rem 1.4rem}}