/* Illustrated portal frame in the existing graphite and amber palette. */
body{background:linear-gradient(#090b0dbb,#090b0de8 850px),url('assets/zone.png') center top/cover fixed}
.shell{max-width:1380px;margin:30px auto;background-color:#22272a;box-shadow:inset 0 0 0 3px #111416,inset 0 0 0 5px #54534f,0 0 70px 20px #000c}
.shell>header{position:relative;isolation:isolate;display:grid;grid-template-columns:1fr auto 1fr;grid-template-rows:245px 66px;gap:0 24px;padding:0 28px;background:#161b1e;border:1px solid #686960;border-bottom:4px ridge #62635c;overflow:hidden}
.shell>header:before{content:'';position:absolute;inset:0;z-index:-2;background:url('assets/portal-header.png') center center/cover no-repeat}.shell>header:after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,#080c0ff5 0%,#0b1013c9 19%,transparent 40%),radial-gradient(ellipse at 50% 40%,#0a0f134d,transparent 42%)}
.shell>header .brand{grid-column:2;grid-row:1;min-width:0;align-self:center;text-align:center;margin-top:10px;filter:drop-shadow(0 4px 5px #000)}.shell>header .brand>span{font-size:76px;letter-spacing:10px;color:#e5e2d8;background:linear-gradient(#f0eee3cc,#c9c9c0b0),url('assets/metal.png') center/200px;background-clip:text;-webkit-background-clip:text}.shell>header .brand small{font-size:16px;letter-spacing:13px;margin-top:17px;text-align:center;color:#d6cbb5}
.shell>header .nav{grid-column:1;grid-row:2;display:flex;gap:27px;margin:0;align-self:center}.shell>header .nav a{font-family:Oswald,sans-serif;font-size:18px;padding:12px 0}.shell>header .nav a.active{color:var(--amber)}.shell>header .headersearch{grid-column:2;grid-row:2;width:260px;max-width:none;margin:0 auto;align-self:center}.shell>header .headersearch input{background:#090d10cc;border-color:#585b59}.shell>header .account{grid-column:3;grid-row:2;justify-self:end;align-self:center;min-width:110px;text-align:center;background:#101619c9}
.sectionnav{border-bottom:3px ridge #575c5b;background:linear-gradient(#272d30,#12171a);justify-content:center;padding:0}.sectionnav a{padding:12px 14px}.hero{min-height:245px}.hero h1{font-size:48px}.hero:before{background-position:center 60%}
@media(max-width:1050px){.shell>header{padding:0 20px;column-gap:16px}.shell>header .nav{gap:18px}.shell>header .brand>span{font-size:64px}.shell>header .headersearch{width:220px}.sectionnav a{padding:11px 9px}.shell{margin:16px 10px}}
@media(max-width:760px){.shell{margin:0;padding:4px}.shell>header{grid-template-columns:1fr auto 1fr;grid-template-rows:200px 56px;column-gap:8px;padding:0 14px}.shell>header:before{background-size:auto 256px;background-position:center top}.shell>header .brand{grid-column:1/-1;grid-row:1;margin-top:0}.shell>header .brand>span{font-size:49px;letter-spacing:6px}.shell>header .brand small{font-size:12px;letter-spacing:9px;margin:13px 0 0;text-align:center}.shell>header .nav,.shell>header .headersearch{display:none}.shell>header .account{grid-column:1;grid-row:2;justify-self:start;font-size:13px;padding:5px 12px;min-width:100px}.shell>header .menubutton{grid-column:3;grid-row:2;justify-self:end;align-self:center;display:block;font-size:26px;padding:5px 12px;border:1px solid #5c6060;background:#11171bd9}.sectionnav{justify-content:start}.hero{min-height:235px}.hero h1{font-size:35px}}
