/*
 * Mechanik 80 — final presentation polish v9.10.0
 * Dark institutional header, concise footer, clean partner wall and deeper archive patina.
 */

:root { --m80-header-h: 194px; }

/* --------------------------------------------------------------------------
   Header: remove the detached white utility strip and give the actual school
   identity enough width. Contact details must remain on one readable line.
   -------------------------------------------------------------------------- */
.m80-utility-bar { display: none !important; }
.m80-header--dropdown .m80-header-container {
  width: min(1720px,calc(100vw - 24px)) !important;
}
.m80-header--dropdown .m80-identity-bar {
  height: 126px;
  color: #fff;
  background:
    linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px),
    linear-gradient(rgba(255,255,255,.028) 1px,transparent 1px),
    linear-gradient(112deg,#03101f 0%,#071b32 52%,#0c3157 100%);
  background-size: 108px 108px,108px 108px,auto;
  border-bottom-color: rgba(255,255,255,.15);
  box-shadow: 0 16px 38px rgba(3,13,26,.24);
}
.m80-header--dropdown .m80-identity-bar__inner { gap: clamp(20px,2.2vw,42px); }
.m80-header--dropdown .m80-identity-lockup {
  flex: 0 0 388px;
  gap: 14px;
}
.m80-header--dropdown .m80-brand__image,
.m80-header--dropdown.is-sticky .m80-brand__image {
  width: 258px !important;
  height: 116px !important;
  padding: 5px 12px !important;
  overflow: hidden !important;
  border-color: rgba(255,255,255,.22) !important;
  background: linear-gradient(135deg,#031225,#0b3159) !important;
}
.m80-header--dropdown .m80-brand__image > img,
.m80-header--dropdown.is-sticky .m80-brand__image > img {
  position: relative !important;
  inset: auto !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  max-height: 100% !important;
  display: block !important;
  object-fit: contain !important;
  object-position: center !important;
  opacity: 1 !important;
  transform: none !important;
}
.m80-header--dropdown .m80-brand__image::after,
.m80-header--dropdown.is-sticky .m80-brand__image::after {
  z-index: 4 !important;
  top: 5px !important;
  right: 12px !important;
  bottom: 5px !important;
  left: 12px !important;
  width: auto !important;
  height: auto !important;
  background: linear-gradient(108deg,transparent 29%,rgba(255,255,255,.12) 39%,rgba(255,255,255,.9) 49%,rgba(255,255,255,.12) 59%,transparent 69%) !important;
  -webkit-mask: url("../images/logo-mechanik-original.png") center / contain no-repeat !important;
  mask: url("../images/logo-mechanik-original.png") center / contain no-repeat !important;
  opacity: 0 !important;
  transform: translateX(-155%) !important;
  transition: transform .88s cubic-bezier(.18,.8,.18,1),opacity .18s ease !important;
}
.m80-header--dropdown .m80-brand:hover .m80-brand__image::after,
.m80-header--dropdown .m80-brand:focus-visible .m80-brand__image::after {
  opacity: .78 !important;
  transform: translateX(155%) !important;
}
.m80-header--dropdown .m80-brand:hover .m80-brand__image,
.m80-header--dropdown .m80-brand:focus-visible .m80-brand__image {
  border-color: rgba(255,255,255,.55) !important;
  box-shadow: 0 21px 48px rgba(0,0,0,.34),0 0 0 3px rgba(230,0,50,.13),inset 0 0 0 1px rgba(255,255,255,.08) !important;
  transform: translateY(-2px) !important;
}
.m80-header--dropdown .m80-header-jubilee {
  width: 110px;
  height: 104px;
  padding: 4px;
  border: 1px solid rgba(255,255,255,.2);
  background: #f5f1e9;
}
.m80-header--dropdown .m80-header-contacts {
  width: auto;
  min-width: 0;
  flex: 1 1 auto;
  grid-template-columns: 1.02fr 1fr 1.35fr;
  color: #fff;
  border-right: 1px solid rgba(255,255,255,.14);
}
.m80-header--dropdown .m80-header-contacts > a {
  min-width: 0;
  padding: 0 clamp(16px,1.45vw,28px);
  gap: clamp(10px,.85vw,16px);
  border-left-color: rgba(255,255,255,.14);
}
.m80-header--dropdown .m80-header-contacts > a:hover,
.m80-header--dropdown .m80-header-contacts > a:focus-visible {
  color: #06172c;
  background: #f4efe7;
}
.m80-header--dropdown .m80-header-contacts img {
  width: 50px;
  height: 50px;
  flex-basis: 50px;
}
.m80-header--dropdown .m80-header-contacts small { font-size: 9px; }
.m80-header--dropdown .m80-header-contacts strong {
  font-size: clamp(10.5px,.68vw,13px);
  line-height: 1.28;
  overflow-wrap: normal;
}
.m80-header--dropdown .m80-header-contacts > a:nth-child(2) strong,
.m80-header--dropdown .m80-header-contacts > a:nth-child(3) strong { white-space: nowrap; }

.m80-dropbar,
.m80-header--dropdown.is-sticky .m80-dropbar { height: 68px; }
.m80-dropnav-menu > li { height: 68px; }
.m80-dropnav-menu > li > a {
  padding-inline: clamp(5px,.47vw,9px);
  font-size: clamp(10.5px,.68vw,13px);
  letter-spacing: .035em;
}
.m80-dropnav-menu > li.m80-nav-jubilee > a { padding-inline: clamp(10px,.7vw,14px); }
.m80-dropnav-toggle { width: 23px; min-width: 23px; }
.m80-dropnav-menu .sub-menu .sub-menu a {
  font-size: 12px;
  line-height: 1.32;
}
.m80-dropactions__facebook { width: 50px; }
.m80-dropactions__bip { width: 60px; }
.m80-dropbar .m80-mobile-search {
  width: 50px;
  padding: 14px;
  display: grid;
  place-items: center;
  border: 0;
  border-left: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.035);
  cursor: pointer;
}
.m80-dropbar .m80-mobile-search:hover,
.m80-dropbar .m80-mobile-search:focus-visible { background: var(--m80-red); }
.m80-dropbar .m80-mobile-search img { width: 22px; height: 22px; object-fit: contain; }

