/* Master e Professioni — v0.9.1-rc5 / mobile-only presentation and motion.
 * Independent of WooCommerce/LMS, 3D scene and desktop templates.
 * Animations are triggered by vmag-mobile.js route classes, never by page scroll.
 */

/* One compact Chat Docenti plate for HOME / CORSI / CHI SIAMO (all mobile routes).
 * Preserve the same full width and the clickable launcher surface. */
html[data-vmag-mode="mobile"] .mep-m-chat-panel {
  box-sizing:border-box;
  height:31px;
  min-height:31px;
  max-height:31px;
}
html[data-vmag-mode="mobile"] .mep-m-chat-launcher {
  box-sizing:border-box;
  height:29px;
  min-height:29px;
  margin:0;
  padding:0 101px 0 11px;
  font-size:11px;
  line-height:1;
}
html[data-vmag-mode="mobile"] .mep-m-chat-operators {
  top:8px;
  right:13px;
  grid-template-columns:repeat(4,10px);
  gap:6px;
}
html[data-vmag-mode="mobile"] .mep-m-chat-operators i {width:10px;height:10px}
html[data-vmag-mode="mobile"] .mep-m-chat-operators i::after {
  left:-1px;right:-1px;bottom:-4px;height:3px;
}
html[data-vmag-mode="mobile"] .mep-m-chat-panel::before {width:57px;height:1px}

/* Move search closer to navigation and save vertical room without changing UX. */
html[data-vmag-mode="mobile"] .mep-m-search {
  min-height:36px;
  height:36px;
  margin:5px 0 8px;
  grid-template-columns:23px minmax(0,1fr) 77px;
}
html[data-vmag-mode="mobile"] .mep-m-search input {
  height:34px;
  padding:0 5px;
  font-size:10.5px;
  letter-spacing:.24px;
}
html[data-vmag-mode="mobile"] .mep-m-search>span {font-size:19px}
html[data-vmag-mode="mobile"] .mep-m-search button {
  height:36px;
  font-size:12px;
}

/* HOME now has CORSI's compact shapes, copper-to-brass replaced by warm gold.
 * Icon is intentionally much more prominent than on the course cards. */
