:root {--mm-ease: cubic-bezier(.22,1,.36,1); --mm-radius: 16px; --mm-line: var(--br3);}
html {scroll-padding-top: 108px;}
.wrap {max-width: 1320px;}
.sec {padding-block: clamp(72px, 7vw, 112px);}
.h-xl,  .h-mix {font-size: clamp(36px, 4.7vw, 68px); line-height: 1.06; letter-spacing: -0.045em; text-wrap: balance;}
.body-txt,  .svc-desc,  .case-desc {line-height: 1.7;}
.nav {top: 12px; left: 20px; right: 20px; width: auto; border: 1px solid var(--br3); border-radius: 18px; overflow: hidden;}
.nav-inner {min-height: 64px; padding-inline: 22px;}
.nav-links {gap: 22px;}
.nav-links a {font-size: 11px; letter-spacing: 0.04em;}
.nav-right {border-left: 0px; padding-left: 0px;}
.nav-cta,  .btn,  .theme-btn,  .drawer-close {border-radius: 999px !important;}
.btn {min-height: 48px; padding-inline: 24px; text-transform: none; font-weight: 600; letter-spacing: 0px !important;}
.nav-cta {text-transform: none; letter-spacing: 0px;}
.btn svg {flex-shrink: 0; width: 16px !important; height: 16px !important;}
.hero {min-height: min(900px, 100svh); height: auto;}
.h30 {padding-block: 160px 104px;}
.h30-name {font-size: clamp(56px, 8vw, 106px); letter-spacing: -0.04em !important;}
.h30-name .hero-name-blue {margin-left: 0.08em;}
.h30-context {max-width: 50ch; line-height: 1.7;}
.hero .mm-meeting-note {color: rgb(204, 204, 204);}
.h30-scroll {bottom: 24px;}
.mm-selection {gap: 24px; margin-top: 40px;}
.mm-selection article {display: flex; flex-direction: column; padding: 8px 8px 20px; border: 1px solid var(--br3); border-radius: 20px; background: var(--s1);}
.mm-deferred-image {border-radius: 12px; aspect-ratio: 4 / 3;}
.mm-selection img {border-radius: 12px; aspect-ratio: auto;}
.mm-selection h3 {font-size: clamp(20px, 1.65vw, 25px); line-height: 1.25; letter-spacing: -0.03em; margin: 20px 12px 8px;}
.mm-selection p {margin-inline: 12px; font-size: 13px; line-height: 1.5;}
.mm-selection .mm-work-link {margin: 16px 12px 0px; padding-top: 12px; border-top: 1px solid var(--br3); font-size: 13px; min-height: 44px; display: flex; align-items: center; color: var(--w); text-decoration: none;}
.mm-selection article > a:first-child {flex: 1 1 0%;}
.mm-catalog {max-width: 1216px; margin: 36px auto 0px;}
.mm-catalog > summary {display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 22px 24px; border: 1px solid var(--br3); border-radius: 12px; list-style: none; background: var(--s1); font-size: 15px; line-height: 1.5;}
.mm-catalog > summary::-webkit-details-marker {display: none;}
.mm-catalog > summary::after {content: "+"; font-size: 24px; font-weight: 400; flex-shrink: 0;}
.mm-catalog[open] > summary::after {content: "−";}
.suites-tabs {padding: 6px; gap: 6px; border: 1px solid var(--br3); border-radius: 16px; background: var(--s1);}
.suite-tab {border: 0px; border-radius: 10px; min-height: 48px; text-transform: none; font-weight: 600; letter-spacing: 0px;}
.svc-grid {gap: 20px !important;}
.svc-card {padding: 28px !important; border: 1px solid var(--br3) !important; border-radius: 16px !important; background: var(--s1) !important;}
.svc-num {font-size: 13px; color: var(--s6);}
.svc-title {font-weight: 700; letter-spacing: -0.03em; font-size: 27px !important;}
.svc-tags span {font-size: 10px; letter-spacing: 0.04em; padding: 6px 9px; border-radius: 6px;}
.mm-proof-grid {grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 32px;}
.mm-proof-grid article {padding: 28px 0px;}
.mm-proof-grid h3 {font-size: 28px;}
.mm-contact-note {border-radius: 20px; padding: 36px;}
.mm-contact-note ol {line-height: 1.7; display: grid; gap: 12px; margin-block: 24px;}
.case-card,  .session-card,  .film-card {border-radius: 16px; overflow: hidden;}
.case-body {padding: 26px;}
.case-title {font-size: 28px;}
.session-title {letter-spacing: -0.02em; line-height: 1.3;}
.faq-q {min-height: 64px; line-height: 1.5;}
.h-mix em {color: var(--s6); letter-spacing: -0.035em;}
#contacto h2 {letter-spacing: -0.045em; text-wrap: balance;}
.cta-contact-label,  .proceso-detail-col-title,  .proceso-detail-duration {font-size: 12px; letter-spacing: 0.04em; line-height: 1.6;}
.cta-contact-val {font-size: 16px; display: inline-flex; align-items: center; min-height: 44px;}
.proceso-step {border-radius: 16px;}
.proceso-detail-wrap {transition: none;}
.proceso-detail-wrap.open {max-height: none;}
.session-cat,  .film-cat,  .session-ep {font-size: 12px; letter-spacing: 0.04em; color: rgb(204, 204, 204);}
.kbd-hint,  .side-nav {display: none !important;}
#page-progress {width: 100%; transform: scaleX(0); transform-origin: left center; background: rgb(0, 0, 255); box-shadow: none; transition: none;}
.btn,  .nav-cta,  .theme-btn,  .drawer-close,  .suite-tab,  .filter-btn {transition: background-color 180ms var(--mm-ease),border-color 180ms var(--mm-ease),transform 180ms var(--mm-ease);}
.mm-deferred-image img,  .case-thumb img {transition: transform 500ms var(--mm-ease);}
.drawer {transition: opacity 240ms var(--mm-ease),transform 240ms var(--mm-ease);}
.btn:active,  .nav-cta:active {transform: scale(0.98) !important;}
@media (hover: hover) and (pointer: fine) {
.mm-selection article:hover .mm-deferred-image img,  .case-card:hover .case-thumb img {transform: scale(1.025);}
.btn:hover,  .nav-cta:hover {transform: translateY(-2px) !important;}
.suite-tab:not(.on):hover,  .filter-btn:not(.on):hover {background: var(--s2);}
.mm-work-link:hover {text-decoration: underline; text-underline-offset: 5px;}
}
@media (max-width: 1100px) {
.nav-links {gap: 12px;}
.nav-inner {padding-inline: 16px;}
.nav-logo-text {font-size: 18px !important;}
.mm-catalog {margin-inline: 32px;}
}
@media (max-width: 700px) {
html {scroll-padding-top: 88px;}
.nav {top: 8px; left: 10px; right: 10px; border-radius: 14px;}
.nav-inner {padding-inline: 10px; min-height: 58px;}
.sec {padding-block: 56px;}
.h-xl,  .h-mix {font-size: clamp(30px, 8vw, 42px);}
.hero {min-height: 0px;}
.h30 {padding: 112px 20px 40px;}
.h30-name {font-size: clamp(36px, 11.8vw, 54px);}
.h30-context {font-size: 15px; line-height: 1.6;}
.hero-cta-row .btn {padding-inline: 20px;}
.mm-selection {gap: 24px; margin-top: 28px;}
.mm-selection h3 {font-size: 23px;}
.mm-selection p {font-size: 14px;}
.mm-deferred-image {aspect-ratio: 16 / 10;}
.mm-selection img {aspect-ratio: auto;}
.mm-catalog {margin-inline: 20px;}
.mm-catalog > summary {padding: 18px; font-size: 14px;}
.svc-card {padding: 24px !important;}
.svc-title {font-size: 25px !important;}
.svc-tags span {font-size: 11px;}
.mm-proof-grid {grid-template-columns: 1fr; gap: 0px;}
.mm-proof-grid article {padding: 24px 0px;}
.mm-contact-note {padding: 24px;}
.case-body {padding: 22px;}
.case-title {font-size: 26px;}
.proceso-grid {grid-template-columns: 1fr;}
.proceso-step {padding: 24px;}
.proceso-step-num {font-size: 12px;}
.proceso-desc {font-size: 15px; line-height: 1.65;}
}
@media (prefers-reduced-motion: reduce) {
.btn,  .nav-cta,  .theme-btn,  .drawer-close,  .suite-tab,  .filter-btn,  .mm-deferred-image img,  .case-thumb img,  .drawer {transition: none;}
.btn:hover,  .nav-cta:hover,  .btn:active,  .nav-cta:active,  .mm-selection article:hover .mm-deferred-image img,  .case-card:hover .case-thumb img {transform: none !important;}
}
.mm-project-heading {max-width: 760px; margin-bottom: 40px;}
.mm-project-heading .label {margin-bottom: 18px;}
.mm-project-heading .body-lg {margin-top: 24px; max-width: 62ch;}
.mm-project-grid {display: grid; grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 20px;}
.mm-project-grid article {padding: 32px; border: 1px solid var(--br3); border-radius: 18px; background: var(--s1); display: flex; flex-direction: column; align-items: flex-start;}
.mm-project-number {font-size: 12px; letter-spacing: 0.06em; color: var(--s6);}
.mm-project-grid h3 {font-size: 28px; line-height: 1.2; letter-spacing: -0.04em; margin: 28px 0px 16px;}
.mm-project-grid p,  .mm-project-grid li {font-size: 15px; line-height: 1.7; color: var(--s6);}
.mm-project-grid ul {padding-left: 18px; margin: 22px 0px 28px; flex: 1 1 0%;}
.mm-project-grid .btn {font-size: 13px; white-space: normal;}
.mm-project-close {margin-top: 32px; display: flex; align-items: center; justify-content: space-between; gap: 24px;}
.mm-project-close p {font-size: 15px; color: var(--s6);}
#sessions-selection-2 {grid-template-columns: repeat(2, minmax(0px, 1fr));}
@media (max-width: 900px) {
.mm-project-grid {grid-template-columns: 1fr;}
.mm-project-grid article {padding: 26px;}
.mm-project-grid h3 {margin-top: 16px;}
.mm-project-close {align-items: flex-start; flex-direction: column;}
}
@media (max-width: 700px) {
#sessions-selection-2 {grid-template-columns: 1fr;}
.mm-project-grid h3 {font-size: 26px;}
}
