/* /order, /visit and the legal pages. See DESIGN.md. No em dashes, no rounded corners. */

/* ===== /order ===== */
.ordhead{padding-bottom:clamp(14px,2vw,24px)}
.ordhead .deck{max-width:60ch}
.ordhead .deck b{font-weight:700}
.ordhead .disp-xl>span+span{color:var(--red-k)}
.ordr{padding-block:clamp(14px,2vw,28px) clamp(44px,5vw,84px)}
.ordr__grid{display:grid;gap:clamp(36px,4vw,60px);align-items:start}

/* The failure. Red ground, big phone number: this is the part that must not be missed. */
.notsent{background:var(--red);color:var(--cream);padding:clamp(16px,2.2vw,28px);margin-top:18px;box-shadow:6px 6px 0 var(--ink);max-width:880px}
.notsent__h{font:400 clamp(40px,5vw,72px)/.95 var(--gothic);text-transform:uppercase;letter-spacing:.006em;margin-bottom:10px}
.notsent p{max-width:60ch;font-size:18px;line-height:1.4}
.notsent__call{margin-top:14px}
.notsent__call .btn-paper{display:block;text-align:center}
.notsent .notsent__status{font:800 italic 17px/1.3 var(--slab);margin-top:12px}

/* "Fix these" list: ink on newsprint, no alarm. Nothing failed, they missed a field. */
.fixit{border:3px solid var(--red-k);background:var(--cream);padding:14px 16px;margin-top:18px;max-width:880px}
.fixit__h{font:400 clamp(30px,3.2vw,44px)/1 var(--gothic);text-transform:uppercase;letter-spacing:.008em;color:var(--red-k)}
.fixit ul{margin-top:8px;padding-left:1.1em;list-style:disc}
.fixit li+li{margin-top:5px}
.fixit a{font-weight:600}
.fixit .tiny{margin-top:10px}

