/* lavet af kabbah · kabbah.dk */
@font-face{font-family:"Bowlby One";src:url(fonts/bowlby-one-latin-400-normal.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"DM Sans";src:url(fonts/dm-sans-latin-400-normal.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"DM Sans";src:url(fonts/dm-sans-latin-500-normal.woff2) format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"DM Sans";src:url(fonts/dm-sans-latin-700-normal.woff2) format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:"Caveat";src:url(fonts/caveat-latin-700-normal.woff2) format("woff2");font-weight:700;font-display:swap}

:root{
  --sort:#121110;--sort-2:#1d1a17;--blaek:#0E0E0E;--papir:#FFF6E6;--papir-2:#F3E6CC;
  --guld:#FFC87E;--groen:#00BF63;--lys-tekst:#e9dfcf;--daemp:#b9ad99;
  --vis:"Bowlby One",Impact,sans-serif;--haand:"Caveat",cursive;
  --skygge:6px 6px 0;--bredde:1240px
}
*{box-sizing:border-box;margin:0}
html{scroll-behavior:smooth;scroll-padding-top:84px}
body{font-family:"DM Sans",system-ui,sans-serif;font-size:17px;line-height:1.55;background:var(--sort);color:var(--papir);-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
:focus-visible{outline:3px solid var(--guld);outline-offset:3px}
.ind{max-width:var(--bredde);margin:0 auto;padding:0 24px}
.vis{font-family:var(--vis);font-weight:400;text-transform:uppercase;line-height:1;letter-spacing:.005em}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.spring{position:absolute;left:12px;top:-60px;background:var(--papir);color:var(--blaek);padding:10px 14px;z-index:50;font-weight:700}
.spring:focus{top:12px}


.top{position:sticky;top:0;z-index:40;background:rgba(18,17,16,.94);backdrop-filter:blur(8px);border-bottom:1px solid #2a2622}
.top .ind{display:flex;align-items:center;justify-content:space-between;gap:20px;height:72px}
.top .logo img{height:42px;width:auto}
.top nav{display:flex;gap:24px;font-weight:500;font-size:15px}
.top nav a{text-decoration:none;color:var(--lys-tekst);padding:6px 0;border-bottom:2px solid transparent;transition:color .15s,border-color .15s}
.top nav a:hover{color:var(--guld);border-color:var(--guld)}
.ring-top{display:inline-flex;align-items:center;min-height:44px;padding:10px 16px;background:var(--papir);color:var(--blaek);font-weight:700;text-decoration:none;border:2px solid var(--papir);white-space:nowrap}
.top .logo{display:flex;align-items:center;min-height:44px}
.menu-knap{display:none}
@media (max-width:900px){
  .top .ind{gap:10px}
  .top .logo{margin-right:auto}
  .top .logo img{height:32px}
  .ring-top{padding:8px 12px;font-size:15px}
  .menu-knap{display:inline-flex;align-items:center;min-height:44px;padding:8px 12px;background:transparent;color:var(--papir);border:2px solid var(--papir);font:700 15px/1 "DM Sans",sans-serif;cursor:pointer}
  .top nav{display:none;position:absolute;left:0;right:0;top:72px;flex-direction:column;gap:0;background:var(--sort);border-bottom:3px solid var(--blaek);box-shadow:0 12px 24px rgba(0,0,0,.5)}
  .top nav.aaben{display:flex}
  .top nav a{padding:16px 24px;border-bottom:1px solid #2a2622;font-size:18px}
}
@media (max-width:380px){.ring-top{font-size:0;padding:8px 12px}.ring-top::after{content:"Ring";font-size:15px}}


.knapper{display:flex;flex-wrap:wrap;gap:12px}
.k{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:14px 22px;font-weight:700;text-decoration:none;border:3px solid currentColor;transition:transform .15s,box-shadow .15s;cursor:pointer;font-size:17px;font-family:inherit}
.k-fuld{background:var(--papir);color:var(--blaek);border-color:var(--papir);box-shadow:5px 5px 0 var(--guld)}
.k-fuld:hover{transform:translate(-2px,-2px);box-shadow:7px 7px 0 var(--guld)}
.k-kant{background:transparent;color:var(--papir)}
.k-kant:hover{transform:translate(-2px,-2px);box-shadow:5px 5px 0 var(--papir)}
.status{display:inline-flex;align-items:center;gap:10px;background:var(--papir);color:var(--blaek);padding:8px 14px;font-weight:700;font-size:15px;transform:rotate(-1.5deg)}
.status::before{content:"";width:10px;height:10px;border-radius:50%;background:var(--groen);box-shadow:0 0 0 4px rgba(0,191,99,.3)}
.status.er-maaske::before{background:var(--guld);box-shadow:0 0 0 4px rgba(255,200,126,.3)}
.status.er-lukket::before{background:#e5534b;box-shadow:0 0 0 4px rgba(229,83,75,.3)}
.tape{position:absolute;width:86px;height:26px;background:rgba(255,246,230,.55);top:-14px;left:50%;transform:translateX(-50%) rotate(-4deg)}
.seddel{position:relative;background:var(--papir);color:var(--blaek);border:3px solid var(--blaek);padding:16px 18px;box-shadow:var(--skygge) var(--guld)}
.lille-titel{display:block;font-weight:700;font-size:13px;letter-spacing:.08em;text-transform:uppercase}


.sek{padding:100px 0;border-bottom:1px solid #2a2622}
.sek h2{font-size:clamp(40px,6vw,78px);margin-bottom:14px}
.sek .under{color:var(--lys-tekst);font-size:19px;max-width:48ch;margin-bottom:48px}
@media (max-width:760px){.sek{padding:64px 0}}


.hero .ind{display:grid;grid-template-columns:1.05fr .95fr;gap:32px;align-items:center;padding-top:56px;padding-bottom:96px}
.hero h1{font-size:clamp(52px,8.6vw,124px);margin:22px 0 22px;line-height:1.02}
.hero h1 span{display:block}
.hero h1 .blok{display:inline-block;background:var(--papir);color:var(--blaek);padding:.16em .18em .02em;margin-top:.22em;transform:rotate(-1.5deg);box-shadow:8px 8px 0 var(--guld);font-size:.8em;white-space:nowrap}
.hero .lede{font-size:clamp(18px,2vw,21px);max-width:32ch;font-weight:500;color:var(--lys-tekst);margin-bottom:28px}
.hero .ugler{position:relative}
.naeste{position:absolute;right:-6px;bottom:-78px;transform:rotate(3deg);max-width:310px}
.naeste b{font-family:var(--vis);font-weight:400;font-size:22px;line-height:1.05;display:block;margin:4px 0}
.naeste a{font-weight:700;font-size:15px;display:inline-flex;align-items:center;min-height:44px}
@media (max-width:900px){
  .hero .ind{grid-template-columns:1fr;padding-top:32px;padding-bottom:88px}
  .hero .ugler{max-width:420px;margin:8px auto 0;width:100%}
  .naeste{position:relative;right:auto;bottom:auto;margin:-28px 0 0 auto;width:fit-content}
}
@media (max-width:420px){.hero h1 .blok{font-size:.74em}}


.vaeg{background:var(--sort-2);background-image:repeating-linear-gradient(90deg,rgba(255,246,230,.04) 0 2px,transparent 2px 120px)}
.vaeg h2{text-shadow:4px 4px 0 #000}
.plakater{display:grid;grid-template-columns:1.25fr 1fr 1fr;gap:34px;align-items:start}
.plakat{position:relative;border:3px solid var(--blaek);box-shadow:8px 8px 0 #000;background:var(--papir);color:var(--blaek);padding:26px 24px 24px}
.p-event{transform:rotate(-2deg);padding:0}
.p-event .tekst{padding:20px 22px 22px}
.plakat .p-billede{height:420px;object-position:50% 86%}
.p-rytme{transform:rotate(1.5deg);margin-top:40px;background:var(--guld)}
.p-foto{transform:rotate(-1deg);margin-top:12px;padding:0}
.plakat .dag{font-weight:700;letter-spacing:.08em;text-transform:uppercase;font-size:14px}
.plakat .dato{font-family:var(--vis);font-size:clamp(54px,6vw,84px);line-height:.9}
.plakat h3{font-family:var(--vis);font-weight:400;font-size:28px;line-height:1.02;margin:16px 0 10px;text-transform:uppercase}
.plakat p{font-size:15px}
.plakat .fb{display:inline-flex;align-items:flex-end;min-height:44px;margin-top:10px;font-weight:700;border-bottom:3px solid currentColor;text-decoration:none;padding-bottom:2px}
.plakat img{width:100%;height:280px;object-fit:cover;border-bottom:3px solid var(--blaek)}
.plakat .tekst{padding:18px 20px 22px}
.stort-tal{font-family:var(--vis);font-size:96px;line-height:.8}
@media (max-width:900px){.plakater{grid-template-columns:1fr;gap:40px}.p-rytme,.p-foto{margin-top:0}}


.program{margin-top:64px;max-width:820px;background:var(--papir);color:var(--blaek);border:3px solid var(--blaek);box-shadow:8px 8px 0 var(--guld);padding:24px 26px 14px;transform:rotate(-.6deg)}
.program h3{font-size:30px;margin-bottom:8px}
.program ul{list-style:none;padding:0}
.program li{display:grid;grid-template-columns:7.5em 1fr auto;gap:14px;padding:12px 0;border-bottom:2px dotted rgba(14,14,14,.25);align-items:baseline}
.program li:last-child{border-bottom:0}
.p-dato{font-family:var(--vis);font-size:18px;text-transform:uppercase}
.p-titel{font-weight:500}
.p-kl{font-weight:700;white-space:nowrap}
@media (max-width:560px){.program li{grid-template-columns:1fr auto;gap:2px 12px}.p-dato{grid-column:1/-1}}


.om .ind{display:grid;grid-template-columns:.9fr 1.1fr;gap:56px;align-items:center}
.uglebillede{position:relative;max-width:440px;justify-self:center;width:100%}
.uglebillede button{all:unset;cursor:pointer;display:block;position:relative}
.uglebillede button:focus-visible{outline:3px solid var(--guld);outline-offset:6px}
.uglebillede img{transition:transform .25s cubic-bezier(.2,.8,.2,1)}
.uglebillede button:hover img{transform:rotate(-2deg) scale(1.02)}
.pil{position:absolute;right:-8%;top:6%;font-family:var(--haand);font-size:clamp(26px,3vw,34px);line-height:1.05;color:var(--papir);transform:rotate(6deg);max-width:220px;transition:opacity .25s,transform .25s}
.pil svg{display:block;width:90px;height:auto;margin:6px 0 0 -30px;color:var(--papir)}
.uglebillede:not(.vist-seddel) .pil{opacity:.0;transform:rotate(6deg) translateY(8px)}
.uglebillede .tryk{position:absolute;left:50%;bottom:-8px;transform:translateX(-50%);font-weight:700;font-size:14px;background:var(--papir);color:var(--blaek);padding:6px 12px;white-space:nowrap}
.uglebillede.vist-seddel .tryk{opacity:0}
.om-tekst p{font-size:19px;color:var(--lys-tekst);max-width:46ch;margin-bottom:16px}
.om-tekst p strong{color:var(--papir)}
.om-tekst p.diskret{font-size:16px;color:var(--daemp);font-style:italic}
.fakta{margin-top:28px;border-left:4px solid var(--guld);padding:6px 0 6px 18px;color:var(--daemp);font-size:16px;max-width:52ch}
@media (max-width:900px){.om .ind{grid-template-columns:1fr;gap:40px}.uglebillede{max-width:260px;margin-right:auto;margin-left:0}.pil{right:-34%;max-width:150px}}
@media (max-width:420px){.uglebillede{max-width:220px}.pil{right:-42%;font-size:24px}}
@media (hover:none){.uglebillede .pil{opacity:1;transform:rotate(6deg)}.uglebillede .tryk{display:none}}


.stemning,.om{overflow-x:clip}
.strimmel{display:flex;gap:28px;overflow-x:auto;scroll-snap-type:x mandatory;padding:20px 24px 40px;margin:0 auto;max-width:calc(var(--bredde) + 48px);scrollbar-width:thin;scrollbar-color:#3a352f transparent}
.polaroid{flex:0 0 auto;width:min(300px,74vw);scroll-snap-align:center;background:var(--papir);color:var(--blaek);padding:12px 12px 14px;box-shadow:8px 8px 0 #000}
.polaroid:nth-child(odd){transform:rotate(-2deg)}.polaroid:nth-child(even){transform:rotate(2deg)}
.polaroid img,.polaroid .polaroid figcaption{font-family:var(--haand);font-size:26px;line-height:1.1;margin-top:10px}


.udvalg{background:var(--papir);color:var(--blaek)}
.udvalg .ind{display:grid;grid-template-columns:1.2fr .8fr;gap:56px;align-items:start}
.udvalg h2{text-shadow:4px 4px 0 var(--guld)}
.udvalg .under{color:#4a4238}
.grupper{display:grid;grid-template-columns:1fr 1fr;gap:34px 44px}
.gruppe h3{font-family:var(--vis);font-weight:400;font-size:24px;text-transform:uppercase;margin-bottom:8px}
.gruppe ul{list-style:none;padding:0}
.gruppe li{padding:8px 0;border-bottom:2px dotted rgba(14,14,14,.25)}
.gruppe li.mere{color:#6b6052;border-bottom:0;font-style:italic}
.udvalg .seddel{transform:rotate(2.5deg);margin-top:30px;box-shadow:var(--skygge) var(--blaek)}
.udvalg .seddel p{font-family:var(--haand);font-size:30px;line-height:1.1}
.udvalg .foto{border:3px solid var(--blaek);box-shadow:8px 8px 0 var(--blaek);transform:rotate(-1.5deg)}
.udvalg .foto img{width:100%;height:420px;object-fit:cover}
@media (max-width:900px){.udvalg .ind{grid-template-columns:1fr;gap:40px}.grupper{grid-template-columns:1fr 1fr;gap:24px}.udvalg .foto img{height:300px}}
@media (max-width:480px){.grupper{grid-template-columns:1fr}}


.gaester .ind{display:block}
.karakter{font-family:var(--vis);font-size:clamp(110px,16vw,200px);line-height:.85;color:var(--guld);text-shadow:6px 6px 0 #000}
.karakter small{display:block;font-family:"DM Sans",sans-serif;font-size:19px;font-weight:500;color:var(--lys-tekst);text-shadow:none;text-transform:none;margin-top:14px;line-height:1.4}


.faq .ind{max-width:880px}
.faq details{border-bottom:2px solid #2a2622}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:22px 0;font-weight:700;font-size:20px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-family:var(--vis);font-size:30px;color:var(--guld);transition:transform .2s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{padding:0 0 22px;color:var(--lys-tekst);max-width:60ch}


.find .ind{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:start}
.skilt{background:var(--papir);color:var(--blaek);border:3px solid var(--blaek);box-shadow:8px 8px 0 var(--guld);padding:26px 26px 22px;transform:rotate(-1deg)}
.skilt h3{font-family:var(--vis);font-weight:400;font-size:30px;text-transform:uppercase;margin-bottom:12px}
.skilt table{width:100%;border-collapse:collapse;font-size:18px}
.skilt td{padding:12px 0;border-bottom:2px dotted rgba(14,14,14,.25)}
.skilt td:last-child{text-align:right;font-weight:700}
.skilt tr.i-dag td{font-weight:700}
.skilt tr.i-dag td:first-child::after{content:"  I dag";font-size:12px;letter-spacing:.06em;text-transform:uppercase;background:var(--blaek);color:var(--papir);padding:3px 6px;margin-left:8px;vertical-align:2px}
.adresse{font-size:19px;color:var(--lys-tekst);margin:8px 0 26px}
.adresse a{color:var(--papir)}
@media (max-width:900px){.find .ind{grid-template-columns:1fr;gap:40px}}


.fod{padding:56px 0 110px;color:var(--daemp);font-size:15px}
.fod .ind{display:grid;grid-template-columns:1fr auto;gap:28px;align-items:end}
.fod img{height:46px;width:auto;margin-bottom:16px}
.fod a{color:var(--lys-tekst)}
.fod p+p{margin-top:6px}
.flowadmin{display:inline-flex;align-items:center;gap:14px;margin-top:16px;text-decoration:none;color:var(--daemp)}
.flowadmin img{height:28px;width:auto;margin:0}
.flowadmin:hover span{color:var(--papir)}
@media (max-width:560px){.flowadmin{flex-direction:column;align-items:flex-start;gap:8px}}
.stempel{display:block;width:120px;aspect-ratio:557.6/278;background:var(--daemp);transform:rotate(-5deg);-webkit-mask:url(img/lavet-af-kabbah.svg) center/contain no-repeat;mask:url(img/lavet-af-kabbah.svg) center/contain no-repeat;transition:background .15s}
.stempel:hover{background:var(--papir)}
@media (max-width:700px){.fod .ind{grid-template-columns:1fr}}


.mobil-bar{display:none}
@media (max-width:900px){
  .mobil-bar{display:grid;grid-template-columns:1fr 1fr;position:fixed;left:0;right:0;bottom:0;z-index:45;border-top:3px solid var(--blaek)}
  .mobil-bar a{display:flex;align-items:center;justify-content:center;min-height:56px;font-weight:700;text-decoration:none}
  .mobil-bar a:first-child{background:var(--papir);color:var(--blaek)}
  .mobil-bar a:last-child{background:var(--sort);color:var(--papir)}
}


.js .glid{opacity:0;translate:0 40px;transition:opacity .5s ease,translate .5s cubic-bezier(.2,.8,.2,1)}
.js .glid.vist{opacity:1;translate:0 0}
.plakater .p-rytme{transition-delay:.08s}.plakater .p-foto{transition-delay:.16s}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .js .glid{opacity:1;translate:none;transition:none}
  .k,.uglebillede img,.pil{transition:none}
}