
@font-face{font-family:'Bodoni Moda';font-style:normal;font-weight:400 700;font-display:swap;src:url('/assets/fonts/bodoni-moda.e3d1b6d7.woff2') format('woff2-variations')}
@font-face{font-family:'Bodoni Moda';font-style:italic;font-weight:400 700;font-display:swap;src:url('/assets/fonts/bodoni-moda-italic.07fcb751.woff2') format('woff2-variations')}
@font-face{font-family:Chivo;font-style:normal;font-weight:300 900;font-display:swap;src:url('/assets/fonts/chivo.a3ed33fd.woff2') format('woff2-variations')}
html{scroll-behavior:smooth}
html,body{margin:0;padding:0;background:var(--dark)}
*{box-sizing:border-box}
a{color:var(--red);text-decoration:none}

a:hover{color:var(--ink)}
::selection{background:var(--rule-red);color:var(--paper)}
h1,h2,h3,.display,.lede{text-wrap:balance}
p,li,.body,.credit,.cap{text-wrap:pretty}
#page div{text-wrap:pretty}
input,button,textarea{font-family:inherit}
input:focus{outline:none;border-color:var(--ink)}
::placeholder{color:rgba(12,12,11,.4)}
#page{container-type:inline-size;container-name:page;width:100%;margin:0 auto;background:var(--paper);color:var(--ink);overflow-x:clip;overflow-y:visible;position:relative}
.pad{padding-left:clamp(16px,3cqw,44px);padding-right:clamp(16px,3cqw,44px)}
.eyebrow{font:700 11px/1 Chivo,system-ui,sans-serif;letter-spacing:.24em;text-transform:uppercase;color:var(--red);border-top:2px solid var(--rule-red);display:inline-block;padding-top:7px;white-space:nowrap}
.display{font-family:'Bodoni Moda',Didot,Georgia,serif;font-weight:400;letter-spacing:-.025em;line-height:.9;margin:0}
.lede{font-family:'Bodoni Moda',Didot,Georgia,serif;font-size:clamp(21px,2.6cqw,34px);line-height:1.24;letter-spacing:-.01em;margin:0;text-wrap:balance}
.body{font:400 clamp(14.5px,1.25cqw,17px)/1.62 Chivo,system-ui,sans-serif;color:var(--body);margin:0}
.cap{font:700 11.5px/1.5 Chivo,system-ui,sans-serif;letter-spacing:.1em;text-transform:uppercase;color:var(--dark)}
.credit{font:400 11px/1.7 Chivo,system-ui,sans-serif;letter-spacing:.05em;color:var(--muted)}
.kicker{font:700 11px/1 Chivo,system-ui,sans-serif;letter-spacing:.24em;text-transform:uppercase;color:var(--muted)}
.link{font:700 11px/1 Chivo,system-ui,sans-serif;letter-spacing:.16em;text-transform:uppercase;color:var(--body);border-bottom:2px solid var(--rule-red);padding-bottom:3px;display:inline-block;white-space:nowrap}
.link:hover{color:var(--red);border-bottom-color:var(--red)}
@keyframes rvIn{from{opacity:0;transform:translateY(52px)}to{opacity:1;transform:none}}
@supports (animation-timeline: view()){
  #guide>*,#who>*,#made>*,#anatomy>.pad>*,#app>.pad>*,#share>*,#languages>*{animation-name:rvIn;animation-duration:auto;animation-fill-mode:both;animation-timing-function:cubic-bezier(.2,.8,.2,1);animation-timeline:view();animation-range:entry 15% cover 26%}
  #cost>.pad>*,#invite>*{animation-name:rvIn;animation-duration:auto;animation-fill-mode:both;animation-timing-function:cubic-bezier(.2,.8,.2,1);animation-timeline:view();animation-range:entry 0% entry 45%}
}
@media (prefers-reduced-motion:reduce){#guide>*,#who>*,#made>*,#anatomy>.pad>*,#app>.pad>*,#share>*,#languages>*,#cost>.pad>*,#invite>*{animation-name:none}}
.plink{color:inherit;border-bottom:2px solid var(--rule-red);padding-bottom:3px;transition:color .15s ease,border-color .15s ease}
.plink:hover{color:var(--red);border-bottom-color:var(--red)}
.olink{color:var(--red);border-bottom:2px solid var(--rule-red);padding-bottom:3px;transition:color .15s ease,border-color .15s ease}
.olink:hover{color:var(--ink);border-bottom-color:var(--ink)}
.btn{font:700 11px/1 Chivo,system-ui,sans-serif;letter-spacing:.16em;text-transform:uppercase;background:var(--red);color:var(--paper);border:none;padding:15px 22px;cursor:pointer;display:inline-block;white-space:nowrap;text-wrap:nowrap}
.btn:hover{background:var(--red-pressed);color:var(--paper)}
.rule2{border-top:2px solid var(--ink)}
.rule1{border-top:1px solid rgba(12,12,11,.24)}
.g2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(28px,4cqw,64px)}
.g3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(24px,3cqw,40px)}
.sec{padding-top:clamp(48px,6.4cqw,104px);padding-bottom:clamp(48px,6.4cqw,104px)}
@container page (max-width:900px){.g2,.g3{grid-template-columns:1fr}.navlinks{display:none !important}.navcta{display:inline-block !important}.anatomyrow{grid-template-columns:1fr!important}.anatomyhead{display:none!important}}
/* ── The phones (56-01, 28 Sep 2026) ──────────────────────────────────────
   Every phone on the page draws the product as it is today. The guide, the
   How it's made and the app phones are drawn in iPhone points (390 x 844) and
   scaled to fit, inside a bezel drawn at the page's own size; the sharing phones
   are fluid and show the guide's real Story, link preview and guest card. */
.tm-col{display:flex;flex-direction:column;align-items:center;container-type:inline-size;container-name:tmcol}
.tm-holder{--s:.846;box-sizing:content-box;position:relative;width:calc(390px*var(--s));padding:11px;background:var(--dark);border-radius:46px;box-shadow:0 0 0 1.5px rgba(12,12,11,.55),0 40px 70px -30px rgba(12,12,11,.5)}
/* 58-24: sized by the column the phone sits in, not the page: at 375 the page is
   375 but the column is 343, and the 352px phone overflowed it. Each step is the
   narrowest column that scale still fits (390*s + 22). */
/* 58-24, his yes: on a short screen the full-size phone (736) and its hint cannot both
   sit under the 56px masthead (56 + 8 + 736 + 16 + 19 + 8 = 843), so it takes the 375
   size. Before the column steps, so a narrower column still wins. */
@media (max-height:843px){.tm-holder{--s:.8}}
@container tmcol (max-width:351px){.tm-holder{--s:.8}}
@container tmcol (max-width:333px){.tm-holder{--s:.74}}
@container tmcol (max-width:310px){.tm-holder{--s:.68}}
@media (prefers-reduced-motion:reduce){.stickycta{transition:none!important}}
.tm-clip{position:relative;display:block;width:calc(390px*var(--s));height:calc(844px*var(--s));border-radius:36px;overflow:hidden;background:var(--paper)}
.tm-screen{position:absolute;left:0;top:0;width:390px;height:844px;transform:scale(var(--s));transform-origin:0 0;display:flex;flex-direction:column;background:var(--paper);color:var(--ink);font-family:Chivo,system-ui,sans-serif;text-align:left;-webkit-font-smoothing:antialiased}
.tm .tm-vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.tm-credit{text-align:center;margin:16px 0 0}
.tm-replay{margin-top:12px;background:none;border:0;padding:0 0 3px;cursor:pointer;color:var(--ink);font:700 10px/1.4 Chivo,system-ui,sans-serif;letter-spacing:.14em;text-transform:uppercase;border-bottom:2px solid var(--rule-red)}
.tm-replay:hover,.tm-replay:focus-visible{color:var(--red)}

