/* ══════════════════════════════════════════════════════════════════════
   FKK MONTE CARLO — mc-blocks.css
   Wiederverwendbare Inhaltsblöcke. Wird auf Seiten geladen, die sie
   brauchen (home, service, events, galerie …), nicht global.
   ══════════════════════════════════════════════════════════════════════ */

.sec{ padding:clamp(5rem,12vh,9rem) 0; }
.sec--tight{ padding:clamp(3rem,7vh,5rem) 0; }
.sec__head{ display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:1.6rem; margin-bottom:3.4rem; }
.sec__head .title{ margin-top:1rem; }
.sec__head .lead{ margin-top:1.1rem; }

/* ─── Wochenfahrplan ─────────────────────────────────────────────── */
.week{ border-top:1px solid rgba(201,162,39,.18); }
.wrow{
  display:grid; grid-template-columns:minmax(120px,.9fr) minmax(140px,1.1fr) 2.6fr minmax(90px,auto);
  gap:1.4rem; align-items:baseline; padding:1.35rem .4rem;
  border-bottom:1px solid rgba(217,224,230,.07); position:relative;
  transition:background .4s var(--ease), padding-left .4s var(--ease);
}
.wrow::before{
  content:''; position:absolute; left:0; top:0; bottom:0; width:2px;
  background:linear-gradient(180deg,var(--champagne),var(--gold));
  transform:scaleY(0); transform-origin:top; transition:transform .45s var(--ease);
}
.wrow:hover{ background:linear-gradient(90deg,rgba(201,162,39,.07),transparent 60%); padding-left:1.3rem; }
.wrow:hover::before{ transform:scaleY(1); }
/* Tag und Öffnungszeit sind die beiden Angaben, die im Wochenplan
   gesucht werden — daher kräftiger und heller als der Rest der Zeile. */
.wrow__day{
  font-family:var(--hl); font-weight:700; font-size:.88rem; letter-spacing:.1em;
  text-transform:uppercase; color:var(--champagne);
}
.wrow__ttl{ font-family:var(--hl); font-weight:600; font-size:1.34rem; color:var(--platin); }
.wrow__txt{ font-size:.97rem; color:var(--text); }
.wrow__hrs{
  font-family:var(--hl); font-weight:700; font-size:.92rem;
  color:var(--champagne); text-align:right; letter-spacing:.02em;
  font-variant-numeric:tabular-nums;
}
.wrow.is-today{ background:linear-gradient(90deg,rgba(201,162,39,.1),transparent 70%); padding-left:1.3rem; }
.wrow.is-today::before{ transform:scaleY(1); }
.wrow.is-today .wrow__ttl{ font-weight:600; }
.wrow.is-today .wrow__day::after{ content:' · heute'; color:var(--gold); }
.wrow.is-today .wrow__day{ color:var(--gold); }

/* ─── Tarife ─────────────────────────────────────────────────────── */
.tarife{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1.5rem; }
.tarife > .bevel{ min-width:0; }
.tarif{ --cut:30px; }
.tarif .bevel__in{ display:flex; flex-direction:column; gap:1.1rem; min-height:100%; }
.tarif__badge{
  align-self:flex-start; font-family:var(--hl); font-weight:600; font-size:.68rem; letter-spacing:0.196em;
  text-transform:uppercase; color:var(--gold); border:1px solid rgba(201,162,39,.4); padding:.34rem .7rem;
}
.tarif__ttl{ font-family:var(--hl); font-weight:600; font-size:1.55rem; }
.tarif__price{ font-family:var(--hl); font-size:clamp(3rem,6vw,4.3rem); line-height:.9; font-weight:600; }
.tarif__price sup{ font-size:.3em; vertical-align:super; margin-left:.15em; }
/* Praefix fuer Tarife ohne Festpreis ("ab 65 €") */
.tarif__from{
  display:inline-block; font-family:var(--hl); font-weight:600;
  font-size:.82rem; letter-spacing:.14em; text-transform:uppercase;
  vertical-align:.34em; margin-right:.45rem; color:var(--gold);
  -webkit-text-fill-color:var(--gold);
}
.tarif__time{ font-family:var(--hl); font-weight:600; font-size:.74rem; letter-spacing:0.154em; text-transform:uppercase; color:var(--ash); }
.tarif ul{ list-style:none; display:grid; gap:.62rem; margin-top:.2rem; padding-top:1.2rem; border-top:1px solid rgba(217,224,230,.1); }
.tarif li{ display:flex; gap:.75rem; font-size:.93rem; color:var(--text); }
.tarif li::before{ content:'—'; color:var(--gold); flex:none; }
.tarif__note{ font-family:var(--hl); font-weight:600; font-size:.70rem; letter-spacing:0.112em; color:var(--ash-2); margin-top:auto; padding-top:1.2rem; }

