/* ============================================================
   Melavie × Speicher – Hauscaterer-Zonen
   Melavie-CI (Petrol, Papier, League Spartan / Montserrat) im
   Raster der Speicher-Seite. Gold bleibt Speicher, Petrol ist Melavie.
   ============================================================ */
@font-face{font-family:'League Spartan';src:url('fonts/league-spartan-latin.woff2') format('woff2');font-weight:100 900;font-display:swap}
@font-face{font-family:'Montserrat';src:url('fonts/montserrat-latin.woff2') format('woff2');font-weight:400 500;font-display:swap}

:root{
  --mv-paper:#FAF7F2;
  --mv-sand:#DDD5CA;
  --mv-ink:#2B2621;
  --mv-muted:#6E655B;
  --mv-petrol:#1D4E49;
  --mv-petrol-dark:#123330;
  --mv-petrol-tint:#E2E8E5;
  --mv-display:'League Spartan','Helvetica Neue',Arial,sans-serif;
  --mv-text:'Montserrat','Helvetica Neue',Arial,sans-serif;
}

.theme-petrol{background:var(--mv-petrol);color:var(--mv-paper)}
.theme-petrol-dark{background:var(--mv-petrol-dark);color:var(--mv-paper)}
.theme-paper{background:var(--mv-paper);color:var(--mv-ink)}

/* Melavie-Typo nur innerhalb der Melavie-Zonen */
.mv h2,.mv h3,.mv .mv-display{font-family:var(--mv-display);font-weight:600;text-transform:none;letter-spacing:-.02em;line-height:1}
.mv h2{font-size:clamp(2.1rem,5vw,4.4rem)}
.mv h3{font-size:clamp(1.25rem,1.8vw,1.6rem)}
.mv p,.mv li{font-family:var(--mv-text);font-size:clamp(.95rem,1.05vw,1.05rem);line-height:1.7}
.mv .eyebrow{font-family:var(--mv-display);font-weight:500;letter-spacing:.24em;font-size:.74rem;color:var(--accent)}
.theme-paper.mv .eyebrow{color:var(--mv-petrol)}
.mv .btn{font-family:var(--mv-display);border-radius:2px;letter-spacing:.12em;font-size:.78rem}
.mv .btn-paper{background:var(--mv-paper);color:var(--mv-petrol-dark)}
.mv .btn-paper:hover{background:var(--accent);transform:translateY(-2px)}
.mv .btn-petrol{background:var(--mv-petrol);color:var(--mv-paper)}
.mv .btn-petrol:hover{background:var(--mv-petrol-dark);transform:translateY(-2px)}

/* handgezeichneter Strich — zeichnet sich beim Einblenden */
.scribble{display:block;width:100%;height:auto;overflow:visible}
.scribble path{fill:none;stroke:var(--accent);stroke-width:3.2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 1.6s cubic-bezier(.6,.1,.2,1) .35s}
.in .scribble path,.scribble.in path{stroke-dashoffset:0}
.hl-under{position:relative;display:inline-block;white-space:nowrap}
.hl-under .scribble{position:absolute;left:-2%;right:-2%;bottom:-.28em;width:104%;height:.4em}

/* Doppelmarke Speicher × Melavie */
.lockup{display:flex;align-items:center;gap:clamp(14px,1.6vw,22px)}
.lockup img.sp{height:clamp(38px,3.6vw,52px);width:auto;filter:brightness(0) invert(1)}
.lockup img.mv-logo{height:clamp(52px,5vw,72px);width:auto;border-radius:50%}
.lockup .x{font-family:var(--mv-display);font-size:1.6rem;font-weight:300;color:var(--accent);line-height:1}
.theme-paper .lockup img.sp,.theme-cream .lockup img.sp{filter:brightness(0)}

