/* Domcraft - putsning (override layer on top of shared.css + upstream.css)
   Feeling: warm craft bar. Paper and malt-brown ink, olive green from the customer's own
   menu PDF as accent, flag green + cream from the facade banner (yellow removed). Fraunces (soft serif, italic accent word) +
   Jost (clean geometric text). Structure follows the Domtrappkallaren makeover:
   full-screen slideshow hero, floating nav, sticky mobile bar, short centred intro, dark footer. */

.rrw {
  --dc-ink: #1E1C19;      /* flag lettering, warm black */
  --dc-paper: #F2ECDC;    /* flag cream */
  --dc-sand: #E6DEC8;     /* second surface */
  --dc-olive: #17513E;    /* flag green (sampled from the facade banner, DSC08237) */
  --dc-gold: #17513E;     /* booking buttons = flag green (yellow removed 2026-11-06) */
  --dc-beige: #D2C49C;    /* labels and accents on dark green */
  --dc-night: #123F31;    /* dark bands + footer, deep flag green */
  --dc-rule: #D3C9AE;
  background: var(--dc-paper);
  color: var(--dc-ink);
  -webkit-font-smoothing: antialiased;
}
html, body { margin: 0; background: #F5F0E4; }
.rrw main { background: var(--dc-paper); }

/* ---------- Type ---------- */
.rrw h1, .rrw h2, .rrw h3, .rrw h4 { font-family: var(--c-heading); font-weight: 400; letter-spacing: -0.01em; line-height: 1.1; text-wrap: balance; }
.rrw h1 em, .rrw h2 em, .rrw h3 em { font-style: italic; color: var(--dc-olive); }
.rrw main h2 { font-size: clamp(30px, 3.8vw, 48px); text-wrap: balance; }
.rrw main p, .rrw .lead { font-size: 17px; line-height: 1.7; text-wrap: balance; }
.rrw .eyebrow {
  font-family: var(--c-body);
  color: var(--dc-olive);
  font-size: 13px;
  font-weight: 500;
  letter-spacing: .26em;
  text-transform: uppercase;
}

/* ---------- Buttons ---------- */
.rrw .cbtn {
  display: inline-flex; align-items: center; justify-content: center;
  font-family: var(--c-body);
  font-size: 14px; font-weight: 500;
  letter-spacing: .16em; text-transform: uppercase; text-decoration: none;
  padding: 16px 30px;
  border-radius: 0;
  background: transparent; color: var(--dc-ink);
  border: 1px solid var(--dc-ink);
  transition: background-color .2s ease, color .2s ease, border-color .2s ease;
}
.rrw .cbtn:hover { background: var(--dc-ink); color: var(--dc-paper); transform: none; filter: none; }
.rrw .cbtn.gold { background: var(--dc-gold); border-color: var(--dc-gold); color: var(--dc-paper); }
.rrw .cbtn.gold:hover { background: var(--dc-ink); border-color: var(--dc-ink); color: var(--dc-paper); }
.rrw .dc-actions { display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; }

/* ---------- Nav ---------- */
.rrw .site-nav { position: sticky; top: 0; z-index: 60; background: var(--dc-paper); border-bottom: 1px solid var(--dc-rule); }
.rrw .site-nav .site-nav-brand img { height: 52px; width: auto; max-width: none; }
.rrw .site-nav a { font-family: var(--c-body); font-size: 14px; letter-spacing: .1em; text-transform: uppercase; font-weight: 500; }
.rrw .site-nav a.site-nav-cta { background: var(--dc-gold); color: var(--dc-paper); border-radius: 0; letter-spacing: .16em; padding: 11px 20px; }
.rrw .site-nav a.site-nav-cta:hover { background: var(--dc-ink); color: var(--dc-paper); filter: none; }
.rrw .site-nav .site-nav-lang { border-color: var(--dc-rule); border-radius: 0; }
.rrw .site-nav .site-nav-lang a[aria-current] { background: var(--dc-ink); color: var(--dc-paper); }
/* three links: centred between logo and language/booking */
@media (min-width: 1061px) {
  .rrw .site-nav { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; }
  .rrw .site-nav .site-nav-links { display: contents; }
  .rrw .site-nav .dc-navc { display: flex; gap: 34px; justify-content: center; align-items: center; }
  .rrw .site-nav .dc-navr { display: flex; gap: 18px; justify-content: flex-end; align-items: center; }
  .rrw .site-nav .site-nav-burger { display: none; }
}
@media (max-width: 1060px) {
  .rrw .site-nav .site-nav-links { display: none; }
  .rrw .site-nav-burger { display: block; }
  .rrw .site-nav .site-nav-brand img { height: 44px; }
}
/* active page (Dennis 2026-11-09, option 1): a thin underline in the text colour, no italic, no dimming of the others */
.rrw .site-nav a[aria-current="page"] { font-style: normal; }
.rrw .site-nav .dc-navc > a[aria-current="page"], .rrw .site-nav-panel a.site-nav-chip[aria-current="page"] { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 7px; }
.rrw .site-nav-panel a.site-nav-chip { font-size: 16px; text-transform: uppercase; letter-spacing: .12em; border-radius: 0; }
.rrw .site-nav-panel a.site-nav-cta { border-radius: 0; font-size: 15px; }
.rrw .site-nav-panel:has(a[aria-current="page"]) a.site-nav-chip:not([aria-current="page"]) { opacity: 1; }
.rrw .site-nav-burger summary:focus-visible, .rrw a:focus-visible, .rrw button:focus-visible { outline: 2px solid var(--dc-olive); outline-offset: 3px; }

/* Home: nav floats transparent over the hero, turns paper on scroll */
.rrw:has(.dc-hero) .site-nav { position: fixed; top: 0; left: 0; right: 0; background: transparent; border-bottom-color: transparent; transition: background .3s ease, border-color .3s ease; }
.rrw:has(.dc-hero) .site-nav.is-scrolled { background: var(--dc-paper); border-bottom-color: var(--dc-rule); }
.rrw:has(.dc-hero) .site-nav:not(.is-scrolled) .site-nav-brand img { filter: brightness(0) invert(1); }
.rrw:has(.dc-hero) .site-nav:not(.is-scrolled) .dc-navc a { color: #fff; text-shadow: 0 1px 8px rgba(0,0,0,.5); }
.rrw:has(.dc-hero) .site-nav:not(.is-scrolled) .site-nav-lang { border-color: rgba(255,255,255,.6); }
.rrw:has(.dc-hero) .site-nav:not(.is-scrolled) .site-nav-lang a:not([aria-current]) { color: #fff; text-shadow: 0 1px 8px rgba(0,0,0,.5); }
.rrw:has(.dc-hero) .site-nav:not(.is-scrolled) .site-nav-burger summary span,
.rrw:has(.dc-hero) .site-nav:not(.is-scrolled) .site-nav-burger summary span::before,
.rrw:has(.dc-hero) .site-nav:not(.is-scrolled) .site-nav-burger summary span::after { background: #fff; }

/* ---------- Hero: full-screen slideshow ---------- */
.rrw .dc-hero { position: relative; overflow: hidden; min-height: 100svh; display: flex; align-items: flex-end; justify-content: center; text-align: center; color: #fff; background: var(--dc-night); }
.rrw .dc-slides { position: absolute; inset: 0; z-index: 0; }
.rrw .dc-slides span { position: absolute; inset: 0; background-size: cover; background-position: center; opacity: 0; animation: dc-slide 30s linear infinite; }
.rrw .dc-slides span:nth-child(1) { animation-name: dc-slide-first; }
.rrw .dc-slides span:nth-child(2) { animation-delay: 5s; }
.rrw .dc-slides span:nth-child(3) { animation-delay: 10s; }
.rrw .dc-slides span:nth-child(4) { animation-delay: 15s; }
.rrw .dc-slides span:nth-child(5) { animation-delay: 20s; }
.rrw .dc-slides span:nth-child(6) { animation-delay: 25s; }
/* 6 slides x 5 s: fade in ~1 s, hold, cross-fade into the next, slow zoom */
@keyframes dc-slide {
  0% { opacity: 0; transform: scale(1); }
  4% { opacity: 1; }
  16.7% { opacity: 1; }
  21% { opacity: 0; transform: scale(1.06); }
  100% { opacity: 0; transform: scale(1.06); }
}
@keyframes dc-slide-first {
  0% { opacity: 1; transform: scale(1); }
  16.7% { opacity: 1; }
  21% { opacity: 0; transform: scale(1.06); }
  95% { opacity: 0; transform: scale(1); }
  100% { opacity: 1; transform: scale(1); }
}
.rrw .dc-hero::after { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(180deg, rgba(0,0,0,.55) 0, rgba(0,0,0,0) 20%, rgba(0,0,0,0) 32%, rgba(0,0,0,.45) 62%, rgba(0,0,0,.75) 100%); }
.rrw .dc-hero-in { position: relative; z-index: 2; display: grid; justify-items: center; gap: 18px; padding: 110px 20px clamp(48px, 8vh, 88px); }
.rrw .dc-hero-logo { margin: 0; line-height: 0; }
.rrw .dc-hero-logo img { display: block; width: clamp(200px, 26vw, 320px); height: auto; filter: drop-shadow(0 2px 18px rgba(0,0,0,.5)); }
.rrw .dc-hero-eb { margin: 0; color: #fff; font-size: 14px; letter-spacing: .3em; padding-left: .3em; text-transform: uppercase; text-shadow: 0 1px 10px rgba(0,0,0,.6); }
.rrw .dc-hero .dc-actions { margin-top: 10px; gap: 14px; }
.rrw .dc-hero .cbtn { min-width: 190px; box-shadow: 0 8px 24px rgba(0,0,0,.3); }
.rrw .dc-hero .cbtn.ghost { background: rgba(18,63,49,.35); color: #fff; border: 1.5px solid #fff; backdrop-filter: blur(3px); }
.rrw .dc-hero .cbtn.ghost:hover { background: var(--dc-paper); border-color: var(--dc-paper); color: var(--dc-olive); }
@media (prefers-reduced-motion: reduce) {
  .rrw .dc-slides span { animation: none; opacity: 0; }
  .rrw .dc-slides span:nth-child(1) { opacity: 1; }
  .rrw * { transition: none !important; }
}

/* ---------- Intro ---------- */
.rrw .dc-intro { max-width: 900px; margin: 0 auto; text-align: center; padding: clamp(64px, 9vw, 120px) clamp(20px, 5vw, 48px); }
.rrw .dc-intro .eyebrow { margin: 0 0 18px; }
.rrw .dc-intro h2 { font-size: clamp(34px, 5vw, 60px); margin: 0 auto 22px; }
.rrw .dc-intro p { max-width: 560px; margin: 0 auto 14px; }
.rrw .dc-intro .dc-actions { margin-top: 30px; }

/* ---------- Taps / G&T / bar food cards ---------- */
.rrw .dc-cards-sec { background: var(--dc-sand); padding: clamp(56px, 8vw, 104px) clamp(20px, 5vw, 64px); text-align: center; }
.rrw .dc-cards-sec .eyebrow { margin: 0 0 14px; }
.rrw .dc-cards-sec h2 { margin: 0 auto clamp(32px, 4vw, 52px); }
.rrw .dc-cards { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(16px, 2.4vw, 32px); text-align: left; }
.rrw .dc-card { margin: 0; background: var(--dc-paper); }
.rrw .dc-card-img { display: block; aspect-ratio: 4 / 3; background-size: cover; background-position: center; }
.rrw .dc-card-body { padding: 24px 26px 30px; }
.rrw .dc-card h3 { font-size: 28px; margin: 0 0 10px; }
.rrw .dc-card p { margin: 0; font-size: 16px; }
.rrw .dc-cards-sec .dc-actions { margin-top: clamp(32px, 4vw, 48px); }
.rrw .dc-season { margin: 26px auto 0; font-size: 15px; letter-spacing: .04em; opacity: .85; }
@media (max-width: 860px) { .rrw .dc-cards { grid-template-columns: 1fr; max-width: 520px; } }

/* ---------- Dark split: after work ---------- */
.rrw .dc-split { display: grid; grid-template-columns: 1fr 1fr; background: var(--dc-night); color: var(--dc-paper); }
.rrw .dc-split-photo { min-height: clamp(320px, 40vw, 600px); background-size: cover; background-position: center; }
.rrw .dc-split-in { align-self: center; padding: clamp(40px, 6vw, 96px) clamp(24px, 6vw, 88px); max-width: 600px; }
.rrw .dc-split .eyebrow { color: var(--dc-beige); margin: 0 0 14px; }
.rrw .dc-split h2 { color: var(--dc-paper); margin: 0 0 18px; }
.rrw .dc-split h2 em { color: var(--dc-beige); }
.rrw .dc-split .cbtn.gold, .rrw .rrw-up .ftr.dc-ftr .cbtn.gold { background: var(--dc-paper); border-color: var(--dc-paper); color: var(--dc-olive); }
.rrw .dc-split .cbtn.gold:hover, .rrw .rrw-up .ftr.dc-ftr .cbtn.gold:hover { background: var(--dc-beige); border-color: var(--dc-beige); color: var(--dc-ink); }
.rrw .dc-split p { margin: 0 0 26px; opacity: .9; }
.rrw .dc-split .cbtn:not(.gold) { color: var(--dc-paper); border-color: var(--dc-paper); }
@media (max-width: 760px) { .rrw .dc-split { grid-template-columns: 1fr; } .rrw .dc-split-photo { min-height: 300px; } }

/* ---------- Gallery ---------- */
.rrw .dc-gal { padding: clamp(40px, 6vw, 80px) 0 0; }
.rrw .dc-gal-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
.rrw .dc-gal-grid > div { background-size: cover; background-position: center; height: clamp(200px, 26vw, 380px); }
.rrw .dc-gal-grid > .wide { grid-column: span 2; }
.rrw .dc-gal-grid > .tall { grid-row: span 2; height: auto; }
.rrw .dc-welcome { text-align: center; padding: clamp(56px, 8vw, 104px) clamp(20px, 5vw, 48px); }
.rrw .dc-welcome h2 { max-width: 640px; margin: 0 auto 26px; font-size: clamp(30px, 4vw, 52px); }
@media (max-width: 720px) {
  .rrw .dc-gal-grid { grid-template-columns: 1fr 1fr; }
  .rrw .dc-gal-grid > .wide { grid-column: 1 / -1; }
  .rrw .dc-gal-grid > .tall { grid-row: auto; height: clamp(200px, 26vw, 380px); }
}

/* ---------- Sub pages ---------- */
.rrw .dc-head { text-align: center; padding: clamp(56px, 8vw, 112px) clamp(20px, 5vw, 48px) clamp(28px, 4vw, 48px); max-width: 820px; margin: 0 auto; }
.rrw .dc-head .eyebrow { margin: 0 0 14px; }
.rrw .dc-head h1 { font-size: clamp(44px, 7vw, 84px); margin: 0 0 18px; line-height: 1; }
.rrw .dc-head p { margin: 0 auto 10px; max-width: 520px; }
.rrw .dc-head .dc-actions { margin-top: 24px; }
.rrw .dc-band { height: clamp(220px, 32vw, 460px); background-size: cover; background-position: center; }

/* Menu */
.rrw .dc-menu { max-width: 880px; margin: 0 auto; padding: clamp(40px, 6vw, 80px) clamp(20px, 5vw, 48px) clamp(24px, 4vw, 48px); }
.rrw .dc-menu-sec + .dc-menu-sec { margin-top: clamp(40px, 6vw, 72px); }
.rrw .dc-menu-sec h2 { font-size: clamp(28px, 3.4vw, 40px); margin: 0 0 8px; padding-bottom: 14px; border-bottom: 1px solid var(--dc-ink); }
.rrw .dc-menu-sub { margin: 14px 0 0; font-size: 14px; letter-spacing: .24em; text-transform: uppercase; color: var(--dc-olive); }
.rrw .dc-item { display: grid; grid-template-columns: 1fr auto; gap: 4px 24px; padding: 20px 0; border-bottom: 1px solid var(--dc-rule); }
.rrw .dc-item h3 { font-family: var(--c-body); font-size: 16px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; margin: 0; }
.rrw .dc-item h3 small { font-size: 13px; font-weight: 400; letter-spacing: .1em; opacity: .8; margin-left: 8px; }
.rrw .dc-item .dc-price { font-family: var(--c-heading); font-size: 22px; text-align: right; white-space: nowrap; align-self: start; grid-row: span 2; color: var(--dc-olive); }
.rrw .dc-item p { grid-column: 1; margin: 0; font-size: 16px; font-style: italic; max-width: 62ch; }
.rrw .dc-item .dc-opt { grid-column: 1 / -1; max-width: none; display: flex; justify-content: space-between; gap: 16px; font-size: 15px; margin: 2px 0 0; }
.rrw .dc-note { text-align: center; font-size: 14px; letter-spacing: .08em; text-transform: uppercase; max-width: 640px; margin: clamp(32px, 5vw, 56px) auto 0; text-wrap: balance; }
.rrw .dc-menu-end { text-align: center; padding: 8px 20px clamp(56px, 8vw, 104px); }

/* Booking */
.rrw .dc-book > * { min-width: 0; }
.rrw .dc-side .cbtn { text-align: center; white-space: normal; overflow-wrap: anywhere; }
.rrw .dc-book { max-width: 1080px; margin: 0 auto; padding: 0 clamp(20px, 5vw, 48px) clamp(56px, 8vw, 104px); display: grid; grid-template-columns: 1.5fr 1fr; gap: clamp(28px, 5vw, 64px); align-items: start; }
.rrw .dc-book iframe { width: 100%; min-height: 640px; border: 1px solid var(--dc-rule); border-radius: 0; background: #fff; }
.rrw .dc-side h2 { font-size: 28px; margin: 0 0 14px; }
.rrw .dc-side p { margin: 0 0 16px; }
.rrw .dc-side .dc-actions { justify-content: flex-start; flex-direction: column; align-items: stretch; margin-bottom: 26px; }
.rrw .dc-hours { list-style: none; margin: 0; padding: 0; }
.rrw .dc-hours li { display: flex; justify-content: space-between; gap: 16px; padding: 12px 0; border-bottom: 1px solid var(--dc-rule); font-size: 16px; }
@media (max-width: 860px) { .rrw .dc-book { grid-template-columns: 1fr; } .rrw .dc-book iframe { min-height: 560px; } }

/* Contact */
.rrw .dc-contact { max-width: 1080px; margin: 0 auto; padding: 0 clamp(20px, 5vw, 48px) clamp(40px, 6vw, 72px); display: grid; grid-template-columns: 1fr 1.2fr; gap: clamp(28px, 5vw, 64px); align-items: start; }
.rrw .dc-rows { margin: 0; }
.rrw .dc-row { display: grid; grid-template-columns: 170px 1fr; gap: 16px; padding: 16px 0; border-bottom: 1px solid var(--dc-rule); font-size: 17px; }
.rrw .dc-row dt { font-size: 13px; letter-spacing: .22em; text-transform: uppercase; color: var(--dc-olive); padding-top: 4px; }
.rrw .dc-row dd { margin: 0; }
.rrw .dc-row a { color: var(--dc-ink); text-underline-offset: 4px; text-decoration-color: var(--dc-olive); }
.rrw .dc-map { width: 100%; min-height: 420px; border: 0; background: var(--dc-sand); }
@media (max-width: 860px) { .rrw .dc-contact { grid-template-columns: 1fr; } .rrw .dc-map { min-height: 320px; } }
@media (max-width: 480px) { .rrw .dc-row { grid-template-columns: 1fr; gap: 4px; } }

/* ---------- Footer ---------- */
.rrw .rrw-up .ftr.dc-ftr { background: var(--dc-night); color: var(--dc-sand); padding: clamp(56px, 7vw, 88px) clamp(20px, 5vw, 64px) clamp(40px, 5vw, 56px); }
.rrw .dc-ftr-top { display: grid; justify-items: center; text-align: center; gap: 18px; padding-bottom: clamp(36px, 5vw, 52px); border-bottom: 1px solid rgba(232,225,204,.2); }
.rrw .dc-ftr-logo img { display: block; width: 150px; height: auto; }
.rrw .dc-ftr-cols { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 32px; max-width: 1080px; margin: 0 auto; padding-top: clamp(32px, 4vw, 48px); }
.rrw .dc-ftr-cols > div { display: grid; align-content: start; gap: 6px; font-size: 19px; line-height: 1.55; }
.rrw .rrw-up .ftr.dc-ftr .dc-lbl { display: block; color: var(--dc-beige); opacity: 1; font-size: 14px; letter-spacing: .22em; text-transform: uppercase; margin-bottom: 8px; }
.rrw .rrw-up .ftr.dc-ftr .dc-lbl.dc-avv { margin-top: 14px; }
.rrw .rrw-up .ftr.dc-ftr .dc-fl { display: block; color: var(--dc-sand); opacity: 1; font-size: 19px; text-decoration: none; padding-block: 2px; }
.rrw .rrw-up .ftr.dc-ftr a.dc-fl:hover { color: var(--dc-beige); }
.rrw .rrw-up .ftr.dc-ftr .cbtn { color: var(--dc-ink); opacity: 1; font-size: 14px; }
.rrw .sub-footer { background: #0D3127; color: var(--dc-sand); padding-top: 18px; }
.rrw .sub-footer .powered { display: flex; justify-content: center; min-height: 44px; font-size: 11px; letter-spacing: .12em; text-transform: uppercase; opacity: .85; }
.rrw .sub-footer .powered img { height: 18px; width: auto; }
.rrw .sub-footer, .rrw .sub-footer small, .rrw .sub-footer .sub-link { font-size: 15px; color: var(--dc-sand); }
.rrw .sub-footer .powered span { font-size: 11px; }
.rrw .sub-footer .sub-link { background: none; border: 0; cursor: pointer; text-decoration: underline; text-underline-offset: 3px; font-family: inherit; }
@media (max-width: 860px) { .rrw .dc-ftr-cols { grid-template-columns: 1fr 1fr; } }
@media (max-width: 480px) {
  .rrw .dc-ftr-cols { grid-template-columns: 1fr; text-align: center; }
  .rrw .dc-ftr-cols > div, .rrw .rrw-up .ftr.dc-ftr .dc-fl { font-size: 18px; justify-items: center; }
}

/* ---------- Sticky mobile bar ---------- */
.rrw .dc-mbar { display: none; }
@media (max-width: 1060px) {
  .rrw .dc-mbar {
    display: grid; grid-template-columns: 1fr 1fr; gap: 8px;
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 70;
    padding: 10px max(12px, env(safe-area-inset-right, 0px)) calc(10px + env(safe-area-inset-bottom, 0px)) max(12px, env(safe-area-inset-left, 0px));
    background: var(--dc-paper); border-top: 1px solid var(--dc-rule);
  }
  .rrw .dc-mbar a {
    display: flex; align-items: center; justify-content: center; min-height: 46px;
    font-family: var(--c-body); font-size: 14px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase;
    text-decoration: none; color: var(--dc-ink); border: 1px solid var(--dc-ink);
  }
  .rrw .dc-mbar a.dc-mbar-book { background: var(--dc-gold); border-color: var(--dc-gold); color: var(--dc-paper); }
}
@media (max-width: 480px) {
  .rrw .dc-hero .cbtn { min-width: 0; flex: 1 1 0; padding: 16px 12px; }
  .rrw .dc-hero .dc-actions { width: 100%; }
}

/* ---------- Cookie banner ---------- */
.rrw .rr-cookie { font-family: var(--c-body); }
.rrw .rr-cookie .cbtn { padding: 12px 20px; font-size: 13px; }
.rrw .rr-cookie .cbtn.rr-ck-all { background: var(--dc-gold); border-color: var(--dc-gold); color: var(--dc-paper); }
.rrw .rr-cookie .rr-ck-link { background: none; border: 0; color: var(--dc-ink); text-decoration: underline; text-underline-offset: 3px; font: inherit; cursor: pointer; padding: 8px; }

/* ---------- Bar pages (Ölbaren / Ginbaren) ---------- */
.rrw .dc-trio { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); max-width: 1080px; margin: 0 auto; padding: clamp(48px, 7vw, 96px) clamp(20px, 5vw, 48px); }
.rrw .dc-trio-item { padding: 4px clamp(16px, 3vw, 40px); text-align: center; }
.rrw .dc-trio-item + .dc-trio-item { border-left: 1px solid var(--dc-rule); }
.rrw main .dc-trio-item h2 { font-size: clamp(26px, 2.6vw, 34px); margin: 0 0 10px; }
.rrw main .dc-trio-item p { font-size: 16px; margin: 0 auto; max-width: 26ch; }
@media (max-width: 720px) {
  .rrw .dc-trio { grid-template-columns: 1fr; gap: 0; max-width: 420px; }
  .rrw .dc-trio-item { padding: 22px 0; }
  .rrw .dc-trio-item + .dc-trio-item { border-left: 0; border-top: 1px solid var(--dc-rule); }
}
.rrw .dc-gal-grid.is-trio { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.rrw .dc-gal-grid.is-trio > div { height: auto; aspect-ratio: 4 / 5; }

/* ---------- Text pages (Integritetspolicy) ---------- */
.rrw .dc-prose { max-width: 680px; margin: 0 auto; padding: 0 clamp(20px, 5vw, 48px) clamp(72px, 9vw, 120px); }
.rrw main .dc-prose h2 { font-size: clamp(24px, 2.4vw, 30px); margin: 40px 0 10px; text-wrap: balance; }
.rrw main .dc-prose p { margin: 0; text-wrap: balance; }
.rrw main .dc-prose p + p { margin-top: 12px; }
.rrw .dc-prose a, .rrw .dc-inline-link { color: inherit; text-decoration: underline; text-underline-offset: 3px; }
.rrw .dc-inline-link { background: none; border: 0; padding: 0; font: inherit; cursor: pointer; }
.rrw .rr-cookie p a { color: inherit; text-decoration: underline; }
.rrw .rr-cookie p, .rrw .dc-card p { text-wrap: balance; }
.rrw .sub-footer .sub-legal a.sub-link { font-size: 15px; color: var(--dc-sand); opacity: 1; text-underline-offset: 3px; }

/* Menu page: tabs (Mat / Öl på kran) + sticky category bar with scroll-spy (house rule, behaviour in mtabs.js) */
.rrw .mtabs { --mtabs-top: 0px; --mtabs-tabs-h: 0px; --mtabs-cats-h: 58px; }
.rrw .mtabs-tabs, .rrw .mtabs-cats { position: sticky; display: flex; gap: 8px; overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch; padding: 8px clamp(16px, 4vw, 48px); background: var(--dc-paper); border-bottom: 1px solid var(--dc-rule); }
.rrw .mtabs-tabs::-webkit-scrollbar, .rrw .mtabs-cats::-webkit-scrollbar { display: none; }
.rrw .mtabs-tabs::before, .rrw .mtabs-tabs::after, .rrw .mtabs-cats::before, .rrw .mtabs-cats::after { content: ""; margin: auto; }
.rrw .mtabs-tabs { top: var(--mtabs-top); z-index: 22; padding-top: 14px; padding-bottom: 14px; }
.rrw .mtabs-cats { top: calc(var(--mtabs-top) + var(--mtabs-tabs-h)); z-index: 20; gap: 4px; padding-top: 4px; padding-bottom: 4px; }
.rrw .mtabs-tab { flex: none; min-height: 44px; padding: 0 22px; border: 1px solid var(--dc-ink); background: transparent; color: var(--dc-ink); font: 500 13px/1 var(--c-body); letter-spacing: .16em; text-transform: uppercase; cursor: pointer; white-space: nowrap; }
.rrw .mtabs-tab.on { background: var(--dc-gold); border-color: var(--dc-gold); color: var(--dc-paper); }
.rrw .mtabs-cats a { flex: none; display: inline-flex; align-items: center; min-height: 44px; padding: 0 14px; color: var(--dc-ink); text-decoration: none; font-size: 13px; letter-spacing: .14em; text-transform: uppercase; white-space: nowrap; border-bottom: 2px solid transparent; opacity: .78; }
.rrw .mtabs-cats a.on { opacity: 1; border-bottom-color: var(--dc-gold); }
.rrw .mtabs-cat { scroll-margin-top: calc(var(--mtabs-top) + var(--mtabs-tabs-h) + var(--mtabs-cats-h) + 12px); }
.rrw .mtabs-panel[hidden] { display: none; }
.rrw .dc-taps-intro { margin: 18px 0 8px; max-width: 60ch; text-wrap: balance; }
.rrw .dc-taps-wait { margin: 24px 0; font-style: italic; opacity: .75; }
.rrw #menu-container { min-height: 240px; }

/* QA 2026-11-09: nav CTA and buttons on one line, trio headings even */
.rrw .site-nav-cta { white-space: nowrap; }
@media (min-width: 700px) { .rrw .dc-trio-item h2 { white-space: nowrap; } }
.rrw .dc-row dd[data-deviating-hours]:empty::after, .rrw [data-deviating-hours]:empty::after { content: "\00a0"; }

/* Ölbaren/Ginbaren hero: text left, video right (Dennis 2026-11-09); stacks text-then-video on phones */
.rrw .dc-vhero { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr); align-items: center; gap: clamp(32px, 5vw, 80px); max-width: 1320px; margin: 0 auto; padding: clamp(40px, 6vw, 88px) clamp(20px, 5vw, 56px); }
.rrw .dc-vhero-text .eyebrow { margin: 0 0 14px; }
.rrw .dc-vhero-text h1 { font-size: clamp(40px, 4.8vw, 72px); line-height: 1.02; margin: 0 0 20px; text-wrap: balance; }
.rrw .dc-vhero-text .lead { margin: 0; max-width: 46ch; text-wrap: balance; }
.rrw .dc-vhero-text .dc-actions { margin-top: 28px; justify-content: flex-start; }
.rrw .dc-vhero-media { aspect-ratio: 16 / 9; overflow: hidden; background: var(--dc-sand); }
.rrw .dc-vhero-media video { display: block; width: 100%; height: 100%; object-fit: cover; }
.rrw .dc-vhero + .dc-taps .dc-menu { padding-top: clamp(16px, 3vw, 40px); }
@media (max-width: 860px) {
  .rrw .dc-vhero { grid-template-columns: 1fr; padding-top: 32px; }
  .rrw .dc-vhero-text { text-align: center; }
  .rrw .dc-vhero-text .lead { margin: 0 auto; }
  .rrw .dc-vhero-text .dc-actions { justify-content: center; }
  .rrw .dc-vhero-media { margin: 0 calc(-1 * clamp(20px, 5vw, 56px)); }
}

/* Home intro heading: two lines on phones instead of three short ones (no 1-3 lone words) */
@media (max-width: 560px) { .rrw .dc-intro h2 { font-size: clamp(23px, 6.2vw, 34px); } }

/* Start page hero: full-bleed video replaces the photo slideshow (Dennis 2026-11-09) */
.rrw .dc-hero-video { position: absolute; inset: 0; z-index: 0; width: 100%; height: 100%; object-fit: cover; }

/* Boka bord dialog (Caspeco in an iframe, behaviour in dc-book.js) */
.dc-book-dlg { padding: 0; border: 0; width: min(560px, calc(100vw - 32px)); height: min(780px, calc(100dvh - 48px)); background: var(--dc-paper); box-shadow: 0 30px 80px rgba(0,0,0,.45); display: none; flex-direction: column; }
.dc-book-dlg[open] { display: flex; }
.dc-book-dlg::backdrop { background: rgba(18,63,49,.72); }
.dc-book-head { display: flex; align-items: center; justify-content: space-between; padding: 10px 12px 10px 20px; background: var(--dc-night); color: var(--dc-paper); }
.dc-book-head p { margin: 0; font-family: var(--c-body); font-size: 14px; font-weight: 500; letter-spacing: .2em; text-transform: uppercase; }
.dc-book-close { width: 44px; height: 44px; border: 0; background: none; color: var(--dc-paper); font-size: 28px; line-height: 1; cursor: pointer; }
.dc-book-dlg iframe { flex: 1; width: 100%; border: 0; background: #fff; }
@media (max-width: 600px) { .dc-book-dlg { width: 100vw; height: 100dvh; max-width: none; max-height: none; margin: 0; } }

/* keyboard focus stays visible on the dark hero video */
.rrw:has(.dc-hero) .site-nav:not(.is-scrolled) a:focus-visible, .rrw .dc-hero a:focus-visible { outline-color: #fff; }

/* Start page: Ginbaren + Ölbaren blocks (Dennis 2026-11-10, proposal 16 + a small photo over the big one) */
.rrw .dc-bars { max-width: 1240px; margin: 0 auto; padding: clamp(48px, 7vw, 110px) clamp(20px, 4vw, 56px); display: grid; gap: clamp(64px, 8vw, 120px); }
.rrw .dc-bars-r { display: grid; grid-template-columns: 1fr 1.1fr; gap: clamp(32px, 6vw, 96px); align-items: center; }
.rrw .dc-bars-r.is-r { grid-template-columns: 1.1fr 1fr; }
.rrw .dc-bars-m { position: relative; padding: 0 16% 12% 0; }
.rrw .dc-bars-r.is-r .dc-bars-m { padding: 0 0 12% 16%; }
.rrw .dc-bars-big { aspect-ratio: 4 / 5; background-size: cover; background-position: center; }
.rrw .dc-bars-small { position: absolute; right: 0; bottom: 0; width: 42%; aspect-ratio: 4 / 5; background-size: cover; background-position: center; outline: 8px solid var(--dc-paper); }
.rrw .dc-bars-r.is-r .dc-bars-small { right: auto; left: 0; }
.rrw .dc-bars-t h2 { margin: 0 0 16px; text-wrap: balance; }
.rrw .dc-bars-t > p { margin: 0; max-width: 44ch; text-wrap: balance; }
.rrw .dc-bars-t .dc-actions { justify-content: flex-start; margin-top: 26px; }
.rrw .dc-bars-f { list-style: none; padding: 0; margin: 34px 0 0; display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--dc-ink); }
.rrw .dc-bars-f li { padding: 14px 10px 0 0; font-size: 13px; letter-spacing: .04em; }
.rrw .dc-bars-f li + li { padding-left: 14px; border-left: 1px solid var(--dc-rule); }
.rrw .dc-bars-f strong { display: block; font-family: var(--c-heading); font-weight: 400; font-size: 34px; line-height: 1; margin-bottom: 6px; }
@media (max-width: 860px) {
  .rrw .dc-bars-r, .rrw .dc-bars-r.is-r { grid-template-columns: 1fr; }
  .rrw .dc-bars-r.is-r .dc-bars-t { order: 2; }
}

/* Start page afterwork block: same sand as the menu block (Dennis 2026-11-10) */
.rrw .dc-split.is-sand { background: var(--dc-sand); color: var(--dc-ink); }
.rrw .dc-split.is-sand .eyebrow { color: var(--dc-olive); }
.rrw .dc-split.is-sand h2 { color: var(--dc-ink); }
.rrw .dc-split.is-sand h2 em { color: var(--dc-olive); }
.rrw .dc-split.is-sand .cbtn.gold { background: var(--dc-gold); border-color: var(--dc-gold); color: var(--dc-paper); }
.rrw .dc-split.is-sand .cbtn.gold:hover { background: var(--dc-ink); border-color: var(--dc-ink); color: var(--dc-paper); }

/* Footer as one block (Dennis 2026-11-10, proposal 4): logo + Boka bord in their own column on the left,
   the four info columns on the right, the fine print under a thin rule on the same green */
.rrw .rrw-up .ftr.dc-ftr { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: clamp(40px, 7vw, 120px); max-width: 1240px; margin: 0 auto; padding: clamp(56px, 7vw, 96px) clamp(20px, 5vw, 64px) 0; }
.rrw footer.site-footer { background: var(--dc-night); }
.rrw .dc-ftr-top { justify-items: start; text-align: left; align-content: start; gap: 22px; padding-bottom: 0; border-bottom: 0; }
.rrw .dc-ftr-cols { max-width: none; margin: 0; padding-top: 0; gap: 28px; }
.rrw .dc-ftr-cols > div, .rrw .rrw-up .ftr.dc-ftr .dc-fl { font-size: 17px; }
.rrw .rrw-up .ftr.dc-ftr .dc-lbl { font-size: 13px; }
.rrw .sub-footer { background: var(--dc-night); max-width: 1240px; margin: clamp(40px, 5vw, 64px) auto 0; padding: 18px clamp(20px, 5vw, 64px) 22px; border-top: 1px solid rgba(232,225,204,.22); }
@media (max-width: 860px) {
  .rrw .rrw-up .ftr.dc-ftr { grid-template-columns: 1fr; }
  .rrw .dc-ftr-top { justify-items: center; text-align: center; }
}

/* Afterwork page: hero photo in the video slot, a flipped split, closing note */
.rrw .dc-vhero-media img { display: block; width: 100%; height: 100%; object-fit: cover; }
.rrw .dc-split.is-flip .dc-split-photo { order: 2; }
.rrw .dc-split.is-sand .cbtn:not(.gold) { color: var(--dc-ink); border-color: var(--dc-ink); }
.rrw .dc-split-actions { justify-content: flex-start; }
.rrw .dc-welcome-p { max-width: 46ch; margin: 0 auto 8px; text-wrap: balance; }
@media (max-width: 860px) { .rrw .dc-split.is-flip .dc-split-photo { order: 0; } }

/* Start page afterwork block: centred and slimmer (Dennis 2026-11-10) */
.rrw .dc-split.is-slim { max-width: 1080px; margin: clamp(48px, 7vw, 96px) auto; grid-template-columns: 1fr 1fr; }
.rrw .dc-split.is-slim .dc-split-photo { min-height: clamp(260px, 28vw, 400px); }
.rrw .dc-split.is-slim .dc-split-in { text-align: center; justify-self: center; max-width: 520px; padding: clamp(32px, 4vw, 56px) clamp(20px, 3vw, 36px); }
.rrw .dc-split.is-slim .dc-split-in p { margin-left: auto; margin-right: auto; text-wrap: balance; }
.rrw .dc-split.is-slim .dc-split-actions { justify-content: center; }
@media (max-width: 860px) { .rrw .dc-split.is-slim { grid-template-columns: 1fr; margin: 0 20px 48px; } }

/* Kontakt hero: keep the banner (right side of the street photo) in view */
.rrw .dc-vhero-media.is-flag img { object-position: 78% center; }

/* Kontakt: the map is exactly as tall as the info list beside it (Dennis 2026-11-10) */
@media (min-width: 861px) {
  .rrw .dc-contact { align-items: stretch; }
  .rrw .dc-map { min-height: 0; height: 100%; }
}

/* Headings (Dennis 2026-11-10, option 9): no single coloured/italic word; text centred, and the small
   eyebrow above each heading sits between two thin rules, like a printed menu card */
.rrw h1 em, .rrw h2 em { font-style: normal !important; color: inherit !important; }
.rrw .dc-vhero-text, .rrw .dc-bars-t, .rrw .dc-split-in { text-align: center; }
.rrw .dc-vhero-text .dc-actions, .rrw .dc-bars-t .dc-actions, .rrw .dc-split-in .dc-actions { justify-content: center; }
.rrw .dc-vhero-text .lead, .rrw .dc-bars-t > p, .rrw .dc-split-in p:not(.eyebrow) { margin-left: auto !important; margin-right: auto !important; }
.rrw .dc-split-in { justify-self: center; }
.rrw main .eyebrow { display: flex; align-items: center; justify-content: center; gap: 14px; }
.rrw main .eyebrow::before, .rrw main .eyebrow::after { content: ""; width: 48px; height: 1px; background: currentColor; flex: none; }

/* Untappd beer list on Ölbaren, restyled as Domcraft's own menu (Dennis 2026-11-10).
   The list is still the customer's live Untappd embed; only its look is ours. */
.rrw #menu-container .ut-menu, .rrw #menu-container .menu-bg-color, .rrw #menu-container .item-bg-color,
.rrw #menu-container .section-header-bg-color, .rrw #menu-container .header-bg-color { background: transparent !important; }
.rrw #menu-container, .rrw #menu-container * { font-family: var(--c-body); color: var(--dc-ink) !important; }
.rrw #menu-container .menu-header, .rrw #menu-container .menu-info, .rrw #menu-container .pagination-container,
.rrw #menu-container .rating, .rrw #menu-container .container-list, .rrw #menu-container .dc-ut-empty, .rrw #menu-container .item-description, .rrw #menu-container .screenreader-only { display: none !important; }
.rrw #menu-container .ut-menu.dc-ut-one .section-heading { display: none !important; }
.rrw #menu-container .section-heading { padding: 0 !important; margin: 32px 0 4px; }
.rrw #menu-container .section-name { font-family: var(--c-heading); font-weight: 400; font-size: clamp(24px, 2.4vw, 32px); margin: 0; padding-bottom: 12px; border-bottom: 1px solid var(--dc-ink); }
.rrw #menu-container .menu-items-container, .rrw #menu-container .section-items-container { display: block; }
.rrw #menu-container :is(.menu-items-container, .section-items-container):has(> .menu-item) { display: grid; grid-template-columns: 1fr 1fr; column-gap: clamp(28px, 4vw, 56px); }
.rrw #menu-container .menu-item { width: auto !important; float: none !important; padding: 18px 0 !important; border-bottom: 1px solid var(--dc-rule); margin: 0 !important; }
.rrw #menu-container .item, .rrw #menu-container .item-details { width: auto !important; float: none !important; }
.rrw #menu-container .item { display: grid; grid-template-columns: 52px minmax(0, 1fr); gap: 16px; align-items: start; }
.rrw #menu-container .item-label { float: none !important; width: 52px; margin: 0 !important; }
.rrw #menu-container .item-label img { width: 52px; height: 52px; object-fit: cover; border-radius: 50%; display: block; }
.rrw #menu-container .item-details { margin: 0 !important; padding: 0 !important; }
.rrw #menu-container .item-name { margin: 0; font-size: 15px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; line-height: 1.35; }
.rrw #menu-container .item-name a { text-decoration: none; }
.rrw #menu-container .item-tap-number { font-family: var(--c-heading); font-weight: 400; letter-spacing: 0; color: var(--dc-olive) !important; margin-right: 6px; }
.rrw #menu-container .item-style { display: block; margin-top: 2px; font-size: 15px; font-style: italic; font-weight: 400; letter-spacing: 0; text-transform: none; }
.rrw #menu-container .item-meta { display: flex; flex-wrap: wrap; gap: 2px 14px; margin-top: 4px; font-size: 13px; letter-spacing: .04em; opacity: .8; }
.rrw #menu-container .item-meta > span:empty, .rrw #menu-container .item-meta > span:has(> .rating) { display: none; }
.rrw #menu-container .item-meta a { text-decoration: none; }
.rrw #menu-container .item-description { margin-top: 6px; font-size: 14px; }
.rrw #menu-container .item-description p { margin: 6px 0 0; font-size: 14px; line-height: 1.55; }
.rrw #menu-container .ut-more, .rrw #menu-container .ut-less { font-size: 12px; letter-spacing: .14em; text-transform: uppercase; text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 760px) { .rrw #menu-container :is(.menu-items-container, .section-items-container):has(> .menu-item) { grid-template-columns: 1fr; } }
.rrw #menu-container .item-meta span::before, .rrw #menu-container .item-meta span::after, .rrw #menu-container .brewery::before { content: none !important; }
.rrw #menu-container .item-tap-number, .rrw #menu-container .item-name a > span { display: inline !important; }
.rrw #menu-container .item-style, .rrw #menu-container .item-meta > span, .rrw #menu-container .brewery { margin-left: 0 !important; padding-left: 0 !important; }

/* Menu page: short general intro between the hero and the category bar */
.rrw .dc-menu-intro { padding-bottom: clamp(24px, 4vw, 48px); }
.rrw .dc-menu-intro p:not(.eyebrow) { max-width: 60ch; margin-left: auto; margin-right: auto; text-wrap: balance; }
.rrw .dc-menu-intro { padding-top: 8px; }
.rrw .dc-intro .eyebrow { margin-left: auto !important; margin-right: auto !important; max-width: none !important; }

/* Ölbaren: "På kranen just nu" heading and intro centred (Dennis 2026-11-10) */
.rrw #pa-kranen .dc-menu-sec > h2, .rrw #pa-kranen .dc-taps-intro { text-align: center; }
.rrw #pa-kranen .dc-taps-intro { margin-left: auto; margin-right: auto; }

/* Phones and tablets (Dennis 2026-11-10 mobile check): the fixed Meny/Boka bar must not cover the end of the
   footer, and footer links get finger-sized tap areas */
@media (max-width: 1060px) {
  .rrw .rrw-up .ftr.dc-ftr a.dc-fl { display: flex; align-items: center; justify-content: center; min-height: 44px; padding-block: 0; }
  .rrw .sub-footer .sub-link { display: inline-flex; align-items: center; min-height: 44px; }
}

/* Start page hero (Dennis 2026-11-10, placement 2): logo, text and buttons in the bottom-left corner,
   the video gets almost the whole frame; the shade follows the corner instead of the whole bottom edge */
.rrw .dc-hero { justify-content: flex-start; text-align: left; }
.rrw .dc-hero-in { justify-items: start; padding: 0 clamp(24px, 5vw, 72px) clamp(40px, 7vh, 72px); }
.rrw .dc-hero-logo img { width: clamp(130px, 14vw, 190px); }
.rrw .dc-hero-eb { padding-left: 0; }
.rrw .dc-hero .dc-actions { justify-content: flex-start; }
.rrw .dc-hero::after { background: linear-gradient(180deg, rgba(0,0,0,.5) 0, rgba(0,0,0,0) 18%), linear-gradient(35deg, rgba(0,0,0,.72) 0, rgba(0,0,0,0) 55%); }
@media (max-width: 480px) { .rrw .dc-hero-eb { font-size: 12px; letter-spacing: .18em; } }

/* Start page: short "about Domcraft" with the logo, under the hero (Dennis 2026-11-10) */
.rrw .dc-about { background: var(--dc-sand); text-align: center; padding: clamp(56px, 8vw, 104px) clamp(20px, 5vw, 64px); display: grid; justify-items: center; }
.rrw .dc-about-logo { display: block; width: clamp(110px, 11vw, 150px); height: auto; margin-bottom: 26px; }
.rrw .dc-about .eyebrow { margin: 0 0 16px; }
.rrw .dc-about h2 { margin: 0 0 20px; font-size: clamp(32px, 4vw, 52px); text-wrap: balance; }
.rrw .dc-about-p { max-width: 58ch; margin: 0 auto; font-size: 17px; line-height: 1.7; text-wrap: balance; }
.rrw .dc-about .dc-actions { margin-top: 30px; justify-content: center; }

/* Booking dialog: who can book (from the customer's own booking page) */
.dc-book-note { margin: 0; padding: 12px 20px; background: var(--dc-sand); color: var(--dc-ink); font-family: var(--c-body); font-size: 14px; line-height: 1.5; text-align: center; text-wrap: balance; }

/* Afterwork request form (sending wired by the developer, see dc-form.js) */
.rrw .dc-form-sec { background: var(--dc-sand); padding: clamp(56px, 8vw, 104px) clamp(16px, 5vw, 64px); scroll-margin-top: 72px; }
.rrw .dc-form-card { max-width: 760px; margin: 0 auto; }
.rrw .dc-form, .rrw .dc-form-thanks { text-align: center; }
.rrw .dc-form h2, .rrw .dc-form-thanks h2 { margin: 0 0 14px; font-size: clamp(30px, 3.6vw, 46px); text-wrap: balance; }
.rrw .dc-form-intro { max-width: 52ch; margin: 0 auto 30px; text-wrap: balance; }
.rrw .dc-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 16px 18px; text-align: left; }
.rrw .dc-field { display: grid; gap: 6px; }
.rrw .dc-field--wide { grid-column: 1 / -1; }
.rrw .dc-field > span { font-size: 13px; letter-spacing: .14em; text-transform: uppercase; }
.rrw .dc-field input, .rrw .dc-field select, .rrw .dc-field textarea {
  -webkit-appearance: none; appearance: none; width: 100%; min-height: 48px; padding: 12px 14px; border: 1px solid var(--dc-ink); border-radius: 0;
  background: var(--dc-paper); color: var(--dc-ink); font: inherit; font-size: 16px; box-sizing: border-box; }
.rrw .dc-field select { background-image: linear-gradient(45deg, transparent 50%, var(--dc-ink) 50%), linear-gradient(135deg, var(--dc-ink) 50%, transparent 50%); background-position: calc(100% - 20px) 21px, calc(100% - 15px) 21px; background-size: 5px 5px; background-repeat: no-repeat; padding-right: 40px; }
.rrw .dc-field input::-webkit-datetime-edit-fields-wrapper { padding: 0; }
.rrw .dc-field input::-webkit-date-and-time-value { text-align: left; }
.rrw .dc-field textarea { min-height: 120px; resize: vertical; }
.rrw .dc-form.is-tried :invalid { border-color: #9b2c2c; }
.rrw .dc-form-err { margin: 16px 0 0; color: #9b2c2c; text-wrap: balance; }
.rrw .dc-form .dc-actions { justify-content: center; margin-top: 24px; }
.rrw .dc-form-alt { margin: 18px 0 0; font-size: 14px; }
.rrw .dc-form-thanks:focus { outline: none; }
@media (max-width: 600px) { .rrw .dc-fields { grid-template-columns: 1fr; } }
/* Afterwork form: fewer than 10 people get a Boka bord box instead of the send button (as on BŒF) */
.rrw .dc-small-party-in { display: grid; justify-items: center; gap: 14px; padding: 20px 22px; background: var(--dc-night); color: var(--dc-paper); text-align: center; }
.rrw .dc-small-party-in[hidden] { display: none; }
.rrw .dc-small-party-in p { margin: 0; color: var(--dc-paper); font-size: 16px; line-height: 1.55; text-wrap: balance; }
.rrw .dc-small-party-in .cbtn.gold { background: var(--dc-paper); border-color: var(--dc-paper); color: var(--dc-olive); }
.rrw .dc-form [data-dc-send][hidden] { display: none; }
.rrw .dc-form-alt a { color: var(--dc-ink); text-decoration: underline; text-underline-offset: 3px; }
.rrw .dc-field input[type=number]::-webkit-inner-spin-button, .rrw .dc-field input[type=number]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
.rrw .dc-field input[type=number] { -moz-appearance: textfield; }
.rrw .dc-field input[type=date], .rrw .dc-field input[type=time] { -webkit-appearance: none; appearance: none; }

/* Start page hero: the bottom-left group is centred on itself, logo over the text and buttons (Dennis 2026-11-10) */
.rrw .dc-hero-in { justify-items: center; text-align: center; }
.rrw .dc-hero .dc-actions { justify-content: center; }
.rrw .dc-hero-eb { padding-left: .3em; }

/* No sticky Meny/Boka bord bar (Dennis 2026-11-10): Boka bord stays in the menu bar and on every page */
.rrw .dc-mbar { display: none !important; }

/* Cookie banner, balanced (Dennis 2026-11-10): centred text, the two choices equally wide side by side,
   Inställningar centred under them; no ring around the accept button. Still no blocker behind it. */
.rrw .rr-cookie { text-align: center; padding: 22px 24px 18px; }
.rrw .rr-cookie .rr-ck-title { margin-bottom: 8px; }
.rrw .rr-cookie [data-ck-view="main"] p { max-width: 52ch; margin-left: auto; margin-right: auto; }
.rrw .rr-cookie .rr-ck-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; max-width: 460px; margin: 16px auto 0; }
.rrw .rr-cookie .rr-ck-actions .cbtn { width: 100%; justify-content: center; box-shadow: none; outline: 0; }
.rrw .rr-cookie .rr-ck-actions .cbtn:focus-visible { outline: 2px solid var(--dc-olive); outline-offset: 3px; }
.rrw .rr-cookie .rr-ck-actions .rr-ck-link { grid-column: 1 / -1; justify-self: center; min-height: 44px; }
.rrw .rr-cookie .rr-ck-opt { text-align: left; }
@media (max-width: 480px) { .rrw .rr-cookie .rr-ck-actions { grid-template-columns: 1fr; } }

/* Hamburger panel on phones/tablets (Dennis 2026-11-10): logo centred at the top, the five pages share the whole
   height, language switch right above Boka bord at the bottom, and nothing scrolls (panel or page behind) */
@media (max-width: 1060px) {
  .rrw .site-nav-panel { position: fixed; inset: 0; height: 100vh; display: flex; flex-direction: column; overflow: hidden;
    padding: 0 20px calc(18px + env(safe-area-inset-bottom, 0px)); gap: 0; background: var(--dc-paper); }
  @supports (height: 100dvh) { .rrw .site-nav-panel { height: 100dvh; } }
  .rrw .site-nav-panel-top { flex: none; display: flex; align-items: center; justify-content: center; height: 76px; min-height: 0; padding: 0; border-bottom: 1px solid var(--dc-rule); }
  .rrw .site-nav-panel-logo { display: block; line-height: 0; }
  .rrw .site-nav-panel-logo img { height: 46px; width: auto; }
  .rrw .site-nav-burger[open] summary { top: 16px; right: 12px; }
  .rrw .site-nav-panel .site-nav-groups { flex: 1 1 auto; min-height: 0; display: flex; }
  .rrw .site-nav-panel .site-nav-group { flex: 1; display: flex; flex-direction: column; gap: 0; }
  .rrw .site-nav-panel a.site-nav-chip { flex: 1 1 0; height: auto; min-height: 0; border: 0; border-bottom: 1px solid var(--dc-rule); border-radius: 0;
    font-size: clamp(16px, 4.6vw, 20px); letter-spacing: .16em; opacity: 1 !important; }
  .rrw .site-nav-panel-lang { flex: none; display: flex; justify-content: center; padding: 16px 0 14px; }
  .rrw .site-nav-panel a.site-nav-cta { flex: none; width: 100%; height: 52px; }
  html:has(.site-nav-burger[open]), html:has(.site-nav-burger[open]) body { overflow: hidden; }
}
@media (max-width: 1060px) { .rrw .site-nav-panel { overscroll-behavior: contain; } }

/* Phones (Dennis 2026-11-10): start-page hero group centred; every row of buttons gets equally wide,
   equally tall buttons */
@media (max-width: 860px) {
  .rrw .dc-hero { justify-content: center; }
  .rrw .dc-hero-in { width: 100%; padding-left: 20px; padding-right: 20px; }
}
@media (max-width: 600px) {
  .rrw main .dc-actions { display: grid; grid-template-columns: repeat(auto-fit, minmax(0, 1fr)); gap: 10px; width: 100%; max-width: 400px; margin-left: auto; margin-right: auto; }
  .rrw main .dc-actions .cbtn { width: 100%; min-width: 0; min-height: 52px; padding: 14px 10px; justify-content: center; display: inline-flex; align-items: center; text-align: center; }
}
@media (max-width: 600px) {
  .rrw main .dc-actions { max-width: 330px; }
  .rrw .dc-split-in { padding-left: 20px !important; padding-right: 20px !important; }
}
@media (max-width: 600px) {
  .rrw .dc-hero .dc-actions { gap: 10px; }
  .rrw .dc-split.is-slim { margin-left: 0; margin-right: 0; }
}
@media (max-width: 600px) { .rrw main .dc-actions .cbtn { font-size: 12px; letter-spacing: .1em; white-space: nowrap; } }
@media (max-width: 600px) {
  .rrw main .dc-actions { grid-template-columns: 1fr; max-width: 320px; }
  .rrw main .dc-actions .cbtn { font-size: 13px; letter-spacing: .14em; }
}

/* Buttons (Dennis 2026-11-10): stacked vertically on phones and tablets, equal width side by side on desktop */
@media (max-width: 860px) {
  .rrw main .dc-actions { display: grid; grid-template-columns: 1fr; gap: 10px; width: 100%; max-width: 320px; margin-left: auto; margin-right: auto; }
  .rrw main .dc-actions .cbtn { width: 100%; min-width: 0; min-height: 52px; justify-content: center; display: inline-flex; align-items: center; text-align: center; }
}
@media (min-width: 861px) {
  .rrw main .dc-actions { display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; justify-content: center; gap: 12px; }
  .rrw main .dc-actions .cbtn { width: 100%; justify-content: center; display: inline-flex; align-items: center; white-space: nowrap; }
}
/* split blocks are only half the page wide, so they keep stacked buttons until there is room */
@media (min-width: 861px) and (max-width: 1060px) {
  .rrw main .dc-split-in .dc-actions { grid-auto-flow: row; grid-auto-columns: auto; max-width: 320px; margin-left: auto; margin-right: auto; }
}
/* Desktop: a button row is as wide as its widest button times the count, so every button in it is equally wide */
@media (min-width: 861px) {
  .rrw main .dc-actions { width: max-content; max-width: 100%; margin-left: auto; margin-right: auto; }
}
/* Half-width columns (hero text, split blocks, the gin/beer blocks): buttons sit side by side only when the column
   is wide enough for two equally wide buttons, otherwise they stay stacked (container query on the column) */
@media (min-width: 861px) {
  .rrw main :is(.dc-vhero-text, .dc-split-in, .dc-bars-t) { container-type: inline-size; width: 100%; }
  .rrw main :is(.dc-vhero-text, .dc-split-in, .dc-bars-t) .dc-actions { grid-auto-flow: row; grid-auto-columns: auto; grid-template-columns: 1fr; width: 100%; max-width: 320px; }
  @container (min-width: 560px) {
    .rrw main :is(.dc-vhero-text, .dc-split-in, .dc-bars-t) .dc-actions { grid-auto-flow: column; grid-auto-columns: 1fr; grid-template-columns: none; width: max-content; max-width: 100%; }
  }
}

/* Sub-page heroes on PHONES only (Dennis 2026-11-10, corrected: the layout change was meant for mobile):
   picture/video across the top, text and buttons centred underneath, all of it on the first screen.
   Desktop keeps text left and picture/video right. */
.rrw { --nav-h: 85px; }
@media (max-width: 1060px) { .rrw { --nav-h: 77px; } }
@media (max-width: 860px) {
  .rrw .dc-vhero { display: flex; flex-direction: column; align-items: stretch; height: calc(100vh - var(--nav-h)); min-height: 520px;
    gap: clamp(16px, 2.4vh, 28px); padding-top: 0; padding-bottom: clamp(20px, 3.2vh, 36px); box-sizing: border-box; }
  @supports (height: 100svh) { .rrw .dc-vhero { height: calc(100svh - var(--nav-h)); } }
  .rrw .dc-vhero-media { order: -1; flex: 1 1 auto; min-height: 140px; aspect-ratio: auto; max-height: none; width: auto; margin: 0 calc(-1 * clamp(20px, 5vw, 56px)); }
  .rrw .dc-vhero-media.is-flag img { object-position: center 38%; }
  .rrw .dc-vhero-text { flex: none; align-self: center; width: 100%; max-width: 700px; text-align: center; }
  .rrw .dc-vhero-text h1 { font-size: clamp(28px, min(8vw, 5.2vh), 44px); margin-bottom: 12px; }
  .rrw .dc-vhero-text .lead { font-size: clamp(15px, 1.9vh, 17px); }
  .rrw .dc-vhero-text .dc-actions { margin-top: clamp(14px, 2.4vh, 24px); }
  .rrw main .dc-vhero-text .dc-actions .cbtn { min-height: 48px; }
}

/* Phones/tablets (Dennis 2026-11-10): Boka bord sits in the top bar, just left of the hamburger */
.rrw .dc-nav-book { display: none; }
@media (max-width: 1060px) {
  .rrw .site-nav { display: flex; align-items: center; }
  .rrw .site-nav .site-nav-brand { margin-right: auto; }
  .rrw .dc-nav-book { display: inline-flex; align-items: center; justify-content: center; height: 40px; padding: 0 16px; margin-right: 6px;
    background: var(--dc-gold); color: var(--dc-paper); font-family: var(--c-body); font-size: 12px; font-weight: 600; letter-spacing: .14em;
    text-transform: uppercase; text-decoration: none; white-space: nowrap; }
  .rrw .dc-nav-book:hover { background: var(--dc-ink); color: var(--dc-paper); }
}
@media (max-width: 1060px) { .rrw .site-nav a.dc-nav-book, .rrw:has(.dc-hero) .site-nav a.dc-nav-book { color: var(--dc-paper); text-shadow: none; } .rrw .site-nav a.dc-nav-book:hover { color: var(--dc-paper); } }
@media (max-width: 1060px) { .rrw .site-nav { column-gap: 4px; } .rrw .dc-nav-book { margin-right: 0; } }