/* Гид по кампусу. Шрифты Prata и Golos Text — локальные, см. campusguide-fonts.css */
:root{
  --bg:#000000;
  --panel:#0B0D07;
  --paper:#EDF0E4;
  --muted:#8D9680;
  --faint:#565E4B;
  --lime:#CFEB9E;
  --lime-soft:#E2F3C4;
  --hair:rgba(207,235,158,.16);
  --hair-2:rgba(207,235,158,.3);
  --dark:#0C1005;

  --serif:"Prata",Georgia,"Times New Roman",serif;
  --sans:"Golos Text",-apple-system,"Segoe UI",sans-serif;

  --pad:clamp(22px,5vw,86px);
  --ease:cubic-bezier(.16,.84,.3,1);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;background:var(--bg);color:var(--paper);
  font-family:var(--sans);font-size:17px;line-height:1.62;font-weight:400;
  -webkit-font-smoothing:antialiased;overflow-x:hidden;
}
body.locked{overflow:hidden}
svg{display:block;max-width:100%}
a{color:inherit}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;text-align:left}
:focus-visible{outline:2px solid var(--lime);outline-offset:4px}
::selection{background:var(--lime);color:var(--dark)}

/* ── загрузка ── */
#loader{position:fixed;inset:0;z-index:200;background:var(--bg);display:grid;place-items:center;
  transition:opacity .8s var(--ease),visibility .8s}
#loader.done{opacity:0;visibility:hidden}
#loader p{font-family:var(--serif);font-size:clamp(20px,3vw,30px);color:var(--lime);margin:0;
  overflow:hidden;white-space:nowrap;border-right:1px solid var(--lime);width:0;
  animation:type 1.1s steps(24) forwards,blink .7s step-end infinite}
@keyframes type{to{width:11.2em}}
@keyframes blink{50%{border-color:transparent}}

/* ── шапка ── */
header{position:fixed;top:0;left:0;right:0;z-index:100;padding:20px var(--pad);
  display:flex;align-items:baseline;justify-content:space-between;gap:30px;
  background:linear-gradient(to bottom,rgba(0,0,0,.92),rgba(0,0,0,.6) 65%,transparent);
  backdrop-filter:blur(8px)}
header .who{font-family:var(--serif);font-size:17px;letter-spacing:.01em}
header .credit{font-family:var(--sans);font-size:10px;line-height:1.3;color:var(--muted);letter-spacing:.04em;margin-top:4px}
header nav{display:flex;gap:24px;font-size:14.5px;color:var(--muted)}
header nav a{text-decoration:none;transition:color .35s}
header nav a:hover,header nav a.on{color:var(--lime)}
@media(max-width:900px){header nav{display:none}}

main{position:relative}
section{padding:clamp(80px,10vw,152px) var(--pad)}
.wrap{max-width:1280px;margin:0 auto}

h1,h2,h3,.serif{font-family:var(--serif);font-weight:400;letter-spacing:-.01em}
h2{font-size:clamp(32px,5.2vw,62px);line-height:1.04;margin:0 0 22px;max-width:19ch}
h3{font-size:clamp(21px,2.4vw,29px);line-height:1.18;margin:0}
.intro{font-size:clamp(17px,1.4vw,20px);line-height:1.6;color:var(--muted);max-width:56ch}
.intro b{color:var(--paper);font-weight:500}

.head{display:grid;grid-template-columns:1.15fr 1fr;gap:clamp(20px,4vw,70px);align-items:end;
  padding-bottom:34px;border-bottom:1px solid var(--hair);margin-bottom:clamp(34px,5vw,64px)}
@media(max-width:900px){.head{grid-template-columns:1fr;gap:18px}}

/* ── обложка ── */
.cover{min-height:100svh;display:flex;align-items:center;padding-top:132px;padding-bottom:70px}
.cover-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:clamp(30px,6vw,90px);align-items:center;width:100%}
@media(max-width:1000px){.cover-grid{grid-template-columns:1fr;gap:44px}}
.eyebrow{font-size:14px;color:var(--muted);margin-bottom:30px;opacity:0}
h1{font-size:clamp(46px,8.2vw,116px);line-height:.97;margin:0 0 30px}
h1 span{display:block;overflow:hidden}
h1 span i{display:block;font-style:normal;transform:translateY(102%)}
.go h1 span i{animation:rise 1.1s var(--ease) forwards}
.go h1 span:nth-child(2) i{animation-delay:.1s}
.go h1 span:nth-child(3) i{animation-delay:.2s}
@keyframes rise{to{transform:translateY(0)}}
.go .eyebrow{animation:soft .9s var(--ease) .05s forwards}
.cover .intro{opacity:0}
.go .cover .intro{animation:soft .9s var(--ease) .5s forwards}
@keyframes soft{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}