/* ─── Galerie-Raster ─────────────────────────────────────────────── */
.gal{ display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); gap:1.2rem; }
.gal figure{ min-width:0; }
.gal figure{ --cut:30px; position:relative; overflow:hidden; }
.gal .bevel__in{ padding:0; }
.gal .ph{
  display:block; width:100%; height:auto;
  aspect-ratio:var(--ar,4/5); object-fit:cover; object-position:center;
  background:var(--onyx-2);
  filter:grayscale(1) contrast(1.08) brightness(.72); transform:scale(1.02);
  transition:filter .8s var(--ease), transform .9s var(--ease);
}
.gal figure:hover .ph{ filter:grayscale(0) contrast(1) brightness(.94); transform:scale(1.06); }

/* Touch: Entsättigung nur noch als kurzer Anlauf, danach volle Farbe.
   Der Zoom wandert über .is-near mit dem Scrollen mit. */
@media (hover: none), (pointer: coarse) {
  .gal .ph{ filter:grayscale(.45) contrast(1.04) brightness(.82); }
  .gal figure.in-view .ph{ filter:grayscale(0) contrast(1) brightness(.94); }
  .gal figure.is-near .ph{ transform:scale(1.06); }
  .wrow.is-near{ background:linear-gradient(90deg,rgba(201,162,39,.07),transparent 60%); padding-left:1.3rem; }
  .wrow.is-near::before{ transform:scaleY(1); }
}
.gal figcaption{
  position:absolute; left:0; right:0; bottom:0; z-index:2; padding:1.4rem;
  background:linear-gradient(0deg,rgba(6,6,10,.94),transparent);
  display:flex; justify-content:space-between; align-items:flex-end; gap:1rem;
}
.gal .g-t{ font-family:var(--hl); font-weight:600; font-size:1.18rem; }
.gal .g-n{ font-family:var(--hl); font-weight:600; font-size:.70rem; letter-spacing:0.182em; color:var(--gold); }
.g1{ grid-column:span 5 } .g2{ grid-column:span 7 }
.g3{ grid-column:span 7 } .g4{ grid-column:span 5 }
.g6{ grid-column:span 6 } .g4c{ grid-column:span 4 } .g12{ grid-column:span 12 }

