/* Editions: the page head carries the turning box; everything below it is quiet reading with prints. */

/* ---------- the head ---------- */
.ed-head{padding-bottom:clamp(40px,5vw,72px)}
.ed-head-grid{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:clamp(24px,3vw,48px);align-items:center}
.ed-head h1{font-size:clamp(3.4rem,2rem + 6vw,7.6rem);margin-bottom:.18em}
.ed-head .lede{max-width:24em}
.ed-jump{display:flex;flex-wrap:wrap;gap:6px 18px;margin-top:clamp(20px,3vw,36px);max-width:30em}
.ed-jump a{font-size:var(--fs-s);color:var(--ink-2);text-decoration:underline;text-decoration-color:var(--rule);text-underline-offset:.25em}
.ed-jump a:hover{color:var(--scarlet);text-decoration-color:currentColor}
.ed-hero-turn{margin-right:calc(-1 * var(--gutter))}
.ed-hero-turn .tt-stage{margin-left:-4%}
.ed-hero-turn figcaption{padding-right:var(--gutter)}
@media (max-width:960px){
  .ed-head-grid{grid-template-columns:1fr}
  .ed-hero-turn,.ed-hero-turn .tt-stage{margin:0}
  .ed-hero-turn figcaption{padding-right:0}
}

/* ---------- the turntable ---------- */
.turntable{margin:0;position:relative}
.tt-stage{position:relative;touch-action:pan-y;user-select:none;-webkit-user-select:none;border-radius:4px}
.tt-stage img{width:100%;height:auto;-webkit-user-drag:none;pointer-events:none}
.turntable.ready .tt-stage{cursor:grab}
.turntable.ready.dragging .tt-stage{cursor:grabbing}
.tt-stage:focus-visible{outline:3px solid var(--scarlet);outline-offset:6px}
.turntable figcaption{margin-top:.4em;max-width:40em}
.tt-hint{display:flex;align-items:center;gap:.5em;margin-bottom:.35em;font-family:var(--text);font-style:normal;font-weight:600;color:var(--ink-2)}
.tt-hint svg{width:34px;height:14px;flex:none;color:var(--scarlet)}
.turntable.loading .tt-hint{opacity:.7}
.plate.night .tt-hint{color:var(--stock-hi)}
.tt-ask{all:unset;cursor:pointer;font-weight:600;text-decoration:underline;text-decoration-thickness:2px;text-decoration-color:var(--scarlet);text-underline-offset:.22em}
.tt-ask:focus-visible{outline:3px solid var(--scarlet);outline-offset:3px}

/* ---------- section copy ---------- */
.ed-split{align-items:center}
.ed-copy .lede{margin-bottom:1.1em}
.ed-copy .actions{margin:28px 0 12px}
.ed-facts{margin:28px 0 0;display:grid;gap:18px;border-left:2px solid var(--ink);padding-left:clamp(18px,2.4vw,30px)}
.ed-facts div{margin:0}
.ed-facts dt{font-weight:600;font-size:var(--fs-1);line-height:1.2;margin-bottom:.2em}
.ed-facts dd{margin:0;color:var(--ink-2);max-width:34em}
.ed-pieces-turn{align-self:center}

/* ---------- acrylic ---------- */
.acrylic-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(16px,3vw,40px);max-width:620px;justify-self:center;width:100%}
.acrylic-pane{position:relative;padding:clamp(14px,2.4vw,26px);border-radius:10px;background:linear-gradient(150deg,rgba(255,255,255,.62),rgba(255,255,255,.22) 45%,rgba(255,255,255,.4));
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.75), inset 0 -2px 0 rgba(28,24,20,.08), 0 1px 0 rgba(28,24,20,.12), 6px 10px 22px -12px rgba(60,38,18,.45)}
.acrylic-pane img{width:100%;height:auto}
.acrylic-pair figure:nth-child(2){transform:translateY(clamp(12px,3vw,36px))}
.acrylic-pair figcaption{text-align:center}

/* ---------- paper ---------- */
.paper-grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(28px,5vw,80px);align-items:start}
.downloads{list-style:none;margin:0 0 clamp(28px,4vw,44px);padding:0;border-top:1px solid var(--rule)}
.downloads li{margin:0;padding:14px 0;border-bottom:1px solid var(--rule);display:grid;gap:2px}
.downloads a{font-weight:600;font-size:var(--fs-1);text-decoration-thickness:2px;text-decoration-color:var(--scarlet);text-underline-offset:.2em;justify-self:start}
.downloads a::after{content:" PDF";font-size:.62em;font-weight:600;letter-spacing:.06em;color:var(--ink-3);vertical-align:.18em}
.downloads li>span{color:var(--ink-2);font-size:var(--fs-s)}
.paper-tokens{max-width:420px;margin-bottom:20px}
.paper-tokens img{transform:rotate(1.4deg)}
@media (max-width:860px){ .paper-grid{grid-template-columns:1fr} .paper-tokens{max-width:360px} }

/* pay what you want: shown only when site.json has a checkout */
.pwyw{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:clamp(24px,4vw,64px);align-items:center;margin-top:clamp(48px,6vw,88px);
  padding:clamp(24px,3.5vw,44px);background:var(--stock-hi);border:2px solid var(--ink);box-shadow:var(--shadow-block)}
