/* ============================================================
   MITTE BÜRO — EVENT VENUE STYLESHEET

   Loaded AFTER /style.css

   NAVIGATION
   ------------------------------------------------------------
   [00] VENUE SETTINGS
   [01] VENUE SHARED TYPOGRAPHY
   [02] VENUE PAGE / TOP AREA
   [03] RETURN HOME
   [04] VENUE TITLE
   [05] ABOUT + ACTIONS STACK
   [06] VENUE CAROUSEL
   [07] FEATURES
   [08] FLOOR PLAN
   [09] VENUE ACTIONS / BUTTONS
   [10] VENUE FOOTER DETAILS
   [11] DESKTOP VENUE LAYOUT
   [12] DESKTOP HOVER STATES
   [13] REDUCED MOTION

   ============================================================ */


/* ============================================================
   [00] VENUE SETTINGS
   Main venue-specific values to tweak
   ============================================================ */

.venue-page {

  /* ----------------------------------------------------------
     Title
     ---------------------------------------------------------- */

  --venue-title-size-mobile:
    44px;

  --venue-title-size-desktop:
    46px;


  /* ----------------------------------------------------------
     Features
     ---------------------------------------------------------- */

  --venue-feature-size:
    20px;


  /* ----------------------------------------------------------
     Desktop composition
     ---------------------------------------------------------- */

  --venue-desktop-carousel-width:
    clamp(
      220px,
      28vw,
      330px
    );


  /*
    ABOUT uses the same preferred width as
    the homepage opening paragraph.
  */

  --venue-desktop-about-width:
    var(--desktop-intro-width);


  /*
    At narrow desktop widths ABOUT is allowed
    to compress rather than collide with FEATURES.
  */

  --venue-desktop-about-min-width:
    150px;


  /*
    FEATURES mirrors the homepage
    350px editorial column.
  */

  --venue-desktop-features-width:
    var(--desktop-left-width);


  /*
    Protect FEATURES from becoming excessively narrow.

    At narrow desktop widths the middle whitespace and
    ABOUT give up space before FEATURES reaches this size.
  */

  --venue-desktop-features-min-width:
    260px;


  /*
    Minimum horizontal breathing room between
    ABOUT and FEATURES.

    At large widths the flexible middle territory
    becomes much larger automatically.
  */

  --venue-desktop-text-gap-min:
    28px;


  /*
    Paragraph-to-buttons distance.

    Same 12px content → action relationship
    established elsewhere on the site.
  */

  --venue-about-actions-gap:
    12px;

/*
  Floor plan maximum width.
*/

--venue-desktop-floorplan-width:
  440px;


/*
  Small independent vertical adjustments.

  These use transform rather than margins,
  so they do not change grid calculations.
*/

--venue-floorplan-lift:
  -20px;

--venue-about-lift:
  -16px;

--venue-features-drop:
  20px;


  /*
    Horizontal gap between sticky carousel
    and entire right-hand composition.
  */

  --venue-desktop-column-gap:
    clamp(
      40px,
      4vw,
      64px
    );


  /*
    Floor plan → text row.
  */

  --venue-desktop-row-gap:
    26px;


  /* ----------------------------------------------------------
     Sticky desktop left column
     ---------------------------------------------------------- */

  --venue-sticky-title-top:
    72px;

  --venue-sticky-carousel-top:
    158px;

}


/* ============================================================
   [01] VENUE SHARED TYPOGRAPHY
   ============================================================ */


/* ------------------------------------------------------------
   Micro typography
   ------------------------------------------------------------ */

.venue-return,
.venue-section-label,
.venue-carousel__status,
.venue-footer__mark {
  font-family:
    "Barlow Semi Condensed",
    sans-serif;

  font-size:
    var(--micro-font-size);

  font-weight:
    800;

  line-height:
    var(--micro-line-height);

  letter-spacing:
    0.04em;

  -webkit-text-stroke:
    0;

  text-transform:
    uppercase;
}