html[data-vmag-mode="mobile"] .mep-m-home-card {
  margin-bottom:19px;
  transform-origin:44% 28%;
}
html[data-vmag-mode="mobile"] .mep-m-home-card .mep-m-offer-meta {
  min-height:22px;
  gap:5px;
  padding:0 5px;
  font-size:9px;
  letter-spacing:.06px;
}
html[data-vmag-mode="mobile"] .mep-m-home-card .mep-m-offer-meta strong {color:#d9a54e}
html[data-vmag-mode="mobile"] .mep-m-home-card h2 {
  width:78%;
  min-height:0;
  margin:0;
  padding:5px 10px;
  background:linear-gradient(101deg,#e9af41 0%,#efbd53 67%,#d99d3b 100%);
  color:#14242b;
  font:900 clamp(16.5px,4.35vw,18.5px)/1.09 "Trebuchet MS",Arial,sans-serif;
  letter-spacing:.2px;
  text-transform:none;
  clip-path:polygon(0 0,91% 0,100% 100%,0 100%);
  overflow-wrap:break-word;
}
html[data-vmag-mode="mobile"] .mep-m-home-card .mep-m-offer-body {padding:11px 12px 12px}
html[data-vmag-mode="mobile"] .mep-m-home-card .mep-m-offer-body>p {
  margin:0 0 10px;
  font-size:14px;
  line-height:1.5;
}
html[data-vmag-mode="mobile"] .mep-m-home-card .mep-m-enrol {
  column-gap:10px;
  row-gap:1px;
  margin-top:5px;
}
html[data-vmag-mode="mobile"] .mep-m-home-card .mep-m-enrol::before {
  width:43px;
  height:43px;
  font-size:39px;
  line-height:1;
  color:#f5bb50;
  border-color:rgba(221,163,62,.6);
  text-shadow:0 0 12px rgba(255,182,53,.27);
  box-shadow:inset 0 0 13px rgba(221,148,36,.12);
}
html[data-vmag-mode="mobile"] .mep-m-home-card .mep-m-enrol span {font-size:9px;line-height:1.05}
html[data-vmag-mode="mobile"] .mep-m-home-card .mep-m-enrol strong {font-size:12px;line-height:1.25}
html[data-vmag-mode="mobile"] .mep-m-home-card .mep-m-card-action {
  margin-top:8px;
  font-size:10px;
}

/* Re-entry animation based on reference: translucent forms surface from the
 * blue-black field, then HUD labels assemble with a quiet left-to-right sweep. */
html[data-vmag-mode="mobile"] .mep-m-view[data-mobile-view="home"].is-home-entering {animation:none}
html[data-vmag-mode="mobile"] .is-home-entering .mep-m-home-card {
  animation:mepHomeMaterialize 1020ms cubic-bezier(.16,1,.3,1) both;
  animation-delay:calc(var(--mep-home-index,0) * 170ms);
}
html[data-vmag-mode="mobile"] .is-home-entering .mep-m-home-card .mep-m-offer-meta,
html[data-vmag-mode="mobile"] .is-home-entering .mep-m-home-card .mep-m-offer-body {
  animation:mepHomeDetail 970ms cubic-bezier(.19,1,.32,1) both;
  animation-delay:calc(200ms + var(--mep-home-index,0) * 170ms);
}
html[data-vmag-mode="mobile"] .is-home-entering .mep-m-home-card h2 {
  animation:mepHomePlateDraw 1140ms cubic-bezier(.16,1,.3,1) both;
  animation-delay:calc(140ms + var(--mep-home-index,0) * 170ms);
}
@keyframes mepHomeMaterialize {
  0%{opacity:0;transform:translate3d(-13px,12px,0) scale(.953);filter:blur(6px) brightness(.56)}
  44%{opacity:.67;filter:blur(2px) brightness(.82)}
  100%{opacity:1;transform:none;filter:none}
}
@keyframes mepHomePlateDraw {
  0%{opacity:0;transform:translate3d(-14px,0,0);filter:blur(5px) brightness(.58);clip-path:polygon(0 0,0 0,0 100%,0 100%)}
  35%{opacity:.95;clip-path:polygon(0 0,46% 0,49% 100%,0 100%)}
  100%{opacity:1;transform:none;filter:none;clip-path:polygon(0 0,91% 0,100% 100%,0 100%)}
}
@keyframes mepHomeDetail {
  0%{opacity:0;transform:translate3d(-9px,6px,0);filter:blur(3px)}
  100%{opacity:1;transform:none;filter:none}
}

/* CHI SIAMO — animate *only the small portraits*, not names, titles, buttons.
 * This starts afresh on every re-entry from another route. */
html[data-vmag-mode="mobile"] .mep-m-view[data-mobile-view="faculty"].is-faculty-entering {animation:none}
html[data-vmag-mode="mobile"] .is-faculty-entering .mep-m-faculty-photo {
  animation:mepFacultyPortraitEmerge 1050ms cubic-bezier(.16,1,.3,1) both;
  animation-delay:calc(var(--mep-faculty-index,0) * 72ms);
  transform-origin:50% 60%;
}
@keyframes mepFacultyPortraitEmerge {
  0%{opacity:0;transform:translate3d(-15px,10px,0) scale(.925);filter:blur(8px) brightness(.45)}
  50%{opacity:.68;filter:blur(2.4px) brightness(.82)}
  100%{opacity:1;transform:none;filter:none}
}

/* Course detail: its code plate and title emerge *horizontally* from the blue
 * background, not as fully visible blocks dropped in from above. Keep the
 * existing gentle lead text stagger and fast close untouched. */
html[data-vmag-mode="mobile"] .mep-m-course-dialog[open]:not(.is-course-closing) .mep-m-course-code {
  animation:mepDossierCodeBuild 1070ms cubic-bezier(.16,1,.3,1) 115ms both;
  transform-origin:left center;
}
html[data-vmag-mode="mobile"] .mep-m-course-dialog[open]:not(.is-course-closing) .mep-m-course-title {
  position:relative;
  isolation:isolate;
  overflow:hidden;
  animation:mepDossierTitleBuild 1310ms cubic-bezier(.16,1,.3,1) 255ms both;
  transform-origin:left center;
}
html[data-vmag-mode="mobile"] .mep-m-course-dialog[open]:not(.is-course-closing) .mep-m-course-title::after {
  content:"";
  pointer-events:none;
  position:absolute;
  inset:-20% auto -20% -25%;
  width:32%;
  transform:translate3d(0,0,0) skewX(-19deg);
  background:linear-gradient(90deg,transparent,rgba(187,255,255,.23),transparent);
  mix-blend-mode:screen;
  animation:mepDossierLightPass 1300ms cubic-bezier(.19,.8,.27,1) 345ms both;
}
@keyframes mepDossierCodeBuild {
  0%{opacity:0;transform:translate3d(-16px,6px,0) scaleX(.88);filter:blur(7px) brightness(.48);clip-path:polygon(0 0,0 0,0 100%,0 100%)}
  34%{opacity:.85;filter:blur(2.5px) brightness(.76);clip-path:polygon(0 0,47% 0,51% 100%,0 100%)}
  100%{opacity:1;transform:none;filter:none;clip-path:polygon(0 0,94% 0,100% 100%,0 100%)}
}
@keyframes mepDossierTitleBuild {
  0%{opacity:0;transform:translate3d(-18px,8px,0) scale(.978);filter:blur(9px) brightness(.44);clip-path:polygon(0 0,0 0,0 100%,0 100%)}
  28%{opacity:.92;filter:blur(3px) brightness(.72);clip-path:polygon(0 0,37% 0,41% 100%,0 100%)}
  67%{opacity:1;filter:blur(.8px) brightness(.96);clip-path:polygon(0 0,79% 0,85% 100%,0 100%)}
  100%{opacity:1;transform:none;filter:none;clip-path:polygon(0 0,94% 0,100% 100%,0 100%)}
}
@keyframes mepDossierLightPass {
  0%{opacity:0;transform:translateX(0) skewX(-19deg)}
  32%{opacity:.8}
  100%{opacity:0;transform:translateX(580%) skewX(-19deg)}
}

@media(max-width:350px){
  html[data-vmag-mode="mobile"] .mep-m-home-card .mep-m-offer-meta{font-size:8.2px;gap:3px}
  html[data-vmag-mode="mobile"] .mep-m-home-card .mep-m-offer-meta span:last-child{display:none}
  html[data-vmag-mode="mobile"] .mep-m-home-card h2{font-size:15.5px}
  html[data-vmag-mode="mobile"] .mep-m-chat-operators{right:10px;gap:5px}
}
@media(prefers-reduced-motion:reduce){
  html[data-vmag-mode="mobile"] .is-home-entering .mep-m-home-card,
  html[data-vmag-mode="mobile"] .is-home-entering .mep-m-home-card h2,
  html[data-vmag-mode="mobile"] .is-home-entering .mep-m-home-card .mep-m-offer-meta,
  html[data-vmag-mode="mobile"] .is-home-entering .mep-m-home-card .mep-m-offer-body,
  html[data-vmag-mode="mobile"] .is-faculty-entering .mep-m-faculty-photo,
  html[data-vmag-mode="mobile"] .mep-m-course-dialog[open] .mep-m-course-code,
  html[data-vmag-mode="mobile"] .mep-m-course-dialog[open] .mep-m-course-title,
  html[data-vmag-mode="mobile"] .mep-m-course-dialog[open] .mep-m-course-title::after {
    animation:none!important;
    transition:none!important;
  }
}


/* v0.9.1-rc7 — mobile HOME only: compact vertical rhythm + card-specific color plates/icons. */
html[data-vmag-mode="mobile"] body[data-mobile-page="home"] #mep-mobile-app{padding-bottom:14px}
html[data-vmag-mode="mobile"] body[data-mobile-page="home"] .mep-m-head{margin-bottom:10px}
html[data-vmag-mode="mobile"] body[data-mobile-page="home"] .mep-m-main{margin-bottom:0}
html[data-vmag-mode="mobile"] body[data-mobile-page="home"] .mep-m-home-card{margin-bottom:14px;box-shadow:0 12px 26px rgba(0,0,0,.16)}
html[data-vmag-mode="mobile"] body[data-mobile-page="home"] .mep-m-home-card .mep-m-offer-body{padding:10px 12px 10px}
html[data-vmag-mode="mobile"] body[data-mobile-page="home"] .mep-m-home-card .mep-m-offer-body>p{margin:0 0 8px;font-size:13.2px;line-height:1.4}
html[data-vmag-mode="mobile"] body[data-mobile-page="home"] .mep-m-home-card .mep-m-enrol{margin-top:3px;column-gap:9px}
html[data-vmag-mode="mobile"] body[data-mobile-page="home"] .mep-m-home-card .mep-m-enrol::before{width:38px;height:38px;font-size:0;background-color:rgba(5,18,24,.58);background-position:center;background-repeat:no-repeat;background-size:23px 23px;box-shadow:inset 0 0 12px rgba(0,0,0,.16)}
html[data-vmag-mode="mobile"] body[data-mobile-page="home"] .mep-m-home-card .mep-m-enrol span{font-size:8.4px}
html[data-vmag-mode="mobile"] body[data-mobile-page="home"] .mep-m-home-card .mep-m-enrol strong{font-size:11.4px;line-height:1.2}
html[data-vmag-mode="mobile"] body[data-mobile-page="home"] .mep-m-home-card .mep-m-card-action{margin-top:6px;font-size:9.6px}

html[data-vmag-mode="mobile"] body[data-mobile-page="home"] .mep-m-home-card[data-home-panel="cert"]{border-bottom-color:#416e98}
html[data-vmag-mode="mobile"] body[data-mobile-page="home"] .mep-m-home-card[data-home-panel="cert"] .mep-m-offer-meta strong{color:#7eb0d6}
html[data-vmag-mode="mobile"] body[data-mobile-page="home"] .mep-m-home-card[data-home-panel="cert"] h2{background:linear-gradient(101deg,#7fa9c8 0%,#5e87ab 66%,#3d6287 100%);color:#08141c}
html[data-vmag-mode="mobile"] body[data-mobile-page="home"] .mep-m-home-card[data-home-panel="cert"] .mep-m-enrol::before{border-color:rgba(102,154,195,.62);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath d='M9 4.5h10.5L24.5 9v18.5H9z' fill='none' stroke='%237eb0d6' stroke-width='2.2' stroke-linejoin='round'/%3E%3Cpath d='M19.5 4.5V9H24' fill='none' stroke='%237eb0d6' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M12.5 14.5h8M12.5 18.5h8M12.5 22.5h6' fill='none' stroke='%237eb0d6' stroke-width='2.2' stroke-linecap='round'/%3E%3C/svg%3E") ;color:#7eb0d6}

html[data-vmag-mode="mobile"] body[data-mobile-page="home"] .mep-m-home-card[data-home-panel="method"]{border-bottom-color:#4f9473}
html[data-vmag-mode="mobile"] body[data-mobile-page="home"] .mep-m-home-card[data-home-panel="method"] .mep-m-offer-meta strong{color:#88c59d}
html[data-vmag-mode="mobile"] body[data-mobile-page="home"] .mep-m-home-card[data-home-panel="method"] h2{background:linear-gradient(101deg,#95c486 0%,#6ea673 64%,#477d63 100%);color:#0b1715}
html[data-vmag-mode="mobile"] body[data-mobile-page="home"] .mep-m-home-card[data-home-panel="method"] .mep-m-enrol::before{border-color:rgba(111,167,132,.62);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Ccircle cx='14' cy='14' r='7.5' fill='none' stroke='%2388c59d' stroke-width='2.4'/%3E%3Cpath d='M19.5 19.5 25 25' fill='none' stroke='%2388c59d' stroke-width='2.4' stroke-linecap='round'/%3E%3Cpath d='M14 11.2v5.6M11.2 14h5.6' fill='none' stroke='%2388c59d' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E");color:#88c59d}

html[data-vmag-mode="mobile"] body[data-mobile-page="home"] .mep-legal-bar{min-height:0;gap:5px 10px;padding:8px 12px 10px;font-size:9.6px;border-top-width:1px}
html[data-vmag-mode="mobile"] body[data-mobile-page="home"] .mep-legal-bar__company{gap:6px;font-size:9px}
html[data-vmag-mode="mobile"] body[data-mobile-page="home"] .mep-legal-bar__legal,
html[data-vmag-mode="mobile"] body[data-mobile-page="home"] .mep-legal-bar__contacts{gap:6px;flex-wrap:wrap}
html[data-vmag-mode="mobile"] body[data-mobile-page="home"] .mep-legal-bar__legal button,
html[data-vmag-mode="mobile"] body[data-mobile-page="home"] .mep-legal-bar__terms,
html[data-vmag-mode="mobile"] body[data-mobile-page="home"] .mep-legal-bar__email,
html[data-vmag-mode="mobile"] body[data-mobile-page="home"] .mep-legal-bar__social{transform:scale(.96);transform-origin:center}

@media(max-width:390px){
  html[data-vmag-mode="mobile"] body[data-mobile-page="home"] .mep-m-home-card h2{font-size:15.2px;padding:4px 9px}
  html[data-vmag-mode="mobile"] body[data-mobile-page="home"] .mep-m-home-card .mep-m-offer-body>p{font-size:12.8px}
  html[data-vmag-mode="mobile"] body[data-mobile-page="home"] .mep-m-home-card .mep-m-enrol::before{width:34px;height:34px;background-size:20px 20px}
  html[data-vmag-mode="mobile"] body[data-mobile-page="home"] .mep-legal-bar{padding:7px 10px 9px}
}


/* v0.9.1-rc8 — Only mobile HOME: release forced viewport height.
 * The legal bar follows the cards in normal document flow. Smaller viewports
 * still scroll naturally; CORSI, CHI SIAMO, dialogs and desktop are unchanged. */
html[data-vmag-mode="mobile"] body[data-mobile-page="home"] #app {
  min-height:0;
}
html[data-vmag-mode="mobile"] body[data-mobile-page="home"] #mep-mobile-app {
  min-height:0;
}