/* --------------------------------------------------------------------------
   The archive is deliberately warmer, darker and visibly damaged. The same
   geometric photograph is still shared by both sides, so the facade aligns.
   -------------------------------------------------------------------------- */
.m80-hero__photo--past {
  background-color: #765127 !important;
  filter: grayscale(.24) sepia(1) saturate(.6) hue-rotate(-7deg) contrast(1.26) brightness(.62) !important;
}
.m80-hero__photo--past::before {
  opacity: 1 !important;
  filter: sepia(.82) saturate(.68) contrast(1.15) brightness(.82);
  mix-blend-mode: multiply !important;
}
.m80-hero__photo--past::after {
  background-image:
    radial-gradient(ellipse at 44% 42%,transparent 12%,rgba(44,23,7,.2) 54%,rgba(30,15,4,.72) 100%),
    linear-gradient(96deg,rgba(140,91,33,.38),rgba(74,42,12,.08) 70%,rgba(25,14,5,.32)),
    url("../images/archive-damage-texture.png") !important;
  background-position: center,center,center !important;
  background-size: cover,cover,cover !important;
  background-blend-mode: multiply,multiply,soft-light !important;
  mix-blend-mode: multiply !important;
  opacity: .82 !important;
}
.m80-hero__photo--now { filter: saturate(1.12) contrast(1.06) brightness(.84) !important; }

/* --------------------------------------------------------------------------
   Legacy Divi output may still contain old card labels for one request. Hide
   obsolete fragments only when present; the PHP migration updates the source.
   -------------------------------------------------------------------------- */
.m80-console-tile--long h3 { max-width: 15ch; }