/* ------------------------------------------------------------
   Main Uchen venue body text

   Accordion copy now lives inside
   .venue-feature__inner p.
   ------------------------------------------------------------ */

.venue-about__text,
.venue-feature__inner p {
  font-family:
    "Uchen",
    serif;

  font-size:
    var(--body-font-size);

  font-weight:
    400;

  line-height:
    var(--body-line-height);

  letter-spacing:
    var(--body-letter-spacing);

  -webkit-text-stroke:
    var(--body-stroke)
    var(--ink);
}


/* ============================================================
   [02] VENUE PAGE / TOP AREA
   Mobile / base
   ============================================================ */

.venue-page .top-info {
  margin-bottom:
    0;
}


/*
  Mobile remains a simple vertical sequence.

  The structural desktop wrappers disappear from
  the mobile layout tree through display: contents.
*/

.venue-content {
  width:
    100%;

  display:
    flex;

  flex-direction:
    column;
}


.venue-right,
.venue-text-row,
.venue-about-stack {
  display:
    contents;
}


/* ------------------------------------------------------------
   Mobile visual order

   ABOUT
   CAROUSEL
   FEATURES
   FLOOR PLAN
   ACTIONS
   ------------------------------------------------------------ */

.venue-about {
  order:
    1;
}


.venue-carousel {
  order:
    2;
}


.venue-features {
  order:
    3;
}


.venue-floorplan {
  order:
    4;
}


.venue-actions {
  order:
    5;
}

/* ------------------------------------------------------------
   Controlled initial page reveal

   Prevents:
   - fallback-font flash
   - broken / unloaded carousel image
   - layout shift while fonts settle
   ------------------------------------------------------------ */

.venue-page {
  animation:
    none;

  transition:
    opacity 0.28s ease;
}


.venue-loading .venue-page {
  opacity:
    0;

  visibility:
    hidden;
}


.venue-is-ready .venue-page {
  opacity:
    1;

  visibility:
    visible;
}

/* ============================================================
   [03] RETURN HOME
   ============================================================ */

.venue-return {
  display:
    inline-block;

  margin-top:
    4px;

  color:
    var(--ink);

  text-decoration:
    none;

  white-space:
    nowrap;

  -webkit-tap-highlight-color:
    transparent;

  transition:
    color 0.16s ease,
    opacity 0.16s ease;
}


/* ============================================================
   [04] VENUE TITLE
   Mobile / base
   ============================================================ */

.venue-header {
  width:
    100%;

  margin-top:
    20px;
}


.venue-title {
  margin:
    0;

  font-family:
    "Barlow Condensed",
    sans-serif;

  font-size:
    var(--venue-title-size-mobile);

  font-weight:
    800;

  line-height:
    0.95;

  letter-spacing:
    0.04em;

  -webkit-text-stroke:
    0.5px
    var(--ink);

  text-transform:
    uppercase;

  text-wrap:
    balance;
}


/* ============================================================
   [05] ABOUT + ACTIONS STACK
   Mobile / base
   ============================================================ */

.venue-about {
  width:
    82%;

  margin-top:
    18px;

  margin-left:
    18%;
}


/*
  Mobile does not show ABOUT label.
  Desktop restores it later.
*/

.venue-about__label {
  display:
    none;
}


.venue-about__text {
  margin:
    0;

  text-align:
    justify;

  text-align-last:
    left;

  text-justify:
    inter-word;

  text-wrap:
    pretty;
}


/* ============================================================
   [06] VENUE CAROUSEL
   Mobile / base
   ============================================================ */

.venue-carousel {
  width:
    100%;

  margin-top:
    16px;
}


/* ------------------------------------------------------------
   [06A] Controls
   ------------------------------------------------------------ */

.venue-carousel__controls {
  width:
    100%;

  height:
    30px;

  display:
    flex;

  align-items:
    center;

  justify-content:
    space-between;
}


.venue-carousel__status {
  display:
    flex;

  align-items:
    center;

  gap:
    8px;
}


