@font-face{font-family:Inter;font-weight:400;src:url(/assets/fonts/inter-latin-400-normal.woff2) format("woff2");font-display:swap}
@font-face{font-family:Inter;font-weight:500;src:url(/assets/fonts/inter-latin-500-normal.woff2) format("woff2");font-display:swap}
@font-face{font-family:Inter;font-weight:600;src:url(/assets/fonts/inter-latin-600-normal.woff2) format("woff2");font-display:swap}
@font-face{font-family:Inter;font-weight:700;src:url(/assets/fonts/inter-latin-700-normal.woff2) format("woff2");font-display:swap}
@font-face{font-family:Inter;font-weight:800;src:url(/assets/fonts/inter-latin-800-normal.woff2) format("woff2");font-display:swap}
@font-face{font-family:Inter;font-weight:700;font-style:italic;src:url(/assets/fonts/inter-latin-700-italic.woff2) format("woff2");font-display:swap}
@font-face{font-family:Yellowtail;font-weight:400;src:url(/assets/fonts/yellowtail-latin-400-normal.woff2) format("woff2");font-display:swap}
@font-face{font-family:"Dela Gothic One";font-weight:400;src:url(/assets/fonts/dela-gothic-one-latin-400-normal.woff2) format("woff2");font-display:swap}
@font-face{font-family:"Anton";font-weight:400;font-style:normal;src:url(/assets/fonts/anton-latin-400-normal.woff2) format("woff2");font-display:swap}
@font-face{font-family:"Bowlby One";font-weight:400;font-style:normal;src:url(/assets/fonts/bowlby-one-latin-400-normal.woff2) format("woff2");font-display:swap}
@font-face{font-family:"Big Shoulders Display";font-weight:900;font-style:normal;src:url(/assets/fonts/big-shoulders-display-latin-900-normal.woff2) format("woff2");font-display:swap}
@font-face{font-family:"Gloock";font-weight:400;font-style:normal;src:url(/assets/fonts/gloock-latin-400-normal.woff2) format("woff2");font-display:swap}
@font-face{font-family:"Dela Gothic One";font-weight:400;font-style:normal;src:url(/assets/fonts/dela-gothic-one-latin-400-normal.woff2) format("woff2");font-display:swap}
@font-face{font-family:"Newsreader";font-weight:400;font-style:normal;src:url(/assets/fonts/newsreader-latin-400-normal.woff2) format("woff2");font-display:swap}
@font-face{font-family:"Newsreader";font-weight:500;font-style:normal;src:url(/assets/fonts/newsreader-latin-500-normal.woff2) format("woff2");font-display:swap}
@font-face{font-family:"Newsreader";font-weight:400;font-style:italic;src:url(/assets/fonts/newsreader-latin-400-italic.woff2) format("woff2");font-display:swap}
@media(prefers-reduced-motion:no-preference){@view-transition{navigation:auto}}
:root{--paper:#f2ebdd;--ink:#14110f;--mid:#6d655a;--line:#14110f22;
--purple:#6a4cff;--amber:#f2a516;--blue:#2a63e8;--green:#8fc13f;--coral:#ff5a45;
--h:Anton,Impact,sans-serif;--body:Newsreader,Georgia,serif;--hc:var(--ink);--bg:var(--acc)}
*{box-sizing:border-box}
html{background:var(--paper);scroll-behavior:smooth}
body{margin:0;color:var(--ink);font:400 20px/1.55 var(--body);-webkit-font-smoothing:antialiased}
a{color:inherit}
img{max-width:100%;display:block}
.px{image-rendering:pixelated}
.col{max-width:1100px;margin:0 auto;padding:0 24px}
.narrow{max-width:640px}
p{margin:0 0 1em}
.small{font-size:16px;color:var(--mid)}
.label{font:400 14px/1 var(--h);letter-spacing:.14em;text-transform:uppercase}