/* --------------------------------------------------------------------------
   Partner wall: the visual is the logo itself. No catalogue number or repeated
   call-to-action is needed inside every tile.
   -------------------------------------------------------------------------- */
.m80-partners__grid .m80-partner-card {
  height: 166px;
  padding: 10px 12px 12px;
  grid-template-rows: 112px minmax(0,1fr);
  gap: 7px;
}
.m80-partners__grid .m80-partner-card > span,
.m80-partners__grid .m80-partner-card > small { display: none !important; }
.m80-partners__grid .m80-partner-card img {
  width: 100%;
  height: 112px;
  padding: 0;
  object-fit: contain;
}
.m80-partners__grid .m80-partner-card strong {
  align-self: center;
  font-size: 15px;
  line-height: 1.08;
  text-align: center;
}
.m80-partners__grid .m80-partner-card:hover img { transform: scale(1.055); }

/* --------------------------------------------------------------------------
   Footer: one school mark inside the school data tile, four useful data cards
   and one horizontal editor-owned menu. The two ambient raster cogs stay.
   -------------------------------------------------------------------------- */
.m80-footer { padding-top: clamp(64px,5.8vw,90px) !important; }
.m80-footer__logos,
.m80-footer__actions,
.m80-footer__nav-label { display: none !important; }
.m80-footer__inner {
  grid-template-columns: minmax(300px,.68fr) minmax(0,1.32fr) !important;
  gap: clamp(42px,5vw,80px) !important;
}
.m80-footer__lead h2 {
  margin: 20px 0 0 !important;
  font-size: clamp(58px,5.2vw,86px) !important;
  line-height: .81 !important;
}
.m80-footer__contact > div,
.m80-footer__contact > div:nth-child(even) {
  min-height: 124px;
  padding: 18px 16px !important;
  grid-template-columns: 68px minmax(0,1fr);
  column-gap: 14px;
}
.m80-footer__contact > div > img,
.m80-footer__contact > div:nth-child(odd) > img {
  position: static;
  width: 54px;
  height: 54px;
  margin: 0;
}
.m80-footer__contact > div > .m80-footer__school-mark,
.m80-footer__contact > div:nth-child(odd) > .m80-footer__school-mark {
  width: 68px !important;
  height: 58px !important;
  margin-left: -7px;
  object-fit: contain !important;
}
.m80-footer__contact strong,
.m80-footer__contact a { font-size: 11.5px; line-height: 1.55; }
.m80-footer__nav {
  grid-column: 1 / -1 !important;
  margin-top: 20px !important;
  padding-top: 0 !important;
  overflow-x: auto;
  scrollbar-width: thin;
  scrollbar-color: var(--m80-red) rgba(255,255,255,.08);
}
.m80-footer__nav > ul,
.m80-footer__nav .m80-footer-menu {
  min-width: max-content;
  display: flex !important;
  flex-wrap: nowrap !important;
  border-left: 1px solid rgba(255,255,255,.18);
}
.m80-footer__nav li {
  min-width: 145px;
  flex: 1 1 0 !important;
}
.m80-footer__nav a {
  min-height: 52px;
  padding: 13px clamp(14px,1.5vw,26px) !important;
  justify-content: center;
  white-space: nowrap;
  font-size: 11px !important;
}
.m80-footer__bottom { margin-top: 26px; }

@media (max-width: 1500px) and (min-width: 1281px) {
  .m80-header--dropdown .m80-identity-lockup { flex-basis: 350px; }
  .m80-header--dropdown .m80-brand__image,
  .m80-header--dropdown.is-sticky .m80-brand__image { width: 232px !important; }
  .m80-header--dropdown .m80-header-jubilee { width: 100px; }
  .m80-header--dropdown .m80-header-contacts > a { padding-inline: 13px; }
  .m80-header--dropdown .m80-header-contacts img { width: 45px; height: 45px; flex-basis: 45px; }
  .m80-dropnav-menu > li > a { padding-inline: 5px; font-size: clamp(10px,.76vw,11.5px); }
  .m80-dropnav-toggle { width: 19px; min-width: 19px; }
  .m80-dropactions__facebook,
  .m80-dropbar .m80-mobile-search { width: 44px; }
  .m80-dropactions__bip { width: 52px; }
}