/* the status bar, drawn: bars, Wi-Fi and battery either side of the island */
.tm-status{flex:none;height:54px;display:flex;align-items:center;justify-content:space-between;position:relative;color:var(--ink)}
.tm-status .tm-ear{width:132px;display:flex;justify-content:center;align-items:center;gap:8px;padding-top:4px}
.tm-time{font:600 17px/1 -apple-system,BlinkMacSystemFont,"SF Pro Text",system-ui,sans-serif;letter-spacing:-.02em}
.tm-island{position:absolute;left:calc(50% - 62px);top:11px;width:124px;height:36px;border-radius:20px;background:var(--ink)}
.tm-status svg{display:block;fill:currentColor}
.tm-status .tm-s{fill:none;stroke:currentColor;stroke-width:2.1;stroke-linecap:round}
.tm-status .tm-bo{fill:none;stroke:currentColor;stroke-opacity:.4;stroke-width:1.1}
.tm-status.on-dark{color:var(--white)}
.tm-status.tm-sm{height:44px;padding:0 20px 0 28px}
.tm-sm .tm-time{font-size:14px}
.tm-sm .tm-island{top:9px;left:calc(50% - 50px);width:100px;height:28px}
.tm-sm .tm-icons{display:flex;align-items:center;gap:4px;transform:scale(.8);transform-origin:100% 50%}
.tm-status.on-dark .tm-island{background:var(--ink)}

/* nav, segmented control, panes */
.tm .nav{flex:none;position:relative;height:68px;display:flex;align-items:center;justify-content:space-between;padding:12px 20px}
.tm .nav .back{font:400 26px/1 Chivo,system-ui,sans-serif;width:44px}
.tm .nav .title{position:absolute;left:0;right:0;text-align:center;font:400 22px/1 'Bodoni Moda',Didot,serif;pointer-events:none}
.tm .nav .pub{font:600 15px/1 Chivo,system-ui,sans-serif;letter-spacing:.02em;color:var(--red);transition:color .25s ease}
.tm .nav .pub.off{color:rgba(90,87,79,.5)}
.tm .seg{flex:none;margin:4px 16px 8px;padding:3px;border-radius:999px;background:rgba(12,12,11,.08);display:flex;position:relative}
.tm .seg label,.tm .seg>span:not(.pill){flex:1;min-height:44px;display:flex;align-items:center;justify-content:center;font:400 15px/1 Chivo,system-ui,sans-serif;color:var(--ink);border-radius:999px;cursor:pointer;position:relative;z-index:1;user-select:none;-webkit-tap-highlight-color:transparent}
.tm .seg>span.on{font-weight:600}
.tm .seg .pill{position:absolute;top:3px;bottom:3px;left:3px;width:calc((100% - 6px)/3);border-radius:999px;background:rgba(255,255,255,.92);box-shadow:0 1px 3px rgba(12,12,11,.12),0 0 0 .5px rgba(12,12,11,.06);transition:transform .25s ease}
.tm .seg .pill.tm-at-edit{transform:translateX(100%)}
#tm-m-chat:checked~.seg label[for=tm-m-chat],#tm-m-edit:checked~.seg label[for=tm-m-edit],#tm-m-prev:checked~.seg label[for=tm-m-prev]{font-weight:600}
#tm-m-edit:checked~.seg .pill{transform:translateX(100%)}
#tm-m-prev:checked~.seg .pill{transform:translateX(200%)}
#tm-m-chat:focus-visible~.seg label[for=tm-m-chat],#tm-m-edit:focus-visible~.seg label[for=tm-m-edit],#tm-m-prev:focus-visible~.seg label[for=tm-m-prev]{outline:2px solid var(--red);outline-offset:-2px}
.tm .panes{flex:1;position:relative;min-height:0}
.tm .pane{position:absolute;inset:0;display:none;flex-direction:column}
#tm-m-chat:checked~.panes .p-chat,#tm-m-edit:checked~.panes .p-edit,#tm-m-prev:checked~.panes .p-prev{display:flex}