/* top bar */
.bar-top{display:flex;justify-content:space-between;align-items:center;padding:22px 0;gap:16px}
.bar-top a{text-decoration:none}
.bar-top .me{font:400 22px/1 var(--h);letter-spacing:.04em;text-transform:uppercase}
.bar-top nav{display:flex;gap:20px;flex-wrap:wrap}
.bar-top nav a{font:400 14px/1 var(--h);letter-spacing:.14em;text-transform:uppercase}
.bar-top nav a:hover{text-decoration:underline;text-decoration-thickness:3px;text-underline-offset:5px}

/* landing */
.hello{padding:40px 0 56px}
.hello h1{font:400 clamp(44px,12.2vw,176px)/1 var(--h);text-transform:uppercase;letter-spacing:-.01em;margin:0 0 28px}
.hello h1 span{display:inline}
.hello h1 .o{color:transparent;-webkit-text-stroke:2.5px var(--ink)}
.hello p{font:italic 400 clamp(22px,3vw,30px)/1.3 var(--body);max-width:24em}
.bands{border-top:3px solid var(--ink)}
.band{display:grid;grid-template-columns:70px 1fr auto;gap:0 20px;align-items:center;padding:30px 0;border-bottom:3px solid var(--ink);text-decoration:none;background:var(--bg);color:var(--hc);position:relative;transition:padding .3s cubic-bezier(.2,.8,.2,1)}
.band:hover{padding-left:32px;padding-right:32px}
.bands .band{margin:0 calc(50% - 50vw);padding-left:calc(50vw - 50% + 24px);padding-right:calc(50vw - 50% + 24px);width:100vw;max-width:100vw}
.band:hover{padding-left:calc(50vw - 50% + 48px)}
.band .n{font:400 20px var(--h)}
.band .t{font:400 clamp(54px,10.5vw,138px)/.92 var(--hf,var(--h));text-transform:uppercase;letter-spacing:-.01em}
.band .d{grid-column:2;font:italic 400 20px/1.3 var(--body);margin-top:10px;max-width:28em}
.band .go{grid-column:3;grid-row:1/3;width:clamp(54px,7vw,88px);aspect-ratio:1;border:4px solid currentColor;display:grid;place-items:center;transition:background .2s,color .2s}
.band .go svg{width:56%;height:auto}
.band:hover .go{background:var(--hc);color:var(--bg)}
.b-wp{--bg:var(--purple);--hc:#fff;--hf:"Bowlby One",Anton,sans-serif}
.b-wp .t{font-size:clamp(46px,9vw,118px);letter-spacing:-.02em}
.b-sc{--bg:var(--amber);--hf:"Big Shoulders Display",Anton,sans-serif}
.b-sc .t{font-weight:900;font-size:clamp(64px,13vw,170px);letter-spacing:.01em}
.b-pb{--bg:var(--blue);--hc:#fff;--hf:Gloock,Georgia,serif}
.b-pb .t{text-transform:none;font-size:clamp(54px,11vw,142px);letter-spacing:-.03em}
.b-pw{--bg:var(--green);--hf:"Dela Gothic One",Anton,sans-serif}
.b-pw .t{font-size:clamp(40px,8vw,104px);letter-spacing:-.03em}
.b-sm{--bg:var(--coral)}
.sticker{position:absolute;right:14%;top:50%;width:92px;height:92px;border-radius:50%;background:var(--paper);color:var(--ink);display:grid;place-items:center;text-align:center;font:400 15px/1.1 var(--h);letter-spacing:.06em;text-transform:uppercase;transform:translateY(-50%) rotate(12deg);border:3px solid var(--ink)}
@media(max-width:700px){.sticker{display:none}.band{grid-template-columns:40px 1fr auto}}

/* project pages */
.hero{background:var(--acc);color:var(--hc);border-bottom:3px solid var(--ink)}
.hero .col{padding-top:6px;padding-bottom:56px}
.hero .label{display:block;margin:34px 0 22px}
.hero h1{font:400 clamp(72px,17vw,220px)/1.04 var(--hf,var(--h));text-transform:uppercase;letter-spacing:-.015em;margin:0 0 26px;overflow-wrap:anywhere}
.hero .lede{font:italic 400 clamp(22px,3vw,30px)/1.3 var(--body);max-width:24em;margin:0}
.hero .bar-top{border:0}
.pg-wp{--acc:var(--purple);--hc:#fff;--hf:"Bowlby One",Anton,sans-serif}
.pg-wp .hero h1{font-size:clamp(52px,12vw,150px);letter-spacing:-.02em}
.pg-sc{--acc:var(--amber);--hf:"Big Shoulders Display",Anton,sans-serif}
.pg-sc .hero h1{font-weight:900;font-size:clamp(90px,23vw,300px);letter-spacing:.02em}
.pg-pb{--acc:var(--blue);--hc:#fff;--hf:Gloock,Georgia,serif}
.pg-pb .hero h1{text-transform:none;font-size:clamp(76px,18vw,230px);letter-spacing:-.04em}
.pg-pw{--acc:var(--green);--hf:"Dela Gothic One",Anton,sans-serif}
.pg-pw .hero h1{font-size:clamp(48px,11vw,140px);letter-spacing:-.03em}
.pg-sm{--acc:var(--coral)}
.body{padding-top:56px}
.body p{font-size:21px}
.body h2{font:400 clamp(30px,4vw,44px)/1 var(--h);text-transform:uppercase;margin:48px 0 14px}
dl.facts{margin:40px 0 0;border-top:3px solid var(--ink)}
dl.facts div{display:grid;grid-template-columns:150px 1fr;gap:16px;padding:14px 0;border-bottom:1px solid var(--line)}
dl.facts dt{font:400 14px/1.5 var(--h);letter-spacing:.14em;text-transform:uppercase}
dl.facts dd{margin:0;font-size:19px}
@media(max-width:560px){dl.facts div{grid-template-columns:1fr;gap:2px}}
.nextproj{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;border-top:3px solid var(--ink);margin-top:80px;padding:22px 0}
.nextproj a{text-decoration:none;font:400 clamp(28px,5vw,52px)/1 var(--h);text-transform:uppercase}
.nextproj small{display:block;font:400 14px var(--h);letter-spacing:.14em;margin-bottom:6px}
.nextproj a:hover{color:var(--mid)}
footer{background:var(--ink);color:var(--paper);margin-top:0;padding:44px 0 60px}
footer .col{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:28px}
footer h4{font:400 14px var(--h);letter-spacing:.14em;text-transform:uppercase;margin:0 0 12px;color:var(--amber)}
footer a{display:block;color:var(--paper);text-decoration:none;font-size:19px;padding:2px 0}
footer a:hover{text-decoration:underline}

/* wildpack */
.lockup{height:40px;width:auto;margin:30px 0 0;filter:brightness(0) invert(1)}
.deck-stage{overflow:hidden;padding:46px 0 56px;margin-top:20px}
.deck{position:relative;display:block;perspective:1100px}
.pc{position:absolute;left:50%;top:0;margin-left:0;transform-origin:50% 60%;transition:transform .55s cubic-bezier(.2,.9,.25,1.12);cursor:pointer;user-select:none;will-change:transform;translate:-50% 0}
.rc{width:420px;height:588px;transform-origin:0 0;border-radius:18px;border:2px solid #2E2A3D;background:#1A1726;padding:17px;display:flex;flex-direction:column;font-family:Inter,system-ui,sans-serif;color:#F4F2FB;box-shadow:0 22px 44px #0006,0 4px 10px #0004;overflow:hidden}
.rc .pf{flex:0 0 215px;height:215px;background:#F4F2FB;border-radius:8px;padding:4px}
.rc .pi{width:100%;height:100%;border-radius:6px;display:grid;place-items:center;font:800 96px Inter,sans-serif;color:#ffffffd9}
.rc .rn{margin:6px 0 2px;height:24px;line-height:24px;text-align:center;font-weight:800;font-size:20px;text-transform:uppercase;letter-spacing:.5px}
.rc .rl{margin:4px 0 14px;height:34px;display:flex;align-items:center;justify-content:center;text-align:center;font-weight:700;font-style:italic;font-size:13px;line-height:17px}
.rc .rs{flex:1;display:flex;flex-direction:column;justify-content:space-evenly;min-height:0}
.rc .sl{display:flex;justify-content:space-between;align-items:flex-end;font-weight:700;text-transform:uppercase}
.rc .sl b{font-weight:800}
.flowlist{counter-reset:s;list-style:none;margin:36px 0 0;padding:0;border-top:3px solid var(--ink)}
.flowlist li{counter-increment:s;display:flex;gap:18px;align-items:baseline;padding:14px 0;border-bottom:1px solid var(--line);font-size:21px}
.flowlist li::before{content:counter(s,decimal-leading-zero);font:400 20px var(--h);color:var(--purple);width:34px}
.flowlist b{font:400 24px var(--h);text-transform:uppercase;letter-spacing:.02em;margin-right:8px;font-weight:400}

/* scafld */
.compare{display:grid;grid-template-columns:1fr 1fr;gap:36px;margin-top:56px}
@media(max-width:700px){.compare{grid-template-columns:1fr}}
.compare h3{font:400 30px/1 var(--h);text-transform:uppercase;margin:0 0 14px}
.steps{list-style:none;margin:0;padding:0;border-top:3px solid var(--ink)}
.steps li{display:flex;gap:12px;padding:10px 0;border-bottom:1px solid var(--line);font-size:19px}
.steps li i{font:400 15px var(--h);font-style:normal;width:26px;padding-top:3px;color:var(--mid)}
.steps li.auto{font-weight:500;background:var(--amber);margin:0 -10px;padding-left:10px;padding-right:10px}
.steps li.auto i{color:var(--ink)}
.steps li em{margin-left:auto;font:400 14px var(--h);font-style:normal;letter-spacing:.1em}
.bigstat{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:30px;margin-top:64px}
.bigstat b{display:block;font:900 clamp(56px,9vw,104px)/.9 "Big Shoulders Display",Anton,sans-serif;text-transform:uppercase}
.bigstat span{font-size:18px;color:var(--mid)}
table.save{width:100%;border-collapse:collapse;margin-top:36px;font-size:20px}
table.save th{font:400 14px var(--h);letter-spacing:.14em;text-transform:uppercase;text-align:right;padding:10px 10px;border-bottom:3px solid var(--ink)}
table.save th:first-child,table.save td:first-child{text-align:left;padding-left:0}
table.save td{text-align:right;padding:14px 10px;border-bottom:1px solid var(--line);font-variant-numeric:lining-nums tabular-nums}
table.save td.hl{font-weight:500;background:var(--amber)}

/* polybot */
.article h2{font:400 clamp(26px,3.4vw,34px)/1.1 Gloock,Georgia,serif;text-transform:none;margin:52px 0 12px;letter-spacing:-.01em}
.article .chart{margin:30px 0 8px}
.pull{font:400 clamp(26px,4vw,38px)/1.15 Gloock,Georgia,serif;border-top:3px solid var(--ink);border-bottom:1px solid var(--line);padding:18px 0;margin:0 0 8px;color:var(--ink)}
.pull b{color:var(--blue);font-weight:400}
.article>p:first-of-type{}
.chart{border-top:3px solid var(--ink);padding-top:14px}
.chart h3{font:400 28px/1 Gloock,Georgia,serif;margin:0 0 6px}
.chart .sub{font-size:16px;color:var(--mid);margin:0 0 12px}
.chart svg{width:100%;height:auto;display:block;overflow:visible}

.chart text{font:400 12px Inter,system-ui,sans-serif;fill:var(--mid);font-variant-numeric:tabular-nums}
.chart .v{fill:var(--ink);font-weight:600}

/* small */
.apps{display:grid;gap:0;border-top:3px solid var(--ink);margin-top:44px}
.app{display:grid;grid-template-columns:132px 1fr;gap:28px;align-items:center;padding:28px 0;border-bottom:3px solid var(--ink)}
.app img,.app .tile{width:132px;height:132px;border:3px solid var(--ink)}
.app .tile{display:grid;place-items:center;background:var(--ink);color:var(--paper);font:400 54px var(--h);letter-spacing:.02em}
.app h2{font:400 clamp(36px,6vw,64px)/.95 var(--h);text-transform:uppercase;margin:0 0 8px}
.app p{margin:0;font-size:20px;max-width:30em}
.app a{font:400 14px var(--h);letter-spacing:.14em;text-transform:uppercase}
@media(max-width:560px){.app{grid-template-columns:84px 1fr;gap:16px}.app img,.app .tile{width:84px;height:84px;font-size:34px}}

.cur{font:400 1.35em/1 Yellowtail,cursive;text-transform:none;letter-spacing:0;display:inline-block;line-height:.9;padding:.02em .06em .14em;margin:0 .08em;transform:none;-webkit-text-stroke:0}
.band .cur{padding-bottom:.04em}

/* wildpack live links and brand */
.get{margin-top:48px;border-top:3px solid var(--ink);padding-top:22px}
.get h2{margin-top:0}
.btn-wp{display:inline-block;font:400 22px/1 var(--h);letter-spacing:.06em;text-transform:uppercase;background:var(--purple);color:#fff;padding:18px 26px;text-decoration:none;border:3px solid var(--ink);box-shadow:5px 5px 0 var(--ink);transition:transform .15s,box-shadow .15s}
.btn-wp:hover{transform:translate(3px,3px);box-shadow:2px 2px 0 var(--ink)}
.brand{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:22px}
.brand a{display:grid;place-items:center;height:130px;background:#0f0d17;border:3px solid var(--ink);padding:18px;text-decoration:none}
.brand img{max-height:70px;width:auto;max-width:100%}
.brand figcaption{font:400 13px var(--h);letter-spacing:.12em;text-transform:uppercase;margin-top:8px}
.brand figure{margin:0;position:relative}
.brand figcaption{position:absolute;left:12px;top:10px;margin:0;z-index:1;pointer-events:none}
/* polybot references */
.article sup.cite{font-size:.65em}
.article a.stat{color:var(--blue);text-decoration-thickness:2px;text-underline-offset:3px}
.cite a{font:400 .85em var(--body);color:var(--mid);text-decoration:none;white-space:nowrap}
ol.refs{padding-left:1.2em;font-size:16px;color:var(--ink)}
ol.refs li{margin-bottom:.8em;padding-left:.3em}
ol.refs a{word-break:break-word}

.sum{font:400 clamp(20px,3vw,30px)/1.2 var(--h);text-transform:uppercase;letter-spacing:.03em;margin:30px 0 0;padding:16px 0;border-top:3px solid var(--ink);border-bottom:1px solid var(--line)}
.sum b{background:linear-gradient(var(--amber),var(--amber)) left center/0% 100% no-repeat;padding:0 .25em;font-weight:400;transition:background-size .9s cubic-bezier(.7,0,.2,1) .35s}
.sum.in b{background-size:100% 100%}
table.save small{font:400 13px var(--body);color:var(--mid)}

/* wildpack: lockup plate, albums, brand */
.plate{display:inline-block;background:#0f0d17;border:3px solid var(--ink);box-shadow:6px 6px 0 var(--ink);padding:16px 26px;margin:30px 0 0}
.plate img{height:clamp(44px,7vw,68px);width:auto}
.albums{margin-top:64px;border-top:3px solid var(--ink);padding-top:22px}
.albums h2,.get h2{font:400 clamp(30px,4vw,44px)/1 var(--h);text-transform:uppercase;margin:0 0 14px}
.brand figure.wide{grid-column:1/-1}
.brand figure.wide a{height:130px}
.brand figure.wide img{max-height:84px}


/* album: a fixed book (spine locked at the centre) whose pages turn */
.car{position:relative;width:min(100%,780px);margin:34px auto 0}
.book{position:relative;width:calc(100% - 10px);aspect-ratio:2/1;perspective:2400px;outline:none;touch-action:pan-y}
.leaf{position:absolute;left:50%;top:0;width:50%;height:100%;transform-origin:0 50%;transform-style:preserve-3d;transition:transform 1s cubic-bezier(.45,.05,.2,1)}
.leaf.flipped{transform:rotateY(-180deg)}
.base{position:absolute;left:50%;top:0;width:50%;height:100%;background:#1a1726;border:3px solid var(--ink);border-left:0}
.face{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;overflow:hidden;background:#fff;border:3px solid var(--ink)}
.face.front{border-left:0}
.face.back{transform:rotateY(180deg);border-right:0}
.face::after{content:"";position:absolute;top:0;bottom:0;width:16%;pointer-events:none}
.face.front::after{left:0;background:linear-gradient(90deg,#0005,transparent)}
.face.back::after{right:0;background:linear-gradient(270deg,#0005,transparent)}
.book::before{content:"";position:absolute;inset:0 -10px -10px 10px;background:var(--ink);z-index:-1;opacity:0;transition:opacity .4s}
.pg-i{position:absolute;inset:0}
.pg-i .ph{position:absolute;display:block}
.pg-i.full .ph{inset:0}
.pg-i svg.tick{position:absolute;inset:0;width:100%;height:100%}
.pg-i .av{position:absolute;border-radius:50%;display:grid;place-items:center;font:800 clamp(12px,2.4vw,22px) Inter,sans-serif;color:#fff}
.car-btn{position:absolute;top:50%;width:44px;height:44px;margin-top:-22px;border-radius:50%;border:3px solid var(--ink);background:#fff;color:var(--ink);display:grid;place-items:center;cursor:pointer;padding:0;transition:background .15s,color .15s,opacity .15s;z-index:200}
.car-btn:hover{background:var(--ink);color:#fff}
.car-btn svg{width:18px;height:18px}
.car-btn[disabled]{opacity:0;pointer-events:none}
.car-prev{left:-22px}.car-next{right:-22px}
@media(max-width:860px){.car-prev{left:6px}.car-next{right:6px}}
.dots{display:flex;justify-content:center;gap:8px;margin:22px 0 0}
.dots button{width:10px;height:10px;border-radius:50%;border:2px solid var(--ink);background:transparent;padding:0;cursor:pointer;transition:background .15s,transform .15s}
.dots button.on{background:var(--ink);transform:scale(1.25)}
@media(prefers-reduced-motion:reduce){.leaf{transition:none}}
/* branding + get it */
.brandsec{margin-top:64px;background:#1A1726;color:#F4F2FB;box-shadow:0 0 0 100vmax #1A1726;clip-path:inset(0 -100vmax);padding:36px 0 44px}
.brandsec h2{color:#F4F2FB}
.brandsec .subh{font:400 clamp(22px,3vw,30px)/1 var(--h);text-transform:uppercase;color:#F4F2FB;margin:34px 0 4px}
.brandsec .brand a{border-color:#2E2A3D;background:#0F0D17}
.brandsec .brand figcaption{color:#9E9AB0}
.brandsec .pbar h3,.brandsec .pbar .hex span{color:#F4F2FB}
.brandsec h2{font:400 clamp(30px,4vw,44px)/1 var(--h);text-transform:uppercase;margin:0 0 6px}
.btn-wp{display:inline-flex;align-items:center;gap:14px}
.btn-wp svg{width:26px;height:26px;flex:none}
/* scafld highlight sweep */
.steps li.auto{background:linear-gradient(var(--amber),var(--amber)) left center/0% 100% no-repeat;transition:background-size .7s cubic-bezier(.7,0,.2,1)}
.steps.in li.auto{background-size:100% 100%}
.steps.in li.auto:nth-of-type(6){transition-delay:.18s}
.steps.in li.auto:nth-of-type(7){transition-delay:.36s}
.steps li.auto em{opacity:0;transition:opacity .3s .5s}
.steps.in li.auto em{opacity:1}
.steps li.auto:nth-of-type(6) em{transition-delay:.7s}.steps li.auto:nth-of-type(7) em{transition-delay:.9s}

.proj-h{font:400 clamp(44px,8vw,96px)/.95 var(--h);text-transform:uppercase;margin:64px 0 6px;letter-spacing:-.005em}
.proj-sub{font:italic 400 clamp(20px,2.6vw,26px)/1.3 var(--body);margin:0;max-width:30em}
.bigstat{margin-top:34px}

.pbar{margin-top:20px}
.pbar svg{display:block;width:100%;height:auto}
.pbar .hex{display:flex;padding:0 1.6%;margin-top:8px}
.pbar .hex span{flex:1;text-align:center;font:400 13px var(--h);letter-spacing:.08em}
.pbar h3{font:400 14px var(--h);letter-spacing:.14em;text-transform:uppercase;margin:0 0 8px}

.chart .fine{font-size:14px;color:var(--mid);margin:10px 0 0;line-height:1.45}


/* phones */
@media(max-width:700px){
  .bands .band{grid-template-columns:1fr auto;gap:0 12px;padding-top:22px;padding-bottom:22px}
  .band .n{display:none}
  .band .t,.band .d{grid-column:1}
  .band .go{grid-column:2;grid-row:1/3;width:44px;border-width:3px}
  .band .t{font-size:clamp(30px,11vw,64px)}
  .b-wp .t{font-size:clamp(28px,9.6vw,60px)}
  .b-sc .t{font-size:clamp(40px,14vw,80px)}
  .b-pb .t{font-size:clamp(34px,12vw,66px)}
  .b-pw .t{font-size:clamp(26px,8.6vw,54px)}
  .band .d{font-size:17px}
  table.save{font-size:14px}
  table.save th{font-size:10.5px;letter-spacing:.04em;padding:8px 3px}
  table.save td{padding:11px 3px}
  table.save small{display:block}
  .bar-top{flex-wrap:wrap;row-gap:10px}
}
.tw{overflow-x:auto;-webkit-overflow-scrolling:touch}

/* robustness: focus, motion, touch, text size, skip link */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{overflow-x:clip}
:focus-visible{outline:3px solid var(--purple);outline-offset:3px}
.brandsec :focus-visible,footer :focus-visible{outline-color:#3BFFDC}
button,a{-webkit-tap-highlight-color:transparent}
.skip{position:absolute;left:12px;top:-60px;background:var(--ink);color:var(--paper);padding:10px 14px;font:400 15px var(--h);letter-spacing:.1em;text-transform:uppercase;z-index:1000;text-decoration:none}
.skip:focus{top:12px}
.dots button{position:relative}
.dots button::before{content:"";position:absolute;inset:-12px}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
  .steps li.auto,.sum b{transition:none}
}
/* album controls sit below the book on phones instead of over the pages */
@media(max-width:620px){
  .car{padding-bottom:58px}
  .car-btn{top:auto;bottom:0;margin-top:0}
  .car-prev{left:calc(50% - 120px)}.car-next{right:calc(50% - 120px)}
  .dots{margin-top:-36px;position:relative;z-index:1}
}
@media print{nav,.skip,.car-btn,.dots{display:none}body{background:#fff}}