/* ================= Startseite: Dein Event im Speicher ================= */
.ev-grid{display:grid;grid-template-columns:1fr 1.15fr;gap:clamp(36px,6vw,110px);align-items:center}
.ev-count{font-family:var(--head);font-weight:800;font-size:clamp(5.5rem,13vw,12.5rem);line-height:.8;letter-spacing:-.05em;color:var(--accent);display:flex;flex-direction:column;gap:.18em}
.ev-count small{font-family:var(--mono);font-size:.78rem;letter-spacing:.24em;text-transform:uppercase;color:var(--muted-dark);line-height:1.6;max-width:none;font-weight:400}
.ev-text p{color:var(--muted-dark);max-width:52ch;margin:1.4rem 0 2rem}
.ev-text p strong{color:var(--text-cream)}
.ev-rooms{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(12px,1.4vw,20px);margin-top:clamp(50px,6vw,90px)}
.room{position:relative;border-radius:10px;overflow:hidden;aspect-ratio:3/4;background:#2a2018}
.room img{width:100%;height:100%;object-fit:cover;transition:transform .8s ease}
.room:hover img{transform:scale(1.05)}
.room::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(14,10,7,0) 40%,rgba(14,10,7,.88) 100%)}
.room figcaption{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:clamp(16px,1.8vw,26px)}
.room figcaption b{display:block;font-size:clamp(1.1rem,1.6vw,1.45rem);text-transform:uppercase;font-weight:800;line-height:1.1}
.room figcaption span{font-family:var(--mono);font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--accent)}
.ev-occasions{display:flex;flex-wrap:wrap;gap:10px;margin-top:clamp(30px,3.5vw,48px)}
.ev-occasions span{border:1px solid var(--line-dark);border-radius:999px;padding:.55rem 1.1rem;font-size:.78rem;text-transform:uppercase;letter-spacing:.1em;font-weight:600;transition:border-color .25s,color .25s}
.ev-occasions span:hover{border-color:var(--accent);color:var(--accent)}
.ev-facts{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line-dark);margin-top:clamp(40px,5vw,70px)}
.ev-facts div{padding:1.4rem 1.2rem 0 0}
.ev-facts b{display:block;font-size:clamp(1.3rem,2vw,1.8rem);font-weight:800;text-transform:uppercase;color:var(--text-cream)}
.ev-facts span{font-family:var(--mono);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted-dark)}

/* ================= Startseite: Melavie-Teaser ================= */
.mvt{overflow:hidden}
.mvt-grid{display:grid;grid-template-columns:1.05fr 1fr;gap:clamp(40px,6vw,110px);align-items:center}
.mvt-collage{position:relative;aspect-ratio:1/1.02}
.mvt-collage figure{position:absolute;margin:0;overflow:hidden;border-radius:2px;box-shadow:0 30px 60px -28px rgba(0,0,0,.55)}
.mvt-collage figure img{width:100%;height:100%;object-fit:cover}
.mvt-collage .c1{left:0;top:6%;width:62%;aspect-ratio:4/5;transform:rotate(-2.5deg)}
.mvt-collage .c2{right:0;top:0;width:46%;aspect-ratio:1;transform:rotate(3deg)}
.mvt-collage .c3{right:6%;bottom:0;width:52%;aspect-ratio:1;transform:rotate(-1.5deg)}
.mvt-collage .stamp{position:absolute;left:44%;top:48%;width:clamp(96px,10vw,140px);z-index:3;transform:translate(-50%,-50%) rotate(-8deg);border-radius:50%;box-shadow:0 0 0 6px var(--mv-petrol),0 20px 40px -10px rgba(0,0,0,.5)}
.mvt-text .lockup{margin-bottom:1.8rem}
.mvt-text p.lead{color:rgba(250,247,242,.82);max-width:50ch;margin:1.4rem 0 1.8rem}
.mvt-list{list-style:none;border-top:1px solid rgba(250,247,242,.18);margin-bottom:2.2rem}
.mvt-list li{display:flex;align-items:baseline;gap:1rem;padding:.95rem 0;border-bottom:1px solid rgba(250,247,242,.18)}
.mvt-list li b{font-family:var(--mv-display);font-weight:600;font-size:clamp(1.1rem,1.5vw,1.3rem)}
.mvt-list li i{flex:1;border-bottom:1px dotted rgba(250,247,242,.4);transform:translateY(-4px)}
.mvt-list li span{font-family:var(--mv-display);color:var(--accent);white-space:nowrap}
.mvt-foot{display:flex;align-items:center;gap:clamp(18px,2.4vw,36px);flex-wrap:wrap}
.rating{display:flex;align-items:center;gap:.8rem}
.rating b{font-family:var(--mv-display);font-size:2.4rem;font-weight:600;line-height:1}
.rating span{font-family:var(--mv-text);font-size:.78rem;line-height:1.4;opacity:.8}
.rating .stars{color:var(--accent);letter-spacing:.12em;font-size:.9rem;opacity:1}