@media (max-width: 1280px) {
  :root { --m80-header-h: 82px; }
  .m80-header--dropdown .m80-identity-bar,
  .m80-header--dropdown.is-sticky .m80-identity-bar {
    height: 82px !important;
    background: linear-gradient(112deg,#03101f,#0b3158) !important;
  }
  .m80-header--dropdown .m80-identity-lockup { flex-basis: auto; }
  .m80-header--dropdown .m80-brand__image,
  .m80-header--dropdown.is-sticky .m80-brand__image {
    width: 162px !important;
    height: 74px !important;
    padding: 3px 7px !important;
  }
  .m80-header--dropdown .m80-header-jubilee { width: 70px; height: 68px; }
  .m80-dropbar .m80-mobile-search { display: flex; }
  .m80-footer__inner { grid-template-columns: 1fr !important; }
  .m80-footer__lead,
  .m80-footer__contact,
  .m80-footer__nav { grid-column: 1 !important; }
  .m80-footer__lead h2 { max-width: 720px; }
}

@media (max-width: 820px) {
  .m80-partners__grid .m80-partner-card {
    height: 150px;
    padding: 8px 9px 10px;
    grid-template-rows: 94px minmax(0,1fr);
  }
  .m80-partners__grid .m80-partner-card img { height: 94px; }
  .m80-footer__contact { grid-template-columns: 1fr !important; }
  .m80-footer__contact > div,
  .m80-footer__contact > div:nth-child(even) { border-left: 0 !important; }
}

@media (max-width: 620px) {
  :root { --m80-header-h: 74px; }
  .m80-header--dropdown .m80-identity-bar,
  .m80-header--dropdown.is-sticky .m80-identity-bar { height: 74px !important; }
  .m80-header--dropdown .m80-brand__image,
  .m80-header--dropdown.is-sticky .m80-brand__image {
    width: 132px !important;
    height: 66px !important;
    padding: 3px 5px !important;
  }
  .m80-header--dropdown .m80-brand:hover .m80-brand__image,
  .m80-header--dropdown .m80-brand:focus-visible .m80-brand__image { transform: none !important; }
  .m80-hero__photo--past::after { opacity: .72 !important; }
  .m80-hero__photo--past::before { opacity: .62 !important; }
  .m80-partners__grid .m80-partner-card strong { font-size: 13px; }
  .m80-footer { padding-top: 58px !important; }
  .m80-footer__inner { gap: 34px !important; }
  .m80-footer__lead h2 { font-size: clamp(52px,16vw,70px) !important; }
  .m80-footer__contact > div,
  .m80-footer__contact > div:nth-child(even) {
    min-height: 112px !important;
    padding: 16px 12px !important;
    grid-template-columns: 62px minmax(0,1fr);
  }
  .m80-footer__contact > div > img,
  .m80-footer__contact > div:nth-child(odd) > img { width: 48px; height: 48px; }
  .m80-footer__contact > div > .m80-footer__school-mark,
  .m80-footer__contact > div:nth-child(odd) > .m80-footer__school-mark { width: 60px !important; height: 52px !important; }
  .m80-footer__nav { margin-top: 4px !important; }
  .m80-footer__nav > ul,
  .m80-footer__nav .m80-footer-menu {
    width: max-content;
    min-width: 100%;
    display: flex !important;
    grid-template-columns: none !important;
    flex-wrap: nowrap !important;
  }
  .m80-footer__nav li { min-width: 132px; }
  .m80-footer__nav a { min-height: 49px; font-size: 10px !important; }
  .m80-footer__bottom { margin-top: 20px; }
}

@media (prefers-reduced-motion: reduce) {
  .m80-header--dropdown .m80-brand__image::after { display: none !important; }
}