/* The order pad */
.pad{position:relative;color:var(--ink);padding:0 clamp(16px,2.6vw,36px) clamp(20px,2.6vw,34px);box-shadow:6px 6px 0 var(--ink);min-width:0}
.pad__head{position:relative;border-bottom:3px double var(--ink);padding-block:14px 12px;margin-bottom:18px}
.pad__name{font:400 clamp(30px,3vw,44px)/.95 var(--gothic);text-transform:uppercase;letter-spacing:.01em}
.pad__addr{font:700 italic 15px/1.25 var(--slab);margin-top:4px}
.pad__stamp{margin-top:12px;margin-left:4px;font-size:27px;padding:5px 9px 3px}
.pad__stamp small{font-size:14px;line-height:1}
.pad__trap{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.pad__row{display:grid;gap:0 clamp(18px,2.4vw,34px)}

.fld{min-width:0;margin:0 0 20px;padding:0;border:0}
.fld label:not(.how__opt),.fld legend{display:block;padding:0;font:400 27px/1 var(--gothic);text-transform:uppercase;letter-spacing:.015em;margin-bottom:4px}
.fld__opt{font:italic 500 15px/1 var(--slab);text-transform:none;letter-spacing:0}
.fld input:not([type=radio]),.fld textarea{display:block;width:100%;min-width:0;max-width:100%;min-height:48px;background:rgba(244,231,207,.62);border:0;border-bottom:2px solid var(--ink);border-radius:0;color:var(--ink);font:500 18px/1.3 var(--slab);padding:10px 8px 8px;-webkit-appearance:none;appearance:none}
.fld input[type=date]{text-align:left}
.fld input[type=date]::-webkit-date-and-time-value{text-align:left}
.fld textarea{line-height:34px;padding:0 8px;border:2px solid var(--ink);background-color:rgba(244,231,207,.62);background-image:repeating-linear-gradient(180deg,transparent 0 33px,rgba(23,18,13,.32) 33px 34px);background-attachment:local;min-height:274px;resize:vertical}
.fld input:focus,.fld textarea:focus{outline:3px solid var(--ink);outline-offset:2px;background-color:var(--cream)}
.fld__hint{font-size:15.5px;line-height:1.35;color:var(--ink2);margin-top:6px}
.fld__err{font:700 16.5px/1.3 var(--sans);color:var(--red-k);margin-top:7px}
.fld--bad input:not([type=radio]),.fld--bad textarea{border-color:var(--red-k);border-width:3px;background-color:var(--cream)}
.fld--bad legend,.fld--bad>label{color:var(--red-k)}

/* Pickup or delivery: real radios, so they look like radios */
.how{display:flex;flex-wrap:wrap;gap:6px 30px}
.how__opt{display:inline-flex;align-items:center;gap:10px;min-height:48px;cursor:pointer;font:400 30px/1 var(--gothic);text-transform:uppercase;letter-spacing:.012em}
.how__opt input{flex:none;width:32px;height:32px;margin:0;background:var(--cream);border:2px solid var(--ink);border-radius:50%;-webkit-appearance:none;appearance:none;cursor:pointer}
.how__opt input:checked{background:radial-gradient(circle,var(--red) 0 44%,var(--cream) 47%)}
.how__opt input:focus-visible{outline:3px solid var(--ink);outline-offset:3px}
.fld--how .fld__hint{margin-top:2px}

.pad__send{border-top:3px double var(--ink);padding-top:16px}
.pad__btn{display:block;width:100%;font-size:32px;padding:15px 18px 12px}
.pad__fine{font-size:15.5px;line-height:1.4;margin-top:12px}
.pad__fine a{display:inline-block;padding-block:2px;font-weight:600}

/* What goes next to the pad */
.ordr__side{display:grid;grid-template-columns:minmax(0,1fr);gap:clamp(26px,3vw,38px);min-width:0}
.ordr__call{padding-bottom:18px}
.ordr__call>p{margin-top:8px;font-size:17px;line-height:1.38}
.ordr__num{display:block;font:400 clamp(50px,5.4vw,78px)/1 var(--gothic);letter-spacing:.008em;text-decoration:none;white-space:nowrap;color:var(--red-k);margin-top:2px}
.ordr__num:hover{text-decoration:underline}
.ordr__call .ordr__status{font:800 italic 17px/1.3 var(--slab)}
.ordr__call .tiny:empty{display:none}
.ordr__turkey{padding:16px 18px 18px;box-shadow:4px 4px 0 var(--ink)}
.ordr__turkey p+p{margin-top:8px;font-size:17px;line-height:1.38}
.ordr__turkey-h{font:400 clamp(40px,4vw,58px)/.95 var(--gothic);text-transform:uppercase}
.ordr__turkey .btn-paper{white-space:nowrap}
.ordr__process{margin-top:10px}
.steps{counter-reset:s;margin-top:12px}
.steps li{counter-increment:s;display:grid;grid-template-columns:48px 1fr;align-items:start;padding-block:9px;border-bottom:1px solid rgba(23,18,13,.5);font-size:17px;line-height:1.36}
.steps li::before{content:counter(s);grid-row:1 / span 2;font:400 46px/.92 var(--gothic);color:var(--red-k)}
.steps b{display:block;font:800 italic 18px/1.25 var(--slab)}
.ordr__more{display:flex;flex-wrap:wrap;gap:12px}

/* The slip on the done page */
.slip>div{display:flex;flex-wrap:wrap;gap:0 14px;align-items:baseline;padding-block:8px;border-bottom:1px solid rgba(23,18,13,.5)}
.slip dt{font:400 26px/1.04 var(--gothic);text-transform:uppercase;letter-spacing:.015em;flex:0 0 118px}
.slip dd{margin:0;min-width:0;flex:1 1 200px;font:500 18px/1.35 var(--slab);overflow-wrap:anywhere}
.slip__h{font:400 26px/1.04 var(--gothic);text-transform:uppercase;letter-spacing:.015em;margin-top:18px}
.slip__order{white-space:pre-wrap;overflow-wrap:anywhere;font:500 18px/1.55 var(--slab);margin-top:6px}

/* ===== /visit ===== */
.vishead{padding-bottom:clamp(30px,3.4vw,50px)}
.vishead__grid{display:grid;gap:clamp(30px,4vw,60px);align-items:start}
.vishead__h{font-size:clamp(68px,11.4vw,178px)}
.vishead__town{font:800 italic clamp(21px,2.4vw,34px)/1.15 var(--slab);margin-top:8px}
.vishead__line{font:400 clamp(30px,3.4vw,50px)/1 var(--gothic);text-transform:uppercase;letter-spacing:.012em;color:var(--red-k);margin-top:18px;text-wrap:balance}
.vishead__cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:18px}
.vishours .hours{margin-top:0;border-top:0}
.vishours .status{margin-top:12px}
.vishours__fine{font-size:16px;line-height:1.38;margin-top:10px}