/* каталог-меню на обложке */
.menu{border:1px solid var(--hair-2);padding:26px 26px 20px;background:var(--panel);opacity:0}
.go .menu{animation:soft 1s var(--ease) .62s forwards}
.menu h4{margin:0 0 18px;font-family:var(--serif);font-size:21px;font-weight:400;color:var(--lime)}
.menu button{display:flex;justify-content:space-between;align-items:baseline;gap:14px;width:100%;
  padding:13px 0;border-bottom:1px solid var(--hair);font-size:15.5px;color:var(--paper);
  transition:color .3s,padding-left .35s var(--ease)}
.menu button:last-of-type{border-bottom:0}
.menu button:hover{color:var(--lime);padding-left:8px}
.menu button em{font-style:normal;font-family:var(--serif);color:var(--faint);font-size:15px;transition:color .3s}
.menu button:hover em{color:var(--lime)}

/* цифры под обложкой */
.figs{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(16px,3vw,50px);
  padding:clamp(40px,5vw,64px) var(--pad);border-top:1px solid var(--hair);max-width:1280px;margin:0 auto}
@media(max-width:760px){.figs{grid-template-columns:repeat(2,1fr);gap:30px}}
.figs b{display:block;font-family:var(--serif);font-weight:400;font-size:clamp(34px,4.4vw,56px);
  line-height:1;color:var(--lime)}
.figs span{display:block;margin-top:10px;font-size:14px;color:var(--muted);line-height:1.45;max-width:24ch}

/* ── адреса ── */
.places{border-top:1px solid var(--hair)}
.place{display:grid;grid-template-columns:1fr 1.15fr;gap:clamp(16px,3vw,54px);
  padding:30px 0;border-bottom:1px solid var(--hair)}
@media(max-width:860px){.place{grid-template-columns:1fr;gap:12px}}
.place h3{margin-bottom:6px}
.place .addr{font-size:14px;color:var(--lime);letter-spacing:.01em}
.place ul{margin:0;padding:0;list-style:none;font-size:15.5px;color:var(--muted);line-height:1.85}
.place li{padding-left:18px;position:relative}
.place li::before{content:"";position:absolute;left:0;top:12px;width:8px;height:1px;background:var(--lime)}

/* ── карта ── */
.wide{max-width:1580px}
.map-shell{display:grid;grid-template-columns:minmax(0,1.62fr) minmax(250px,.38fr);gap:clamp(20px,3vw,44px);align-items:start}
@media(max-width:1080px){.map-shell{grid-template-columns:1fr}}
.map-box{background:var(--panel);padding:clamp(16px,2.4vw,30px);border:1px solid var(--hair)}
.zone{cursor:pointer}
.zone .sh{fill:rgba(207,235,158,.07);stroke:var(--hair-2);stroke-width:1;transition:fill .45s var(--ease),stroke .45s}
.zone:hover .sh,.zone.act .sh{fill:var(--lime);stroke:var(--lime)}
.zone .t1{font-family:"Prata",serif;font-size:17px;fill:var(--paper);transition:fill .45s}
.zone .t2{font-family:"Golos Text",sans-serif;font-size:11.5px;fill:var(--muted);transition:fill .45s}
.zone:hover .t1,.zone.act .t1,.zone:hover .t2,.zone.act .t2{fill:var(--dark)}
.map-cap{font-family:"Golos Text",sans-serif;font-size:11px;fill:var(--faint)}
.map-info{border-left:1px solid var(--hair-2);padding-left:clamp(18px,2vw,30px);min-height:250px}
.map-info h3{margin-bottom:6px}
.map-info .addr{font-size:14px;color:var(--lime);margin-bottom:14px}
.map-info p{font-size:15.5px;color:var(--muted);margin:0 0 16px}
.map-info ul{margin:0;padding:0;list-style:none;font-size:15.5px;line-height:1.8}
.map-info li{padding-left:18px;position:relative}
.map-info li::before{content:"";position:absolute;left:0;top:13px;width:8px;height:1px;background:var(--lime)}
.swap{animation:soft .5s var(--ease)}