/* ================= Unterseite catering.html ================= */
.cat-hero{position:relative;min-height:92svh;display:flex;align-items:flex-end;overflow:hidden;color:var(--mv-paper)}
.cat-hero>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.cat-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(18,51,48,.55) 0%,rgba(18,51,48,.15) 35%,rgba(18,51,48,.92) 100%)}
.cat-hero .inner{position:relative;z-index:2;width:100%;padding-bottom:clamp(48px,7vw,96px);padding-top:140px}
.cat-hero h1{font-family:var(--mv-display);font-weight:600;text-transform:none;letter-spacing:-.03em;font-size:clamp(2.6rem,7.6vw,6.6rem);line-height:.95;max-width:12ch;margin:1.6rem 0 1.4rem}
.cat-hero p.lead{font-family:var(--mv-text);max-width:54ch;font-size:clamp(1rem,1.3vw,1.15rem);opacity:.9}
.cat-hero .btns{display:flex;gap:14px;flex-wrap:wrap;margin-top:2rem}
.cat-hero .backlink{font-family:var(--mono);text-transform:uppercase;letter-spacing:.18em;font-size:.72rem;color:var(--accent)}
.badge-new{display:inline-block;font-family:var(--mv-display);font-weight:600;font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;background:var(--accent);color:#1a130a;padding:.45rem .8rem;border-radius:2px;margin-left:.8rem}

.intro-split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(36px,6vw,110px);align-items:start}
.intro-split .big{font-family:var(--mv-display);font-weight:500;font-size:clamp(1.5rem,2.8vw,2.4rem);line-height:1.2;letter-spacing:-.01em;color:var(--mv-ink)}
.intro-split .big em{font-style:normal;color:var(--mv-petrol)}
.intro-split p+p{margin-top:1rem}
.intro-split .facts{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--mv-sand);margin-top:2rem;border:1px solid var(--mv-sand)}
.intro-split .facts div{background:var(--mv-paper);padding:1.1rem}
.intro-split .facts b{display:block;font-family:var(--mv-display);font-size:1.9rem;font-weight:600;color:var(--mv-petrol);line-height:1}
.intro-split .facts span{font-family:var(--mv-text);font-size:.74rem;color:var(--mv-muted)}

.svc-head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap;margin-bottom:clamp(34px,4vw,60px)}
.svc-head p{max-width:44ch;opacity:.82}
.svc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:rgba(250,247,242,.16);border:1px solid rgba(250,247,242,.16)}
.svc{background:var(--mv-petrol);padding:clamp(24px,2.6vw,40px);display:flex;flex-direction:column;gap:.8rem;min-height:260px;transition:background .35s}
.svc:hover{background:var(--mv-petrol-dark)}
.svc .no{font-family:var(--mv-display);font-size:.8rem;letter-spacing:.2em;color:var(--accent)}
.svc p{opacity:.8;font-size:.95rem}
.svc .tag{margin-top:auto;font-family:var(--mv-display);font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;color:var(--accent)}

