:root{
  --red:#c80f12;
  --red-dark:#920b0e;
  --red-soft:#e13b39;
  --black:#171513;
  --cream:#f8f2ea;
  --beige:#f2ebe2;
  --white:#ffffff;
  --text:#2a2522;
  --muted:#6f6761;
  --shadow:0 12px 35px rgba(26,18,14,.12);
  --radius:24px;
  --radius-sm:16px;
  --container:1240px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:Arial, Helvetica, sans-serif;
  color:var(--text);
  background:linear-gradient(180deg,#faf7f2 0%,#fff 28%,#faf6f0 100%);
  line-height:1.55;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
p,h1,h2,h3{margin:0 0 .8rem}
ul{padding:0;margin:0;list-style:none}
.container{width:min(var(--container), calc(100% - 32px)); margin:0 auto}
.section{padding:30px 0}
.skip-link{
  position:absolute; left:-9999px; top:10px; background:#000; color:#fff; padding:10px 14px; z-index:9999;
}
.skip-link:focus{left:10px}

.site-header{
  position:sticky; top:0; z-index:50;
  background:rgba(255,255,255,.94);
  backdrop-filter:blur(10px);
  box-shadow:0 4px 24px rgba(0,0,0,.05);
}
.header-inner{
  min-height:96px; display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:18px;
}
.logo{display:flex; align-items:center; gap:10px}
.logo-wordmark{display:inline-flex; align-items:flex-start}
.logo-stack{display:flex; flex-direction:column; align-items:flex-start; line-height:1}
.logo-small{display:block; font-family:Georgia, "Times New Roman", serif; font-weight:700; font-size:1.25rem; color:#111; line-height:1; margin-left:12px; letter-spacing:.02em}
.logo-big{display:block; font-family:Georgia, "Times New Roman", serif; font-size:4.2rem; font-weight:900; color:var(--red); letter-spacing:-0.04em; line-height:.9; text-shadow:2px 2px 0 #ffffff, 4px 4px 0 rgba(0,0,0,.85);}

.main-nav{display:flex; justify-content:center; gap:10px; flex-wrap:wrap}
.main-nav a{
  padding:10px 16px; font-weight:700; border-radius:999px; position:relative;
}
.main-nav a.active,
.main-nav a:hover{color:var(--red)}
.main-nav a.active::after,
.main-nav a:hover::after{
  content:""; position:absolute; left:18px; right:18px; bottom:4px; height:3px; background:var(--red); border-radius:999px;
}
.header-actions{display:flex; align-items:center; gap:12px}
.phone-button,.order-button{
  border-radius:16px; padding:14px 18px; font-weight:800; color:#fff; white-space:nowrap; box-shadow:var(--shadow);
}
.phone-button{background:linear-gradient(180deg,var(--red-soft),var(--red-dark))}
.order-button{background:#111}
.menu-toggle{display:none; border:0; background:none; padding:8px 0; align-items:center; gap:12px; cursor:pointer}
.menu-toggle span{display:block; width:26px; height:3px; border-radius:999px; background:#111; margin:4px 0}
.menu-toggle .menu-toggle-text{width:auto; height:auto; background:none; margin:0; font-weight:700}

.hero{padding:26px 0 10px}
.hero-inner{
  display:grid; grid-template-columns:1.05fr .95fr; align-items:stretch; overflow:hidden; border-radius:36px; background:linear-gradient(90deg, rgba(251,243,233,1) 0%, rgba(250,241,230,1) 50%, rgba(255,255,255,1) 50%); box-shadow:var(--shadow);
}
.hero-copy{position:relative; padding:62px 56px; min-height:420px; display:flex; flex-direction:column; justify-content:center}
.watermark{position:absolute; right:40px; top:26px; width:170px; opacity:.1; pointer-events:none}
.eyebrow{font-family:"Brush Script MT", "Segoe Script", cursive; color:var(--red); font-size:2.2rem; margin-bottom:.2rem}
.hero h1{
  font-family:Georgia, "Times New Roman", serif; font-size:4.6rem; line-height:.95; color:#111; letter-spacing:-.03em; max-width:560px;
}
.lead{font-size:1.55rem; color:#2c2621; max-width:560px; margin-top:18px}
.hero-actions{display:flex; gap:16px; margin-top:18px; flex-wrap:wrap}
.cta-primary,.cta-secondary{
  display:inline-flex; align-items:center; justify-content:center; min-height:64px; padding:0 28px; border-radius:18px; font-size:1.25rem; font-weight:800; box-shadow:var(--shadow)
}
.cta-primary{background:linear-gradient(180deg,var(--red-soft),var(--red-dark)); color:#fff}
.cta-secondary{background:#fff; border:2px solid #23201d; color:#171513}
.hero-media img{width:100%; height:100%; object-fit:cover}

.info-strip-wrap{padding:0 0 10px}
.info-strip{
  margin-top:-24px; background:#fff; border-radius:28px; box-shadow:var(--shadow); display:grid; grid-template-columns:repeat(4,1fr); overflow:hidden
}
.info-card{display:flex; gap:16px; padding:26px 28px; align-items:flex-start; position:relative}
.info-card + .info-card{border-left:1px solid #ece7e0}
.info-icon{font-size:2.2rem; color:var(--red); line-height:1}
.info-label{font-size:1rem; color:#4f4740; margin:0 0 6px; font-weight:700}
.info-value{font-size:1.3rem; line-height:1.35; font-weight:800; margin:0}

.section-heading{text-align:center; margin-bottom:22px}
.section-heading.left-align{text-align:left}
.section-heading h2{font-family:Georgia, "Times New Roman", serif; font-size:3.2rem; color:#14110f; margin-bottom:6px}
.ornament{
  width:130px; height:12px; margin:0 auto; position:relative
}
.left-align .ornament{margin-left:0}
.ornament::before,
.ornament::after{content:""; position:absolute; top:5px; width:56px; height:2px; background:var(--red)}
.ornament::before{left:0}
.ornament::after{right:0}
.ornament:after{}
.ornament{background:radial-gradient(circle at center,var(--red) 0 2px, transparent 3px), linear-gradient(var(--red),var(--red)); background-size:10px 10px, 18px 2px; background-repeat:no-repeat; background-position:center center, center 5px}

.popular-grid{
  display:grid; grid-template-columns:repeat(5,1fr); gap:14px;
}
.dish-card{
  background:#fff; border-radius:18px; overflow:hidden; box-shadow:0 8px 22px rgba(0,0,0,.08); text-align:center; border:1px solid #eee7df;
}
.dish-card img{width:100%; aspect-ratio:16/9; object-fit:cover}
.dish-card h3{font-family:Georgia, serif; font-size:1.45rem; margin:10px 12px 2px}
.dish-card p{color:var(--red); font-size:1.8rem; font-weight:900; margin-bottom:14px}

.lunch-banner{
  background:linear-gradient(90deg,#b5090d 0%, #c20c10 30%, #a10a0d 100%);
  color:#fff; border-radius:24px; box-shadow:var(--shadow);
  display:grid; grid-template-columns:220px 1fr 260px; gap:0; align-items:stretch; overflow:hidden
}
.lunch-col{padding:28px 30px}
.lunch-intro{display:flex; flex-direction:column; justify-content:center; align-items:center; text-align:center; background:rgba(255,255,255,.06)}
.lunch-kicker{font-family:Georgia, serif; font-size:1.6rem; margin:0 0 8px}
.lunch-from-price{font-family:Georgia, serif; font-size:3.5rem; font-weight:900; line-height:1}
.lunch-main{display:flex; flex-direction:column; justify-content:center}
.lunch-main h2{font-family:Georgia, serif; font-size:3rem; margin-bottom:8px}
.lunch-time{font-size:1.45rem; margin-bottom:10px}
.lunch-main p{font-size:1.3rem; max-width:740px}
.lunch-side{display:flex; flex-direction:column; justify-content:center; text-align:center; border-left:1px dashed rgba(255,255,255,.5)}
.lunch-price{font-family:Georgia, serif; font-size:3.2rem; font-weight:800; line-height:1; margin-bottom:8px}
.lunch-side p{font-size:1.8rem; font-family:Georgia, serif; line-height:1.2; margin:0}

.tabs{
  display:grid; grid-template-columns:repeat(6,1fr); gap:12px; margin-bottom:18px
}
.tab-button{
  border:0; border-radius:16px 16px 0 0; padding:18px 14px; font-size:1.35rem; font-weight:800; background:#f3ede5; color:#231d19; cursor:pointer;
}
.tab-button.is-active{background:linear-gradient(180deg,var(--red-soft),var(--red-dark)); color:#fff}
.tab-panel{animation:fade .25s ease}
@keyframes fade{from{opacity:.3; transform:translateY(8px)}to{opacity:1; transform:none}}
.menu-cards{display:grid; gap:18px}
.menu-cards.six-up{grid-template-columns:repeat(2,1fr)}
.menu-cards.three-up{grid-template-columns:repeat(3,1fr)}
.mini-menu{
  background:#fff; border-radius:20px; border:1px solid #ebe3da; box-shadow:0 10px 26px rgba(0,0,0,.06); padding:22px;
}
.mini-menu-icon{font-size:2rem; margin-bottom:6px}
.mini-menu h3{font-family:Georgia, serif; font-size:2rem; margin-bottom:4px}
.subprice{color:var(--red); font-weight:800; font-size:1.05rem; margin-bottom:12px}
.mini-menu ul{display:grid; gap:8px}
.mini-menu li{display:grid; gap:6px; padding:8px 0; border-bottom:1px dashed #e8ddd3}
.mini-menu li:last-child{border-bottom:none}
.mini-menu li span:first-child{font-weight:800; color:#191613}
.mini-menu li span:last-child{color:#5d554e; font-size:.98rem}
.menu-note{font-size:.98rem; color:#5a534c; margin-top:12px}

.features-wrap{padding-top:10px}
.features-grid{
  display:grid; grid-template-columns:repeat(4,1fr); gap:16px
}
.feature-card{
  background:#f7efe6; border:1px solid #eadfce; border-radius:20px; padding:24px; text-align:center
}
.feature-icon{font-size:2.6rem; margin-bottom:8px}
.feature-card h3{font-family:Georgia, serif; font-size:1.9rem; color:var(--red)}
.feature-price{font-size:1.45rem; font-weight:900; color:#2a241f}

.about-grid{display:grid; grid-template-columns:1.2fr .8fr; gap:24px; align-items:start}
.about-grid p{font-size:1.18rem}
.about-box{
  background:#fff; border-radius:20px; border:1px solid #ece4da; box-shadow:0 10px 26px rgba(0,0,0,.06); padding:24px
}
.about-box h3{font-family:Georgia, serif; font-size:2rem}
.about-box li{padding:10px 0; border-bottom:1px dashed #eadfce}
.about-box li:last-child{border-bottom:none}

.site-footer{margin-top:24px; background:linear-gradient(180deg,#171310 0%,#0f0d0b 100%); color:#fff; position:relative}
.site-footer::before{
  content:""; position:absolute; inset:0; background:radial-gradient(circle at left center, rgba(255,255,255,.06), transparent 35%); pointer-events:none
}
.footer-grid{
  display:grid; grid-template-columns:1.2fr 1fr 1fr 1fr; gap:26px; padding:34px 0; align-items:start
}
.footer-brand{position:relative}
.footer-logo-row{display:flex; align-items:center; gap:10px}
.footer-logo-wordmark .logo-small{color:#fff; margin-left:10px}
.footer-logo-wordmark .logo-big{text-shadow:2px 2px 0 rgba(0,0,0,.45), 4px 4px 0 rgba(255,255,255,.12)}
.footer-logo .logo-big{font-size:3.6rem}
.footer-welcome{font-family:"Brush Script MT", "Segoe Script", cursive; font-size:2.4rem; color:#f4c96b; margin-top:10px}
.footer-col h3{font-size:1.2rem; color:#f2c767; margin-bottom:12px; text-transform:uppercase; letter-spacing:.06em}
.footer-col p{font-size:1.1rem; color:#f2ede8}
.footer-bottom{border-top:1px solid rgba(255,255,255,.08)}
.footer-bottom-inner{padding:16px 0; text-align:center; color:#ddd2c8}

/* MOBILE */
@media (max-width:1200px){
  .hero h1{font-size:4rem}
  .lead{font-size:1.35rem}
  .popular-grid{grid-template-columns:repeat(4,1fr)}
  .menu-cards.three-up,.features-grid,.footer-grid,.about-grid{grid-template-columns:repeat(2,1fr)}
  .lunch-banner{grid-template-columns:180px 1fr 220px}
}

@media (max-width:980px){
  .header-inner{grid-template-columns:auto auto auto; justify-content:space-between}
  .menu-toggle{display:inline-flex}
  .main-nav{
    position:absolute; left:16px; right:16px; top:92px; background:#fff; border-radius:20px; box-shadow:var(--shadow); padding:14px; display:none; flex-direction:column; align-items:flex-start;
  }
  .main-nav.is-open{display:flex}
  .main-nav a{width:100%}
  .main-nav a.active::after,.main-nav a:hover::after{left:16px; right:auto; width:40px}
  .header-actions{display:none}
  .hero-inner{grid-template-columns:1fr}
  .hero-copy{order:1; min-height:auto; padding:40px 28px}
  .hero-media{order:0; max-height:360px}
  .hero h1{font-size:3.5rem}
  .eyebrow{font-size:2rem}
  .lead{font-size:1.2rem}
  .info-strip{grid-template-columns:repeat(2,1fr)}
  .info-card:nth-child(3){border-left:none; border-top:1px solid #ece7e0}
  .info-card:nth-child(4){border-top:1px solid #ece7e0}
  .popular-grid{grid-template-columns:repeat(3,1fr)}
  .lunch-banner{grid-template-columns:1fr}
  .lunch-col{padding:22px 20px}
  .lunch-intro{padding-bottom:12px}
  .lunch-main{padding-top:8px; text-align:center}
  .lunch-main h2{font-size:2.4rem}
  .lunch-main p{font-size:1.15rem; max-width:none}
  .lunch-side{border-left:none; border-top:1px dashed rgba(255,255,255,.4); text-align:center}
  .lunch-price{font-size:2.6rem}
  .lunch-side p{font-size:1.45rem}
  .tabs{grid-template-columns:repeat(3,1fr)}
  .menu-cards.six-up,.menu-cards.three-up,.footer-grid,.about-grid,.features-grid{grid-template-columns:1fr}
}

@media (max-width:640px){
  body{font-size:16px}
  .container{width:min(var(--container), calc(100% - 20px))}
  .header-inner{min-height:82px; gap:10px}
    .logo-small{font-size:1rem; margin-left:8px}
  .logo-big{font-size:2.8rem}
  .hero{padding-top:14px}
  .hero-inner{border-radius:24px}
  .hero-copy{padding:26px 18px}
  .hero h1{font-size:2.8rem}
  .eyebrow{font-size:1.8rem}
  .cta-primary,.cta-secondary{width:100%; min-height:58px; font-size:1.1rem}
  .info-strip{grid-template-columns:1fr}
  .info-card + .info-card{border-left:none; border-top:1px solid #ece7e0}
  .popular-grid{grid-template-columns:repeat(2,1fr)}
  .dish-card h3{font-size:1.12rem}
  .dish-card p{font-size:1.35rem}
  .section{padding:24px 0}
  .section-heading h2{font-size:2.3rem}
  .tabs{grid-template-columns:repeat(2,1fr)}
  .tab-button{padding:14px 10px; font-size:1.05rem}
  .mini-menu{padding:18px}
  .mini-menu h3{font-size:1.6rem}
  .footer-logo .logo-big{font-size:2.7rem}
  .footer-welcome{font-size:1.8rem}
}

@media (max-width:420px){
  .popular-grid{grid-template-columns:1fr}
  .tabs{grid-template-columns:1fr 1fr}
}


.header-actions{justify-self:end}
.main-nav{justify-self:center}


/* ===============================
   V6 – mer professionell och luftig känsla
   =============================== */

:root{
  --container:1180px;
  --shadow:0 18px 50px rgba(31,21,16,.10);
  --radius:28px;
  --radius-sm:18px;
}

body{
  background:
    radial-gradient(circle at top right, rgba(200,15,18,.06), transparent 34%),
    linear-gradient(180deg,#fbf7f1 0%,#fff 34%,#fbf6f0 100%);
  color:#241f1a;
}

.container{
  width:min(var(--container), calc(100% - 48px));
}

.site-header{
  background:rgba(255,255,255,.96);
  box-shadow:0 8px 30px rgba(28,20,16,.06);
}

.header-inner{
  min-height:104px;
  gap:32px;
}

.logo-big{font-size:4.45rem;}
.main-nav{gap:18px;}
.main-nav a{padding:12px 18px;font-size:1.02rem;}
.phone-button{padding:15px 22px;border-radius:999px;}

.hero{padding:38px 0 28px;}
.hero-inner{
  border-radius:42px;
  background:linear-gradient(90deg, #fbf0e2 0%, #fff8ee 52%, #ffffff 52%);
}
.hero-copy{padding:78px 68px;min-height:500px;}
.hero h1{font-size:5rem;max-width:620px;}
.lead{font-size:1.45rem;max-width:650px;line-height:1.6;color:#3a312b;}
.hero-actions{gap:18px;margin-top:26px;}
.cta-primary,.cta-secondary{border-radius:999px;min-height:62px;padding:0 34px;}

.info-strip-wrap{padding:10px 0 28px;}
.info-strip{margin-top:-30px;border-radius:30px;}
.info-card{padding:32px 34px;}

.section{padding:58px 0;}
.section-heading{margin-bottom:34px;}
.section-heading h2{font-size:3.45rem;letter-spacing:-.02em;}

.popular-grid{grid-template-columns:repeat(4,1fr);gap:26px;}
.dish-card{
  border-radius:24px;
  border:1px solid rgba(111,86,65,.13);
  box-shadow:0 18px 40px rgba(32,22,15,.08);
  transition:transform .18s ease, box-shadow .18s ease;
}
.dish-card:hover{transform:translateY(-4px);box-shadow:0 24px 54px rgba(32,22,15,.13);}
.dish-card img{aspect-ratio:4/3;}
.dish-card h3{font-size:1.35rem;margin-top:16px;}
.dish-card p{margin-bottom:18px;}

.lunch-banner{
  grid-template-columns:230px 1fr 250px;
  border-radius:32px;
  background:
    linear-gradient(120deg, rgba(255,255,255,.10), transparent 34%),
    linear-gradient(90deg,#ae080c 0%, #c20c10 44%, #8f070b 100%);
  box-shadow:0 24px 56px rgba(150,11,14,.22);
}
.lunch-col{padding:42px 42px;}
.lunch-intro{background:rgba(255,255,255,.09);}
.lunch-kicker{font-size:1.5rem;opacity:.95;}
.lunch-from-price{font-size:3.7rem;}
.lunch-main h2{font-size:3.35rem;}
.lunch-main p{font-size:1.22rem;line-height:1.65;}
.lunch-side{border-left:1px dashed rgba(255,255,255,.38);}
.lunch-price{font-size:3.2rem;}
.lunch-side p{font-size:1.8rem;}

.tabs{gap:14px;margin-bottom:28px;}
.tab-button{
  border-radius:999px;
  padding:17px 16px;
  background:#f5eee5;
  box-shadow:inset 0 0 0 1px rgba(111,86,65,.08);
}
.tab-button.is-active{box-shadow:0 10px 24px rgba(184,9,13,.18);}

.menu-cards{gap:26px;}
.menu-cards.six-up,.menu-cards.three-up{grid-template-columns:repeat(2,minmax(0,1fr));}
.mini-menu{
  border-radius:26px;
  padding:32px;
  border:1px solid rgba(111,86,65,.13);
  box-shadow:0 18px 42px rgba(32,22,15,.07);
}
.mini-menu-icon{
  width:54px;height:54px;border-radius:18px;display:flex;align-items:center;justify-content:center;
  background:#fff3e5;margin-bottom:18px;
}
.mini-menu h3{font-size:2.15rem;margin-bottom:8px;}
.subprice{margin-bottom:18px;}
.mini-menu ul{gap:4px;}
.mini-menu li{grid-template-columns:1fr;padding:13px 0;}
.mini-menu li span:first-child{font-size:1.04rem;}
.mini-menu li span:last-child{color:#6d6259;line-height:1.45;}
.menu-note{line-height:1.65;}

.features-wrap{padding-top:34px;}
.features-grid{gap:24px;}
.feature-card{
  border-radius:26px;
  padding:34px 28px;
  background:linear-gradient(180deg,#fff7ed 0%,#f7eee3 100%);
  box-shadow:0 14px 36px rgba(32,22,15,.06);
}
.about-section{padding-bottom:72px;}
.about-grid{gap:38px;}
.about-grid p{line-height:1.78;}
.about-box{padding:34px;border-radius:26px;}
.site-footer{margin-top:42px;}
.footer-grid{padding:52px 0;gap:42px;}
.footer-col p{line-height:1.65;}

@media (max-width:1200px){
  .popular-grid{grid-template-columns:repeat(3,1fr);}
  .hero h1{font-size:4.2rem;}
}

@media (max-width:980px){
  .container{width:min(var(--container), calc(100% - 30px));}
  .header-inner{min-height:88px;}
  .hero{padding-top:24px;}
  .hero-copy{padding:44px 32px;min-height:auto;}
  .hero h1{font-size:3.65rem;}
  .popular-grid{grid-template-columns:repeat(2,1fr);gap:20px;}
  .lunch-banner{grid-template-columns:1fr;}
  .lunch-col{padding:30px 28px;}
  .lunch-side{border-left:none;border-top:1px dashed rgba(255,255,255,.38);}
  .menu-cards.six-up,.menu-cards.three-up{grid-template-columns:1fr;}
  .features-grid{grid-template-columns:repeat(2,1fr);}
}

@media (max-width:640px){
  .container{width:min(var(--container), calc(100% - 22px));}
  .section{padding:42px 0;}
  .header-inner{min-height:80px;}
  .logo-small{font-size:.95rem;}
  .logo-big{font-size:2.85rem;text-shadow:1px 1px 0 #ffffff, 3px 3px 0 rgba(0,0,0,.85);}
  .hero-inner{border-radius:28px;}
  .hero-copy{padding:34px 22px;}
  .hero h1{font-size:3rem;}
  .lead{font-size:1.08rem;}
  .info-card{padding:24px 22px;}
  .popular-grid{grid-template-columns:1fr;}
  .dish-card h3{font-size:1.3rem;}
  .lunch-main h2{font-size:2.55rem;}
  .lunch-from-price{font-size:3.15rem;}
  .lunch-main p{font-size:1.08rem;}
  .tabs{grid-template-columns:1fr 1fr;}
  .tab-button{border-radius:18px;}
  .mini-menu{padding:24px 20px;}
  .features-grid{grid-template-columns:1fr;}
}