/* ── изометрия ── */
.iso-wrap{position:relative}
#isoMap{width:100%;height:auto;overflow:visible}
.bld{cursor:pointer;transition:transform .45s var(--ease)}
.bld:hover,.bld.act{transform:translate(0,-9px)}
.bld .f{stroke:#0B0F06;stroke-width:.8;stroke-linejoin:round;transition:fill .4s var(--ease)}
.bld .top{fill:#D4EDA2}
.bld .lf{fill:#A6CC77}
.bld .rf{fill:#7FA755}
.bld:hover .top,.bld.act .top{fill:#EFFBD9}
.bld:hover .lf,.bld.act .lf{fill:#C4E294}
.bld:hover .rf,.bld.act .rf{fill:#9DC66A}
.ctx{cursor:default}
.ctx .f{stroke:rgba(207,235,158,.32);stroke-width:.9}
.ctx .top{fill:#0F150B}.ctx .lf{fill:#0A0F07}.ctx .rf{fill:#070B05}
.ctx:hover{transform:none}
.lbl{opacity:0;pointer-events:none;transition:opacity .7s var(--ease)}
.lbl.on{opacity:1}
.num{font-family:"Prata",serif;fill:#0B0F06}
.ctx .num{fill:rgba(207,235,158,.2)}
.wall{font-family:"Golos Text",sans-serif;fill:rgba(11,15,6,.6);letter-spacing:.14em;font-size:8.5px}
.ctx .wall{fill:rgba(207,235,158,.4)}
.env{fill:#070B04;stroke:rgba(207,235,158,.14);stroke-width:.9}
.env2{fill:#0C1208;stroke:rgba(207,235,158,.18);stroke-width:.9}
.entm{fill:var(--lime)}
.entl{font-family:"Golos Text",sans-serif;fill:var(--lime);font-size:11px;font-weight:500}
.roofcap{letter-spacing:.2em}
.env-line{fill:none;stroke:rgba(207,235,158,.22);stroke-width:.9}
.env-t{font-family:"Golos Text",sans-serif;fill:var(--faint);letter-spacing:.2em;font-size:10px}
.iso-cap{margin-top:16px;font-size:13px;color:var(--faint);line-height:1.55;max-width:62ch}
.offsite{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:20px}
.offsite button{border:1px solid var(--hair);padding:15px 17px;transition:border-color .35s,color .35s}
.offsite button:hover,.offsite button.act{border-color:var(--lime)}
.offsite b{display:block;font-family:var(--serif);font-weight:400;font-size:18px;margin-bottom:3px}
.offsite span{font-size:13px;color:var(--muted)}
.offsite button:hover b,.offsite button.act b{color:var(--lime)}
@media(max-width:520px){.offsite{grid-template-columns:1fr}}
.zmeta{display:flex;flex-wrap:wrap;gap:6px 20px;font-size:13.5px;color:var(--lime);margin:-6px 0 16px}

/* ── каталог ── */
.filters{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 22px;margin-bottom:14px}
.chip{font-size:15px;color:var(--muted);padding:6px 0;border-bottom:1px solid transparent;transition:color .3s,border-color .3s}
.chip:hover{color:var(--paper)}
.chip.on{color:var(--lime);border-color:var(--lime)}
.tally{margin-left:auto;font-family:var(--serif);font-size:15px;color:var(--faint)}
.rows{border-top:1px solid var(--hair)}
.row{display:grid;grid-template-columns:44px 1fr 210px;gap:22px;align-items:baseline;width:100%;
  padding:24px 0;border-bottom:1px solid var(--hair);position:relative;transition:padding-left .4s var(--ease)}
.row::after{content:"";position:absolute;left:0;bottom:-1px;height:1px;width:0;background:var(--lime);transition:width .5s var(--ease)}
.row:hover{padding-left:12px}
.row:hover::after{width:100%}
.row .no{font-family:var(--serif);font-size:15px;color:var(--faint);transition:color .35s}
.row:hover .no{color:var(--lime)}
.row .nm{display:block;font-family:var(--serif);font-size:clamp(19px,2vw,26px);line-height:1.2;transition:color .35s}
.row:hover .nm{color:var(--lime)}
.row .sb{display:block;margin-top:7px;font-size:14.5px;color:var(--muted);line-height:1.5;max-width:56ch}
.row .pl{font-size:13.5px;color:var(--faint);line-height:1.5}
.row.hide{display:none}
@media(max-width:860px){.row{grid-template-columns:32px 1fr;gap:14px}.row .pl{display:none}}

/* ── карточка ── */
.sheet{position:fixed;inset:0;z-index:150;display:none}
.sheet.open{display:block}
.veil{position:absolute;inset:0;background:rgba(0,0,0,.7);backdrop-filter:blur(5px);opacity:0;transition:opacity .5s var(--ease)}
.sheet.in .veil{opacity:1}
.card{position:absolute;right:0;top:0;bottom:0;width:min(600px,100%);background:var(--lime);color:var(--dark);
  padding:clamp(28px,4vw,52px);overflow-y:auto;transform:translateX(101%);transition:transform .6s var(--ease)}
.sheet.in .card{transform:none}
.card h3{font-size:clamp(27px,3.6vw,40px);line-height:1.08;margin:0 0 12px;max-width:15ch}
.card .kind{font-size:14px;color:#4A5A2E;margin-bottom:26px}
.card .body{font-size:16px;line-height:1.6}
.shut{position:absolute;top:20px;right:20px;font-size:14px;color:#4A5A2E;border-bottom:1px solid #4A5A2E;padding-bottom:1px}
.shut:hover{color:var(--dark);border-color:var(--dark)}
.facts{display:grid;grid-template-columns:96px 1fr;gap:10px 20px;margin:26px 0;padding:22px 0;
  border-top:1px solid rgba(12,16,5,.25);border-bottom:1px solid rgba(12,16,5,.25);font-size:15px}
.facts dt{color:#4A5A2E;font-size:13.5px}
.facts dd{margin:0}
.kit{margin:0;padding:0;list-style:none;font-size:14.5px;line-height:1.75;columns:1}
.kit li{padding-left:16px;position:relative;margin-bottom:7px}
.kit li::before{content:"";position:absolute;left:0;top:11px;width:8px;height:1px;background:var(--dark)}
.warn{margin-top:24px;padding:16px 18px;background:rgba(12,16,5,.08);font-size:14px;line-height:1.55}

/* ── инверсия: доступ ── */
.flip{background:var(--lime);color:var(--dark);position:relative}
.flip h2{max-width:16ch}
.flip .intro{color:#3E4D24;max-width:52ch}
.flip .head{border-bottom-color:rgba(12,16,5,.22)}
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(20px,3vw,44px)}
@media(max-width:900px){.steps{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.steps{grid-template-columns:1fr}}
.step{border-top:1px solid rgba(12,16,5,.28);padding-top:20px}
.step em{font-style:normal;font-family:var(--serif);font-size:15px;color:#5A6B39}
.step h4{font-family:var(--serif);font-weight:400;font-size:22px;margin:10px 0 10px}
.step p{margin:0;font-size:15px;line-height:1.6;color:#33401D}

/* ── сервисы ── */
.svc{display:grid;grid-template-columns:repeat(auto-fit,minmax(290px,1fr));gap:clamp(26px,3.4vw,54px)}
.svc article{border-top:1px solid var(--hair);padding-top:20px}
.svc h4{font-family:var(--serif);font-weight:400;font-size:22px;margin:0 0 10px}
.svc p{margin:0;font-size:15.5px;color:var(--muted);line-height:1.62}
.svc a{color:var(--lime);text-decoration:none;border-bottom:1px solid var(--hair-2)}
.svc a:hover{border-color:var(--lime)}

/* ── мелочи ── */
.tips{columns:2;column-gap:clamp(30px,5vw,70px)}
@media(max-width:780px){.tips{columns:1}}
.tip{break-inside:avoid;padding:20px 0;border-bottom:1px solid var(--hair)}
.tip b{display:block;font-family:var(--serif);font-weight:400;font-size:20px;margin-bottom:6px}
.tip span{font-size:15px;color:var(--muted);line-height:1.6}

/* ── подвал ── */
footer{background:var(--panel);border-top:1px solid var(--hair);padding:clamp(64px,8vw,110px) var(--pad) 44px}
.foot{display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(30px,5vw,80px)}
@media(max-width:880px){.foot{grid-template-columns:1fr}}
.foot h3{margin-bottom:16px}
.foot p,.foot li{font-size:15px;color:var(--muted);line-height:1.75}
.foot a{color:var(--lime);text-decoration:none;border-bottom:1px solid var(--hair)}
.foot a:hover{border-color:var(--lime)}
.foot ul{margin:0;padding:0;list-style:none}
.foot li{padding-left:18px;position:relative;margin-bottom:12px}
.foot li::before{content:"";position:absolute;left:0;top:12px;width:8px;height:1px;background:var(--lime)}
.sign{margin-top:56px;padding-top:20px;border-top:1px solid var(--hair);display:flex;
  justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:13.5px;color:var(--faint)}

/* ── появление заголовков ── */
.wipe{clip-path:inset(0 100% 0 0);transition:clip-path 1s var(--ease)}
.wipe.seen{clip-path:inset(0 0 0 0)}
.lift{opacity:0;transform:translateY(16px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
.lift.seen{opacity:1;transform:none}

@media(prefers-reduced-motion:reduce){
  *{animation-duration:.01ms!important;transition-duration:.01ms!important}
  h1 span i{transform:none}.eyebrow,.cover .intro,.menu{opacity:1}
  .wipe{clip-path:none}.lift{opacity:1;transform:none}
  html{scroll-behavior:auto}
  #loader p{width:11.2em;border-right:0}
}