/* ------------------------------------------------------------
   Progress circle
   ------------------------------------------------------------ */

.venue-carousel__progress {
  display:
    block;

  width:
    16px;

  height:
    16px;

  transform:
    rotate(-90deg);
}


.venue-carousel__progress-bg,
.venue-carousel__progress-fill {
  fill:
    none;

  stroke-width:
    2.8;
}


.venue-carousel__progress-bg {
  stroke:
    #c5c5c5;
}


.venue-carousel__progress-fill {
  stroke:
    var(--ink);

  stroke-linecap:
    round;

  stroke-dasharray:
    62.83;

  stroke-dashoffset:
    62.83;
}


.venue-carousel__progress-fill.is-running {
  animation:
    venue-carousel-progress
    6s
    linear
    forwards;
}


@keyframes venue-carousel-progress {

  from {
    stroke-dashoffset:
      62.83;
  }

  to {
    stroke-dashoffset:
      0;
  }

}


/* ------------------------------------------------------------
   Next button
   ------------------------------------------------------------ */

.venue-carousel__next {
  position:
    relative;

  width:
    28px;

  height:
    20px;

  padding:
    0;

  margin:
    0;

  border:
    0;

  background:
    transparent;

  color:
    inherit;

  cursor:
    pointer;

  appearance:
    none;

  -webkit-appearance:
    none;

  -webkit-tap-highlight-color:
    transparent;

  -webkit-user-select:
    none;

  user-select:
    none;

  touch-action:
    manipulation;

  transition:
    opacity 0.16s ease;
}


.venue-carousel__next::before,
.venue-carousel__next::after {
  content:
    "";

  position:
    absolute;

  top:
    50%;

  width:
    7px;

  height:
    7px;

  border-right:
    2px solid var(--ink);

  border-bottom:
    2px solid var(--ink);

  transform:
    translateY(-50%)
    rotate(-45deg);
}


.venue-carousel__next::before {
  left:
    7px;
}


.venue-carousel__next::after {
  left:
    13px;
}


.venue-carousel__next:focus:not(:focus-visible) {
  outline:
    none;
}


/* ------------------------------------------------------------
   [06B] Carousel frame
   4:5 everywhere.
   ------------------------------------------------------------ */

.venue-carousel__frame {
  position:
    relative;

  width:
    100%;

  aspect-ratio:
    4 / 5;

  overflow:
    hidden;

  background:
    #ddd;

  touch-action:
    pan-y;

  user-select:
    none;
}


.venue-carousel__image {
  display:
    block;

  width:
    100%;

  height:
    100%;

  margin:
    0;

  padding:
    0;

  border:
    0;

  object-fit:
    cover;

  object-position:
    center;

  opacity:
    1;

  pointer-events:
    none;

  transform:
    none !important;

  animation:
    none !important;

  transition:
    none !important;
}


/* ------------------------------------------------------------
   Temporary incoming crossfade image
   ------------------------------------------------------------ */

.venue-carousel__incoming-image {
  position:
    absolute;

  inset:
    0;

  z-index:
    2;

  display:
    block;

  width:
    100%;

  height:
    100%;

  margin:
    0;

  padding:
    0;

  border:
    0;

  object-fit:
    cover;

  object-position:
    center;

  opacity:
    0;

  pointer-events:
    none;

  transform:
    none !important;

  animation:
    none !important;

  transition:
    opacity 0.24s ease !important;
}


.venue-carousel__incoming-image.is-visible {
  opacity:
    1;
}


/* ------------------------------------------------------------
   [06C] View gallery button
   ------------------------------------------------------------ */

.venue-gallery-button {
  margin-top:
    12px;
}


/* ============================================================
   [07] FEATURES

   Accordion behavior mirrors homepage:
   - CSS chevron
   - 0fr → 1fr body opening
   - line-by-line copy reveal
   ============================================================ */

.venue-features {
  width:
    100%;

  margin-top:
    30px;
}


