/* Missing Exhibitors: the hall floor on move-in day. Carpet ground, concrete booths, marking tape. */
@font-face{font-family:"Hanken Grotesk";font-style:normal;font-weight:800;font-display:swap;src:url("fonts/hanken-grotesk-latin-800-normal.woff2") format("woff2")}
@font-face{font-family:"Hanken Grotesk";font-style:normal;font-weight:600;font-display:swap;src:url("fonts/hanken-grotesk-latin-600-normal.woff2") format("woff2")}
@font-face{font-family:"Atkinson Hyperlegible";font-style:normal;font-weight:400;font-display:swap;src:url("fonts/atkinson-hyperlegible-latin-400-normal.woff2") format("woff2")}
@font-face{font-family:"Atkinson Hyperlegible";font-style:normal;font-weight:700;font-display:swap;src:url("fonts/atkinson-hyperlegible-latin-700-normal.woff2") format("woff2")}
@font-face{font-family:"Hanken Grotesk Figures";font-style:normal;font-weight:400;font-display:swap;unicode-range:U+0030-0039;src:url("fonts/hanken-grotesk-latin-400-normal.woff2") format("woff2")}
@font-face{font-family:"Hanken Grotesk Figures";font-style:normal;font-weight:700;font-display:swap;unicode-range:U+0030-0039;src:url("fonts/hanken-grotesk-latin-600-normal.woff2") format("woff2")}
@font-face{font-family:"Permanent Marker";font-style:normal;font-weight:400;font-display:swap;src:url("fonts/permanent-marker-latin-400-normal.woff2") format("woff2")}

:root{
  --carpet:#5a1730;      /* aisle carpet, the ground */
  --carpet-deep:#4a1127; /* carpet in shadow, occupied booths */
  --carpet-pile:#66203a; /* loop-pile highlight */
  --chalk:#f3f1ec;       /* text on carpet */
  --concrete:#cfcac0;    /* bare booth floor */
  --ink:#22201d;         /* text on concrete and tape */
  --ink-soft:#3d3833;
  --tape:#ff7a1a;        /* floor-marking tape: action and empty booths only */
  --sign:"Hanken Grotesk","Helvetica Neue",Arial,sans-serif;
  --text:"Hanken Grotesk Figures","Atkinson Hyperlegible",system-ui,sans-serif;
  --marker:"Permanent Marker","Comic Sans MS",cursive;
  --unit:1.5rem;
  --ease:cubic-bezier(.16,1,.3,1);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:5rem}
body{
  margin:0;min-height:100svh;display:flex;flex-direction:column;color:var(--chalk);font-family:var(--text);font-size:1.125rem;line-height:1.6;
  background-color:var(--carpet);
  background-image:
    radial-gradient(circle at 1px 1px,var(--carpet-pile) 1px,transparent 1.4px),
    radial-gradient(circle at 3px 3px,var(--carpet-deep) .9px,transparent 1.3px);
  background-size:4px 4px,4px 4px;
}
::selection{background:var(--tape);color:var(--ink)}
:focus-visible{outline:3px solid var(--tape);outline-offset:3px}
a{color:inherit;text-decoration-thickness:.08em;text-underline-offset:.22em}
a:hover{text-decoration-thickness:.16em}
h1,h2,h3{font-family:var(--sign);font-weight:800;line-height:1.15;letter-spacing:-.02em;margin:0;text-wrap:balance}
p,ul,ol{margin:0}
.wrap{max-width:76rem;margin:0 auto;padding:0 2.5rem}
main{flex:1 0 auto}
.skip{position:absolute;left:-999px;top:0;background:var(--tape);color:var(--ink);padding:.75rem 1rem;z-index:10}
.skip:focus{left:1rem;top:1rem}