.formats{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(18px,2vw,30px)}
.fmt{background:#fff;border:1px solid var(--mv-sand);display:flex;flex-direction:column}
.fmt .ph{aspect-ratio:4/3;overflow:hidden}
.fmt .ph img{width:100%;height:100%;object-fit:cover;transition:transform .7s ease}
.fmt:hover .ph img{transform:scale(1.05)}
.fmt .bd{padding:clamp(20px,2vw,30px);display:flex;flex-direction:column;gap:.7rem;flex:1}
.fmt .price{font-family:var(--mv-display);font-size:clamp(1.8rem,2.6vw,2.4rem);font-weight:600;color:var(--mv-petrol);line-height:1}
.fmt .price small{font-size:.9rem;font-weight:400;color:var(--mv-muted)}
.fmt p{color:var(--mv-muted)}
.fmt ul{list-style:none;margin-top:auto;padding-top:.8rem;border-top:1px solid var(--mv-sand)}
.fmt li{font-size:.88rem;padding:.3rem 0 .3rem 1.3rem;position:relative}
.fmt li::before{content:"";position:absolute;left:0;top:.95em;width:.7rem;height:1.5px;background:var(--mv-petrol)}

/* Rechner */
.calc{display:grid;grid-template-columns:1.1fr .9fr;gap:0;border:1px solid var(--mv-sand);background:#fff}
.calc-in{padding:clamp(24px,3vw,48px);display:grid;gap:1.8rem}
.calc-in label{display:block;font-family:var(--mv-display);font-weight:600;font-size:.82rem;letter-spacing:.14em;text-transform:uppercase;margin-bottom:.7rem}
.calc-in output{float:right;font-family:var(--mv-display);font-size:1.1rem;color:var(--mv-petrol);letter-spacing:0}
.calc-in input[type=range]{width:100%;accent-color:var(--mv-petrol)}
.seg{display:flex;flex-wrap:wrap;gap:8px}
.seg input{position:absolute;opacity:0;pointer-events:none}
.seg label{margin:0;cursor:pointer;border:1px solid var(--mv-muted);padding:.65rem 1rem;font-family:var(--mv-text);font-weight:500;font-size:.85rem;letter-spacing:0;text-transform:none;border-radius:2px;transition:.2s}
.seg input:checked+label{background:var(--mv-petrol);border-color:var(--mv-petrol);color:var(--mv-paper)}
.seg input:focus-visible+label{outline:2px solid var(--accent);outline-offset:2px}
.check{display:flex;gap:.7rem;align-items:center;font-family:var(--mv-text);font-size:.92rem;cursor:pointer}
.check input{accent-color:var(--mv-petrol);width:18px;height:18px}
.calc-out{background:var(--mv-petrol);color:var(--mv-paper);padding:clamp(24px,3vw,48px);display:flex;flex-direction:column;gap:1rem}
.calc-out .sum{font-family:var(--mv-display);font-weight:600;font-size:clamp(2.4rem,4.6vw,3.8rem);line-height:1;letter-spacing:-.02em}
.calc-out dl{display:grid;grid-template-columns:1fr auto;gap:.5rem 1rem;font-family:var(--mv-text);font-size:.88rem;border-top:1px solid rgba(250,247,242,.2);padding-top:1rem}
.calc-out dd{text-align:right;font-family:var(--mv-display)}
.calc-out .fine{font-size:.76rem;opacity:.7;margin-top:auto}

/* Ablauf */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(20px,2.4vw,36px);counter-reset:s}
.step{border-top:2px solid var(--mv-petrol);padding-top:1.4rem;counter-increment:s}
.step::before{content:"0" counter(s);display:block;font-family:var(--mv-display);font-size:3rem;font-weight:300;color:var(--mv-petrol);line-height:1;margin-bottom:1rem}
.step h3{margin-bottom:.6rem}
.step p{color:var(--mv-muted);font-size:.94rem}

/* Stimmen */
.voices{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(24px,3vw,50px)}
.voice{border-top:1px solid rgba(250,247,242,.25);padding-top:1.4rem}
.voice .stars{color:var(--accent);letter-spacing:.14em}
.voice p{font-family:var(--mv-display);font-size:clamp(1.15rem,1.5vw,1.35rem);line-height:1.35;margin:.8rem 0 1rem}
.voice cite{font-family:var(--mv-text);font-style:normal;font-size:.78rem;letter-spacing:.08em;text-transform:uppercase;opacity:.7}

/* overflow safety */
.ev-grid>*,.mvt-grid>*,.intro-split>*,.calc>*{min-width:0}

@media(max-width:1024px){
  .svc-grid,.formats{grid-template-columns:1fr 1fr}
  .steps{grid-template-columns:1fr 1fr}
  .ev-facts{grid-template-columns:1fr 1fr}
}
@media(max-width:900px){
  .ev-grid,.mvt-grid,.intro-split,.calc{grid-template-columns:1fr}
  .mvt-collage{max-width:520px;margin:0 auto;width:100%}
  .voices{grid-template-columns:1fr}
}
@media(max-width:640px){
  .ev-rooms{grid-template-columns:1fr 1fr}
  .ev-rooms .room:last-child{grid-column:1/-1;aspect-ratio:16/10}
  .room figcaption{padding:12px}.room figcaption b{font-size:.92rem}
  .svc-grid,.formats,.steps{grid-template-columns:1fr}
  .svc{min-height:0}
  .intro-split .facts{grid-template-columns:1fr 1fr 1fr}
  .intro-split .facts b{font-size:1.4rem}
}
@media(prefers-reduced-motion:reduce){.scribble path{transition:none;stroke-dashoffset:0}}