.venue-section-label {
  margin:
    0 0 14px;
}


.venue-features__list {
  width:
    100%;
}


/* ------------------------------------------------------------
   [07A] Individual feature

   Open item gains extra bottom breathing room,
   matching the homepage accordion rhythm.
   ------------------------------------------------------------ */

.venue-feature {
  width:
    100%;

  margin-bottom:
    12px;

  transition:
    margin-bottom 0.22s ease;
}


.venue-feature.is-open {
  margin-bottom:
    8px;
}


/* ------------------------------------------------------------
   [07B] Feature heading
   ------------------------------------------------------------ */

.venue-feature__toggle {
  width:
    100%;

  display:
    flex;

  align-items:
    center;

  gap:
    10px;

  padding:
    0;

  margin:
    0;

  border:
    0;

  border-radius:
    0;

  background:
    transparent;

  color:
    var(--ink);

  text-align:
    left;

  font-family:
    "Barlow Condensed",
    sans-serif;

  font-size:
    var(--venue-feature-size);

  font-weight:
    700;

  line-height:
    1.08;

  letter-spacing:
    0.04em;

  -webkit-text-stroke:
    0.4px
    var(--ink);

  cursor:
    pointer;

  appearance:
    none;

  -webkit-appearance:
    none;

  -webkit-tap-highlight-color:
    transparent;

  -webkit-user-select:
    none;

  user-select:
    none;

  touch-action:
    manipulation;

  transition:
    opacity 0.16s ease;
}


.venue-feature__toggle:focus:not(:focus-visible) {
  outline:
    none;
}


.venue-feature__toggle:focus-visible {
  outline:
    1px solid
    var(--ink);

  outline-offset:
    3px;
}


/* ------------------------------------------------------------
   [07C] Homepage-style CSS chevron

   The old literal ">" span is no longer used.

   This little compatibility rule also hides it
   if the old HTML is briefly still present.
   ------------------------------------------------------------ */

.venue-feature__arrow {
  display:
    none;
}


.venue-feature__toggle::before {
  content:
    "";

  width:
    7px;

  height:
    7px;

  flex:
    0 0 7px;

  margin-left:
    7px;

  margin-right:
    8px;

  border-right:
    2px solid var(--ink);

  border-bottom:
    2px solid var(--ink);

  transform:
    rotate(-45deg);

  transform-origin:
    center;

  transition:
    transform 0.25s ease;
}


.venue-feature.is-open
.venue-feature__toggle::before {
  transform:
    rotate(45deg);
}


/* ------------------------------------------------------------
   [07D] Smooth accordion open / close

   Content is NEVER display:none.

   The inner wrapper is what clips the copy while
   the grid track animates from 0fr to 1fr.
   ------------------------------------------------------------ */

.venue-feature__content {
  display:
    grid;

  grid-template-rows:
    0fr;

  width:
    100%;

  transition:
    grid-template-rows 0.22s ease;
}


.venue-feature.is-open
.venue-feature__content {
  grid-template-rows:
    1fr;
}


/* ------------------------------------------------------------
   [07E] Accordion inner

   32px indentation mirrors homepage accordion copy.
   ------------------------------------------------------------ */

.venue-feature__inner {
  min-height:
    0;

  overflow:
    hidden;

  padding-left:
    32px;
}


/* ------------------------------------------------------------
   [07F] Accordion body copy

   10px above / 12px below mirrors homepage rhythm.
   ------------------------------------------------------------ */

.venue-feature__inner p {
  margin:
    10px 0 12px;

  text-align:
    justify;

  text-align-last:
    left;

  text-justify:
    inter-word;

  text-wrap:
    pretty;
}


/* ------------------------------------------------------------
   [07G] Line-by-line reveal

   JS converts each actual rendered line into
   .venue-feature__line.

   Same timing principle as homepage.
   ------------------------------------------------------------ */

