PageSourceSearch

https://www.piren-bar.se/julbord

html piren-bar.se collected 2026-09-26 06:55:50 UTC 57,999 bytes, 1,110 lines download raw bytes

1<!DOCTYPE html>
2<html lang="sv">
3<head>
4<meta charset="utf-8">
5<meta name="viewport" content="width=device-width, initial-scale=1">
6
7<title>Piren Restaurang &amp; Bar ◆ Julbord</title>
8<meta name="description" content="Pirens julbord 2026 i Hornsbergs Strand. Julbord tisdag–lördag från 895 kr, julbrunch 495 kr. Sittningar, priser och dryckespaket. Boka senast 15 oktober och få 12% rabatt.">
9<link rel="canonical" href="https://www.piren-bar.se/julbord">
10
11<link rel="alternate" hreflang="sv" href="https://www.piren-bar.se/julbord">
12<link rel="alternate" hreflang="en" href="https://www.piren-bar.se/en/julbord">
13<link rel="alternate" hreflang="x-default" href="https://www.piren-bar.se/julbord">
14
15<meta property="og:type" content="website">
16<meta property="og:site_name" content="Piren Restaurang &amp; Bar">
17<meta property="og:locale" content="sv_SE">
18<meta property="og:locale:alternate" content="en_GB">
19<meta property="og:url" content="https://www.piren-bar.se/julbord">
20<meta property="og:title" content="Piren Restaurang &amp; Bar ◆ Julbord">
21<meta property="og:description" content="Julbord vid vattnet i Hornsbergs Strand, från 25 november. Från 895 kr.">
22<meta property="og:image" content="https://www.piren-bar.se/assets/photos/og-piren.gif">
23<meta name="twitter:card" content="summary_large_image">
24
25<meta name="theme-color" content="#ffeee5">
26<link rel="icon" href="/assets/logo/favicon.7166a224fbe14434.png" sizes="32x32">
27<link rel="apple-touch-icon" href="/assets/logo/webclip.8b9e081f85c17f8b.png">
28<link rel="manifest" href="/site.webmanifest">
29
30<link rel="preconnect" href="https://fonts.googleapis.com">
31<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
32
33<!-- Component CSS before layout.css: layout.css's breakpoint tiers override
34     the component roots and only win if they are read last. julbord.css is
35     page-scoped: only the two julbord pages retune benefit-columns and draw
36     the buffet map. -->
37<link rel="stylesheet" href="/assets/css/tokens.ce52c951c4ec413a.css">
38<link rel="stylesheet" href="/assets/css/base.f2b051f4aa292ab3.css">
39<link rel="stylesheet" href="/assets/css/components.4ef85aa77f95f531.css">
40<link rel="stylesheet" href="/assets/css/sections.d856f6d5836ec8eb.css">
41<link rel="stylesheet" href="/assets/css/julbord.520dd21c6349df6e.css">
42<link rel="stylesheet" href="/assets/css/layout.14ed86506a141cbd.css">
43
44<script type="application/ld+json">
45{
46  "@context": "https://schema.org",
47  "@type": "WebPage",
48  "name": "Julbord",
49  "url": "https://www.piren-bar.se/julbord",
50  "inLanguage": "sv-SE",
51  "isPartOf": { "@type": "WebSite", "@id": "https://www.piren-bar.se/#website" },
52  "about": { "@id": "https://www.piren-bar.se/#restaurant" }
53}
54</script>
54
55</head>
56
57<body>
58<a class="skip-link" href="#main">Hoppa till innehållet</a>
59
60<div class="page-shell" data-wl-component="page-shell">
61
62  <header class="site-header" data-wl-component="site-header" data-nav-active="julbord" data-wl-c="site-header" data-wl-i="0">
63
64  <!-- Announcement band ---------------------------------------------------
65       One <a> per current or upcoming event. display:contents on the set, so
66       the repeat container adds a node to the DOM and nothing to the layout,
67       and layout.css shows only the first, which is the soonest event, since
68       the rows arrive sorted by start date. That is what a visitor without
69       JavaScript gets, and it is correct, just never shuffled.
70
71       The filter keeps an event until its END date; an event with no end date
72       is kept until its start date passes. `now` here is DEPLOY time, which
73       is why site-header.js checks the dates again in the browser; otherwise
74       a finished event would sit in the band until something else triggered a
75       publish. A filter the renderer cannot parse falls back to rendering
76       every entry, and the script's own date check catches that too.
77
78       NO aria-label ON THE LINK. An aria-label REPLACES the accessible name,
79       so a label here would announce itself instead of the event, the one
80       thing the band exists to say. The visible text is the name.
81
82       aria-live is deliberately absent too: the script chooses one band
83       before first paint, so nothing changes after load, and a live region
84       would make the marquee read itself out. -->
85  <div class="site-header__announce-set"><a class="site-header__announce" href="/evenemang/julbord-2026" data-announce>
86
87      <span class="site-header__announce-viewport">
88        <span class="site-header__announce-track" data-announce-track>
89          <span class="site-header__announce-inner" data-announce-group>
90            <span class="site-header__diamond" aria-hidden="true"></span>
91            <span class="site-header__announce-title">Julbord</span>
92            <span class="site-header__announce-note">Från 25 november</span>
93            <span class="site-header__announce-cta">
94              Läs mer
95              <span class="site-header__chevron" aria-hidden="true"></span>
96            </span>
97          </span>
98        </span>
99      </span>
100
101      
102      <span hidden data-announce-start>2026-11-25</span>
103      <span hidden data-announce-end>2026-12-21</span>
104      <span hidden data-announce-link>/julbord</span>
105    </a></div>
106
107  <!-- Main bar ----------------------------------------------------------- -->
108  <div class="site-header__bar">
109
110    <!-- The wordmark. The static SVG is what paints, what carries the alt
111         text, and what stays if the animation never arrives; the animated
112         version renders into the empty span on top of it, in the same box. -->
113    <a class="site-header__logo" href="/">
114      <img class="site-header__logo-mark" src="/assets/logo/wordmark-slate.6d64dedadc2aa49e.svg"
115           width="432" height="184" alt="Piren Restaurang &amp; Bar, till startsidan">
116      <span class="site-header__logo-anim" data-lottie-mount aria-hidden="true"></span>
117    </a>
118    <!-- Carries the animated wordmark's published URL. The file lives in the
119         CMS asset library, and this is how its address reaches the page
120         without hand-writing a /cms-assets/ path; the filename half of that
121         path changes whenever the asset is renamed or converted. -->
122    <span data-lottie-src hidden src="/cms-assets/7c5497f5-ada7-405f-a1e3-66eed7c0cd8f/9237eeeaf87656db.lottie"></span>
123
124    <nav class="site-header__nav" aria-label="Huvudmeny">
125      <ul class="nav-list">
126        <li class="nav-item" data-nav-id="menyer">
127          <a class="nav-item__link" href="/menyer">Menyer</a>
128        </li>
129        <li class="nav-item" data-nav-id="julbord">
130          <a class="nav-item__link" href="/julbord">Julbord</a>
131        </li>
132        <!-- Abonnera is a plain link while its card panel is parked; see the
133             interface above for what was removed and how to bring it back. -->
134        <li class="nav-item" data-nav-id="abonnera">
135          <a class="nav-item__link" href="/abonnera">Abonnera</a>
136        </li>
137        <li class="nav-item" data-nav-id="evenemang">
138          <a class="nav-item__link" href="/evenemang">Evenemang</a>
139        </li>
140        <li class="nav-item" data-nav-id="hitta">
141          <a class="nav-item__link" href="/hitta-hit">Hitta hit</a>
142        </li>
143      </ul>
144    </nav>
145
146    <div class="site-header__actions">
147      <a class="btn waiteraid-widget" data-hash="b054b5cb6241c65f4d01012bac48ddab"
148         href="https://app.bokabord.se/reservation/?app_type=bokabord&amp;hash=b054b5cb6241c65f4d01012bac48ddab" target="_blank" rel="noopener">Boka bord</a>
149      <!-- SV / EN. The two options are written out per branch rather than marked with
150     a modifier class, because only ONE of them may carry aria-current. A
151     shared class cannot express that, and a screen reader needs to hear which
152     language it is already reading. -->
153<div class="lang-switch lang-switch--bar" role="group" aria-label="Språk / Language"
154     data-wl-component="lang-switch">
155  
156      
157          <a class="lang-switch__option is-current" href="/julbord" lang="sv" aria-current="true">SV</a>
158          <span class="lang-switch__divider" aria-hidden="true"></span>
159          <a class="lang-switch__option" href="/en/julbord" lang="en">EN</a>
160        
161    
162</div>
163    </div>
164
165    <!-- The phone's language switch. It sits in the bar beside the burger
166         rather than at the foot of the drawer, because changing language is
167         not a navigation choice and should not be behind a menu. Shown by the
168         same --burger flag that shows the burger, so the two can never both
169         appear or both vanish. -->
170    <div class="site-header__bar-lang">
171      <!-- SV / EN. The two options are written out per branch rather than marked with
172     a modifier class, because only ONE of them may carry aria-current. A
173     shared class cannot express that, and a screen reader needs to hear which
174     language it is already reading. -->
175<div class="lang-switch lang-switch--bar" role="group" aria-label="Språk / Language"
176     data-wl-component="lang-switch">
177  
178      
179          <a class="lang-switch__option is-current" href="/julbord" lang="sv" aria-current="true">SV</a>
180          <span class="lang-switch__divider" aria-hidden="true"></span>
181          <a class="lang-switch__option" href="/en/julbord" lang="en">EN</a>
182        
183    
184</div>
185    </div>
186
187    <!-- The three waves are Piren's own mark. Inlined rather than loaded as an
188         image file so the strokes can take currentColor and cross-fade to the
189         close cross, which a linked file could not do. -->
190    <button class="site-header__burger" type="button"
191            aria-expanded="false" aria-controls="site-menu">
192      <svg class="site-header__burger-icon" viewBox="0 0 100 100" aria-hidden="true" focusable="false">
193        <g transform="matrix(1.33589,0,0,1.33589,-14.76,-2.3257)"
194           fill="none" stroke="currentColor" stroke-width="7"
195           stroke-linecap="round" stroke-linejoin="round">
196          <path transform="translate(48.373,19.97)"  d="M-30.872,-2.47 C-20.582,-2.47 -20.582,2.47 -10.292,2.47 C-0.001,2.47 -0.001,-2.47 10.289,-2.47 C20.58,-2.47 20.58,2.47 30.872,2.47"></path>
197          <path transform="translate(48.373,39.119)" d="M-30.872,-2.47 C-20.582,-2.47 -20.582,2.47 -10.292,2.47 C-0.001,2.47 -0.001,-2.47 10.289,-2.47 C20.58,-2.47 20.58,2.47 30.872,2.47"></path>
198          <path transform="translate(48.373,58.268)" d="M-30.872,-2.47 C-20.582,-2.47 -20.582,2.47 -10.292,2.47 C-0.001,2.47 -0.001,-2.47 10.289,-2.47 C20.58,-2.47 20.58,2.47 30.872,2.47"></path>
199        </g>
200      </svg>
201      <span class="visually-hidden">Meny</span>
202    </button>
203  </div>
204
205  <!-- Mobile drawer -------------------------------------------------------
206       Absolutely positioned against the header, so opening it lays the menu
207       OVER the page instead of pushing every section down the screen.
208
209       It carries its own booking CTA: the bar's version sits in
210       .site-header__actions, which is display:none the moment the burger
211       appears, so without this a phone reader would have no way to book. -->
212  <div class="site-header__drawer" id="site-menu" data-open="false">
213    <div class="site-header__drawer-inner">
214      <nav aria-label="Meny">
215        <ul class="drawer-list">
216          <li class="drawer-item" data-nav-id="menyer">
217            <a class="drawer-item__link" href="/menyer">Menyer</a>
218          </li>
219          <li class="drawer-item" data-nav-id="julbord">
220            <a class="drawer-item__link" href="/julbord">Julbord</a>
221          </li>
222          <li class="drawer-item" data-nav-id="abonnera">
223            <a class="drawer-item__link" href="/abonnera">Abonnera</a>
224          </li>
225          <li class="drawer-item" data-nav-id="evenemang">
226            <a class="drawer-item__link" href="/evenemang">Evenemang</a>
227          </li>
228          <li class="drawer-item" data-nav-id="hitta">
229            <a class="drawer-item__link" href="/hitta-hit">Hitta hit</a>
230          </li>
231        </ul>
232      </nav>
233
234      <a class="btn btn--block waiteraid-widget" data-hash="b054b5cb6241c65f4d01012bac48ddab"
235         href="https://app.bokabord.se/reservation/?app_type=bokabord&amp;hash=b054b5cb6241c65f4d01012bac48ddab" target="_blank" rel="noopener">Boka bord</a>
236    </div>
237  </div>
238
239  <!-- THE BOOKING SYSTEM. Loaded from here rather than from each page's head
240       because this component is the one thing every page has exactly once,
241       the same reason the consent notice is rendered from site-footer.
242
243       WaiterAid's script binds a single click listener on `document` at
244       DOMContentLoaded and, from then on, any .waiteraid-widget element opens
245       the booking. `defer` keeps it off the parser's critical path while
246       still running BEFORE DOMContentLoaded, which is the event it binds on;
247       `async` would race that and silently leave the buttons inert.
248
249       IT ALSO READS AND FORWARDS utm_source / utm_medium / utm_campaign /
250       utm_term / utm_content / gclid into the booking, and accepts
251       data-ga-cid and data-ga-sid so a booking can be tied back to the visit
252       that produced it. That is why the booking funnel is measurable at all;
253       see gtm/GTM-PLAN.md.
254
255       NOTE FOR THE COOKIE POLICY: on load it also fetches
256       api.bokabord.se/restaurants/<hash>/promotions and writes a timestamp to
257       localStorage, before the visitor has clicked anything. -->
258  
258<script src="https://app.bokabord.se/widget-popup/widget.min.js" defer></script>
258
259</header>
260
261  <main id="main">
262
263    <!-- 1. Hero: the page's one h1, on the brick ground that carries the
264            season across from the home page.
265
266            KEPT SHORT ON PURPOSE. The lead is two sentences, the facts are
267            three lines, and the offer is a title, one condition and a line of
268            fine print. The previous version carried a four-line lead and a
269            five-line offer paragraph, and the client's note was that the hero
270            had "sooo much text". Every binding term is still here; it is
271            ranked rather than run together.
272
273            THE DAYS ARE THE BOLD PART of each fact, which is why the lines
274            arrive in three pieces. "Julbord" is gone from the first one: the
275            page is called Julbord, the h1 says Julbord, and a third mention
276            two lines later only delayed the fact a guest is looking for.
277
278            BOTH SITTINGS ARE NAMED IN FULL in fact-1. "975 kr andra" left the
279            noun to be carried over from four words earlier, and the client
280            read it as a dangling number rather than as a second price.
281
282            THE EARLY BIRD TERMS ARE THE ONES THAT BIND. The quota is 20
283            discounted seats per sitting and the WHOLE party has to fit inside
284            what is left of it, or everyone pays full price. That condition is
285            the offer text; the deadline is in the title; which sittings it
286            covers is the fine print.
287
288            THE DEADLINE WAS 30 SEPTEMBER and was extended to 15 OCTOBER on
289            11 Sept 2026 (client's instruction). The meta description above
290            carries the same date; change both together.
291
292            "12 %" in the offer title carries a LITERAL non-breaking space
293            (U+00A0), so a phone never breaks the line between the number and
294            the sign. Not the &nbsp; entity: the renderer re-escapes entities
295            inside params, and the entity came out as visible text. When
296            editing this file through a tool, write it via update_files with
297            the JSON escape  ; update_page_source turned it into a plain
298            space. -->
299    <!-- The Julbord page's opening statement: the page's one h1, the facts a guest
300     needs before anything else, the early-bird offer, and the two ways in:
301     book a table, or ask about a party.
302
303     THERE IS NO EYEBROW. There used to be one above the h1; this site does not
304     use them anywhere, and the param went with it once both julbord pages had
305     stopped passing it.
306
307     Brick ground with the foam texture, the same treatment as the seasonal
308     band on the home page, so arriving here reads as continuous with it.
309
310     THE OFFER TITLE IS A <p>, NOT A HEADING. It is a callout inside the hero,
311     not a section of the page; as an h2 it sat in the outline between the h1
312     and the menu as if it were a chapter. Its size comes from the class.
313
314     THE THREE PARTS OF A FACT LINE CARRY NO WHITESPACE BETWEEN THEM in the
315     markup, and the space that separates them on screen is drawn by the CSS
316     instead. A newline here would survive as a text node when a part is
317     empty, and the line would start with a stray space.
318
319     The second CTA points at #abonnering on the same page. assets/js/site.js
320     turns any same-page anchor into a smooth scroll, so it travels rather
321     than jumping, and moves the keyboard focus with it, which a bare hash
322     change does not. -->
323<section class="section section--clip julbord-hero" id="julbord"
324         data-wl-component="julbord-hero" aria-labelledby="julbord-heading">
325
326  
327      <img class="decor-glyph decor-glyph--utensils" src="/assets/piren/utensils.a33bfb769696fa66.svg"
328           loading="lazy" decoding="async" alt="">
329    
330
331  <div class="container">
332    <div class="julbord-hero__row">
333
334      <div class="julbord-hero__copy" data-reveal>
335        <h1 class="julbord-hero__heading" id="julbord-heading">Julbord vid vattnet</h1>
336        <p class="julbord-hero__lead">Från 25 november dukar vi upp Pirens första julbord. Allt man kan önska från en klassisk vinterbuffé i en varm julmiljö med magisk utsikt över viken.</p>
337
338        <ul class="julbord-hero__facts">
339          <li class="julbord-hero__fact"><span class="julbord-hero__fact-lead"></span><strong class="julbord-hero__fact-days">Tisdag–lördag</strong><span class="julbord-hero__fact-rest">· 895 kr första sittningen, 975 kr andra sittningen</span></li>
340          <li class="julbord-hero__fact"><span class="julbord-hero__fact-lead">Julbrunch</span><strong class="julbord-hero__fact-days">lördag och söndag</strong><span class="julbord-hero__fact-rest">· 495 kr</span></li>
341          <li class="julbord-hero__fact"><span class="julbord-hero__fact-lead"></span><strong class="julbord-hero__fact-days"></strong><span class="julbord-hero__fact-rest">
341Glögg vid ankomst ingår</span></li>
342        </ul>
343
344        
345            <div class="julbord-hero__offer">
346              <p class="julbord-hero__offer-title">Boka senast 15 oktober och få 12 % rabatt</p>
347              <p class="julbord-hero__offer-text">Max 20 rabatterade platser per sittning, och hela sällskapet måste rymmas inom dem.</p>
348              <p class="julbord-hero__offer-fine">Gäller båda sittningarna tisdag–fredag samt lördagens kvällssittning. Inte julbrunch eller abonnering. Dryck till ordinarie pris.</p>
349            </div>
350          
351
352        <div class="julbord-hero__actions">
353          <a class="btn" href="https://app.bokabord.se/reservation/?app_type=bokabord&amp;hash=b054b5cb6241c65f4d01012bac48ddab">Boka julbord</a>
354          <a class="btn btn--outline" href="#abonnering">Företag &amp; större sällskap</a>
355        </div>
356      </div>
357
358      <div class="media-frame media-frame--square julbord-hero__media">
359        <picture><source type="image/avif" srcset="/cms-assets/227f8eb5-96c1-4fa8-bcfc-6d175972c35f/698de9bfbccd1546-320.avif 320w, /cms-assets/227f8eb5-96c1-4fa8-bcfc-6d175972c35f/698de9bfbccd1546-640.avif 640w, /cms-assets/227f8eb5-96c1-4fa8-bcfc-6d175972c35f/698de9bfbccd1546-960.avif 960w" sizes="100vw"><source type="image/webp" srcset="/cms-assets/227f8eb5-96c1-4fa8-bcfc-6d175972c35f/698de9bfbccd1546-320.webp 320w, /cms-assets/227f8eb5-96c1-4fa8-bcfc-6d175972c35f/698de9bfbccd1546-640.webp 640w, /cms-assets/227f8eb5-96c1-4fa8-bcfc-6d175972c35f/698de9bfbccd1546-960.webp 960w" sizes="100vw"><img class="media-frame__img" width="1080" height="1080" loading="eager" decoding="async" src="/cms-assets/227f8eb5-96c1-4fa8-bcfc-6d175972c35f/698de9bfbccd1546.jpg" alt="Dukat julbord på Piren" fetchpriority="high" sizes="100vw"></picture>
360      </div>
361
362    </div>
363  </div>
364</section>
365
366    <!-- 2. Menyn: five categories, each a list of what is actually on the
367            table rather than a sentence about it. Each category sets left
368            under its own name, so every diamond down the page stands on one
369            line; julbord.css centres the ROW instead, which is what keeps a
370            short last row of two from stranding against the left edge.
371
372            The "Lax, fisk & skaldjur" heading keeps the word on purpose: it is
373            the kitchen's own category name, and here it is followed
374            immediately by the five things it means, so it describes rather
375            than promises. -->
376    <!-- A row of short, titled columns. The copy is page-specific rather than
377     editorial, so it arrives as a JSON array param instead of a collection.
378
379     The row wraps on its own — .benefit has a min-inline-size floor — so three
380     items sit in a row, five wrap to a second line, and none of it needs a
381     breakpoint.
382
383     Spacing and layout are classes rather than branches around the body: a
384     wl-choose around the whole thing would mean two copies of this markup to
385     keep in step, which is exactly the trap the two event-list templates
386     already are.
387
388     THE THREE PARTS OF A ROW CARRY NO WHITESPACE BETWEEN THEM in the markup.
389     Each part collapses with :empty when its field is an empty string, and a
390     newline inside the span would leave a text node behind that :empty no
391     longer matches — an unused part would then take a line of its own with
392     nothing on it. -->
393<section class="section benefit-columns benefit-columns--none benefit-columns--stacked"
394         id="menyn" data-wl-component="benefit-columns" aria-label="Menyn">
395
396  
397
398  <div class="container container--band">
399    <div class="benefit-columns__inner">
400
401      
402          <div class="benefit-columns__intro">
403            <h2 class="benefit-columns__heading">En måltid att gå flera varv för</h2>
404            <p class="benefit-columns__lead">Vi berikar vårt julbord med klassiska favoriter och smaker med Pirens egen twist. Här är några av sakerna du kan se fram emot.</p>
405          </div>
406        
407
408      <ul class="benefit-columns__row">
409        
410
411        
412          <li class="benefit benefit--bullets" data-reveal>
413            <h3 class="benefit__title">Sill &amp; tillbehör</h3>
414            <ul class="benefit__bullets">
415              
416                <li>Klassiker</li>
417              
418                <li>
418Löjromssill</li>
419              
420                <li>Citron &amp; fänkål</li>
421              
422                <li>Äpple &amp; konjak</li>
423              
424            </ul>
425          </li>
426        
427          <li class="benefit benefit--bullets" data-reveal>
428            <h3 class="benefit__title">Lax, fisk &amp; skaldjur</h3>
429            <ul class="benefit__bullets">
430              
431                <li>Kall- och varmrökt lax</li>
432              
433                <li>Sotad tonfisk</li>
434              
435                <li>Rökta räkor</li>
436              
437                <li>Marinerade blåmusslor</li>
438              
439                <li>Kräftstjärtsröra</li>
440              
441            </ul>
442          </li>
443        
444          <li class="benefit benefit--bullets" data-reveal>
445            <h3 class="benefit__title">Chark &amp; kallskuret</h3>
446            <ul class="benefit__bullets">
447              
448                <li>Julskinka</li>
449              
450                <li>Lammfiol</li>
451              
452                <li>Chark</li>
453              
454                <li>Patéer</li>
455              
456                <li>Rökt renhjärta</li>
457              
458            </ul>
459          </li>
460        
461          <li class="benefit benefit--bullets" data-reveal>
462            <h3 class="benefit__title">Småvarmt</h3>
463            <ul class="benefit__bullets">
464              
465                <li>Köttbullar</li>
466              
467                <li>Prinskorv</li>
468              
469                <li>Revben</li>
470              
471                <li>Janssons frestelse</li>
472              
473                <li>Västerbottenpaj</li>
474              
475                <li>Helstekt hjort</li>
476              
477                <li>Omelett med stuvade kantareller</li>
478              
479            </ul>
480          </li>
481        
482          <li class="benefit benefit--bullets" data-reveal>
483            <h3 class="benefit__title">Desserter &amp; julgodis</h3>
484            <ul class="benefit__bullets">
485              
486                <li>Saffranstiramisu</li>
487              
488                <li>Espressobrownie</li>
489              
490                <li>Kardemumma- &amp; äppelpaj</li>
491              
492                <li>Pannacotta</li>
493              
494                <li>Fudge</li>
495              
496                <li>Brända mandlar</li>
497              
498            </ul>
499          </li>
500        
501
502        
503      </ul>
504
505      <div class="benefit-columns__notes">
506        <p class="benefit-columns__note">Glögg vid ankomst ingår.</p>
507        <p class="benefit-columns__note benefit-columns__note--fine">Utbudet är preliminärt och kan komma att justeras.</p>
508      </div>
509
510      
511
512      
513
514    </div>
515  </div>
516</section>
517
518    <!-- 3. Karta över julbordet: the photograph of the map, from the CMS. -->
519    <!-- WHAT THIS USED TO BE. Until 2 Sept this component drew the julbord as an
520     SVG seen from above — a long table with four numbered stops, a dashed
521     route, candles and spruce — with the same four stops repeated as text
522     underneath, and an eyebrow above the heading. It is now a photograph of
523     the real map, kept in the CMS, so the numbered list would be describing a
524     picture the reader can simply look at.
525
526     The drawing and its palette are in the parent of the commit "buffet-map:
527     show the photographed map from the CMS", here and in
528     assets/css/julbord.css. Restore both halves together or not at all. -->
529<section class="section buffet-map" id="karta"
530         data-wl-component="buffet-map" aria-labelledby="karta-heading">
531  <div class="container">
532    <div class="buffet-map__inner">
533
534      <!-- Inside the inner wrapper, not the section: the rule spans its
535           positioned ancestor, and a full-bleed section would stretch it the
536           width of the viewport instead of the content column. -->
537      
538          <div class="section-rule" aria-hidden="true"><span class="section-rule__mark"></span></div>
539        
540
541      <div class="buffet-map__intro">
542        <h2 class="buffet-map__heading" id="karta-heading">Hitta din väg runt julbordet</h2>
543        <p class="buffet-map__lead">Följ julbordet från sill och fisk vidare till kallskuret och det småvarma.</p>
544      </div>
545
546      <!-- No width/height attributes: the asset's own dimensions are not known
547           here, and a wrong pair would reserve the wrong box and shift the
548           page as it loads. The aspect-ratio in julbord.css holds the space
549           instead. -->
550      <figure class="buffet-map__figure">
551        <picture><source type="image/avif" srcset="/cms-assets/2e1aa007-e6e7-4fcd-a70f-1663d041c0ed/93d55211e2291ec9-320.avif 320w, /cms-assets/2e1aa007-e6e7-4fcd-a70f-1663d041c0ed/93d55211e2291ec9-640.avif 640w, /cms-assets/2e1aa007-e6e7-4fcd-a70f-1663d041c0ed/93d55211e2291ec9-960.avif 960w, /cms-assets/2e1aa007-e6e7-4fcd-a70f-1663d041c0ed/93d55211e2291ec9-1280.avif 1280w, /cms-assets/2e1aa007-e6e7-4fcd-a70f-1663d041c0ed/93d55211e2291ec9-1600.avif 1600w" sizes="100vw"><source type="image/webp" srcset="/cms-assets/2e1aa007-e6e7-4fcd-a70f-1663d041c0ed/93d55211e2291ec9-320.webp 320w, /cms-assets/2e1aa007-e6e7-4fcd-a70f-1663d041c0ed/93d55211e2291ec9-640.webp 640w, /cms-assets/2e1aa007-e6e7-4fcd-a70f-1663d041c0ed/93d55211e2291ec9-960.webp 960w, /cms-assets/2e1aa007-e6e7-4fcd-a70f-1663d041c0ed/93d55211e2291ec9-1280.webp 1280w, /cms-assets/2e1aa007-e6e7-4fcd-a70f-1663d041c0ed/93d55211e2291ec9-1600.webp 1600w" sizes="100vw"><img class="buffet-map__image" loading="lazy" decoding="async" src="/cms-assets/2e1aa007-e6e7-4fcd-a70f-1663d041c0ed/93d55211e2291ec9.webp" alt="Karta över Pirens julbord: långbordet sett uppifrån, med avdelningarna markerade i den ordning man går runt det." sizes="100vw"></picture>
552      </figure>
553
554    </div>
555  </div>
556</section>
557
558    <!-- 4. Sittningar & priser: the client's own diagnosis was that a page
559            saying only "från 895 kr" sends the price question to the inbox
560            instead of answering it. Every sitting and every price is here.
561
562            ONE CARD PER DAY, AND THREE RANKED FACTS INSIDE IT. As one line
563            per sitting ("Sittning 1 · ankomst 16:00–16:30 · 895 kr") the
564            sitting, the time and the price carried the same weight and the
565            eye had to parse the dots to find the price. Now the sitting is a
566            small heading, the time sits under it, and the price has a line of
567            its own; julbord.css draws the outline.
568
569            "Ankomst" is gone from the times: a range under a sitting heading
570            is the arrival window, and the word was on every line of the
571            section. Each sitting has three arrival slots fifteen minutes
572            apart to spread the queue at the glögg, which is why the time is a
573            range rather than one o'clock time.
574
575            MÃ¥ndag has no sittings, so its two lines are notes with no title
576            and no price. Every field is present as an empty string: the
577            deploy validates each binding against the data and refuses a key
578            that is missing outright. -->
579    <!-- A row of short, titled columns. The copy is page-specific rather than
580     editorial, so it arrives as a JSON array param instead of a collection.
581
582     The row wraps on its own — .benefit has a min-inline-size floor — so three
583     items sit in a row, five wrap to a second line, and none of it needs a
584     breakpoint.
585
586     Spacing and layout are classes rather than branches around the body: a
587     wl-choose around the whole thing would mean two copies of this markup to
588     keep in step, which is exactly the trap the two event-list templates
589     already are.
590
591     THE THREE PARTS OF A ROW CARRY NO WHITESPACE BETWEEN THEM in the markup.
592     Each part collapses with :empty when its field is an empty string, and a
593     newline inside the span would leave a text node behind that :empty no
594     longer matches — an unused part would then take a line of its own with
595     nothing on it. -->
596<section class="section benefit-columns benefit-columns--none benefit-columns--stacked"
597         id="priser" data-wl-component="benefit-columns" aria-label="Sittningar och priser">
598
599  
600      <img class="decor-glyph decor-glyph--cocktail" src="/assets/piren/cocktail.b302016d6a12e2cf.svg"
601           loading="lazy" decoding="async" alt="">
602    
603
604  <div class="container container--band">
605    <div class="benefit-columns__inner">
606
607      
608          <div class="benefit-columns__intro">
609            <h2 class="benefit-columns__heading">Sittningar &amp; priser</h2>
610            <p class="benefit-columns__lead">Julbordet serveras i sittningar om 2,5 timmar. Priserna nedan avser julbordet per person.</p>
611          </div>
612        
613
614      <ul class="benefit-columns__row">
615        
616
617        
618
619        
620          <li class="benefit benefit--rows" data-reveal>
621            <h3 class="benefit__title">Tisdag–fredag</h3>
622            <p class="benefit__meta"></p>
623            <ul class="benefit__rows">
624              
625                <li class="benefit__row"><span class="benefit__row-title">Sittning 1</span><span class="benefit__row-note">16:00–16:30</span><span class="benefit__row-price">895 kr</span></li>
626              
627                <li class="benefit__row"><span class="benefit__row-title">Sittning 2</span><span class="benefit__row-note">19:30–20:00</span><span class="benefit__row-price">975 kr</span></li>
628              
629            </ul>
630          </li>
631        
632          <li class="benefit benefit--rows" data-reveal>
633            <h3 class="benefit__title">Lördag</h3>
634            <p class="benefit__meta"></p>
635            <ul class="benefit__rows">
636              
637                <li class="benefit__row"><span class="benefit__row-title">Julbrunch</span><span class="benefit__row-note">13:00–13:30</span><span class="benefit__row-price">495 kr</span></li>
638              
639                <li class="benefit__row"><span class="benefit__row-title">Sittning 2</span><span class="benefit__row-note">18:00–18:30</span><span class="benefit__row-price">895 kr</span></li>
640              
641            </ul>
642          </li>
643        
644          <li class="benefit benefit--rows" data-reveal>
645            <h3 class="benefit__title">Söndag</h3>
646            <p class="benefit__meta"></p>
647            <ul class="benefit__rows">
648              
649                <li class="benefit__row"><span class="benefit__row-title">Julbrunch</span><span class="benefit__row-note">13:00–13:30</span><span class="benefit__row-price">495 kr</span></li>
650              
651            </ul>
652          </li>
653        
654          <li class="benefit benefit--rows" data-reveal>
655            <h3 class="benefit__title">MÃ¥ndag</h3>
656            <p class="benefit__meta"></p>
657            <ul class="benefit__rows">
658              
659                <li class="benefit__row"><span class="benefit__row-title"></span><span class="benefit__row-note">Inget ordinarie julbord</span><span class="benefit__row-price"></span></li>
660              
661                <li class="benefit__row"><span class="benefit__row-title"></span><span class="benefit__row-note">
661Julbord endast vid helabonnering</span><span class="benefit__row-price"></span></li>
662              
663            </ul>
664          </li>
665        
666      </ul>
667
668      <div class="benefit-columns__notes">
669        <p class="benefit-columns__note">Glögg vid ankomst ingår. Dryck tillkommer enligt ordinarie priser eller valt dryckespaket.</p>
670        <p class="benefit-columns__note benefit-columns__note--fine">Barn 0–3 år äter gratis, 4–12 år 25 kr per fyllt år. Sen avbokning debiteras med 250 kr per person, för julbrunch 150 kr.</p>
671      </div>
672
673      
674
675      
676
677    </div>
678  </div>
679</section>
680
681    <!-- 5. Dryckespaket: the client asked whether to say the packages are
682            discounted. They are, and the saving is documented per package in
683            DRYCK, so the claim is substantiable rather than decorative. The
684            range 4–16% is honest: the alcohol-free package's saving depends
685            on which three drinks the guest picks.
686
687            THE PRICE SITS UNDER THE NAME, one step down in size, rather than
688            beside it after a dot. "Alkoholfritt · 275 kr" was also the one
689            title long enough to wrap, which started that package's list a
690            line below its neighbours'; with the price on its own line every
691            card starts at the same height and the reserved second line the
692            old layout needed is gone.
693
694            NO VOLUME ON THE WINE, at the client's request. A glass is a glass;
695            "16 cl" priced the pour rather than describing it, and it was the
696            only measurement a guest had no decision to make about. The snaps
697            and the avec keep theirs: 2 cl and 5 cl are genuinely different
698            pours, and the brunch package's smaller snaps is the reason it
699            costs less. -->
700    <!-- A row of short, titled columns. The copy is page-specific rather than
701     editorial, so it arrives as a JSON array param instead of a collection.
702
703     The row wraps on its own — .benefit has a min-inline-size floor — so three
704     items sit in a row, five wrap to a second line, and none of it needs a
705     breakpoint.
706
707     Spacing and layout are classes rather than branches around the body: a
708     wl-choose around the whole thing would mean two copies of this markup to
709     keep in step, which is exactly the trap the two event-list templates
710     already are.
711
712     THE THREE PARTS OF A ROW CARRY NO WHITESPACE BETWEEN THEM in the markup.
713     Each part collapses with :empty when its field is an empty string, and a
714     newline inside the span would leave a text node behind that :empty no
715     longer matches — an unused part would then take a line of its own with
716     nothing on it. -->
717<section class="section benefit-columns benefit-columns--none benefit-columns--stacked"
718         id="dryck" data-wl-component="benefit-columns" aria-label="Dryckespaket">
719
720  
721
722  <div class="container container--band">
723    <div class="benefit-columns__inner">
724
725      
726          <div class="benefit-columns__intro">
727            <h2 class="benefit-columns__heading">Dryckespaket till bordet</h2>
728            <p class="benefit-columns__lead">Varje paket kostar mindre än samma drycker beställda styckvis: mellan 4 och 16 procent, beroende på paket och val.</p>
729          </div>
730        
731
732      <ul class="benefit-columns__row">
733        
734
735        
736
737        
738          <li class="benefit benefit--rows" data-reveal>
739            <h3 class="benefit__title">Brunch</h3>
740            <p class="benefit__meta">275 kr</p>
741            <ul class="benefit__rows">
742              
743                <li class="benefit__row"><span class="benefit__row-title"></span><span class="benefit__row-note">1 öl</span><span class="benefit__row-price"></span></li>
744              
745                <li class="benefit__row"><span class="benefit__row-title"></span><span class="benefit__row-note">1 glas husets vin</span><span class="benefit__row-price"></span></li>
746              
747                <li class="benefit__row"><span class="benefit__row-title"></span><span class="benefit__row-note">
7471 snaps, 2 cl</span><span class="benefit__row-price"></span></li>
748              
749                <li class="benefit__row"><span class="benefit__row-title"></span><span class="benefit__row-note">Kaffe</span><span class="benefit__row-price"></span></li>
750              
751            </ul>
752          </li>
753        
754          <li class="benefit benefit--rows" data-reveal>
755            <h3 class="benefit__title">Alkoholfritt</h3>
756            <p class="benefit__meta">275 kr</p>
757            <ul class="benefit__rows">
758              
759                <li class="benefit__row"><span class="benefit__row-title"></span><span class="benefit__row-note">3 valfria alkoholfria enheter</span><span class="benefit__row-price"></span></li>
760              
761                <li class="benefit__row"><span class="benefit__row-title"></span><span class="benefit__row-note">1 alkoholfri snaps, 5 cl</span><span class="benefit__row-price"></span></li>
762              
763                <li class="benefit__row"><span class="benefit__row-title"></span><span class="benefit__row-note">Kaffe</span><span class="benefit__row-price"></span></li>
764              
765            </ul>
766          </li>
767        
768          <li class="benefit benefit--rows" data-reveal>
769            <h3 class="benefit__title">Klassiskt</h3>
770            <p class="benefit__meta">455 kr</p>
771            <ul class="benefit__rows">
772              
773                <li class="benefit__row"><span class="benefit__row-title"></span><span class="benefit__row-note">1 julöl</span><span class="benefit__row-price"></span></li>
774              
775                <li class="benefit__row"><span class="benefit__row-title"></span><span class="benefit__row-note">1 snaps, 5 cl</span><span class="benefit__row-price"></span></li>
776              
777                <li class="benefit__row"><span class="benefit__row-title"></span><span class="benefit__row-note">2 glas husets vin</span><span class="benefit__row-price"></span></li>
778              
779                <li class="benefit__row"><span class="benefit__row-title"></span><span class="benefit__row-note">Kaffe</span><span class="benefit__row-price"></span></li>
780              
781            </ul>
782          </li>
783        
784          <li class="benefit benefit--rows" data-reveal>
785            <h3 class="benefit__title">Premium</h3>
786            <p class="benefit__meta">675 kr</p>
787            <ul class="benefit__rows">
788              
789                <li class="benefit__row"><span class="benefit__row-title"></span><span class="benefit__row-note">1 julöl</span><span class="benefit__row-price"></span></li>
790              
791                <li class="benefit__row"><span class="benefit__row-title"></span><span class="benefit__row-note">1 snaps, 5 cl</span><span class="benefit__row-price"></span></li>
792              
793                <li class="benefit__row"><span class="benefit__row-title"></span><span class="benefit__row-note">2 glas premiumvin</span><span class="benefit__row-price"></span></li>
794              
795                <li class="benefit__row"><span class="benefit__row-title"></span><span class="benefit__row-note">1 avec, 5 cl</span><span class="benefit__row-price"></span></li>
796              
797                <li class="benefit__row"><span class="benefit__row-title"></span><span class="benefit__row-note">Kaffe</span><span class="benefit__row-price"></span></li>
798              
799            </ul>
800          </li>
801        
802      </ul>
803
804      <div class="benefit-columns__notes">
805        <p class="benefit-columns__note">Klassiskt och Premium kan inte kombineras inom samma sällskap. Alkoholfritt kan kombineras med båda. Hela sällskapet behöver inte välja paket.</p>
806        <p class="benefit-columns__note benefit-columns__note--fine">Klassiskt, Premium och Alkoholfritt förbokas. Brunchpaketet kan även beställas på plats. Byte av ett förbeställt paket görs senast 48 timmar före sittningen.</p>
807      </div>
808
809      
810
811      
812
813    </div>
814  </div>
815</section>
816
817    <!-- 6. Abonneringar: the invitation on the left, the two tiers stacked on
818            the right. 30 is where private hire starts, which is why the close
819            below says 29 is the most that can be booked online.
820
821            The 500 kr-per-unused-seat figure behind minimum spend is marked
822            an internal calculation in ABONNERINGAR and is deliberately NOT
823            published; what a guest needs to know is that minimum spend exists
824            for a full hire and that food and drink count towards it.
825
826            THE TWO LINKS UNDER THE NOTE go to the terms page for larger
827            parties, each to its own section: the cancellation terms for
828            parties of 16 or more, and the technology and equipment available
829            for larger parties and private hire. The ids are set on the h2s
830            of villkor-storre-sallskap.html. -->
831    <!-- A row of short, titled columns. The copy is page-specific rather than
832     editorial, so it arrives as a JSON array param instead of a collection.
833
834     The row wraps on its own — .benefit has a min-inline-size floor — so three
835     items sit in a row, five wrap to a second line, and none of it needs a
836     breakpoint.
837
838     Spacing and layout are classes rather than branches around the body: a
839     wl-choose around the whole thing would mean two copies of this markup to
840     keep in step, which is exactly the trap the two event-list templates
841     already are.
842
843     THE THREE PARTS OF A ROW CARRY NO WHITESPACE BETWEEN THEM in the markup.
844     Each part collapses with :empty when its field is an empty string, and a
845     newline inside the span would leave a text node behind that :empty no
846     longer matches — an unused part would then take a line of its own with
847     nothing on it. -->
848<section class="section benefit-columns benefit-columns--none benefit-columns--split"
849         id="abonnering" data-wl-component="benefit-columns" aria-label="Abonneringar">
850
851  
852      <img class="decor-glyph decor-glyph--wine-glass" src="/assets/piren/wine-glass.08279af6935bcad6.svg"
853           loading="lazy" decoding="async" alt="">
854    
855
856  <div class="container container--band">
857    <div class="benefit-columns__inner">
858
859      
860          <div class="benefit-columns__intro">
861            <h2 class="benefit-columns__heading">Alla samlade till Jul</h2>
862            <p class="benefit-columns__lead">Planerar ni företagets julbord eller kommer ni som ett större sällskap? Från 30 personer blir bokningen en abonnering: 795 kr per person första sittningen, 875 kr den andra.</p>
863          </div>
864        
865
866      <ul class="benefit-columns__row">
867        
868          <li class="benefit" data-reveal>
869
870            
871
872            <!-- h2 when the section has no heading of its own, h3 when it does. -->
873            <h3 class="benefit__title">30 till 69 personer</h3>
874
875            <p class="benefit__text">Delabonnering med en egen del av restaurangen. Inget minimum spend.</p>
876          </li>
877        
878          <li class="benefit" data-reveal>
879
880            
881
882            <!-- h2 when the section has no heading of its own, h3 when it does. -->
883            <h3 class="benefit__title">70 till 98 personer</h3>
884
885            <p class="benefit__text">Hela Piren för er själva. Minimum spend gäller, och all mat och dryck räknas mot beloppet.</p>
886          </li>
887        
888
889        
890
891        
892      </ul>
893
894      <div class="benefit-columns__notes">
895        <p class="benefit-columns__note">Dryck tillkommer. På måndagar är helabonnering det enda sättet att boka julbord.</p>
896        <p class="benefit-columns__note benefit-columns__note--fine"></p>
897      </div>
898
899      
900          <ul class="benefit-columns__links">
901            
902              <li><a class="link-strong" href="/villkor-storre-sallskap#avbokning">Avbokningsvillkor för större sällskap</a></li>
903            
904              <li><a class="link-strong" href="/villkor-storre-sallskap#teknik">Teknik &amp; utrustning</a></li>
905            
906          </ul>
907        
908
909      
910
911    </div>
912  </div>
913</section>
914
915    <!-- 7. Avslutande CTA -->
916    <!-- The last thing on the page: one question, two answers, and where to come.
917     Centred, because nothing follows it and there is nothing to align to. -->
918<section class="section closing-cta closing-cta--tint" id="boka"
919         data-wl-component="closing-cta" aria-labelledby="boka-heading">
920  <div class="container">
921    <div class="closing-cta__inner" data-reveal>
922
923      <h2 class="closing-cta__heading" id="boka-heading">Säkra din julstämning</h2>
924      <p class="closing-cta__lead">Boka julbord för upp till 29 personer direkt online. Är ni 30 eller fler räknas det som en abonnering. Skicka en förfrågan så hjälper vi er hitta rätt upplägg.</p>
925
926      <div class="closing-cta__actions">
927        <a class="btn" href="https://app.bokabord.se/reservation/?app_type=bokabord&amp;hash=b054b5cb6241c65f4d01012bac48ddab">Boka julbord</a>
928        
929            <a class="btn btn--outline" href="mailto:[email protected]?subject=Julbord%20f%C3%B6r%20st%C3%B6rre%20s%C3%A4llskap">Skicka förfrÃ¥gan</a>
930          
931      </div>
932
933      
934
935    </div>
936  </div>
937</section>
938
939  </main>
940
941  <footer class="site-footer piren-theme-inverse" data-wl-component="site-footer">
942  <div class="site-footer__inner">
943
944    <div class="site-footer__top">
945
946      <div class="site-footer__brand">
947        <a class="site-footer__logo" href="/">
948          <img src="/assets/logo/wordmark-cream.161f345b577fa908.svg" width="432" height="184"
949               loading="lazy" decoding="async" alt="Piren Restaurang &amp; Bar, till startsidan">
950        </a>
951        <address class="site-footer__address">
952          <a href="https://maps.app.goo.gl/BT7m4N82Q4E9Bn9c9" target="_blank" rel="noopener"><span>Kristinebergs Strand 2</span>, <span>112 52</span> <span>Stockholm</span></a>
953          <a href="tel:+4686183030"><span>08-618 30 30</span></a>
954          <a href="mailto:[email protected]?subject=Fr%C3%A5ga%20fr%C3%A5n%20hemsida"><span>[email protected]</span></a>
955        </address>
956      </div>
957
958      <nav class="site-footer__nav" aria-label="Sidfot">
959        <ul class="site-footer__list">
960          <li><a href="/">Hem</a></li>
961          <li><a href="/menyer">Menyer</a></li>
962          <li><a href="/julbord">Julbord</a></li>
963          <li><a href="/abonnera">Abonnera</a></li>
964          <li><a href="/hitta-hit">Hitta hit</a></li>
965        </ul>
966        <ul class="site-footer__list">
967          <li><a href="/evenemang">Evenemang</a></li>
968          <li><a href="/storre-sallskap">Större sällskap</a></li>
969          <li><a href="/hitta-hit">Kontakta oss</a></li>
970        </ul>
971        <ul class="site-footer__list">
972          <li><a href="https://www.instagram.com/restaurang_piren/" target="_blank" rel="noopener">Instagram</a></li>
973          <li><a href="https://www.tiktok.com/@pirenrestaurang" target="_blank" rel="noopener">TikTok</a></li>
974          <li><a href="https://www.facebook.com/restaurangobar/" target="_blank" rel="noopener">Facebook</a></li>
975          <li><a href="https://www.linkedin.com/company/piren/" target="_blank" rel="noopener">LinkedIn</a></li>
976        </ul>
977      </nav>
978    </div>
979
980    <div class="site-footer__legal">
981      <p class="site-footer__copyright">Piren 2026 © All Rights Reserved</p>
982      <ul class="site-footer__policy">
983        
984            <li><a href="/sidkarta">Sidkarta</a></li>
985            <li><a href="/abonneringspolicy">Abonneringspolicy</a></li>
986            <li><a href="/integritetspolicy">Integritetspolicy</a></li>
987            <li><a href="/cookiepolicy">Cookiepolicy</a></li>
988          
989        <!-- Withdrawing consent has to be as easy as giving it, so this is
990             always here, not behind show-policy-links. assets/js/site.js
991             wires it to window.pirenConsent.show(), which cookie-consent.js
992             publishes, and swaps the label from data-en on the English pages.
993
994             `hidden` sits on the LI, not the button: this row is a flex
995             container with a gap, so an emptied-but-present item would still
996             contribute one gap of blank space. site.js reveals it only once
997             that API exists, so if consent is ever switched off entirely this
998             vanishes rather than becoming a dead button. -->
999        <li hidden>
1000          <button class="site-footer__consent-link" type="button"
1001                  data-consent-reopen data-en="Cookie settings">Kakinställningar</button>
1002        </li>
1003      </ul>
1004    </div>
1005
1006  </div>
1007
1008  <!-- Rendered from here, not from each page: the footer is on every page
1009       exactly once, which is the same thing the consent notice needs to be.
1010       It is position:fixed, so sitting inside the footer element costs it
1011       nothing in layout. -->
1012  <!-- Swedish is the markup; every string that differs carries data-en and
1013     cookie-consent.js swaps it when <html lang> is en. The alternative, a
1014     param per string, would mean passing a dozen more attributes on all
1015     fourteen pages for a block no page mentions by name.
1016
1017     The root ships hidden. The script reveals the bar only if there is a
1018     question to ask, so a returning visitor never sees it flash. -->
1019<div class="cookie-consent" data-wl-component="cookie-consent" data-consent
1020     data-log-endpoint="https://app.weblooks.app/api/consent/CKJXPneA9XKVZQ62" data-policy-version="3" hidden data-wl-c="cookie-consent" data-wl-i="0">
1021
1022  <section class="cookie-consent__bar" aria-labelledby="cookie-consent-title" hidden>
1023    <div class="cookie-consent__inner">
1024      <div class="cookie-consent__copy">
1025        <p class="cookie-consent__title" id="cookie-consent-title"
1026           data-en="Cookies on this site">Kakor på den här webbplatsen</p>
1027        <p class="cookie-consent__text"
1028           data-en="We use necessary cookies to make the site work. With your consent we would also like to use optional ones.">Vi använder nödvändiga kakor för att webbplatsen ska fungera. Med ditt samtycke vill vi även använda valfria kakor.</p>
1029        
1030            <a class="link-strong" href="/cookiepolicy" data-en-href="/en/cookie-policy"
1031               data-en="Cookie policy">Cookiepolicy</a>
1032          
1033      </div>
1034
1035      <!-- Reject carries the same weight as accept, deliberately: a refusal
1036           that is visibly harder than acceptance is not freely given. -->
1037      <div class="cookie-consent__actions">
1038        <button class="btn btn--outline" type="button" data-consent-manage
1039                data-en="Customise">Anpassa</button>
1040        <button class="btn" type="button" data-consent-reject
1041                data-en="Reject optional">Neka valfria</button>
1042        <button class="btn" type="button" data-consent-accept
1043                data-en="Accept all">Acceptera alla</button>
1044      </div>
1045    </div>
1046  </section>
1047
1048  <!-- The dialog behind "Anpassa". A real modal, not the bar rewriting itself:
1049       choosing per purpose is a considered decision and deserves the page's
1050       full attention, and it is also what the footer's "Kakinställningar"
1051       link reopens. -->
1052  <div class="cookie-modal" role="dialog" aria-modal="true"
1053       aria-labelledby="cookie-modal-title" hidden>
1054    <div class="cookie-modal__backdrop" data-consent-close></div>
1055    <div class="cookie-modal__panel" tabindex="-1">
1056      <h2 class="cookie-modal__title" id="cookie-modal-title"
1057          data-en="Cookie settings">Kakinställningar</h2>
1058      <p class="cookie-modal__text"
1059         data-en="Choose which cookies we may use. You can change this at any time from the link in the footer.">Välj vilka kakor vi får använda. Du kan ändra detta när som helst via länken i sidfoten.</p>
1060
1061      <div class="cookie-modal__list">
1062        <div class="cookie-option">
1063          <label class="cookie-option__row">
1064            <input class="cookie-option__input" type="checkbox"
1065                   value="necessary" checked disabled>
1066            <span class="cookie-option__name" data-en="Necessary">Nödvändiga</span>
1067          </label>
1068          <p class="cookie-option__text"
1069             data-en="Needed for the site to work: remembering this choice, and nothing else. Always on.">Krävs för att webbplatsen ska fungera, bland annat för att komma ihåg det här valet. Kan inte stängas av.</p>
1070        </div>
1071
1072        <div class="cookie-option">
1073          <label class="cookie-option__row">
1074            <input class="cookie-option__input" type="checkbox" value="analytics">
1075            <span class="cookie-option__name" data-en="Analytics">Analys</span>
1076          </label>
1077          <p class="cookie-option__text"
1078             data-en="Loads Google Analytics, through Google Tag Manager, so we can see how the site is used and improve it.">Laddar Google Analytics via Google Tag Manager, så att vi kan se hur webbplatsen används och förbättra den.</p>
1079        </div>
1080
1081        <div class="cookie-option">
1082          <label class="cookie-option__row">
1083            <input class="cookie-option__input" type="checkbox" value="marketing">
1084            <span class="cookie-option__name" data-en="Marketing">Marknadsföring</span>
1085          </label>
1086          <p class="cookie-option__text"
1087             data-en="Lets us measure which ads lead to bookings. The ad's click id is kept for your visit and travels with your booking, and a visit that takes place is reported to Meta and Google. No advertising cookies are set here.">Låter oss mäta vilka annonser som leder till bokningar. Annonsens klick-id sparas för ditt besök och följer med din bokning, och ett besök som blir av rapporteras till Meta och Google. Inga annonskakor sätts här.</p>
1088        </div>
1089      </div>
1090
1091      <div class="cookie-modal__actions">
1092        <button class="btn btn--outline" type="button" data-consent-reject
1093                data-en="Reject optional">Neka valfria</button>
1094        <button class="btn" type="button" data-consent-save
1095                data-en="Save choices">Spara val</button>
1096      </div>
1097    </div>
1098  </div>
1099</div>
1100</footer>
1101
1102</div>
1103
1104<script src="/assets/js/site.e7b815f4cf3de570.js" defer></script>
1104
1105
1106<script type="application/json" id="wl-params">{"site-header":[{"nav-active":"julbord","home-url":"/","booking-url":"https://app.bokabord.se/reservation/?app_type=bokabord&hash=b054b5cb6241c65f4d01012bac48ddab","booking-hash":"b054b5cb6241c65f4d01012bac48ddab","announcement-cta":"Läs mer","menus-url":"/menyer","julbord-url":"/julbord","private-url":"/abonnera","events-url":"/evenemang","find-url":"/hitta-hit","private-business-url":"/abonnera","private-wedding-url":"/abonnera","private-personal-url":"/abonnera","label-business":"Företag","label-wedding":"Bröllop","label-personal":"Privat","text-business":"Konferens, kickoff eller julfest. Hela Piren för er själva.","text-wedding":"Vigsel, middag och fest med vattnet utanför fönstret.","text-personal":"Födelsedagar, dop och allt annat värt att fira.","alt-business":"Pirens matsal sedd från takhöjd","alt-wedding":"Pirens vinterträdgård fylld av gäster","alt-personal":"En gäst som skrattar vid bordet","has-en":true,"sv-url":"/julbord","en-url":"/en/julbord","lang-current":"sv","lang-label":"Språk / Language","lang-soon":"engelsk version kommer snart","label-menus":"Menyer","label-julbord":"Julbord","label-private":"Abonnera","label-events":"Evenemang","label-find":"Hitta hit","label-book":"Boka bord","label-nav":"Huvudmeny","label-menu":"Meny","label-home-alt":"Piren Restaurang & Bar, till startsidan"}],"cookie-consent":[{"log-endpoint":"https://app.weblooks.app/api/consent/CKJXPneA9XKVZQ62","policy-version":"3","policy-url":"/cookiepolicy","policy-url-en":"/en/cookie-policy","show-policy-link":true}]}</script>
vendor: 1 bytes, line 1106
1106
1107<script type="module" src="/assets/wl-components.db1730919197a2ee.js"></script>
vendor: 1 bytes, line 1107
1107
1108<script type="module" src="https://static.cloudflareinsights.com/beacon.min.js/v31edd6df95cf4e85bb4c19e7a9bdbcba1788362987495" integrity="sha512-iIg7k2xntmwu6/uSb5tpc/hySgZc4eoL31yB29W6tJFo2akwjPWcEqnCEdJvGexCL0KEQwVYv5BlowfhVz26hg==" data-cf-beacon='{"version":"2024.11.0","token":"49d36fbb15e5421b9b9524d20f28bfff","r":1,"spa":2}' crossorigin="anonymous"></script>
1108
1109</body>
1110</html>

Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.