/* buttons: a strip of marking tape */
.btn{
  display:inline-flex;align-items:center;min-height:3rem;padding:.7rem 1.6rem;
  background:var(--tape);color:var(--ink);font-family:var(--sign);font-weight:800;font-size:1.15rem;
  letter-spacing:.04em;text-transform:uppercase;text-decoration:none;
  clip-path:polygon(0 4%,3% 0,100% 2%,99% 96%,97% 100%,0 98%);
  transition:transform .4s var(--ease),background-color .3s var(--ease);
}
.btn:hover{transform:translateY(-2px);background:#ff8c38}
.btn-sm{min-height:2.75rem;padding:.45rem 1.1rem;font-size:1rem}
.btn-ink,.close .btn-ink{background:var(--ink);color:var(--tape)}
.btn-ink:hover{background:#000}
.act{margin-top:1.25rem}

/* header */
.mast{border-bottom:2px solid var(--carpet-deep);background:var(--carpet-deep)}
.mast-in{max-width:76rem;margin:0 auto;padding:.75rem 2.5rem;display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap}
.mark{display:block;color:var(--chalk);line-height:0}
.wm{width:19rem;height:auto}
.nav{display:flex;align-items:center;gap:1.25rem;font-family:var(--sign);font-weight:600;font-size:1rem}
.nav a:not(.btn){text-decoration:none;padding:.6rem 0;border-bottom:2px solid transparent}
.nav a:not(.btn):hover,.nav a[aria-current]{border-bottom-color:var(--concrete)}

/* booths and taped squares */
.booth{background:var(--concrete);color:var(--ink);padding:2.25rem;
}
.booth a{color:var(--ink)}
.taped{position:relative;padding:3rem;border:5px dashed var(--tape);color:var(--chalk)}

/* hero */
.hero{padding:4.5rem 0 3.5rem}
.hero-in{display:grid;grid-template-columns:repeat(12,1fr);gap:2.5rem;align-items:start}
.hero-h{grid-column:1/8;font-size:5.4rem;text-transform:uppercase;letter-spacing:-.025em;line-height:.98}
.hero-rail{grid-column:8/13;display:grid;gap:1.25rem;padding-top:.5rem}
.hero-sub{font-size:1.2rem;line-height:1.5}
.hero-act p:first-child{font-size:1.1rem}
.hero-plan{grid-column:1/13;margin-top:1.5rem}
.plan{display:block;width:100%;height:auto}
.plan .b-full{fill:#7a2a46;stroke:#94506a;stroke-width:1.5}
.plan .b-empty{fill:var(--concrete);stroke:var(--tape);stroke-width:3;stroke-dasharray:7 3}
.hero:has(.btn:hover) .plan .b-empty,.hero:has(.btn:focus-visible) .plan .b-empty{animation:march 1.2s linear infinite}
@keyframes march{
  to{stroke-dashoffset:-20}
}

/* sections */
.sec{padding-top:6rem}
.sec-h{font-size:2.75rem;margin-bottom:1.25rem;text-transform:uppercase}
.prob{display:grid;grid-template-columns:repeat(12,1fr);gap:2.5rem}
.prob-h{grid-column:1/6;text-transform:uppercase;margin:0}
.prob-body{grid-column:6/13;font-size:1.2rem;max-width:62ch}

.wwd{display:grid;grid-template-columns:5fr 7fr;gap:3rem}
.wwd-head p{max-width:60ch}
.ticks{list-style:none;padding:0;display:grid;gap:.85rem;align-content:start}
.ticks li{position:relative;padding-left:2rem}
.ticks li::before{content:"";position:absolute;left:0;top:.35em;width:1.05rem;height:1.05rem;background:var(--carpet)}
.ticks-light li::before{background:var(--concrete)}
.price-terms .ticks li::before{background:var(--carpet)}
.pct{font-size:2.2em;line-height:1;display:inline-block;margin-right:.1em}

.free{display:grid;grid-template-columns:7fr 5fr;gap:3rem;align-items:center}
.free-head>p{max-width:62ch}
.limits{margin:0 0 1.25rem}
.free-how{font-weight:700}

.steps{list-style:none;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:var(--unit);counter-reset:step}
.step{counter-increment:step;background:var(--concrete);color:var(--ink);padding:3.25rem 1.5rem 1.5rem;position:relative}
.step::before{content:counter(step);position:absolute;top:0;left:1.25rem;background:var(--tape);color:var(--ink);
  font-family:var(--marker);font-size:1.6rem;line-height:1;padding:.35rem .7rem .25rem;transform:rotate(-3deg) translateY(-30%)}
.step h3{font-size:1.35rem;margin-bottom:.6rem}

.price{display:grid;grid-template-columns:repeat(12,1fr);gap:2.5rem}
.price-lead{grid-column:1/13}
.price-big{font-family:var(--sign);font-weight:800;font-size:2.7rem;line-height:1.3;letter-spacing:-.015em;max-width:30ch;text-wrap:balance}
.price-add{margin-top:.75rem;font-size:1.35rem;font-weight:700}
.price-terms{grid-column:1/8}
.terms{gap:.75rem}
.terms a{overflow-wrap:anywhere}
.notinc{grid-column:8/13}
.notinc::before,.qa::before{content:"";display:block;height:3px;background:var(--concrete);margin-bottom:1rem}
.notinc h3{font-size:1.5rem;margin-bottom:.75rem}
.x{list-style:none;padding:0;display:grid;gap:.6rem}
.x li{padding-left:1.6rem;position:relative}
.x li::before{content:"";position:absolute;left:0;top:.5em;width:.9rem;height:.18rem;background:var(--concrete);transform:rotate(45deg)}
.x li::after{content:"";position:absolute;left:0;top:.5em;width:.9rem;height:.18rem;background:var(--concrete);transform:rotate(-45deg)}

.faq{display:grid;grid-template-columns:1fr 1fr;gap:2rem 3.5rem}
.qa{padding-top:0}
.qa h3{font-size:1.3rem;margin-bottom:.5rem}
.qa p{max-width:62ch}

.close{margin-top:7rem;background:var(--tape);color:var(--ink);padding:4.5rem 0}
.close a{color:var(--ink)}
.close-h{font-size:3.8rem;text-transform:uppercase;max-width:20ch}
.close-body{margin-top:1rem;font-size:1.2rem;max-width:58ch}

/* sub pages */
.sub{padding-top:5rem;padding-bottom:5rem}
.sub-box{max-width:52rem}
.sub-h{font-size:3.8rem;text-transform:uppercase;margin-bottom:1.25rem}
.lead{font-size:1.2rem;max-width:62ch}
.big-mail{margin-top:1.5rem}
.big-mail .btn{text-transform:none;letter-spacing:0;font-size:1.4rem;overflow-wrap:anywhere}

/* policy pages: long reading on a concrete booth */
.doc{display:grid;grid-template-columns:16rem 1fr;gap:3rem;padding-top:4rem;padding-bottom:4rem;align-items:start}
.doc-head{grid-column:1/3}
.doc-h{font-size:3.8rem;text-transform:uppercase}
.toc{position:sticky;top:1rem;font-family:var(--sign);font-weight:600;font-size:.98rem}
.toc ol{padding-left:1.25rem;display:grid;gap:.35rem}
.prose{background:var(--concrete);color:var(--ink);padding:3rem;max-width:none}
.prose>*{max-width:70ch}
.prose a{color:var(--ink);overflow-wrap:anywhere}
.prose h2{font-size:1.65rem;margin:2.5rem 0 .75rem}
.prose h2::before{content:"";display:block;height:3px;background:var(--carpet);margin-bottom:1rem}
.prose h2:first-of-type{margin-top:1.5rem}
.prose h3{font-size:1.25rem;margin:1.75rem 0 .5rem}
.prose p,.prose ul{margin:0 0 1rem}
.prose ul{padding-left:1.25rem}
.prose li{margin-bottom:.4rem}
.prose time{font-weight:700}

/* footer */
.foot{margin-top:0;background:var(--carpet-deep);border-top:2px solid var(--carpet-pile)}
.pg-home .foot{margin-top:0}
.foot-in{max-width:76rem;margin:0 auto;padding:2.5rem 2.5rem;display:grid;grid-template-columns:auto 1fr auto;gap:1.5rem 2.5rem;align-items:center}
.foot-mark{display:block;color:var(--concrete);line-height:0}
.foot-mark .wm{width:12rem}
.foot-text{display:grid;gap:.25rem;font-size:1rem}
.foot-links{display:flex;flex-wrap:wrap;gap:.25rem 1.25rem;font-family:var(--sign);font-weight:600}
.foot-links a{padding:.5rem 0}

@media (max-width:900px){
  .hero-in,.prob,.price{grid-template-columns:1fr}
  .hero-in{row-gap:1.25rem}
  .hero-rail{padding-top:0}
  .hero-h{font-size:3.8rem}
  .hero-h,.hero-rail,.hero-plan,.prob-h,.prob-body,.price-lead{grid-column:1}
  .wwd,.free{grid-template-columns:1fr}
  .steps{grid-template-columns:1fr 1fr}
  .price-terms,.notinc{grid-column:1}
  .faq{grid-template-columns:1fr}
  .doc{grid-template-columns:1fr}
  .doc-head{grid-column:1}
  .toc{position:static}
  .foot-in{grid-template-columns:1fr}
}
@media (max-width:560px){
  .wrap,.mast-in,.foot-in{padding-left:1rem;padding-right:1rem}
  .hero{padding:2rem 0}
  .hero-h{font-size:2.6rem}
  .sec{padding-top:3rem}
  .sec-h{font-size:1.9rem}
  .booth{padding:1.25rem}
  .taped{padding:1.5rem}
  .close{padding:2.5rem 0}
  .close-h{font-size:2rem}
  .sub-h,.doc-h{font-size:2.2rem}
  .prose{padding:1.25rem}
  .price-big{font-size:1.6rem}
  .wm{width:13rem}
  body{font-size:1.0625rem}
  .steps{grid-template-columns:1fr}
  .nav{gap:.9rem;width:100%;justify-content:space-between}
  .taped{border-width:4px}
}
@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important}
}