/* Subpages of protoship.dev (imprint, privacy, 404): the hall floor, the gantry and one chamfered panel from the home page,
   without the factory. */
@font-face{font-family:"Saira Stencil One";src:url(/fonts/saira-stencil-one/saira-stencil-one-latin-400-normal.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Chakra Petch";src:url(/fonts/chakra-petch/chakra-petch-latin-400-normal.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Chakra Petch";src:url(/fonts/chakra-petch/chakra-petch-latin-600-normal.woff2) format("woff2");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:"Chakra Petch";src:url(/fonts/chakra-petch/chakra-petch-latin-700-normal.woff2) format("woff2");font-weight:700;font-style:normal;font-display:swap}

:root{
  --f-sten:"Saira Stencil One","Arial Black",Impact,sans-serif;
  --f-ui:"Chakra Petch","Segoe UI",system-ui,sans-serif;
  --floor:#d9d7d0;--seam:rgba(84,78,60,.075);--yel:#f0b400;--hz:#1e1f1e;
  --ink:#1b1e1d;--ink-2:#454b48;--rule:#c3c6c0;--panel:#f3f4f0;--panel-edge:#2d3230;
  --orange:#ef6b1f;--orange-hi:#f5813b;--orange-lo:#b04c10;--shadow:rgba(52,47,33,.2);--focus:#1d5fd6;
  --nav-h:64px;--gut:clamp(16px,3.4vw,56px);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;min-height:100vh;display:flex;flex-direction:column;color:var(--ink);background-color:var(--floor);
  background-image:linear-gradient(90deg,var(--seam) 1px,transparent 1px),linear-gradient(0deg,var(--seam) 1px,transparent 1px);
  background-size:80px 80px;font:400 17px/1.6 var(--f-ui);font-synthesis:none}
::selection{background:var(--yel);color:var(--ink)}
a{color:inherit;text-underline-offset:3px}
:focus-visible{outline:3px solid var(--focus);outline-offset:3px}
.skip{position:fixed;left:12px;top:-80px;z-index:100;background:var(--ink);color:#fff;padding:12px 16px;font-weight:600;text-decoration:none}
.skip:focus{top:12px}

.gantry{position:sticky;top:0;z-index:50;height:var(--nav-h);background:linear-gradient(#f1f2ee,#e3e4df);
  border-top:1px solid #b9bcb6;box-shadow:0 2px 0 #3a3f3d,0 8px 0 rgba(52,47,33,.14)}
.gantry::after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:4px;background:repeating-linear-gradient(-45deg,var(--yel) 0 7px,var(--hz) 7px 14px)}
.gantry-in{height:100%;display:flex;align-items:center;gap:16px;padding:0 var(--gut)}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;min-height:44px;margin-right:auto}
.brand svg{width:30px;height:30px;flex:none}
.brand span{font:400 25px/1 var(--f-sten);letter-spacing:.01em;padding-top:2px}
.btn{--cut:9px;--bg:var(--orange);position:relative;isolation:isolate;display:inline-flex;align-items:center;min-height:44px;padding:0 18px;
  font:600 15px/1.1 var(--f-ui);color:var(--ink);text-decoration:none;white-space:nowrap}
.btn::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--bg);
  clip-path:polygon(var(--cut) 0,100% 0,100% calc(100% - var(--cut)),calc(100% - var(--cut)) 100%,0 100%,0 var(--cut));box-shadow:inset 0 -4px 0 var(--orange-lo)}
.btn:hover{--bg:var(--orange-hi)}

main{flex:1;width:100%;max-width:860px;margin:0 auto;padding:56px var(--gut) 72px}
.sheet{--c:18px;position:relative;isolation:isolate;filter:drop-shadow(6px 8px 0 var(--shadow));padding:44px clamp(22px,4.4vw,56px) 40px}
.sheet::before,.sheet::after{content:"";position:absolute;z-index:-1}
.sheet::before{inset:0;background:var(--panel-edge);clip-path:polygon(var(--c) 0,100% 0,100% calc(100% - var(--c)),calc(100% - var(--c)) 100%,0 100%,0 var(--c))}
.sheet::after{inset:2px;background:var(--panel);clip-path:polygon(calc(var(--c) - 1px) 0,100% 0,100% calc(100% - var(--c) + 1px),calc(100% - var(--c) + 1px) 100%,0 100%,0 calc(var(--c) - 1px))}
h1{margin:0 0 10px;font:400 clamp(36px,5.4vw,58px)/1.02 var(--f-sten);letter-spacing:.005em}
.lede{margin:0 0 8px;color:var(--ink-2)}
h2{margin:36px 0 10px;padding-top:26px;border-top:1px solid var(--rule);font:700 20px/1.3 var(--f-ui)}
h3{margin:22px 0 6px;font:700 17px/1.35 var(--f-ui)}
p,ul{margin:0 0 12px}
ul{padding-left:1.2em}
li{margin:0 0 6px}
address{font-style:normal}
.de{margin-top:44px}
.de>h2:first-child{margin-top:0}

.yard{margin-top:auto;background:#3b3e3c;color:#e8eae5}
.yard::before{content:"";display:block;height:16px;background:repeating-linear-gradient(-45deg,var(--yel) 0 12px,var(--hz) 12px 24px);box-shadow:0 2px 0 #1a1b1a}
.yard-in{max-width:860px;margin:0 auto;padding:30px var(--gut) 40px;display:flex;flex-wrap:wrap;gap:4px 18px;font-size:15px}
.yard a{color:#fff;display:inline-flex;align-items:center;min-height:44px}
.yard a:hover{color:var(--yel)}
.yard a:focus-visible{outline-color:var(--yel)}
@media (max-width:599px){
  body{font-size:16px}
  main{padding-top:36px}
  .brand span{font-size:22px}
}
a[href^="tel:"]{white-space:nowrap}