.pwyw h3{font:400 var(--fs-3)/1 var(--display);margin-bottom:.35em}
.pwyw-label{font-weight:600;margin:0 0 10px}
.amounts{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:6px}
.amount{min-width:4.6em;min-height:46px;padding:.4em .9em;border:2px solid var(--ink);border-radius:2px;background:transparent;color:var(--ink);font:600 1.15rem var(--text);cursor:pointer}
.amount:hover{background:var(--stock)}
.amount[aria-pressed="true"]{background:var(--ink);color:var(--stock-hi)}
.pwyw .actions{margin:16px 0 8px}
@media (max-width:860px){ .pwyw{grid-template-columns:1fr} }

/* ---------- on screen ---------- */
.ed-list{list-style:none;padding:0;margin:0 0 8px;display:grid;gap:14px}
.ed-list li{margin:0;color:#d0d6d2;max-width:34em}
.ed-list b{color:var(--stock-hi);font-weight:600}
.screen-fleets{margin:0}
.screen-ships{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(10px,1.6vw,22px)}
.screen-ships li{margin:0;background:var(--stock-hi);border-radius:3px;padding:6px}
.screen-ships li:nth-child(even){transform:translateY(clamp(8px,1.6vw,20px))}
.screen-ships img{width:100%;height:auto}
.screen-fleets figcaption{margin-top:clamp(24px,3vw,40px)}

/* ---------- compare ---------- */
.tiers-wrap{border-top:2px solid var(--ink);border-bottom:2px solid var(--ink)}
.tiers{width:100%;border-collapse:collapse}
.tiers th,.tiers td{text-align:left;vertical-align:top;padding:18px 16px 18px 0}
.tiers thead th{font-family:var(--fell);font-style:italic;font-weight:400;font-size:var(--fs-s);color:var(--ink-3);padding-top:14px;padding-bottom:12px;border-bottom:1px solid var(--rule)}
.tiers tbody tr+tr th,.tiers tbody tr+tr td{border-top:1px solid var(--rule)}
.tiers tbody th{font:400 var(--fs-2)/1.05 var(--display);width:28%}
.tiers td{color:var(--ink-2)}
.tiers .price{width:22%;padding-right:0}
.tiers .price b{font:400 var(--fs-2)/1 var(--display);color:var(--ink)}
.tiers .tbd{font-family:var(--fell);font-style:italic;color:var(--ink-3)}
.compare-actions{margin:32px 0 12px}
@media (max-width:700px){
  .tiers thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .tiers,.tiers tbody,.tiers tr,.tiers th,.tiers td{display:block;width:auto}
  .tiers tbody tr{padding:18px 0}
  .tiers tbody tr+tr{border-top:1px solid var(--rule)}
  .tiers tbody tr+tr th,.tiers tbody tr+tr td{border-top:0}
  .tiers th,.tiers td{padding:0 0 6px}
  .tiers tbody th,.tiers .price{width:auto}
}

/* ---------- the launch ---------- */
.launch-steps{list-style:none;margin:clamp(36px,5vw,64px) 0 0;padding:0;counter-reset:step}
.launch-steps>li{position:relative;margin:0;padding:0 0 clamp(28px,4vw,44px) clamp(56px,7vw,84px);counter-increment:step}
.launch-steps>li::before{content:counter(step);position:absolute;left:0;top:-.12em;font:400 clamp(2.2rem,4vw,3rem)/1 var(--display);color:var(--gold)}
.launch-steps>li::after{content:"";position:absolute;left:.62em;top:3.4rem;bottom:.6rem;width:1px;background:rgba(243,234,211,.22)}
.launch-steps>li:last-child::after{display:none}
.launch-steps h3{font-size:var(--fs-1);margin-bottom:.35em}
.launch-steps p{color:#d0d6d2}
.launch-count{font-family:var(--fell);font-style:italic;color:var(--stock-hi)}
.launch-count b{font:400 1.4em var(--display);font-style:normal;color:var(--gold);margin-left:.2em}

/* ---------- how the pieces are made ---------- */
.made-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(24px,4vw,56px)}
.made-steps li{margin:0}
.made-art{aspect-ratio:4/3;display:grid;place-items:center;background:var(--stock-hi);border:1px solid var(--rule);overflow:hidden;margin-bottom:18px}
.made-art img{width:auto;height:84%;max-width:90%}
.made-steps li:last-child .made-art img{width:100%;height:100%;max-width:none;object-fit:cover;object-position:42% 60%}
.made-steps h3{font-size:var(--fs-1);margin-bottom:.35em}
.made-steps p{color:var(--ink-2)}
.made-board{margin-top:clamp(56px,7vw,100px)}
.made-files{margin-top:clamp(28px,4vw,44px)}
.made-files code{font-family:ui-monospace,Consolas,monospace;font-size:.9em;background:rgba(28,24,20,.06);padding:0 .25em;border-radius:2px}
@media (max-width:860px){ .made-steps{grid-template-columns:1fr;max-width:520px} }

/* ---------- questions ---------- */
.ed-faq{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:clamp(24px,5vw,80px)}
.ed-faq h2{font-size:var(--fs-3)}
.ed-faq p{color:var(--ink-2)}
@media (max-width:860px){ .ed-faq{grid-template-columns:1fr} }