/* chat */
.tm .log{flex:1;overflow-y:auto;padding:8px 16px 12px;display:flex;flex-direction:column;gap:8px;scrollbar-width:none}
.tm .log::-webkit-scrollbar{display:none}
.tm .log .spacer{flex:1}
.tm .msg{max-width:300px;padding:12px 14px;border-radius:16px;font:400 17px/1.45 Chivo,system-ui,sans-serif;color:var(--ink)}
.tm .msg.recv{align-self:flex-start;background:var(--white)}
.tm .msg.sent{align-self:flex-end;background:var(--sand)}
.tm .msg.recv+.msg.sent,.tm .msg.sent+.msg.recv,.tm .card+.msg,.tm .msg+.card{margin-top:8px}
.tm .typing{align-self:flex-start;background:var(--white);border-radius:16px;padding:16px;display:flex;gap:4px}
.tm .typing i{width:7px;height:7px;border-radius:50%;background:var(--muted);opacity:.35;animation:tmDot 1.2s ease-in-out infinite}
.tm .typing i:nth-child(2){animation-delay:.2s}.tm .typing i:nth-child(3){animation-delay:.4s}
@keyframes tmDot{0%,60%,100%{opacity:.3;transform:translateY(0)}30%{opacity:.9;transform:translateY(-2px)}}
.tm .card{flex:none;align-self:flex-start;width:330px;max-width:100%;background:var(--white);border-radius:16px;overflow:hidden}
/* the lead photo, as ConversationView.cardMedia draws it: full width, 110 tall, the card's corners, the credit bottom left */
.tm .cmedia{position:relative;height:110px;background:var(--sand)}
.tm .cmedia img{display:block;width:100%;height:100%;object-fit:cover}
.tm .ccredit{position:absolute;left:6px;bottom:6px;padding:3px 6px;background:rgba(12,12,11,.55);color:var(--paper);font:500 9px/1.2 Chivo,system-ui,sans-serif;white-space:nowrap}
.tm .cbody{padding:12px 14px 0}
.tm .card .ey{font:600 11px/1.2 Chivo,system-ui,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.tm .card .namerow{padding-top:4px}
.tm .card .name{display:inline;font:400 20px/1.15 'Bodoni Moda',Didot,serif;color:var(--ink);text-decoration:none}
.tm .mk{font:500 10px/1 Chivo,system-ui,sans-serif;color:var(--red)}
.tm .card .note{padding-top:8px;font:400 17px/1.45 Chivo,system-ui,sans-serif;color:var(--ink);margin:0}
.tm .card .addr{display:inline-block;padding-top:8px;font:600 13px/1.35 Chivo,system-ui,sans-serif;color:var(--red);text-decoration:none}
.tm .card .foot{display:flex;justify-content:space-between;align-items:baseline}
.tm .card .foot span{font:600 15px/44px Chivo,system-ui,sans-serif;letter-spacing:.02em;color:var(--red)}
.tm .in{animation:tmRise .25s ease both}
.tm .card.in{animation:tmLand .5s ease-in-out both}
@keyframes tmRise{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@keyframes tmLand{0%{opacity:0;transform:translateY(18px) scale(.97)}100%{opacity:1;transform:none}}
.tm .chips{flex:none;display:flex;gap:8px;padding:0 16px 8px;overflow:hidden}
.tm .chip{flex:none;height:44px;display:flex;align-items:center;padding:0 16px;border-radius:999px;background:rgba(255,255,255,.72);box-shadow:inset 0 0 0 1px rgba(12,12,11,.22);font:400 15px/1 Chivo,system-ui,sans-serif;white-space:nowrap}
.tm .composer{flex:none;display:flex;align-items:flex-end;gap:8px;padding:0 16px 8px}
.tm .field{flex:1;min-width:0;min-height:44px;max-height:170px;overflow:hidden;display:flex;align-items:center;border-radius:24px;background:rgba(255,255,255,.8);box-shadow:inset 0 0 0 1px rgba(12,12,11,.22),0 1px 2px rgba(12,12,11,.05);padding:10px 16px;font:400 17px/1.4 Chivo,system-ui,sans-serif}
.tm .field .ph{margin:0;color:var(--muted)}
.tm .pov-t{margin:0}
.tm .field .txt{white-space:pre-wrap}
.tm .caret{display:inline-block;width:2px;height:21px;margin:0 0 -4px 1px;background:var(--red);animation:tmBlink 1.2s steps(1) infinite}
@keyframes tmBlink{50%{opacity:0}}
.tm .rec{flex:1;min-width:0;height:44px;border-radius:999px;background:rgba(255,255,255,.8);box-shadow:inset 0 0 0 1px rgba(12,12,11,.22);display:none;align-items:center;gap:8px;padding:0 0 0 16px}
.tm .rec .dot{width:9px;height:9px;border-radius:50%;background:var(--red);flex:none;animation:tmRecdot 1.2s ease-in-out infinite}
@keyframes tmRecdot{50%{opacity:.35}}
.tm .rec .word{font:400 15px/1 Chivo,system-ui,sans-serif}
.tm .rec .tm-alt{display:none}
.tm .rec .grow{flex:1}
.tm .rec .clock{font:400 13px/1 Chivo,system-ui,sans-serif;color:var(--muted);font-variant-numeric:tabular-nums}
.tm .rec .x{width:44px;height:44px;display:flex;align-items:center;justify-content:center}
.tm .rec .wave{flex:1;min-width:0;height:28px;display:none;align-items:center;justify-content:flex-end;gap:2px;overflow:hidden}
.tm .rec .wave b{flex:none;width:3px;border-radius:2px;background:var(--ink);height:2px;transition:height .15s linear}
.tm .wavey .rec .wave{display:flex}
.tm .wavey .rec .word,.tm .wavey .rec .grow{display:none}
.tm .rec.trans .dot,.tm .rec.trans .wave,.tm .rec.trans .clock,.tm .rec.trans .x,.tm .rec.trans .grow,.tm .rec.trans .word{display:none}
.tm .rec.trans .tm-alt{display:block;color:var(--muted)}
.tm .rec .spin{display:none}
.tm .rec.trans .spin{display:block}
.tm .composer svg{display:block;fill:currentColor}
.tm .composer .tm-s,.tm .form .tm-s,.tm .pov .tm-s,.tm .mapbtn .tm-s{fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.tm .x{color:var(--muted)}
.tm .circle{flex:none;width:44px;height:44px;border-radius:50%;display:flex;align-items:center;justify-content:center;position:relative}
.tm .circle.glass{background:rgba(255,255,255,.8);box-shadow:inset 0 0 0 1px rgba(12,12,11,.22),0 1px 2px rgba(12,12,11,.05);color:var(--ink)}
.tm .circle.red{background:var(--red);color:var(--paper)}
.tm .send .tm-s{stroke-width:2.6}
.tm .recording .field{display:none}
.tm .recording .rec{display:flex}
.tm .recording .mic{background:var(--red);box-shadow:none;color:var(--paper)}
.tm .mic .g-stop,.tm .mic .g-spin{display:none}
.tm .recording .mic .g-mic{display:none}
.tm .recording .mic .g-stop{display:block}
.tm .transcribing .mic .g-stop{display:none}
.tm .transcribing .mic .g-spin{display:block}
.tm .spinner{animation:tmSpin 1.2s steps(8) infinite}
@keyframes tmSpin{to{transform:rotate(360deg)}}
.tm .home{flex:none;height:26px;display:flex;justify-content:center;align-items:flex-end;padding-bottom:8px}
.tm .home i{width:134px;height:5px;border-radius:4px;background:var(--ink)}

/* Edit: the app's iOS form */
.tm .form{flex:1;overflow-y:auto;padding:4px 16px 24px;scrollbar-width:none}
.tm .form::-webkit-scrollbar{display:none}
.tm .fh{display:flex;justify-content:space-between;align-items:center;min-height:44px;padding:18px 16px 8px;font:400 13px/1 -apple-system,BlinkMacSystemFont,"SF Pro Text",system-ui,sans-serif;letter-spacing:.02em;text-transform:uppercase;color:var(--muted)}
.tm .fh .dots{color:var(--red);font:600 20px/1 -apple-system,BlinkMacSystemFont,system-ui,sans-serif;letter-spacing:.05em}
.tm .group{background:var(--white);border-radius:24px;overflow:hidden}
.tm .row{display:flex;align-items:center;gap:12px;min-height:48px;padding:12px 16px;position:relative;font:400 17px/1.3 -apple-system,BlinkMacSystemFont,"SF Pro Text",system-ui,sans-serif;color:var(--ink)}
.tm .row+.row::before{content:"";position:absolute;top:0;left:16px;right:0;height:.5px;background:rgba(12,12,11,.18)}
.tm .row .v{margin-left:auto;color:var(--muted);text-align:right;max-width:62%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tm .row .stack{min-width:0;flex:1}
#page .tm .row .sub{font-size:15px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:2px}
#page .tm .row .sub.two{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.tm .row.add{color:var(--red)}
.tm .row.add svg{flex:none}
.tm .rt{margin:0}
.tm .row.new{animation:tmRise .5s ease-in-out both}
.tm .cover{padding:14px 16px 12px}
.tm .cover .cvimg{position:relative;height:150px;border-radius:8px;background-color:var(--sand);background-position:center 40%;background-size:cover;background-repeat:no-repeat}
.tm .cover .badge{position:absolute;right:10px;bottom:10px;width:28px;height:28px;border-radius:50%;background:rgba(12,12,11,.55);display:flex;align-items:center;justify-content:center}
.tm .cover .badge svg{fill:var(--paper)}
.tm .cover .cl{display:flex;justify-content:space-between;align-items:baseline;margin-top:12px}
.tm .cover .cl .cvl{font:600 11px/1 Chivo,system-ui,sans-serif;letter-spacing:.07em;text-transform:uppercase;color:var(--red)}
.tm .cover .cl span{font:600 14px/1 Chivo,system-ui,sans-serif;color:var(--red)}
.tm .ff{font:400 13px/1.4 -apple-system,BlinkMacSystemFont,system-ui,sans-serif;color:var(--muted);padding:8px 16px 0}

/* Preview, and the guide phone: the live Paris page at a phone's width */
.tm .pov{flex:none;display:flex;align-items:center;gap:8px;padding:8px 16px;font:400 13px/1.3 Chivo,system-ui,sans-serif;color:var(--muted);background:var(--paper);border-bottom:1px solid rgba(12,12,11,.14)}
.tm .pov svg{fill:currentColor}
.tm .pempty{flex:1;display:flex;align-items:center;justify-content:center;text-align:center;padding:0 40px;font:400 15px/1.6 Chivo,system-ui,sans-serif;color:var(--muted);text-wrap:balance}
.tm .page{flex:1;overflow-y:auto;padding:0 16px 96px;scrollbar-width:none;position:relative;background:var(--paper)}
.tm .page::-webkit-scrollbar{display:none}
.tm .idbar{position:sticky;top:0;z-index:40;margin:0 -16px;padding:0 16px;height:56px;display:flex;align-items:center;gap:12px;background:var(--paper);border-bottom:2px solid var(--ink)}
.tm .wordmark{font:400 20px/1 'Bodoni Moda',Didot,serif;letter-spacing:-.01em;white-space:nowrap}
.tm .idguide{font:700 10px/1 Chivo,system-ui,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);opacity:0;transform:translateX(-4px);transition:opacity .15s ease,transform .15s ease;white-space:nowrap}
.tm .idbar.pinned .idguide{opacity:1;transform:none}
.tm .pg-head{margin-top:40px}
.tm .pg-h1{font:400 40px/.98 'Bodoni Moda',Didot,serif;letter-spacing:-.015em}
.tm .byauthor{margin:16px 0 0;display:flex;align-items:center;gap:10px;font:400 14px/1.4 Chivo,system-ui,sans-serif;color:var(--muted)}
.tm .mugshot{flex:none;width:34px;height:34px;border-radius:50%;object-fit:cover;background:rgba(12,12,11,.08)}
.tm .byauthor a{color:var(--ink);text-decoration:none;border-bottom:2px solid var(--rule-red)}
.tm .dek{font:italic 400 18px/1.35 'Bodoni Moda',Didot,serif;color:var(--body);margin:24px 0 0;max-width:30ch}
.tm .acts{margin:24px 0 0;display:flex;flex-wrap:wrap;gap:10px 22px;align-items:baseline}
.tm .act{color:var(--ink);font:700 10px/1.4 Chivo,system-ui,sans-serif;letter-spacing:.14em;text-transform:uppercase;border-bottom:2px solid var(--rule-red)}
.tm .hero{margin:28px 0 0;position:relative}
.tm .hero .tm-vid{display:block;width:100%;height:218px;object-fit:cover;background:rgba(12,12,11,.14)}
.tm .hero figcaption{position:absolute;left:10px;bottom:10px;background:rgba(12,12,11,.55);color:var(--paper);font:500 10px/1 Chivo,system-ui,sans-serif;padding:4px 8px}
.tm .clipbtn{position:absolute;right:12px;bottom:12px;width:36px;height:36px;border-radius:50%;border:0;padding:0;background:rgba(12,12,11,.55);color:var(--paper);display:grid;place-items:center;cursor:pointer}
.tm .clipbtn[hidden]{display:none}
.tm .clipbtn svg{fill:currentColor}
.tm .clipbtn.is-paused svg{display:none}
.tm .clipbtn.is-paused::before{content:"";margin-left:3px;border-style:solid;border-width:7px 0 7px 11px;border-color:transparent transparent transparent var(--paper)}
.tm .clipbtn:focus-visible{outline:2px solid var(--paper);outline-offset:2px}
.tm .stickybar{position:sticky;top:56px;z-index:6;margin:28px -16px 0;padding:0 16px;background:var(--paper);border-bottom:1px solid rgba(12,12,11,.14)}
.tm .filterbar{display:flex;flex-wrap:wrap;gap:4px;padding:8px 0}
.tm .gchip{border:1px solid rgba(12,12,11,.14);padding:4px 11px;border-radius:999px;font:700 10px/1 Chivo,system-ui,sans-serif;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.tm .gchip .dot{display:inline-block;width:7px;height:7px;border-radius:50%;margin-right:6px;background:currentColor}
.tm .gchip.on{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.tm .gchip.cur{border-color:var(--ink);color:var(--ink)}
.tm .c-stay{color:var(--cat-stay)}.tm .c-eat{color:var(--cat-eat)}.tm .c-drink{color:var(--cat-drink)}.tm .c-art{color:var(--cat-art)}.tm .c-wander{color:var(--cat-wander)}.tm .c-shop{color:var(--cat-shop)}.tm .c-weekend{color:var(--cat-weekend)}.tm .c-daytrip{color:var(--cat-daytrip)}
.tm .pg-sec{margin-top:44px}
.tm .cat{border-top:2px solid var(--rule-red);padding-top:14px;margin-bottom:4px}
.tm .pg-h2{font:400 26px/1 'Bodoni Moda',Didot,serif}
.tm .pheading{margin:8px 0 4px;font:italic 400 19px/1.3 'Bodoni Moda',Didot,serif;color:var(--body);max-width:34ch}
.tm .sectionintro{margin:8px 0 0;font:italic 400 16px/1.4 'Bodoni Moda',Didot,serif;color:var(--body);max-width:46ch}
.tm .subsec{margin:32px 0 -6px;font:700 10px/1.4 Chivo,system-ui,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:var(--red)}
.tm .entry{margin:28px -14px 0;padding:4px 14px 24px;border-radius:8px}
.tm .entry+.entry{border-top:1px solid rgba(12,12,11,.14);padding-top:28px}
.tm .entry>figure{margin:16px 0 0;position:relative}
.tm .pmedia{position:relative;overflow:hidden;border-radius:4px;background:rgba(12,12,11,.14)}
.tm .pmedia img{display:block;width:100%;height:203px;object-fit:cover}
.tm .pcredit{position:absolute;left:8px;bottom:8px;background:rgba(12,12,11,.55);color:var(--paper);font:500 10px/1 Chivo,system-ui,sans-serif;padding:4px 7px}
.tm .pcap{margin:8px 0 0;font:400 13px/1.4 Chivo,system-ui,sans-serif;color:var(--muted)}
.tm .label{margin:14px 0 -4px;font:700 10px/1.4 Chivo,system-ui,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.tm .pg-h3{margin:16px 0 0;font:400 22px/1.08 'Bodoni Moda',Didot,serif}
.tm .place{color:var(--ink);text-decoration:none}
.tm .place .mark{color:var(--red);font:500 10px Chivo,system-ui,sans-serif;margin-left:6px;vertical-align:10px}
.tm .locality{margin:8px 0 0;font:400 12px/1.4 Chivo,system-ui,sans-serif;letter-spacing:.02em;color:var(--muted)}
.tm .practical{margin:12px 0 0;font:700 10px/1.4 Chivo,system-ui,sans-serif;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-variant-numeric:tabular-nums}
.tm .said{margin:12px 0 0;font:400 16px/1.62 Chivo,system-ui,sans-serif;color:var(--body)}
.tm .page .addr{margin:14px 0 0}
.tm .page .addr a{font:700 10px/1.5 Chivo,system-ui,sans-serif;letter-spacing:.08em;text-transform:uppercase;color:var(--red);text-decoration:none}
.tm .page .addr a::after{content:"\00a0\00a0\2197\FE0E"}
.tm .pshare{margin:12px 0 0;font:700 10px/1.4 Chivo,system-ui,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.tm .page .new{animation:tmLand .5s ease-in-out both}
.tm .mapbtn{position:absolute;left:50%;bottom:24px;transform:translateX(-50%);z-index:30;display:flex;align-items:center;gap:8px;padding:12px 18px;border-radius:999px;background:var(--ink);color:var(--paper);font:700 10px/1 Chivo,system-ui,sans-serif;letter-spacing:.14em;text-transform:uppercase;box-shadow:0 6px 18px rgba(12,12,11,.25)}
.tm .mapbtn svg{fill:none}

/* the guide phone: the page itself, tapped through, ending on the app's share step. No touch mark: the phone is not being recorded (58-20) */
.tm-gphone{cursor:default}
.tm-gphone[role=button]{cursor:pointer}
.tm .tm-gpage{padding-bottom:0}
.tm .tm-gpage .entry{margin-top:0}

/* the guide phone's last screen: the app's share step (58-19, 28 Sep 2026), drawn
   from ShareStepView as it rests after publishing Paris. The 2-of-2 step bar, the
   heading in Bodoni (28 in the app, the page scale's 30 here), the link in a 48-high field with the copy mark, the Reel,
   Story and Post tiles at 57.5% of the phone's width with the next one peeking in,
   the page dots, and the two large buttons over the home indicator. The tiles are the
   renderer's own reel, Story and Post, as the guide ships them. */
.tm .tm-ss{flex:1;min-height:0;position:relative;overflow:hidden;display:flex;flex-direction:column;padding:40px 24px 0;background:var(--paper)}
.tm .ss-bars{display:flex;gap:4px}
.tm .ss-bars i{flex:1;height:3px;border-radius:100px;background:var(--red)}
.tm .ss-h{margin-top:16px;font:400 30px/1.2 'Bodoni Moda',Didot,serif;color:var(--ink)}
.tm .ss-link{margin-top:12px;min-height:48px;display:flex;align-items:center;gap:8px;padding:0 16px;border-radius:16px;box-shadow:inset 0 0 0 1px rgba(12,12,11,.22)}
.tm .ss-url{flex:1;min-width:0;white-space:nowrap;font:400 15px/1 ui-monospace,"SF Mono",Menlo,monospace;color:var(--ink)}
.tm .ss-link svg{flex:none;fill:none;stroke:var(--red)}
.tm .ss-link .tm-s{stroke-width:1.6;stroke-linejoin:round}
.tm .ss-strip{margin:12px -24px 0;padding:0 24px;display:flex;align-items:flex-end;gap:8px;overflow:hidden}
.tm .ss-tile{flex:none;width:224px;display:flex;flex-direction:column;align-items:center}
.tm .ss-img{position:relative;width:224px;height:398px;border-radius:8px;overflow:hidden;box-shadow:inset 0 0 0 1px rgba(12,12,11,.14);background:var(--white)}
.tm .ss-post .ss-img{height:280px}
.tm .ss-img img{display:block;width:100%;height:100%;object-fit:cover}
.tm .ss-play{position:absolute;right:8px;bottom:8px;width:29px;height:29px;border-radius:50%;background:rgba(12,12,11,.42);display:flex;align-items:center;justify-content:center}
.tm .ss-play svg{fill:var(--white);margin-left:2px}
.tm .ss-cap{margin-top:6px;font:400 15px/1.3 Chivo,system-ui,sans-serif;color:var(--muted);text-align:center}
.tm .ss-dots{margin-top:12px;display:flex;justify-content:center;gap:8px}
.tm .ss-dots i{width:8px;height:8px;border-radius:50%;background:var(--stone)}
.tm .ss-dots i.on{background:var(--ink)}
.tm .ss-bar{margin-top:auto;padding:16px 0 40px;display:flex;flex-direction:column;gap:12px;background:var(--paper)}
.tm .ss-btn{height:52px;border-radius:100px;display:flex;align-items:center;justify-content:center;background:var(--red);color:var(--white);font:400 17px/1 -apple-system,BlinkMacSystemFont,"SF Pro Text",system-ui,sans-serif;letter-spacing:-.01em}
.tm .ss-ghost{background:rgba(12,12,11,.14);color:var(--ink)}

/* the sticker */
.tm .sticker{position:absolute;right:-44px;top:180px;width:112px;height:112px;transform:rotate(-12deg);z-index:5;pointer-events:none;transition:opacity .25s ease,transform .25s ease;filter:drop-shadow(0 6px 10px rgba(12,12,11,.22))}
.tm .sticker svg{position:absolute;inset:0;fill:var(--red)}
.tm .sticker span{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;text-align:center;font:700 17px/1.02 Chivo,system-ui,sans-serif;letter-spacing:.06em;text-transform:uppercase;color:var(--paper)}
.tm .sticker.gone{opacity:0;transform:rotate(-4deg) scale(.9)}
:lang(fr) .tm .sticker{width:128px;height:128px;right:-52px}
/* The sticker overhangs the phone only as far as the gutter beside it allows: the
   page clips anything past its own edge, and at the narrowest two-column widths
   there is barely a gutter at all. */
@container page (min-width:901px) and (max-width:1100px){.tm .sticker{right:-20px}:lang(fr) .tm .sticker{right:-24px}}
:lang(fr) .tm .sticker span{font-size:15px;letter-spacing:.04em}
@container page (max-width:560px){.tm-made{padding-top:56px}.tm .sticker{right:auto;left:-4px;top:-64px;width:88px;height:88px}.tm .sticker span{font-size:14px}:lang(fr) .tm .sticker{width:100px;height:100px;right:auto}:lang(fr) .tm .sticker span{font-size:12px}}

/* reduced motion: stills, and switches without travel */
.tm.tm-calm *,.tm.tm-calm *::before,.tm.tm-calm *::after{animation:none!important;transition:none!important}
@media (prefers-reduced-motion:reduce){.tm *,.tm *::before,.tm *::after{animation:none!important;transition:none!important}}

/* the sharing phones: fluid, at the page's own size */
.tm-fphone{width:100%;max-width:352px;background:var(--dark);border-radius:46px;padding:11px;box-shadow:0 0 0 1.5px rgba(12,12,11,.55),0 40px 70px -30px rgba(12,12,11,.5)}
.tm-fscreen{width:100%;aspect-ratio:330/716;border-radius:36px;overflow:hidden;position:relative;display:flex;flex-direction:column;background:var(--paper);text-align:left}
.tm-ig{background:var(--ink)}
.tm-story{position:relative;flex:none;width:100%;aspect-ratio:9/16;border-radius:8px;overflow:hidden;background:var(--dark)}
.tm-story>img{display:block;width:100%;height:100%;object-fit:cover}
.tm-storytop{position:absolute;left:0;right:0;top:0;padding:8px 8px 0;color:var(--white)}
.tm-prog{display:block;height:2px;border-radius:999px;background:rgba(255,255,255,.35);overflow:hidden}
.tm-prog i{display:block;width:40%;height:100%;background:var(--white)}
.tm-who{display:flex;align-items:center;gap:8px;margin-top:8px;font:600 12px/1 -apple-system,BlinkMacSystemFont,system-ui,sans-serif}
.tm-who img{width:22px;height:22px;border-radius:50%;object-fit:cover}
.tm-reply{flex:1;display:flex;align-items:center;gap:12px;padding:0 12px;color:var(--white)}
.tm-pillin{flex:1;border:1px solid rgba(255,255,255,.5);border-radius:999px;padding:8px 14px;font:400 13px/1 -apple-system,BlinkMacSystemFont,system-ui,sans-serif;color:rgba(255,255,255,.85)}
.tm-reply svg{flex:none}
.tm-reply .tm-s{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.tm-wa{background:var(--sand)}
.wa-head{flex:none;height:52px;background:var(--wa-green);display:flex;align-items:center;gap:10px;padding:0 14px;color:var(--white)}
.wa-back{font:400 17px/1 Chivo,system-ui,sans-serif}
.wa-av{width:30px;height:30px;border-radius:50%;background:rgba(255,255,255,.28);display:flex;align-items:center;justify-content:center;font:500 12px/1 Chivo,system-ui,sans-serif}
.wa-who{display:flex;flex-direction:column;gap:2px;font:500 14px/1.2 Chivo,system-ui,sans-serif}
.wa-on{font:400 10px/1.2 Chivo,system-ui,sans-serif;color:rgba(255,255,255,.72)}
.wa-chat{flex:1;min-height:0;overflow:hidden;padding:12px 10px;display:flex;flex-direction:column;justify-content:flex-end;gap:8px}
.wa-day{flex:none;align-self:center;background:rgba(225,245,254,.92);border-radius:7px;padding:4px 10px;font:400 10px/1 Chivo,system-ui,sans-serif;letter-spacing:.06em;text-transform:uppercase;color:var(--slate)}
.wa-in,.wa-out{flex:none;display:flex;flex-direction:column;box-shadow:0 1px 1px rgba(12,12,11,.14);font:400 13px/1.4 Chivo,system-ui,sans-serif;color:var(--dark)}
.wa-in{align-self:flex-start;max-width:82%;background:var(--white);border-radius:8px 8px 8px 2px;padding:6px 10px 4px}
.wa-out{align-self:flex-end;max-width:88%;background:var(--wa-bubble);border-radius:8px 8px 2px 8px;padding:4px 4px 4px}
.wa-out>.wa-t,.wa-out>.wa-link{padding:4px 6px 0}
.wa-prev{display:flex;flex-direction:column;background:var(--wa-bubble-2);border-radius:6px;overflow:hidden}
.wa-prev img{display:block;width:100%;aspect-ratio:1200/630;object-fit:cover}
.wa-pt{padding:8px 10px 0;font:600 12px/1.3 Chivo,system-ui,sans-serif;color:var(--ink)}
.wa-pd{padding:2px 10px 0;font:400 11px/1.35 Chivo,system-ui,sans-serif;color:var(--muted);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.wa-pu{padding:4px 10px 8px;font:400 11px/1.2 Chivo,system-ui,sans-serif;color:var(--slate)}
.wa-link{color:var(--slate);text-decoration:underline;word-break:break-all;font-size:12px}
.wa-time{align-self:flex-end;font:400 10px/1 Chivo,system-ui,sans-serif;color:var(--slate);padding:4px 4px 0}
.wa-ticks{color:var(--moss)}
.wa-bar{flex:none;padding:0 10px 12px;display:flex;align-items:center;gap:8px}
.wa-field{flex:1;background:var(--white);border-radius:999px;padding:10px 14px;box-shadow:0 1px 1px rgba(12,12,11,.12);font:400 13px/1 Chivo,system-ui,sans-serif;color:var(--slate)}
.wa-mic{flex:none;width:38px;height:38px;border-radius:50%;background:var(--wa-green);color:var(--white);display:flex;align-items:center;justify-content:center}
.wa-mic .tm-s{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}
.tm-guest{position:relative;flex:1;min-height:0;display:flex;align-items:center;justify-content:center;padding:28px 0;background:url('/media/web-street-1-b70c3c33.jpg') center/cover no-repeat var(--sand)}
.tm-guest::before{content:"";position:absolute;inset:0;background:rgba(12,12,11,.34)}
.tm-guest img{position:relative;display:block;width:76%;height:auto;aspect-ratio:1080/1350;box-shadow:0 18px 34px -14px rgba(12,12,11,.5)}

/* The palette, named once. Every colour in the design file is a var() now, so a
   value exists in exactly one place and a new one cannot be typed in by accident.
   The first six are the guide's own tokens (tools/_guide_styles.css) at the same
   values, so the two halves of the site finally share a definition rather than two
   lists that had drifted to 37 values between them.
   tools/palette_check.py fails the build on a raw hex that is not one of these. */
:root {
  --paper: #F4F1E8;   --ink: #0C0C0B;      --body: #3A3833;
  --muted: #5A574F;   --red: #C4271E;      --rule-red: #E63329;
  --white: #FFFFFF;
  /* Surfaces above paper, and the phone in its dark state. */
  --cream: #FBF9F4;   --sand: #E5DDD5;
  --dark: #1A1917;
  /* The app's recessive mark: the share step's page dots. */
  --stone: #D9D2C2;
  /* Small text and hairlines between muted and paper. */
  --gray: #6E6B64;    --line: #C4BFB6;
  /* Red held down, and red on a dark ground. */
  --red-pressed: #A81F18;                  --coral: #FF7A6D;
  /* Text that sits on a photograph. */
  --slate: #5F6D70;   --moss: #4F6153;
  /* WhatsApp, for the one mockup showing a message in it. Their brand, not ours. */
  --wa-green: #075E54; --wa-bubble: #DCF8C6; --wa-bubble-2: #D2F0B8;
  /* The guide's category colours, its one cross-guide axis, at the values
     tools/_guide_styles.css already defines (.chip.cat-*). The filter chips are
     the guide's real navigation, so the homepage's mockup of them needs the same
     eight. Named here rather than typed in, like everything else. */
  --cat-eat: #C4271E;    --cat-drink: #6F3448;   --cat-art: #34526F;
  --cat-wander: #346F4A; --cat-shop: #6F5934;    --cat-stay: #346F6B;
  --cat-daytrip: #344A6F; --cat-weekend: #3A3833;
}

/* Hoisted classes are author-origin and outrank the UA's [hidden] rule, so the
   phone screens and the sent/unsent form states need this said explicitly. */
[hidden] { display: none !important; }

/* Keyboard focus. The design described hover only. */
:focus-visible { outline: 2px solid var(--red); outline-offset: 3px; }

.skip-link {
  position: absolute; left: -9999px; top: 0; z-index: 100;
  background: var(--ink); color: var(--paper); padding: 10px 16px;
  font-size: 11.5px; font-weight: 700; letter-spacing: .12em;
  text-transform: uppercase;
}
.skip-link:focus { left: 0; }

/* Thumb-sized hit areas for the small uppercase links, using the same overlay
   trick the guide uses: absolutely positioned, so not one pixel of layout
   moves. The insets were chosen against the measured gaps between these links
   (24px in the header, 28px in the footer) so no two targets can overlap,
   which would be worse than leaving them small. */
header nav a, footer a, a.link, .credit a { position: relative; }
header nav a::after, footer a::after, a.link::after, .credit a::after {
  content: ""; position: absolute;
  left: -4px; right: -4px; top: -9px; bottom: -6px;
}

/* These stack in a column only 9px apart, so they get just enough to clear
   24px and no more. */
a.olink { position: relative; }
a.olink::after {
  content: ""; position: absolute;
  left: -4px; right: -4px; top: -3px; bottom: -3px;
}

/* House style: no orphaned text. `text-wrap: pretty` stops a single word being
   left alone on the last line of any flowing text; `balance` evens out short
   headings. Fixed-width UI (a phone-mockup nav title, a chip) is handled per
   element, since wrap cannot help inside a locked width. */
h1, h2, h3, h4, h5, h6, .display { text-wrap: balance; }
p, li, figcaption, blockquote, dd, dt { text-wrap: pretty; }
#page div, #app div { text-wrap: pretty; }


#app :focus-visible, #invite :focus-visible { outline-color: var(--paper); }

/* The phone mockups and the language sheet were plain divs with an onClick.
   They are buttons now, and a button brings styling a div never had. */
.btn-reset {
  background: none; border: 0; padding: 0; margin: 0;
  font: inherit; color: inherit; text-align: inherit;
  cursor: pointer; -webkit-appearance: none; appearance: none;
}
/* The one thing a reset cannot inherit: a button does not take the width its
   parent offers, and the div it replaced did. */
.btn-block { width: 100%; }

/* Footer: the guide link (Tomáš's Paris) matched the legal links beside it in
   every state except hover, where the design shifted it to coral while the legal
   links only gain the red underline. Keep its normal paper colour and show just
   the shared underline, so the row is consistent.

   Matched on the href, not on a generated class. This rule was written as
   `.s371.h4` and silently stopped applying the moment the design shifted that
   link to `.s372`: the class numbers are output, not names, and any selector
   pinned to one is a rule that quietly lapses. */
footer a[href*="/paris"]:hover,
footer a[href*="/paris"]:focus-visible { color: var(--paper); }

.s0{margin-bottom:22px;box-shadow:0 12px 30px rgba(12,12,11,.3)}
.s1{position:fixed;left:0;right:0;bottom:0;z-index:70;display:flex;justify-content:center;pointer-events:none;opacity:0;transition:opacity .25s ease}
.s2{font-family:'Bodoni Moda',Didot,Georgia,serif;font-size:20px;letter-spacing:-.01em;color:var(--ink);white-space:nowrap;transition:color .15s ease}
.s3{color:var(--body);border-bottom:2px solid transparent;padding-bottom:4px;transition:color .15s ease,border-color .15s ease}
.s4{color:var(--red);font-weight:700;border-bottom:2px solid transparent;padding-bottom:4px;transition:color .15s ease,border-color .15s ease}
.s5{display:flex;align-items:center;gap:clamp(14px,1.9cqw,26px);font:400 11.5px/1 Chivo,system-ui,sans-serif;letter-spacing:.09em;text-transform:uppercase;white-space:nowrap;text-wrap:pretty}
.s6{display:none;color:var(--red);font:700 10px/1 Chivo,system-ui,sans-serif;letter-spacing:.14em;text-transform:uppercase;white-space:nowrap;border-bottom:2px solid var(--rule-red);padding-bottom:4px}
.s7{position:sticky;top:0;z-index:40;background:var(--paper);border-bottom:2px solid var(--ink);display:flex;align-items:center;justify-content:space-between;gap:12px;height:56px;text-wrap:pretty}
.s8{font-style:italic}
.s9{font-size:clamp(41px,8.8cqw,109px);line-height:.95;margin-top:clamp(18px,2.4cqw,32px);max-width:15ch;text-wrap:balance}
.s10{font-size:clamp(17px,1.85cqw,25px);color:var(--body);max-width:30ch;margin:clamp(22px,2.8cqw,40px) 0 0}
.s11{color:var(--body)}
.s12{display:flex;flex-wrap:wrap;align-items:baseline;gap:clamp(22px,3.4cqw,48px);margin-top:clamp(30px,3.8cqw,54px)}
.s13{padding-top:clamp(40px,5.4cqw,84px);padding-bottom:clamp(56px,7cqw,110px)}
.s14{position:absolute;inset:0;background:url('/media/web-quay-ed6c9178.jpg') center 50%/cover no-repeat}
.s15{position:absolute;inset:0;background:linear-gradient(to top,rgba(12,12,11,.9) 0%,rgba(12,12,11,.6) 26%,rgba(12,12,11,.2) 58%,rgba(12,12,11,0) 100%)}
.s16{font-size:clamp(30px,5.4cqw,68px);color:var(--cream);text-shadow:0 2px 24px rgba(12,12,11,.55);line-height:1.02;max-width:22ch}
.s17{position:absolute;left:0;right:0;bottom:0;padding-bottom:clamp(26px,3.4cqw,52px)}
.s18{position:relative;width:100%;height:clamp(360px,62vh,720px);background:var(--dark);overflow:hidden}
.s19{color:var(--gray);border-bottom:1px solid rgba(196,39,30,.45)}
.s20{padding-top:12px}
.s21{font-size:clamp(34px,6cqw,78px);line-height:.94}
.s22{margin-top:clamp(16px,2cqw,24px)}
.s23{font:700 10.5px/1.4 Chivo,system-ui,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:var(--red)}
.s24{color:var(--body);margin-top:7px}
.s25{padding:clamp(13px,1.8cqw,20px) 0}
.s26{margin-top:clamp(20px,2.6cqw,32px)}
.s27{margin-top:clamp(20px,2.6cqw,30px)}
.s28{margin-top:clamp(20px,2.6cqw,34px);align-items:start}
.s29{color:var(--red)}
.s30{font-size:clamp(32px,5.6cqw,72px);line-height:.96}
.s31{margin-top:clamp(16px,2cqw,24px);max-width:44ch}
.s32{font:700 11px/1.4 Chivo,system-ui,sans-serif;letter-spacing:.14em;color:var(--red);flex:none}
.s33{font:700 15px/1.3 Chivo,system-ui,sans-serif}
.s34{margin-top:5px}
.s35{display:flex;gap:clamp(14px,2cqw,22px);padding:clamp(14px,1.8cqw,20px) 0;align-items:baseline}
.s36{margin-top:clamp(24px,3cqw,38px)}
.s37{background-image:url('/media/par-hero-poster.e8e94b32.jpg')}
.s38{margin-top:clamp(18px,2.4cqw,30px);align-items:start}
.s39{border-top:2px solid var(--ink)}
.s40{max-width:34ch}
.s41{font:700 10.5px/1.4 Chivo,system-ui,sans-serif;letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}
.s42{display:grid;grid-template-columns:1fr 1fr;gap:clamp(20px,3cqw,48px);padding:12px 0;border-bottom:1px solid rgba(12,12,11,.2)}
.s43{font:700 10.5px/1.4 Chivo,system-ui,sans-serif;letter-spacing:.16em;text-transform:uppercase;color:var(--red-pressed)}
.s44{font:700 11px/1.4 Chivo,system-ui,sans-serif;letter-spacing:.1em;text-transform:uppercase;color:var(--ink)}
.s45{display:flex;align-items:baseline;gap:10px}
.s46{width:16px;height:16px;flex:none}
.s47{width:2px;height:5px;background:var(--red);border-radius:2px;transition:height .15s linear,background .25s ease}
.s48{width:2px;height:9px;background:var(--red);border-radius:2px;transition:height .15s linear,background .25s ease}
.s49{width:2px;height:13px;background:var(--red);border-radius:2px;transition:height .15s linear,background .25s ease}
.s50{width:2px;height:7px;background:var(--red);border-radius:2px;transition:height .15s linear,background .25s ease}
.s51{width:2px;height:11px;background:var(--red);border-radius:2px;transition:height .15s linear,background .25s ease}
.s52{width:2px;height:15px;background:var(--red);border-radius:2px;transition:height .15s linear,background .25s ease}
.s53{width:2px;height:8px;background:var(--red);border-radius:2px;transition:height .15s linear,background .25s ease}
.s54{width:2px;height:4px;background:var(--red);border-radius:2px;transition:height .15s linear,background .25s ease}
.s55{width:2px;height:10px;background:var(--red);border-radius:2px;transition:height .15s linear,background .25s ease}
.s56{width:2px;height:14px;background:var(--red);border-radius:2px;transition:height .15s linear,background .25s ease}
.s57{width:2px;height:6px;background:var(--red);border-radius:2px;transition:height .15s linear,background .25s ease}
.s58{width:2px;height:12px;background:var(--red);border-radius:2px;transition:height .15s linear,background .25s ease}
.s59{display:flex;align-items:flex-end;gap:2px;height:15px}
.s60{font:500 11px/1 Chivo,system-ui,sans-serif;color:var(--gray);flex:none;font-variant-numeric:tabular-nums}
.s61{display:inline-flex;align-items:center;gap:10px;background:var(--white);border:1px solid rgba(12,12,11,.14);border-radius:100px;padding:10px 14px;box-shadow:0 10px 22px -14px rgba(12,12,11,.4)}
.s62{margin-top:10px;font:400 14px/1.55 Chivo,system-ui,sans-serif;color:var(--dark)}
.s63{margin-top:12px;max-width:36ch}
.s64{opacity:1;transform:translateY(0px);transition:opacity .5s ease,transform .5s cubic-bezier(.2,.8,.2,1)}
.s65{font-family:'Bodoni Moda', Didot, serif;font-size:clamp(26px,3cqw,40px);line-height:1;display:inline-block}
.s66{font:700 10.5px/1.5 Chivo, system-ui, sans-serif;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-top:8px}
.s67{display:inline-block;width:fit-content;max-width:100%;background:var(--cream);color:var(--ink);border:1px solid rgba(12,12,11,.14);padding:18px}
.s68{color:var(--muted);max-width:42ch}
.s69{display:grid;grid-template-columns:1fr;gap:12px;justify-items:start;opacity:1;transform:translateY(0px);transition:opacity .5s ease,transform .5s cubic-bezier(.2,.8,.2,1)}
.s70{display:grid;grid-template-columns:1fr 1fr;gap:clamp(20px,3cqw,48px);padding:clamp(22px,2.8cqw,36px) 0;border-bottom:1px solid rgba(12,12,11,.2);align-items:start}
.s71{color:var(--muted)}
.s72{display:flex;flex-wrap:wrap;align-items:center;gap:10px 18px;font:700 11px/1.5 Chivo, system-ui, sans-serif;letter-spacing:.12em;text-transform:uppercase}
.s73{display:inline-block;width:fit-content;max-width:100%;background:var(--cream);color:var(--ink);border:1px solid rgba(12,12,11,.14);padding:16px 18px}
.s74{font-family:'Bodoni Moda', Didot, serif;font-size:clamp(17px,1.9cqw,24px);line-height:1.3}
.s75{margin-top:clamp(34px,4.4cqw,64px);border-top:2px solid var(--ink)}
.s76{max-width:26ch;margin:0}
.s77{margin-top:clamp(30px,4cqw,54px);align-items:start}
.s78{padding-top:0}
.s79{background:var(--paper);color:var(--ink)}
.s80{font-size:clamp(30px,5.2cqw,66px);margin-top:clamp(16px,2cqw,26px);line-height:.98;max-width:24ch}
.s81{margin-top:clamp(14px,1.8cqw,22px);max-width:48ch}
.s82{font:700 11px/1.4 Chivo,system-ui,sans-serif;letter-spacing:.14em;text-transform:uppercase}
.s83{margin-top:7px;min-height:4.9em}
.s84{border-top:2px solid var(--ink);margin-top:auto;padding-top:14px}
.s85{display:flex;flex-direction:column;gap:34px;height:100%}
.s86{margin-top:clamp(30px,4cqw,52px);align-items:stretch}
.s87{background:var(--paper);color:var(--ink);border-top:2px solid var(--ink)}
.s88{font-size:clamp(30px,5.2cqw,66px);margin-top:clamp(16px,2cqw,26px);line-height:.98;max-width:22ch}
.s89{font:700 11px/1.4 Chivo,system-ui,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:var(--red)}
.s90{margin-top:10px;color:var(--dark)}
.s91{border-top:2px solid var(--ink);padding-top:clamp(14px,1.8cqw,20px)}
.s92{margin-top:clamp(30px,4cqw,52px)}
.s93{font:700 11px/1 Chivo,system-ui,sans-serif;letter-spacing:.26em;text-transform:uppercase;color:var(--coral)}
.s94{font-size:clamp(32px,5.6cqw,72px);line-height:.96;color:var(--cream)}
.s95{color:rgba(244,241,232,.72);margin-top:clamp(16px,2cqw,24px);max-width:44ch}
.s96{color:var(--cream);margin-top:clamp(18px,2.2cqw,28px);max-width:26ch}
.s97{font:700 10.5px/1 Chivo,system-ui,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--paper);border-top:2px solid var(--rule-red);padding-top:7px}
.s98{display:flex;flex-wrap:wrap;gap:10px clamp(16px,2cqw,24px);margin-top:clamp(22px,2.8cqw,34px)}
.s99{margin-top:clamp(18px,2.4cqw,30px);align-items:center}
.s100{background:var(--ink);color:var(--paper)}
.s101{font-size:clamp(30px,5.2cqw,66px);margin-top:clamp(16px,2cqw,26px);line-height:.98;max-width:20ch}
.s102{font:400 clamp(15px,1.35cqw,17px)/1.62 Chivo,system-ui,sans-serif;color:var(--body);margin:0 0 clamp(14px,1.6cqw,18px)}
.s103{font:400 clamp(15px,1.35cqw,17px)/1.62 Chivo,system-ui,sans-serif;color:var(--body);margin:0}
.s104{max-width:56ch;margin-top:clamp(24px,3cqw,36px)}
.s105{font:700 11px/1 Chivo,system-ui,sans-serif;letter-spacing:.26em;text-transform:uppercase;color:var(--red)}
.s106{font-size:clamp(42px,8cqw,104px);line-height:1.02;color:var(--ink);margin-top:clamp(18px,2.4cqw,32px)}
.s107{font:400 15px/1 Chivo,system-ui,sans-serif;letter-spacing:.04em;color:var(--muted);margin-top:clamp(18px,2.2cqw,26px)}
.s108{margin-top:clamp(24px,3cqw,44px);color:var(--ink);max-width:26ch;margin-bottom:0}
.s109{color:var(--coral)}
.s110{font-size:clamp(32px,5.6cqw,72px);margin-top:clamp(16px,2cqw,26px);line-height:.96}
.s111{margin-top:clamp(16px,2cqw,24px);max-width:42ch;color:rgba(244,241,232,.86)}
.s112{display:none}
.s113{font-size:clamp(20px,2.2cqw,28px)}
.s114{font:700 10.5px/1 Chivo,system-ui,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:rgba(244,241,232,.9)}
.s115{font:400 10.5px/1 Chivo,system-ui,sans-serif;letter-spacing:.06em;text-transform:uppercase;color:rgba(244,241,232,.58)}
.s116{display:flex;align-items:baseline;justify-content:space-between;gap:10px}
.s117{width:100%;background:var(--cream);border:1px solid rgba(12,12,11,.34);border-bottom-width:1px;color:var(--ink);padding:13px 12px;font:400 15px/1.3 Chivo,system-ui,sans-serif;margin-top:9px;outline:none;transition:border-color .25s ease}
.s118{font:400 12.5px/1.4 Chivo,system-ui,sans-serif;color:var(--coral);margin-top:7px}
.s119{width:100%;padding:16px 18px;opacity:1;cursor:pointer}
.s120{color:rgba(244,241,232,.62);margin-top:-4px}
.s121{color:var(--gray);border-bottom:1px solid rgba(110,107,100,.4);padding-bottom:2px;transition:color .15s ease,border-color .15s ease}
.s122{color:rgba(244,241,232,.62)}
.s123{border:1px solid rgba(244,241,232,.22);border-top:3px solid var(--rule-red);padding:clamp(22px,3cqw,34px);display:flex;flex-direction:column;gap:18px}
.s124{align-items:start}
.s125{font-family:'Bodoni Moda',Didot,serif;font-size:clamp(22px,2.4cqw,30px);line-height:1}
.s126{margin:10px 0 0;font:400 11.5px/1.7 Chivo,system-ui,sans-serif;letter-spacing:.04em;color:rgba(244,241,232,.78)}
.s127{color:var(--paper);border-bottom:2px solid transparent;padding-bottom:3px;transition:color .15s ease,border-color .15s ease}
.s128{color:rgba(244,241,232,.7);border-bottom:2px solid transparent;padding-bottom:4px;transition:color .15s ease,border-color .15s ease}
.s129{color:rgba(244,241,232,.6);font-weight:400}
.s130{display:flex;flex-wrap:wrap;gap:14px clamp(18px,2.4cqw,28px);font:700 10.5px/1 Chivo,system-ui,sans-serif;letter-spacing:.14em;text-transform:uppercase}
.s131{background:var(--ink);color:var(--paper);padding-top:clamp(34px,4cqw,60px);padding-bottom:clamp(34px,4cqw,60px);display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:clamp(18px,2.6cqw,34px);text-wrap:pretty}
.s132{max-width:none}

.h0:hover,.h0:focus-visible{color:var(--red)}
.h1:hover,.h1:focus-visible{color:var(--ink);border-bottom-color:var(--rule-red)}
.h2:hover,.h2:focus-visible{color:var(--red-pressed);border-bottom-color:var(--rule-red)}
.h3:hover,.h3:focus-visible{color:var(--paper);border-bottom-color:var(--paper)}
.h4:hover,.h4:focus-visible{color:var(--coral);border-bottom-color:var(--rule-red)}
.h5:hover,.h5:focus-visible{color:var(--paper);border-bottom-color:var(--rule-red)}