.shifts{position:relative;padding-block:calc(var(--tear-h) + clamp(18px,3vw,44px)) calc(var(--tear-h) + clamp(30px,4vw,60px))}
.shifts__grid{display:grid;gap:clamp(22px,2.6vw,36px)}
.shift{padding:5px}
.shift img{aspect-ratio:3/2;object-fit:cover;object-position:50% 30%}
.shift figcaption{font-size:17px;line-height:1.3;padding:10px 6px 6px}
.shift figcaption b{font:400 27px/1 var(--gothic);text-transform:uppercase;letter-spacing:.02em;margin-right:.2em}

.ways{padding-block:clamp(18px,3vw,36px) var(--sec)}
.ways__grid{display:grid;gap:clamp(26px,4vw,60px);align-items:start;margin-top:clamp(18px,2.4vw,34px)}
.ways__copy{display:grid;gap:clamp(22px,2.4vw,32px)}
.way p{margin-top:8px;max-width:52ch}
.way__lnk{font-weight:600}
.ways__pic{position:relative;min-width:0}
.ways__pencil{margin-top:12px;text-align:right}

.after{padding-block:clamp(44px,6vw,90px) clamp(44px,5vw,76px)}
.after__grid{display:grid;gap:clamp(30px,4vw,64px);align-items:start}
.after__deal{font:700 italic clamp(19px,1.7vw,24px)/1.28 var(--slab);margin-top:12px;max-width:40ch}
.after__rating{margin-top:12px}
.after__rating b{font-weight:700}
.after__cta{margin-top:16px}
.socials{margin-top:8px}
.socials .tally .k{text-decoration-thickness:2px}
.socials .tally .k:hover{color:var(--red-k)}
.socials .v{overflow-wrap:anywhere}

/* ===== Legal pages: a legal-notices column ===== */
.legal{padding-block:clamp(28px,4vw,60px) clamp(44px,5vw,84px)}
.legal__grid{display:grid;gap:22px clamp(32px,5vw,90px)}
.legal__rail{border-block:3px double var(--ink);padding-block:10px;align-self:start}
.legal__date{font:700 italic 15px/1.3 var(--slab)}
.legal__rail nav{display:flex;flex-wrap:wrap;gap:0 18px;margin-top:4px}
.legal__rail a{display:inline-block;padding-block:8px;font:400 27px/1 var(--gothic);text-transform:uppercase;letter-spacing:.015em;text-decoration:none}
.legal__rail a:hover{text-decoration:underline}
.legal__rail a[aria-current]{color:var(--red-k);text-decoration:underline;text-decoration-thickness:3px;text-underline-offset:.14em}
.legal__body{min-width:0}
.legal__body .lede{max-width:none}
.legal__body h2{font:400 clamp(31px,2.6vw,38px)/1 var(--gothic);text-transform:uppercase;letter-spacing:.01em;border-top:2px solid var(--ink);padding-top:10px;margin-top:1.15em}
.legal__body h2+*{margin-top:.5em}
.legal__sign{display:none}
.legal__body strong{font-weight:700}
.legal__body a{overflow-wrap:anywhere}

/* ===== wider ===== */
@media (min-width:600px){
  .pad__row{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pad__head{padding-right:190px;min-height:82px}
  .pad__stamp{position:absolute;margin:0;font-size:32px;right:2px;top:10px}
  .notsent__call .btn-paper{display:inline-block}
  .pad__btn{display:inline-block;width:auto;padding-inline:30px}
}
@media (min-width:700px){
  .shifts__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (min-width:700px){
  .vishead__grid{grid-template-columns:minmax(0,1.5fr) minmax(0,1fr)}
  .vishours{margin-top:clamp(20px,3vw,44px)}
  .ways__grid{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr)}
  .ways__grid--solo{grid-template-columns:minmax(0,1fr)}
  .ways__grid--solo .ways__copy{grid-template-columns:repeat(2,minmax(0,1fr))}
  .after__grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .legal__grid{grid-template-columns:280px minmax(0,66ch)}
  .legal__rail{position:sticky;top:76px}
  .legal__rail nav{flex-direction:column}
  .legal__sign{display:block;border-top:1px solid var(--ink);padding-top:14px;margin-top:10px}
  .legal__sign img{width:100%;height:auto}
  .legal__sign figcaption{font:italic 600 15px/1.25 var(--slab);margin-top:8px}
}
@media (min-width:860px){
  .ordr__grid{grid-template-columns:minmax(0,1.62fr) minmax(0,1fr)}
}
@media print{.pad__trap,.pad__send,.ordr__side{display:none}}