.venue-feature__line {
  display:
    block;

  width:
    100%;

  opacity:
    0;

  transform:
    translateY(2px);

  transition:
    opacity 0.11s ease,
    transform 0.11s ease;

  transition-delay:
    0s;

  text-align:
    justify;

  text-align-last:
    justify;
}


.venue-feature__line:last-child {
  text-align-last:
    left;
}


.venue-feature.is-open
.venue-feature__line {
  opacity:
    1;

  transform:
    translateY(0);

  transition-delay:
    calc(
      var(--line-index) *
      0.04s
    );
}


/* ============================================================
   [08] FLOOR PLAN
   ============================================================ */

.venue-floorplan {
  width:
    100%;

  margin-top:
    38px;
}


.venue-floorplan__image {
  display:
    block;

  width:
    100%;

  height:
    auto;

  margin:
    0;

  object-fit:
    contain;
}


/* ============================================================
   [09] VENUE ACTIONS / BUTTONS
   Mobile / base
   ============================================================ */

.venue-actions {
  width:
    100%;

  display:
    flex;

  align-items:
    center;

  flex-wrap:
    wrap;

  gap:
    10px;

  margin-top:
    18px;
}


/* ------------------------------------------------------------
   Shared venue button
   ------------------------------------------------------------ */

.venue-button {
  display:
    inline-block;

  padding:
    5px 7px;

  border:
    0;

  border-radius:
    2px;

  background:
    var(--button-grey);

  color:
    var(--ink);

  font-family:
    "Barlow Condensed",
    sans-serif;

  font-size:
    14px;

  font-weight:
    500;

  line-height:
    1.15;

  letter-spacing:
    0.03em;

  text-decoration:
    none;

  -webkit-text-stroke:
    0.4px
    var(--ink);

  text-transform:
    uppercase;

  white-space:
    nowrap;

  cursor:
    pointer;

  appearance:
    none;

  -webkit-appearance:
    none;

  -webkit-tap-highlight-color:
    transparent;

  transition:
    background-color 0.16s ease,
    color 0.16s ease,
    opacity 0.16s ease;
}


/* ============================================================
   [10] VENUE FOOTER DETAILS
   ============================================================ */

.venue-footer__mark {
  display:
    none;

  color:
    var(--ink);

  text-decoration:
    none;

  -webkit-tap-highlight-color:
    transparent;

  transition:
    color 0.16s ease,
    opacity 0.16s ease;
}

/*
  Mobile footer follows normal document flow.
*/

.venue-page .site-footer {
  margin-top:
    58px;
}


/* ============================================================
   [11] DESKTOP VENUE LAYOUT
   800px and above
   ============================================================ */

