/* Profundidade arquitetônica compartilhada pelos cinco andares do Planeta TI. */
.room{
  isolation:isolate;
  background:
    linear-gradient(90deg,rgba(0,0,0,.42),transparent 14%,transparent 86%,rgba(0,0,0,.48)),
    linear-gradient(180deg,#17101f 0 13%,#392542 13% 66%,#17101e 66% 100%);
  box-shadow:inset 0 0 100px rgba(0,0,0,.55);
}
.ceiling{height:82px!important;background:
  repeating-linear-gradient(90deg,transparent 0 calc(20% - 1px),rgba(255,255,255,.055) calc(20% - 1px) 20%),
  linear-gradient(180deg,#17101f,#2b1e33)!important;
  border-bottom:2px solid rgba(255,255,255,.08);box-shadow:0 14px 30px rgba(0,0,0,.35)}
.ceiling::after{content:"";position:absolute;left:3%;right:3%;bottom:-13px;height:13px;
  background:linear-gradient(180deg,#392941,#160f1e);clip-path:polygon(0 0,100% 0,98.5% 100%,1.5% 100%)}
.lamp{height:7px!important;width:96px!important;background:#fff4d9!important;
  border:1px solid #fff;box-shadow:0 18px 80px 16px rgba(255,214,168,.25)!important}
.window{left:9%!important;right:9%!important;top:102px!important;bottom:37%!important;border-radius:2px!important;
  border:8px solid #1a1220!important;outline:1px solid rgba(255,255,255,.2);
  box-shadow:0 18px 38px rgba(0,0,0,.42),inset 0 0 60px rgba(255,255,255,.09)!important}
.window::before,.window::after{width:7px!important;background:linear-gradient(90deg,#16101d,#4c3852,#16101d)!important}
.floorplane{height:38%!important;background:
  linear-gradient(168deg,rgba(255,255,255,.08),transparent 22%),
  repeating-linear-gradient(105deg,transparent 0 96px,rgba(255,255,255,.055) 97px 99px),
  linear-gradient(180deg,#3d2b46,#17101e)!important;
  border-top:7px solid #17101d!important;box-shadow:inset 0 24px 45px rgba(255,179,107,.08)!important}
.floorplane::after{opacity:.75!important;background:
  repeating-linear-gradient(176deg,transparent 0 58px,rgba(255,255,255,.045) 59px 60px),
  linear-gradient(180deg,rgba(255,179,107,.1),transparent 46%)!important}
.bench{left:10%!important;right:10%!important;bottom:14%!important;height:43px!important;border-radius:2px!important;
  background:linear-gradient(180deg,#765a72 0 8%,#38283f 9% 55%,#1d1524 56%)!important;
  border:1px solid rgba(255,255,255,.18)!important;box-shadow:0 24px 24px rgba(0,0,0,.55)!important}
.bench::after{content:"";position:absolute;left:5%;right:5%;top:100%;height:72px;
  background:linear-gradient(90deg,#17101d 0 3%,transparent 3% 48%,#17101d 48% 52%,transparent 52% 97%,#17101d 97%);
  clip-path:polygon(0 0,100% 0,98% 100%,95% 100%,95% 9%,52% 9%,52% 100%,48% 100%,48% 9%,5% 9%,5% 100%,2% 100%)}
.bench::before{content:"";position:absolute;left:5%;right:5%;bottom:100%;height:128px;filter:drop-shadow(0 10px 10px rgba(0,0,0,.5));pointer-events:none}

/* Silhuetas dos equipamentos mudam conforme o serviço do andar. */
.maintenance .bench::before{background:
  linear-gradient(#16141d,#09080d) 5% 56%/88px 68px no-repeat,
  linear-gradient(#31283a,#131019) 8% 100%/75px 54px no-repeat,
  linear-gradient(#09080d,#201827) 33% 74%/130px 11px no-repeat,
  linear-gradient(135deg,#342a3e,#0b0910) 48% 100%/118px 62px no-repeat,
  radial-gradient(circle,#ffb36b 0 3px,transparent 4px) 76% 56%/82px 82px no-repeat,
  linear-gradient(#15121a,#08070b) 82% 100%/86px 112px no-repeat}
.networks .bench::before{background:
  repeating-linear-gradient(180deg,#17131d 0 12px,#765a72 13px 15px,#09080c 16px 22px) 4% 100%/105px 122px no-repeat,
  repeating-linear-gradient(180deg,#17131d 0 12px,#765a72 13px 15px,#09080c 16px 22px) 92% 100%/105px 122px no-repeat,
  radial-gradient(circle at 20% 50%,#7dff9b 0 2px,transparent 3px) 50% 82%/210px 28px repeat-x,
  linear-gradient(#221a29,#0a090d) 50% 100%/250px 54px no-repeat}
.remote .bench::before{background:
  linear-gradient(#0a0910,#20172a) 12% 56%/150px 84px no-repeat,
  linear-gradient(135deg,#8157a1,#13101b 65%) 12% 53%/138px 72px no-repeat,
  linear-gradient(#0a0910,#20172a) 50% 50%/170px 96px no-repeat,
  linear-gradient(135deg,#a24acf,#15101c 68%) 50% 47%/158px 84px no-repeat,
  linear-gradient(#0a0910,#20172a) 88% 56%/150px 84px no-repeat,
  linear-gradient(135deg,#3c7088,#13101b 65%) 88% 53%/138px 72px no-repeat}
.formatting .bench::before{background:
  linear-gradient(#15131c,#08070b) 8% 100%/72px 110px no-repeat,
  radial-gradient(circle at 50% 38%,#ffb36b 0 3px,transparent 4px) 8% 100%/72px 110px no-repeat,
  linear-gradient(135deg,#352a3d,#0b0910) 38% 100%/118px 62px no-repeat,
  linear-gradient(#111018,#07060a) 68% 100%/44px 88px no-repeat,
  linear-gradient(135deg,#57435f,#0b0910) 91% 100%/112px 62px no-repeat}
.classes .bench::before{background:
  linear-gradient(#19131e,#09070c) 12% 75%/118px 68px no-repeat,
  linear-gradient(135deg,#795092,#120e18) 12% 70%/106px 56px no-repeat,
  linear-gradient(#19131e,#09070c) 50% 68%/132px 78px no-repeat,
  linear-gradient(135deg,#5d748d,#120e18) 50% 63%/120px 66px no-repeat,
  linear-gradient(#19131e,#09070c) 88% 75%/118px 68px no-repeat,
  linear-gradient(135deg,#96705d,#120e18) 88% 70%/106px 56px no-repeat}
.roomhead{padding-top:103px!important}.roomhead h1{font-size:clamp(32px,4.8vw,58px)!important;
  text-shadow:0 3px 1px rgba(0,0,0,.45),0 12px 35px rgba(0,0,0,.7)!important}
.fnum{display:inline-block;background:rgba(18,12,25,.72);border:1px solid rgba(255,179,107,.3);
  padding:7px 10px;border-radius:3px;backdrop-filter:blur(7px)}
.hint{display:inline-block;background:rgba(13,9,18,.62);padding:7px 10px;border-left:2px solid var(--sun);backdrop-filter:blur(6px)}
.spot .dot{width:15px!important;height:15px!important;background:#ffd5ff!important;border:2px solid #733995;
  box-shadow:0 0 18px rgba(232,179,255,.95)!important}.spot .dot::after{inset:4px!important;background:#26102f!important}

@media(max-width:767px){
  .room{height:650px!important}.window{left:3%!important;right:3%!important;top:94px!important;bottom:42%!important}
  .roomhead{padding-top:108px!important}.roomhead h1{font-size:clamp(28px,9vw,42px)!important;max-width:13ch!important}
  .bench{left:4%!important;right:4%!important;bottom:15%!important}.bench::before{transform:scale(.72);transform-origin:bottom center}
}

/* Salas semirrealistas geradas para cada andar. */
.room{height:calc(100svh - 68px)!important;min-height:620px;background-position:center!important;background-size:cover!important;background-repeat:no-repeat!important}
.room.maintenance{background-image:linear-gradient(180deg,rgba(4,4,10,.2),rgba(4,4,10,.08) 55%,rgba(4,4,10,.5)),url('/images/ti/rooms/manutencao-interior.png')!important}
.room.networks{background-image:linear-gradient(180deg,rgba(4,4,10,.2),rgba(4,4,10,.08) 55%,rgba(4,4,10,.5)),url('/images/ti/rooms/redes-interior.png')!important}
.room.remote{background-image:linear-gradient(180deg,rgba(4,4,10,.2),rgba(4,4,10,.08) 55%,rgba(4,4,10,.5)),url('/images/ti/rooms/suporte-remoto-interior.png')!important}
.room.formatting{background-image:linear-gradient(180deg,rgba(4,4,10,.2),rgba(4,4,10,.08) 55%,rgba(4,4,10,.5)),url('/images/ti/rooms/formatacao-interior.png')!important}
.room.classes{background-image:linear-gradient(180deg,rgba(4,4,10,.14),rgba(4,4,10,.04) 55%,rgba(4,4,10,.42)),url('/images/ti/rooms/aulas-interior.png')!important}
.room .ceiling,.room .lamp,.room .window,.room .floorplane,.room .bench{display:none!important}.roomhead{padding-top:34px!important}.roomhead h1{font-size:clamp(30px,4vw,52px)!important;max-width:14ch!important}.roomhead::before{content:"";position:absolute;z-index:-1;left:8px;top:18px;width:min(620px,85vw);height:190px;background:linear-gradient(90deg,rgba(5,8,22,.84),rgba(5,8,22,0));filter:blur(1px)}
.spot .card{background:rgba(12,8,20,.95)!important}.spot .dot{background:#fff1d6!important;border-color:var(--sun)!important;box-shadow:0 0 20px var(--sun)!important}
@media(max-width:767px){.room{height:650px!important;min-height:650px;background-size:auto 100%!important;background-position:center!important}.roomhead{padding-top:28px!important}.roomhead h1{font-size:clamp(25px,8vw,38px)!important}.roomhead::before{top:10px;height:180px}.room .spot:nth-of-type(1){left:22%!important;top:68%!important}.room .spot:nth-of-type(2){left:43%!important;top:78%!important}.room .spot:nth-of-type(3){left:66%!important;top:68%!important}.room .spot:nth-of-type(4){left:84%!important;top:78%!important}}