/* MAINKUN unified motion + home UX refinements · 2026-10-14 */
:root{
  --mk-motion-fast:280ms;
  --mk-motion-reveal:620ms;
  --mk-motion-ease:cubic-bezier(.2,.72,.2,1);
  --mk-motion-delay:45ms;
}

/* One motion language: quick hover, soft reveal, no springy overshoot. */
.motion-ready .ui-reveal{
  opacity:0;
  filter:blur(1px);
  translate:0 16px;
  transition-property:opacity,translate,filter;
  transition-duration:520ms,var(--mk-motion-reveal),500ms;
  transition-timing-function:var(--mk-motion-ease);
  transition-delay:calc(var(--ui-order,0) * var(--mk-motion-delay));
}
.motion-ready .ui-reveal.is-visible{opacity:1;filter:none;translate:0 0}

.site-logo img,.language-switch,.button,.button>span:last-child,.text-link,.path-card,.path-card b,
.featured-card,.featured-image-wrap img,.featured-lineup-card,.featured-lineup-card i,
.beer-summary,.beer-swatch img,.experience-cards article,.experience-media img,
.location-map-links a,.sns-block>a,.floating-contact-link,.home-latest-card{
  transition-duration:var(--mk-motion-fast)!important;
  transition-timing-function:var(--mk-motion-ease)!important;
}

/* Hero CTA: let three distinct visitor intents read as one group. */
.home-hero .hero-actions{flex-wrap:wrap}
.home-hero .hero-actions .button{will-change:transform}
@media (hover:hover) and (pointer:fine){
  .home-hero .hero-actions .button:hover{transform:translateY(-2px)}
}

/* Featured beer cards and lineup CTA share exactly the same reveal/hover rhythm. */
.featured-grid.has-lineup-cta > .ui-reveal{transition-delay:calc(var(--ui-order,0) * var(--mk-motion-delay))}
.featured-card{position:relative}
.featured-card .featured-detail-link{
  position:absolute;inset:0;z-index:4;border:0;text-indent:-9999px;overflow:hidden;
}
.featured-card:focus-within{outline:2px solid currentColor;outline-offset:4px}
@media (hover:hover) and (pointer:fine){
  .featured-card:hover,.featured-lineup-card:hover{transform:translateY(-4px)}
}

/* Discovery: brand / visit / business are separate intents on desktop. */
.home-paths .path-grid.is-purpose-split{grid-template-columns:repeat(3,minmax(0,1fr))}
.home-paths .path-card.business-card{background:#171914;color:#fff9e9}
.home-paths .path-card.business-card p{color:#fff9e9b8}

/* Empty news should not reserve the height of a populated editorial section. */
.home-latest.is-empty-news{padding-top:clamp(38px,5vw,70px);padding-bottom:clamp(38px,5vw,70px)}
.home-latest.is-empty-news .home-latest-head{margin-bottom:24px}
.home-latest.is-empty-news .home-latest-head h2{font-size:clamp(30px,4vw,52px)}
.home-latest.is-empty-news .home-latest-empty{min-height:0;padding:22px 24px}

/* Footer guide link now occupies the former archive-link position. */
.site-footer .footer-trade-guide-link{opacity:.86;text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}
.site-footer .footer-trade-guide-link:hover,.site-footer .footer-trade-guide-link:focus-visible{opacity:1}
/* Old injected trade link must never duplicate the new canonical footer link. */
.site-footer > .footer-trade-link{display:none!important}

/* General interaction timing cleanup for controls that were too abrupt. */
.beer-browser-filters button,.location-copy .location-address-copy,
.news-filter button,.detail-toggle,.contact-channel-card a,.visit-faq summary{
  transition-duration:var(--mk-motion-fast)!important;
  transition-timing-function:var(--mk-motion-ease)!important;
}


/* Desktop hero: preserve the original video proportions and height.
   The original MALT / BREW / POUR strip now occupies the remaining first-screen
   space, so the film itself is never stretched and no empty bridge is needed. */
@media (min-width:981px){
  body:has(.home-hero) .home-hero{
    height:calc(100svh - 80px);
    min-height:620px;
    max-height:780px;
  }
}

@media (max-width:980px){
  .home-paths .path-grid.is-purpose-split{grid-template-columns:1fr 1fr}
  .home-paths .path-grid.is-purpose-split .business-card{grid-column:1/-1}
}
@media (max-width:767px){
  .home-paths .path-grid.is-purpose-split{grid-template-columns:1fr}
  .home-paths .path-grid.is-purpose-split .business-card{grid-column:auto}
}
@media (prefers-reduced-motion:reduce){
  .motion-ready .ui-reveal{opacity:1;filter:none;translate:0;transition:none!important}
  .site-logo img,.language-switch,.button,.button>span:last-child,.text-link,.path-card,.path-card b,
  .featured-card,.featured-image-wrap img,.featured-lineup-card,.featured-lineup-card i,
  .beer-summary,.beer-swatch img,.experience-cards article,.experience-media img,
  .location-map-links a,.sns-block>a,.floating-contact-link,.home-latest-card{transition:none!important}
}

/* Expand/collapse and small state changes should feel related to card motion. */
.beer-expand-shell,.beer-expanded,.detail-toggle,.award-pill,
.contact-form input,.contact-form textarea,.contact-form select,
.visit-faq summary i,.floating-contact-dock{
  transition-duration:320ms!important;
  transition-timing-function:var(--mk-motion-ease)!important;
}

@media (prefers-reduced-motion:reduce){
  .mainegg,.mainegg-card,
  .beer-expand-shell,.beer-expanded,.detail-toggle,.award-pill,.visit-faq summary i,.floating-contact-dock{
    animation:none!important;transition:none!important;
  }
}

/* Give the final home sections their own fields instead of letting them merge visually. */
body:has(.home-hero) .home-paths{
  background:#ece8dc;
  border-top:1px solid rgba(23,25,20,.08);
  border-bottom:1px solid rgba(23,25,20,.10);
}
body:has(.home-hero) .contact-channels{
  background:#f7f2e7;
  border-top:0;
}
body:has(.home-hero) .home-paths > .section-label,
body:has(.home-hero) .contact-channels .section-label{
  color:#76590e;
}