.mseq-grid, .mseq-single, .mseq-placeholder, .mseq-tiles, .mseq-crumbs, .mseq-services, .mseq-phero {
--mseq-accent: #6FCFDE;
--mseq-accent-dark: #4DB8C9;
--mseq-text: #000;
--mseq-muted: #5A646E;
--mseq-line: #E4E8EC;
--mseq-bg: #F0F2F4;
font-family: Inter, sans-serif;
color: var(--mseq-text);
} .mseq-btn {
display: inline-flex; align-items: center; justify-content: center;
padding: 10px 22px; border-radius: 20px; border: 2px solid var(--mseq-accent);
font: 600 15px/1.3 Inter, sans-serif; text-decoration: none !important; text-align: center;
transition: background-color .2s, color .2s, border-color .2s;
}
.mseq-btn--kp { background: var(--mseq-accent); color: #fff !important; }
.mseq-btn--kp:hover { background: var(--mseq-accent-dark); border-color: var(--mseq-accent-dark); }
.mseq-btn--ghost { background: transparent; color: #000 !important; }
.mseq-btn--ghost:hover { background: var(--mseq-accent); color: #fff !important; } .mseq-grid {
display: grid; gap: 24px;
grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
}
.mseq-card {
display: flex; flex-direction: column;
background: #fff; border-radius: 20px; overflow: hidden;
transition: box-shadow .2s, transform .2s;
}
.mseq-card:hover { box-shadow: 0 12px 32px rgba(0, 0, 0, .08); transform: translateY(-2px); }
.mseq-card__photo { position: relative; display: block; aspect-ratio: 4 / 3; background: #fff; }
.mseq-card__photo img {
position: absolute; top: 20px; left: 20px; width: calc(100% - 40px); height: calc(100% - 30px);
object-fit: contain;
}
.mseq-card__body { display: flex; flex-direction: column; flex: 1; padding: 0 24px 24px; }
.mseq-card__class {
align-self: flex-start; margin-bottom: 8px; padding: 3px 12px; border-radius: 20px;
background: var(--mseq-bg); color: var(--mseq-muted); font-size: 13px; font-weight: 500;
}
.mseq-card__title { margin: 0 0 20px; font: 700 24px/1.2 Manrope, Inter, sans-serif; }
.mseq-card__title a { color: inherit; text-decoration: none; }
.mseq-card__title a:hover { color: var(--mseq-accent-dark); }
.mseq-card__actions { display: flex; gap: 10px; margin-top: auto; }
.mseq-card__actions .mseq-btn { flex: 1; padding: 9px 6px; font-size: 14px; white-space: nowrap; } body.mseq-single-page { background: #F0F2F4; }
body.mseq-single-page .site-main { max-width: 1500px; margin: 0 auto; padding: 20px 20px 60px; }
.mseq-single__top {
display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 24px; margin-bottom: 24px;
}
.mseq-gallery, .mseq-info, .mseq-specs, .mseq-cta { background: #fff; border-radius: 20px; }
.mseq-gallery { padding: 30px; }
.mseq-gallery__main { position: relative; aspect-ratio: 4 / 3; }
.mseq-gallery__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; }
.mseq-gallery__thumbs { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 16px; }
.mseq-gallery__thumb {
width: 72px; height: 72px; padding: 4px; border: 2px solid var(--mseq-line); border-radius: 12px;
background: #fff; cursor: pointer;
}
.mseq-gallery__thumb.is-active { border-color: var(--mseq-accent); }
.mseq-gallery__thumb img { width: 100%; height: 100%; object-fit: contain; }
.mseq-info { display: flex; flex-direction: column; padding: 40px; }
.mseq-info__brand { margin-bottom: 8px; color: var(--mseq-muted); font-size: 16px; }
.mseq-info__title { margin: 0 0 12px; font: 700 50px/1.1 Manrope, Inter, sans-serif; }
.mseq-info__lead { margin: 12px 0 0; color: var(--mseq-muted); font-size: 17px; line-height: 1.6; }
.mseq-info__actions { margin-top: auto; padding-top: 28px; }
.mseq-info__actions .mseq-btn { padding: 14px 40px; font-size: 17px; }
.mseq-specs { padding: 40px; margin-bottom: 24px; }
.mseq-specs__title { margin: 0 0 20px; font: 700 32px/1.2 Manrope, Inter, sans-serif; }
.mseq-specs__table { width: 100%; border-collapse: collapse; border: 0; margin: 0; }
.mseq-specs__table th, .mseq-specs__table td {
padding: 14px 16px; border: 0; border-bottom: 1px solid var(--mseq-line);
font-size: 16px; line-height: 1.45; text-align: left; vertical-align: top; background: none;
}
.mseq-specs__table tr:nth-child(odd) th, .mseq-specs__table tr:nth-child(odd) td { background: #F7F8FA; }
.mseq-specs__table th { width: 45%; color: var(--mseq-muted); font-weight: 400; }
.mseq-specs__table td { font-weight: 600; }
.mseq-specs__notes { margin-top: 18px; color: var(--mseq-muted); font-size: 14px; line-height: 1.6; }
.mseq-cta {
display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 30px 40px;
}
.mseq-cta__title { font: 700 24px/1.25 Manrope, Inter, sans-serif; }
.mseq-cta__text { margin-top: 6px; color: var(--mseq-muted); font-size: 16px; }
.mseq-cta .mseq-btn { flex-shrink: 0; padding: 14px 40px; font-size: 17px; }  body.mseq-single-page { overflow-x: clip; }
.mseq-hero {
--mseq-edge: calc((100% - min(100% - 40px, 1460px)) / 2);
position: relative; width: 100vw; margin: 0 0 8px calc(50% - 50vw); overflow: hidden;
}
.mseq-hero__media {
position: relative; height: min(56.25vw, 820px, calc(100vh - 150px)); min-height: 460px;
background: linear-gradient(#cfd0d2, #F0F2F4);
}
.mseq-hero__media::before {
content: ""; position: absolute; left: 0; right: 0; top: 0; z-index: 1; height: 12%; pointer-events: none;
background: linear-gradient(#F0F2F4, rgba(240, 242, 244, 0));
}
.mseq-hero__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 60%; }
.mseq-hero__media::after {
content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 32%; pointer-events: none;
background: linear-gradient(to bottom, rgba(240, 242, 244, 0), rgba(240, 242, 244, .75) 60%, #F0F2F4);
}
.mseq-hero__panel { position: absolute; top: 9%; right: calc(var(--mseq-edge) + 2%); z-index: 2; width: min(460px, 34%); }
.mseq-hero__brand { margin-bottom: 6px; color: var(--mseq-muted); font-size: 16px; font-weight: 500; letter-spacing: .02em; }
.mseq-hero__title { margin: 0 0 12px; font: 800 48px/1.05 Manrope, Inter, sans-serif; color: #000; }
.mseq-hero__lead { margin: 10px 0 0; color: #3F4850; font-size: 17px; line-height: 1.55; }
.mseq-hero__panel .mseq-card__class { display: inline-block; background: rgba(255, 255, 255, .7); }
.mseq-hero__actions { position: absolute; right: calc(var(--mseq-edge) + 2%); bottom: 14%; z-index: 2; }
.mseq-hero--wide .mseq-hero__img { object-position: 20% 55%; } .mseq-hero--left .mseq-hero__panel { top: 4%; right: auto; left: calc(var(--mseq-edge) + 2%); width: min(560px, 42%); }
@media (min-width: 1201px) and (max-width: 1500px) {
.mseq-hero--left .mseq-hero__title { font-size: 40px; margin-bottom: 8px; }
.mseq-hero--left .mseq-hero__lead { font-size: 15px; margin-top: 6px; }
}
.mseq-hero--left .mseq-hero__actions { bottom: 5%; }
.mseq-hero__actions .mseq-btn { padding: 15px 44px; font-size: 17px; box-shadow: 0 10px 28px rgba(77, 184, 201, .35); } .mseq-facts { display: flex; flex-wrap: wrap; margin: 0 0 8px; padding: 0; font-family: Inter, sans-serif; }
.mseq-facts__item { flex: 1 1 200px; padding: 16px 24px; border-left: 1px solid #D5DADF; }
.mseq-facts__item:first-child { padding-left: 0; border-left: 0; }
.mseq-facts__item dt { margin: 0 0 6px; color: var(--mseq-muted); font-size: 14px; }
.mseq-facts__item dd { margin: 0; font: 700 24px/1.2 Manrope, Inter, sans-serif; color: #000; } .mseq-single--hero .mseq-specs { padding: 32px 0 24px; border-radius: 0; background: none; }
.mseq-specs--grid { scroll-margin-top: 110px; }
.mseq-specs__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 56px; margin: 0; }
.mseq-specs__row { display: grid; grid-template-columns: minmax(0, 44%) minmax(0, 1fr); gap: 16px; padding: 16px 0; border-bottom: 1px solid #D5DADF; }
.mseq-specs__row dt { margin: 0; color: var(--mseq-muted); font-size: 15px; line-height: 1.45; }
.mseq-specs__row dd { margin: 0; font-size: 16px; font-weight: 600; line-height: 1.45; }
@media (max-width: 1200px) {
.mseq-hero__panel { position: static; width: auto; padding: 8px var(--mseq-edge) 0; }
.mseq-hero__actions { position: static; padding: 20px var(--mseq-edge) 8px; }
.mseq-specs__grid { grid-template-columns: 1fr; }
}
@media (max-width: 767px) {
.mseq-hero__media { height: 62vw; min-height: 0; }
.mseq-hero__img { object-position: center 70%; }
.mseq-hero--wide .mseq-hero__media { height: 72vw; }
.mseq-hero--wide .mseq-hero__img { object-position: 6% 62%; }
.mseq-hero__title { font-size: 32px; }
.mseq-hero__lead { font-size: 16px; }
.mseq-hero__actions .mseq-btn { width: 100%; }
.mseq-facts { flex-direction: column; }
.mseq-facts__item {
display: flex; justify-content: space-between; align-items: baseline; gap: 12px;
flex-basis: auto; padding: 12px 0; border-left: 0; border-top: 1px solid #D5DADF;
}
.mseq-facts__item:first-child { border-top: 0; }
.mseq-facts__item dt { margin: 0; }
.mseq-facts__item dd { font-size: 16px; text-align: right; }
.mseq-single--hero .mseq-specs { padding: 24px 0 16px; }
.mseq-specs__row { grid-template-columns: 1fr; gap: 4px; padding: 12px 0; }
}
@media (max-width: 1024px) {
.mseq-single__top { grid-template-columns: 1fr; }
.mseq-info__title { font-size: 40px; }
}
@media (max-width: 767px) {
.mseq-grid { grid-template-columns: 1fr; gap: 16px; }
.mseq-gallery, .mseq-info, .mseq-specs { padding: 20px; }
.mseq-info__title { font-size: 32px; }
.mseq-info__actions .mseq-btn, .mseq-cta .mseq-btn { width: 100%; }
.mseq-specs__title { font-size: 24px; }
.mseq-specs__table th, .mseq-specs__table td { display: block; width: auto; padding: 4px 12px; }
.mseq-specs__table th { padding-top: 12px; border-bottom: 0; }
.mseq-specs__table td { padding-bottom: 12px; }
.mseq-cta { flex-direction: column; align-items: stretch; padding: 20px; }
.mseq-cta__title { font-size: 20px; }
} .mseq-stock {
position: absolute; top: 14px; left: 14px; z-index: 1; padding: 4px 12px; border-radius: 20px;
background: #E6F6EA; color: #1E7B34; font: 600 13px/1.3 Inter, sans-serif;
}
.mseq-nophoto {
position: absolute; inset: 20px 20px 10px; display: flex; align-items: center; justify-content: center;
border-radius: 14px; background: #F0F2F4; color: #8A939C; font: 500 14px/1.3 Inter, sans-serif;
} .mseq-crumbs { margin: 0 0 16px; font: 400 14px/1.5 Inter, sans-serif; }
.mseq-crumbs ol { display: flex; flex-wrap: wrap; gap: 4px 0; margin: 0; padding: 0; list-style: none; }
.mseq-crumbs li { color: #000; }
.mseq-crumbs li + li::before { content: "›"; margin: 0 8px; color: #8A939C; }
.mseq-crumbs a { color: #5A646E; text-decoration: none; }
.mseq-crumbs a:hover { color: #4DB8C9; } .mseq-tiles {
display: grid; gap: 24px; grid-template-columns: repeat(3, minmax(0, 1fr));
font-family: Inter, sans-serif;
}
@media (max-width: 1024px) { .mseq-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.mseq-tile {
position: relative; display: flex; flex-direction: column; padding: 30px; border-radius: 20px;
background: #fff; color: #000 !important; text-decoration: none; transition: box-shadow .2s, transform .2s;
}
.mseq-tile:hover { box-shadow: 0 12px 32px rgba(0, 0, 0, .08); transform: translateY(-2px); }
.mseq-tile__photo { position: relative; display: block; aspect-ratio: 4 / 3; margin-bottom: 20px; }
.mseq-tile__photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; }
.mseq-tile__arrow {
position: absolute; top: 24px; right: 24px; display: flex; align-items: center; justify-content: center;
width: 52px; height: 52px; border-radius: 50%; background: #6FCFDE; color: #fff; font-size: 22px;
}
.mseq-tile__title { font: 600 26px/1.2 Inter, sans-serif; }
.mseq-tile__lead { margin-top: 6px; color: #5A646E; font-size: 15px; line-height: 1.45; } .mseq-placeholder {
padding: 40px; border-radius: 20px; background: #fff; font-family: Inter, sans-serif; text-align: center;
}
.mseq-placeholder p { max-width: 640px; margin: 0 auto 24px; color: #5A646E; font-size: 18px; line-height: 1.6; }
.mseq-placeholder .mseq-btn { padding: 14px 40px; font-size: 17px; } .mseq-services { display: grid; gap: 24px; }
.mseq-service {
display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 40px; align-items: center;
padding: 30px; border-radius: 20px; background: #fff;
}
.mseq-service__photo { aspect-ratio: 4 / 3; overflow: hidden; border-radius: 14px; background: var(--mseq-bg); }
.mseq-service__photo img { display: block; width: 100%; height: 100%; object-fit: cover; }
.mseq-service__title { margin: 0 0 14px; font: 600 32px/1.2 Inter, sans-serif; color: #000; }
.mseq-service__lead { margin: 0 0 16px; color: var(--mseq-muted); font-size: 18px; line-height: 1.6; }
.mseq-service__list { margin: 0 0 24px; padding: 0; list-style: none; }
.mseq-service__list li { position: relative; padding: 6px 0 6px 22px; font-size: 17px; line-height: 1.5; }
.mseq-service__list li::before {
content: ''; position: absolute; left: 0; top: 15px; width: 8px; height: 8px; border-radius: 50%; background: var(--mseq-accent);
}
.mseq-service__actions { display: flex; flex-wrap: wrap; gap: 12px; }
.mseq-service__actions .mseq-btn { padding: 12px 32px; font-size: 16px; }
@media (max-width: 1024px) { .mseq-service { grid-template-columns: 1fr 1fr; gap: 28px; } .mseq-service__title { font-size: 26px; } }
@media (max-width: 767px) {
.mseq-service { grid-template-columns: 1fr; gap: 20px; padding: 20px; }
.mseq-service__title { font-size: 24px; }
.mseq-service__lead { font-size: 16px; }
.mseq-tiles { grid-template-columns: 1fr; gap: 16px; }
.mseq-tile { padding: 20px; }
.mseq-tile__title { font-size: 22px; }
.mseq-placeholder { padding: 24px 20px; }
} body:has(.mseq-phero) { overflow-x: clip; } .mseq-phero { position: relative; font-family: Inter, sans-serif; }
.mseq-phero__media {
position: relative; width: 100vw; margin-left: calc(50% - 50vw);
height: min(62.5vw, 1000px); min-height: 520px; background: linear-gradient(#cfd0d2, #F0F2F4);
} .mseq-phero__img { position: absolute; top: 0; left: 0; width: 100%; height: 96% !important; max-width: none; object-fit: cover; object-position: center bottom; } .mseq-phero__media::before, .mseq-phero__media::after { content: ""; position: absolute; left: 0; right: 0; z-index: 1; pointer-events: none; }
.mseq-phero__media::before { top: 0; height: 16%; background: linear-gradient(#F0F2F4, rgba(240, 242, 244, 0)); }
.mseq-phero__media::after { bottom: 0; height: 12%; background: linear-gradient(rgba(240, 242, 244, 0), rgba(240, 242, 244, .8) 55%, #F0F2F4); }
.mseq-phero__text { position: absolute; top: 3%; left: 0; z-index: 2; width: min(640px, 44%); }
.mseq-phero__title { margin: 0 0 18px; font: 700 60px/1.05 Manrope, Inter, sans-serif; color: #0B1B2B; text-transform: uppercase; }
.mseq-phero__lead { margin: 0; color: #3F4850; font-size: 17px; line-height: 1.6; }
.mseq-phero__actions { margin-top: 26px; }
.mseq-phero__actions .mseq-btn { padding: 15px 44px; font-size: 17px; box-shadow: 0 10px 28px rgba(77, 184, 201, .35); } @media (max-width: 1400px) {
.mseq-phero__media { height: 54vw; min-height: 0; } .mseq-phero__text { position: static; width: auto; padding: 4px 0 24px; }
.mseq-phero__title { font-size: 44px; }
} @media (min-width: 1101px) and (max-width: 1400px) { .mseq-phero--mid .mseq-phero__media { height: calc(38vw + 470px); }
.mseq-phero--mid .mseq-phero__text { position: absolute; top: 40px; width: min(580px, 52%); padding: 0; }
.mseq-phero--mid .mseq-phero__title { font-size: 48px; }
.mseq-phero--mid .mseq-phero__lead { font-size: 16px; }
}
@media (max-width: 767px) {
.mseq-phero__title { font-size: 32px; }
.mseq-phero__lead { font-size: 16px; }
.mseq-phero__actions .mseq-btn { width: 100%; }
}