/* ─── Kannelurglas-Band mit Deco-Fächer ──────────────────────────── */
.engrave{ position:relative; padding:clamp(6rem,15vh,10rem) 0; overflow:hidden; text-align:center; }
.engrave .shell{ position:relative; z-index:2; }
.fluted{ position:absolute; inset:0; pointer-events:none; opacity:.9; }
.fluted::before{
  content:''; position:absolute; inset:0;
  background:repeating-linear-gradient(90deg,
    rgba(217,224,230,.075) 0 1px, rgba(217,224,230,.02) 1px 3px,
    transparent 3px 6px, rgba(201,162,39,.05) 6px 7px, transparent 7px 13px);
  -webkit-mask-image:linear-gradient(180deg,transparent,#000 30%,#000 70%,transparent);
  mask-image:linear-gradient(180deg,transparent,#000 30%,#000 70%,transparent);
}
.fluted::after{
  content:''; position:absolute; inset:0;
  background:repeating-conic-gradient(from 0deg at 50% 118%,
    rgba(201,162,39,.11) 0 .9deg, transparent .9deg 5.4deg);
  -webkit-mask-image:radial-gradient(ellipse 62% 78% at 50% 108%,#000,transparent 72%);
  mask-image:radial-gradient(ellipse 62% 78% at 50% 108%,#000,transparent 72%);
}
.engrave blockquote{
  font-family:var(--display); font-style:italic; font-weight:400;
  font-size:clamp(1.6rem,4.4vw,3.1rem); line-height:1.24; max-width:20ch; margin:1.8rem auto 0;
}
.engrave cite{
  display:block; margin-top:1.8rem; font-family:var(--hl); font-weight:600; font-style:normal;
  font-size:.72rem; letter-spacing:0.238em; text-transform:uppercase; color:var(--gold);
}

/* ─── Reservierungs-Band ─────────────────────────────────────────── */
.invite{ position:relative; overflow:hidden; text-align:center; padding:clamp(6rem,17vh,11rem) 0; }
.invite__bg{
  position:absolute; inset:-12% 0; background:var(--onyx) center/cover no-repeat;
  filter:grayscale(.7) brightness(.38); will-change:transform;
}
.invite::after{
  content:''; position:absolute; inset:0;
  background:radial-gradient(60% 70% at 50% 50%,rgba(61,14,28,.5),rgba(6,6,10,.92) 70%);
}
.invite .shell{ position:relative; z-index:2; }
.cta-row{ display:flex; gap:1rem; justify-content:center; flex-wrap:wrap; margin-top:2.4rem; }

@media (max-width:1024px){
  .tarife{ grid-template-columns:1fr; } .tarif{ --cut:24px; }
  .g1,.g2,.g3,.g4,.g4c{ grid-column:span 6; }
}
@media (max-width:680px){
  .wrow{ grid-template-columns:1fr; gap:.35rem; }
  .wrow__hrs{ text-align:left; }
  .g1,.g2,.g3,.g4,.g4c,.g6{ grid-column:span 12; }
}

/* ─── Kontakt- und Newsletterblock am Seitenfuß ──────────────────── */
.cta__grid{ display:grid; grid-template-columns:minmax(0,.85fr) minmax(0,1.3fr) minmax(0,.85fr); gap:1.5rem; align-items:stretch; }
.cta__grid > .bevel{ --cut:28px; min-width:0; }
.cta__grid .bevel__in{ display:flex; flex-direction:column; gap:1rem; height:100%; }
.cta__tel{
  display:block; font-family:var(--hl); font-size:clamp(1.5rem,2.6vw,2.05rem);
  font-weight:600; line-height:1.1; letter-spacing:-.01em; margin:.2rem 0 .6rem;
}
.cta__newsttl{
  font-family:var(--hl); font-size:clamp(1.7rem,3vw,2.2rem); line-height:1.05;
  color:var(--platin); margin:.2rem 0 .4rem;
}
.cta__newsttl em{ font-style:italic; color:var(--champagne); }
.cta__perks{ list-style:none; display:grid; gap:.6rem; padding-top:1.1rem; border-top:1px solid rgba(217,224,230,.1); }
.cta__perks li{ display:flex; gap:.75rem; font-size:.92rem; color:var(--text); }
.cta__perks li::before{ content:'—'; color:var(--gold); flex:none; }

@media (max-width:1180px){
  .cta__grid{ grid-template-columns:1fr 1fr; }
  .cta__grid > .bevel:nth-child(2){ grid-column:1 / -1; order:3; }
}
@media (max-width:760px){
  .cta__grid{ grid-template-columns:minmax(0,1fr); }
  .cta__grid > .bevel:nth-child(2){ order:0; }
}
/* Sehr schmale Geraete (iPhone SE 1. Gen. u. ae.): die Fase frisst sonst
   mehr Breite, als die Kachel hat, und die Karten stehen ueber. */
@media (max-width:400px){
  .cta__grid > .bevel{ --cut:20px; }
  .cta__grid .bevel__in{ padding:1.35rem; }
  .form__row{ grid-template-columns:minmax(0,1fr); }
  .deflist li{ flex-wrap:wrap; }
}

/* ─── Touch: Nachzügler ──────────────────────────────────────────────
   Muss hinter der Basisregel von .invite__bg stehen. Bei gleicher
   Spezifität gewinnt sonst die spätere Deklaration und der Filter
   bleibt auf grayscale(.7).
   ─────────────────────────────────────────────────────────────────── */
@media (hover: none), (pointer: coarse) {
  /* Das Reservierungsband war mit grayscale(.7) auf kleinen Schirmen
     kaum noch als Bild zu erkennen */
  .invite__bg{ filter:grayscale(.25) brightness(.46); }
}