/* Sabai Takeaway — fælles stil for alle sider. Magenta plakat, lime accent, skarpe hjørner. */
:root{--m:#C2185B;--l:#C8E64C;--h:#FFFFFF;--maal:1200px}
*{box-sizing:border-box;margin:0;padding:0}
html{scrollbar-color:var(--l) var(--m);accent-color:var(--l)}
body{background:var(--m);color:var(--h);font-family:Archivo,"Helvetica Neue",Arial,sans-serif;font-size:18px;line-height:1.5;font-weight:400;overflow-x:hidden}
::selection{background:var(--l);color:var(--m)}
:focus-visible{outline:4px solid var(--h);outline-offset:4px}
a{color:inherit;text-decoration-thickness:2px;text-underline-offset:4px}
img{display:block;max-width:100%;height:auto}
.stor{font-family:Unbounded,Archivo,sans-serif;font-weight:800;line-height:1;text-wrap:balance}
.rum{max-width:var(--maal);margin-inline:auto;padding-inline:16px}
p,li,dd,dt{max-width:64ch}

/* bånd */
.baand{background:var(--h);color:var(--m);padding:8px 16px;font-size:15px;text-align:center}
.baand p{max-width:none}

/* top */
.top{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px;padding-block:16px}
.top .navn{font-size:24px;color:var(--l);letter-spacing:.02em;text-decoration:none}
.top .kontakt{display:flex;flex-wrap:wrap;align-items:center;gap:16px}
.top .tlf{font-weight:600;font-size:18px;white-space:nowrap}

/* knap: én farve på hele siden */
.knap{display:inline-flex;align-items:center;justify-content:center;min-height:56px;padding:12px 24px;background:var(--l);color:var(--m);font-family:Unbounded,Archivo,sans-serif;font-weight:800;font-size:20px;line-height:1;text-decoration:none;border:0;white-space:nowrap}
.knap:hover{background:var(--h)}

/* hero */
.hero{padding-block:32px 80px}
.hero h1{font-size:18px;font-weight:600;margin-bottom:8px}
.kaempe{font-size:clamp(76px,20.4vw,296px);color:var(--l);letter-spacing:-.02em;line-height:.92;margin-left:-.04em;overflow-wrap:normal}
.hero .delt{display:grid;grid-template-columns:1fr 1fr;gap:32px;align-items:center;margin-top:32px}
.tre{font-size:clamp(28px,3.4vw,48px);line-height:1.1;margin-bottom:32px;max-width:none}
.nummer{font-size:clamp(32px,4vw,56px);color:var(--h);text-decoration:none;display:block;margin-bottom:8px;letter-spacing:-.01em}
.hero .lille{font-size:16px;margin-bottom:24px}
.ramme{background:var(--h);padding:16px}
.ramme img{width:100%;aspect-ratio:3/2;object-fit:cover;background:var(--m)}
.ramme.kvad img{aspect-ratio:1/1}

/* menu */
.menu{padding-block:80px}
.menu h2{font-size:clamp(40px,6vw,80px);margin-bottom:8px}
.menu .intro{margin-bottom:48px}
.retter{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.ret{background:var(--l);color:var(--m);display:flex;flex-direction:column}
.ret .ramme{padding:8px}
.ret .tekst{padding:16px 16px 24px;display:flex;flex-direction:column;gap:16px;flex:1}
.ret h3{font-size:28px;line-height:1.05}
.ret .pris{font-family:Unbounded,Archivo,sans-serif;font-weight:800;font-size:40px;line-height:1;margin-top:auto}
.menu .bestil{margin-top:48px;display:flex;flex-wrap:wrap;gap:16px;align-items:center}
.koekken h2{font-size:clamp(32px,4.4vw,56px);margin-bottom:32px}
.to-bred{display:grid;grid-template-columns:1fr 1fr;gap:32px}
.to-bred figure{margin:0}
.to-bred .ramme img{aspect-ratio:3/2;object-fit:cover}
.to-bred figcaption{margin-top:16px;max-width:38ch}

/* bånd der ruller (den eneste bevægelse) */
.rulle{border-block:4px solid var(--l);overflow:hidden;padding-block:16px}
.rulle .spor{display:flex;width:max-content;animation:rul 60s linear infinite}
.rulle span{font-family:Unbounded,Archivo,sans-serif;font-weight:800;font-size:clamp(28px,4vw,56px);line-height:1;white-space:nowrap;padding-right:.6em;color:var(--l)}
@keyframes rul{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.rulle .spor{animation:none}}

/* anmeldelser */
.ord{padding-block:80px}
.ord h2{font-size:clamp(40px,6vw,80px);margin-bottom:32px}
.plads{border:4px solid var(--l);padding:48px 24px;min-height:200px;display:flex;align-items:center}
.plads p{font-size:clamp(20px,2.4vw,28px);font-weight:600;max-width:none}

/* tider og adresse */
.find{padding-block:80px}
.find .to{display:grid;grid-template-columns:1fr 1fr;gap:48px}
.find h2{font-size:clamp(40px,6vw,80px);margin-bottom:32px;grid-column:1/-1}
.find h3{font-size:28px;margin-bottom:16px}
.tider{list-style:none;border-top:2px solid var(--h)}
.tider li{display:flex;justify-content:space-between;gap:16px;padding-block:8px;border-bottom:2px solid var(--h);max-width:none}
.tider b{font-weight:600}
address{font-style:normal}
address p{margin-bottom:24px}

/* fod */
.fod{padding-block:48px;font-size:16px}
hr{border:0;height:4px;background:var(--l)}
.fod .rum{display:flex;flex-wrap:wrap;justify-content:space-between;gap:24px 48px}
.fod p{max-width:none}

@media (max-width:900px){
  .hero .delt,.find .to{grid-template-columns:1fr}
  .retter{grid-template-columns:1fr 1fr}
  .to-bred{grid-template-columns:1fr;gap:24px}
}
@media (max-width:600px){
  .hero{padding-block:24px 48px}
  .menu,.ord,.find{padding-block:48px}
  .retter{grid-template-columns:1fr 1fr;gap:12px}
  .ret .tekst{padding:12px 12px 16px;gap:8px}
  .ret h3{font-size:20px}
  .ret .pris{font-size:26px}
  .top .navn{font-size:20px}
  .top .kontakt{width:100%}
  .knap{width:100%}
  .rulle{padding-block:8px}
}

/* ---- faelles chrome paa alle sider ---- */
.spring{position:fixed;top:-120px;left:0;z-index:20;background:var(--l);color:var(--m);padding:16px 24px;min-height:48px;display:inline-flex;align-items:center;font-weight:600;text-decoration:none;transition:top .16s ease-out}
.spring:focus,.spring:focus-visible{top:0}
@media (prefers-reduced-motion:reduce){.spring{transition:none}}

/* navigation: hvid blok paa den side man staar paa, limestreger over og under */
.sider{border-block:4px solid var(--l)}
.sider ul{list-style:none;display:flex;flex-wrap:wrap;gap:0}
.sider li{max-width:none}
.sider a{display:inline-flex;align-items:center;min-height:48px;padding:8px 16px;text-decoration:none;font-weight:600;font-size:16px;letter-spacing:.02em}
.sider a:hover{text-decoration:underline;text-underline-offset:6px}
.sider a[aria-current="page"]{background:var(--h);color:var(--m)}

/* sidehoved paa undersider */
.sidetop{padding-block:40px 32px}
.sidetop h1{font-family:Unbounded,Archivo,sans-serif;font-weight:800;font-size:clamp(44px,11vw,120px);line-height:.95;letter-spacing:-.02em;color:var(--l);text-wrap:balance;margin-left:-.03em}
.sidetop p{font-size:clamp(19px,2.2vw,24px);font-weight:600;margin-top:24px;max-width:40ch}

/* trin som fede lime-blokke */
.blokke{list-style:none;display:grid;gap:16px;counter-reset:t}
@media (min-width:900px){.blokke{grid-template-columns:repeat(3,1fr);gap:24px}}
.blokke li{counter-increment:t;border:4px solid var(--l);padding:24px;max-width:none}
.blokke li::before{content:counter(t);display:block;font-family:Unbounded,Archivo,sans-serif;font-weight:800;font-size:48px;line-height:1;color:var(--l)}
.blokke h3{font-family:Unbounded,Archivo,sans-serif;font-weight:800;font-size:22px;line-height:1.1;margin:16px 0 8px;color:var(--l)}
.blokke p{max-width:none}

/* mellemoverskrift i en almindelig sektion */
.afsnit{padding-block:48px}
@media (min-width:900px){.afsnit{padding-block:80px}}
.afsnit h2{font-family:Unbounded,Archivo,sans-serif;font-weight:800;font-size:clamp(36px,5vw,64px);line-height:1;margin-bottom:32px}

/* spoergsmaal og svar */
.qa{padding-block:48px}
@media (min-width:900px){.qa{padding-block:80px}}
.qa h2{font-family:Unbounded,Archivo,sans-serif;font-weight:800;font-size:clamp(36px,5vw,64px);line-height:1;margin-bottom:32px}
.qa dl{border-top:2px solid var(--h);max-width:70ch}
.qa dt{font-weight:600;font-size:20px;padding-top:24px;max-width:none}
.qa dd{padding-bottom:24px;border-bottom:2px solid var(--h);margin-top:8px;max-width:none}

/* videre nederst */
.videre{padding-block:48px}
@media (min-width:900px){.videre{padding-block:80px}}
.videre h2{font-family:Unbounded,Archivo,sans-serif;font-weight:800;font-size:clamp(32px,4vw,56px);line-height:1;margin-bottom:24px}
.videre ul{list-style:none;display:grid;gap:16px}
@media (min-width:900px){.videre ul{grid-template-columns:1fr 1fr;gap:24px}}
.videre li{max-width:none}
.videre a{display:block;border:4px solid var(--l);padding:24px;text-decoration:none}
.videre a:hover b{text-decoration:underline;text-underline-offset:6px}
.videre b{display:block;font-family:Unbounded,Archivo,sans-serif;font-weight:800;font-size:28px;line-height:1.05;color:var(--l)}
.videre span{display:block;margin-top:8px;font-size:16px}

/* et bredt foto i hvid ramme */
.bredramme{background:var(--h);padding:16px}
.bredramme img{width:100%;aspect-ratio:3/2;object-fit:cover;background:var(--m)}