@media (min-width: 800px) {


  /* ----------------------------------------------------------
     PAGE SHELL

     Same basic page-bottom architecture as homepage.

     The right-hand composition now lives entirely in
     normal flow, so opening FEATURES naturally increases
     page height without JS measurement.
     ---------------------------------------------------------- */

  .venue-page {
    position:
      relative;

    min-height:
      100vh;

    height:
      auto;

    overflow:
      visible;

    padding-bottom:
      65px;
  }


  /* ----------------------------------------------------------
     Top info
     ---------------------------------------------------------- */

  .venue-page .top-info {
    margin:
      0;
  }


  /* ----------------------------------------------------------
     Return home
     ---------------------------------------------------------- */

  .venue-return {
    position:
      fixed;

    top:
      calc(
        var(--desktop-edge) +
        15px
      );

    left:
      var(--desktop-edge);

    z-index:
      100;

    margin:
      0;
  }


  /* ----------------------------------------------------------
     STICKY VENUE TITLE
     ---------------------------------------------------------- */

  .venue-header {
    position:
      sticky;

    top:
      var(--venue-sticky-title-top);

    z-index:
      80;

    width:
      max-content;

    margin-top:
      52px;
  }


  .venue-title {
    position:
      relative;

    z-index:
      1;

    width:
      max-content;

    font-size:
      var(--venue-title-size-desktop);
  }


  /* ----------------------------------------------------------
     VENUE DESKTOP FIELD

     IMPORTANT STRUCTURAL CHANGE:

     Column 1 = sticky carousel
     Column 2 = entire independent right-hand composition

     The carousel no longer spans the same grid rows
     as FLOOR PLAN / ABOUT / FEATURES.

     Therefore accordion expansion cannot change the
     starting Y-position of ABOUT or FEATURES.
     ---------------------------------------------------------- */

  .venue-content {
    position:
      relative;

    display:
      grid;

    grid-template-columns:
      var(--venue-desktop-carousel-width)
      minmax(0, 1fr);

    column-gap:
      var(--venue-desktop-column-gap);

    align-items:
      start;

    width:
      100%;

    min-height:
      0;

    height:
      auto;

    margin-top:
      34px;
  }


  /*
    Reset the mobile display:contents system.
  */

  .venue-right {
    display:
      grid;
  }


  .venue-text-row,
  .venue-about-stack {
    display:
      grid;
  }


  .venue-about,
  .venue-carousel,
  .venue-features,
  .venue-floorplan,
  .venue-actions {
    order:
      initial;
  }


  /* ----------------------------------------------------------
     STICKY DESKTOP CAROUSEL

     Independent from right-hand row calculations.
     ---------------------------------------------------------- */

  .venue-carousel {
    position:
      sticky;

    top:
      var(--venue-sticky-carousel-top);

    z-index:
      70;

    grid-column:
      1;

    align-self:
      start;

    width:
      var(--venue-desktop-carousel-width);

    margin:
      0;
  }


  .venue-carousel__image,
  .venue-carousel__incoming-image {
    object-position:
      center center;
  }


  /* ----------------------------------------------------------
     RIGHT-HAND COMPOSITION

     Row 1 = floor plan
     Row 2 = stable ABOUT / FEATURES text row

     Opening FEATURES only increases row 2 downward.
     Its TOP coordinate cannot change.
     ---------------------------------------------------------- */

  .venue-right {
    grid-column:
      2;

    min-width:
      0;

    width:
      100%;

    grid-template-rows:
      auto
      auto;

    row-gap:
      var(--venue-desktop-row-gap);

    align-content:
      start;
  }


  /* ----------------------------------------------------------
     DESKTOP FLOOR PLAN
     ---------------------------------------------------------- */

.venue-floorplan {
  grid-row:
    1;

  justify-self:
    center;

  width:
    min(
      100%,
      var(--venue-desktop-floorplan-width)
    );

  margin:
    0;

  transform:
    translateY(
      var(--venue-floorplan-lift)
    );
}

  /* ----------------------------------------------------------
     STABLE DESKTOP TEXT ROW

     Three tracks:

     1. ABOUT
        prefers 285px, may shrink to 150px

     2. flexible breathing room
        absorbs narrowing FIRST

     3. FEATURES
        prefers 350px, may shrink to 260px

     This gives us homepage-like fixed editorial widths
     whenever possible while remaining responsive.
     ---------------------------------------------------------- */

  .venue-text-row {
    grid-row:
      2;

    width:
      100%;

    min-width:
      0;

    grid-template-columns:
      minmax(
        var(--venue-desktop-about-min-width),
        var(--venue-desktop-about-width)
      )
      minmax(
        var(--venue-desktop-text-gap-min),
        1fr
      )
      minmax(
        var(--venue-desktop-features-min-width),
        var(--venue-desktop-features-width)
      );

    align-items:
      start;

    margin:
      -10px 0 0;
  }


  /* ----------------------------------------------------------
     DESKTOP ABOUT + ACTIONS STACK

     Lives entirely in the left text track.
     ---------------------------------------------------------- */

.venue-about-stack {
  grid-column:
    1;

  display:
    flex;

  flex-direction:
    column;

  align-items:
    flex-start;

  gap:
    var(--venue-about-actions-gap);

  width:
    100%;

  min-width:
    0;

  margin:
    0;

  transform:
    translateY(
      var(--venue-about-lift)
    );
}

  /* ----------------------------------------------------------
     DESKTOP ABOUT
     ---------------------------------------------------------- */

  .venue-about {
    position:
      static;

    width:
      100%;

    max-width:
      none;

    min-width:
      0;

    margin:
      0;
  }


  .venue-about__label {
    display:
      block;

    margin-bottom:
      16px;
  }


  .venue-about__text {
    width:
      100%;

    min-width:
      0;
  }


  /* ----------------------------------------------------------
     DESKTOP ACTIONS

     Their distance from ABOUT is controlled ONLY by
     --venue-about-actions-gap.
     ---------------------------------------------------------- */

  .venue-actions {
    position:
      static;

    width:
      100%;

    display:
      flex;

    flex-direction:
      row;

    flex-wrap:
      wrap;

    align-items:
      flex-start;

    justify-content:
      flex-start;

    gap:
      8px;

    margin:
      0;
  }


  .venue-button {
    font-size:
      16px;
  }


  /* ----------------------------------------------------------
     DESKTOP FEATURES

     Lives in the right text track.

     Its right edge naturally reaches the right edge of
     the usable page composition.

     Crucially: no absolute positioning and no negative
     vertical calculations based on its height.
     ---------------------------------------------------------- */

 .venue-features {
  grid-column:
    3;

  align-self:
    start;

  justify-self:
    stretch;

  width:
    100%;

  min-width:
    0;

  max-width:
    none;

  margin:
    0;

  transform:
    translateY(
      var(--venue-features-drop)
    );
}


  .venue-features
  .venue-section-label {
    margin-bottom:
      16px;
  }


  /*
    Homepage desktop accordion rhythm.
  */

  .venue-feature {
    margin-bottom:
      8px;
  }


  .venue-feature.is-open {
    margin-bottom:
      4px;
  }


  .venue-feature__toggle {
    font-size:
      20px;
  }


  /* ----------------------------------------------------------
     Gallery button
     ---------------------------------------------------------- */

  .venue-gallery-button {
    margin-top:
      12px;
  }


  /* ----------------------------------------------------------
     VENUE FOOTER

     Shared footer items inherit their desktop positioning
     from /style.css.
     ---------------------------------------------------------- */

  .venue-page .site-footer {
    margin:
      0;
  }


  /* ----------------------------------------------------------
     MITTE BÜRO
     Venue-only bottom-right micrographic.
     ---------------------------------------------------------- */

  .venue-footer__mark {
    position:
      absolute;

    right:
      var(--desktop-edge);

    bottom:
      var(--desktop-edge);

    z-index:
      100;

    display:
      block;

    white-space:
      nowrap;

    text-align:
      right;
  }


}


/* ============================================================
   [12] DESKTOP HOVER STATES
   True mouse / trackpad only
   ============================================================ */

@media
  (min-width: 800px)
  and (hover: hover)
  and (pointer: fine) {


  .venue-return:hover {
    color:
      var(--muted-hover);
  }


  .venue-carousel__next:hover {
    opacity:
      0.8;
  }


  .venue-feature__toggle:hover {
    opacity:
      0.8;
  }


  .venue-button:hover {
    background-color:
      var(--button-grey-hover);
  }

.venue-footer__mark:hover {
  color:
    var(--muted-hover);
}
     
}


/* ============================================================
   [13] REDUCED MOTION
   Accessibility
   ============================================================ */

@media (prefers-reduced-motion: reduce) {


  .venue-carousel__progress-fill,
  .venue-carousel__incoming-image,
  .venue-return,
  .venue-carousel__next,
  .venue-feature,
  .venue-feature__toggle,
  .venue-feature__content,
  .venue-feature__line,
  .venue-button {
    animation:
      none !important;

    transition:
      none !important;
  }


  .venue-feature__toggle::before {
    transition:
      none !important;
  }


}