:root {
--bmg-navy: #08122a;
--bmg-mint: #a3eabb;
--bmg-green: #46d067;
--bmg-mist: #f6f6f6;
--bmg-paper: #ffffff;
--bmg-ink: var(--bmg-navy);
--bmg-muted: color-mix(in srgb, var(--bmg-navy) 62%, #ffffff);
--bmg-line: color-mix(in srgb, var(--bmg-navy) 12%, transparent);
--bmg-navy-2: color-mix(in srgb, var(--bmg-navy) 86%, #ffffff);
--bmg-navy-deep: color-mix(in srgb, var(--bmg-navy) 82%, #000000);
--bmg-on-dark-muted: rgba(255, 255, 255, 0.68);
--bmg-fabric: #efeae1;
--bmg-display: "Inter Tight", "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
--bmg-text: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
--bmg-gutter: clamp(20px, 4.2vw, 64px);
--bmg-max: 1360px;
--bmg-section: clamp(88px, 11vw, 176px);
--bmg-r-lg: clamp(20px, 2.2vw, 30px);
--bmg-r: 18px;
--bmg-r-sm: 12px;
--bmg-ease: cubic-bezier(0.16, 1, 0.3, 1);
--bmg-ease-io: cubic-bezier(0.76, 0, 0.24, 1);
--bmg-rise: 28px;
--bmg-header-h: 84px;
}
body.bmg-anim-suave { --bmg-rise: 14px; } html { scroll-behavior: smooth; scroll-padding-top: calc(var(--bmg-header-real, 84px) + 8px); -webkit-text-size-adjust: 100%; }
html.bmg-loading,
html.bmg-loading body { overflow: hidden; }
body.bmg-site {
margin: 0;
background: var(--bmg-mist);
color: var(--bmg-ink);
font-family: var(--bmg-text);
font-size: 1.0625rem;
line-height: 1.6;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
text-rendering: optimizeLegibility;
overflow-x: clip;
}
.bmg-site *, .bmg-site *::before, .bmg-site *::after { box-sizing: border-box; }
:where(.bmg-site) img { display: block; max-width: 100%; height: auto; }
:where(.bmg-site) a { color: inherit; }
:where(.bmg-site) p { margin: 0; }
:where(.bmg-site) :where(ul, ol) { margin: 0; padding: 0; list-style: none; }
:where(.bmg-site) :where(h1, h2, h3) { margin: 0; font-family: var(--bmg-display); font-weight: 300; }
:where(.bmg-site) strong { font-weight: 600; }
:where(.bmg-site) figure { margin: 0; }
:where(.bmg-site) button { font: inherit; color: inherit; }
.bmg-site :focus-visible { outline: 2px solid var(--bmg-green); outline-offset: 3px; border-radius: 6px; }
.bmg-site ::selection { background: var(--bmg-mint); color: var(--bmg-navy); }
.screen-reader-text {
position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}
.bmg-skip {
position: fixed; left: 16px; top: -80px; z-index: 10001;
background: var(--bmg-navy); color: #fff; padding: 12px 18px; border-radius: 999px; text-decoration: none;
transition: top .2s;
}
.bmg-skip:focus { top: 16px; }
.bmg-wrap { width: min(var(--bmg-max), 100% - var(--bmg-gutter) * 2); margin-inline: auto; } .bmg-h2 {
font-size: clamp(2.1rem, 1.15rem + 3.1vw, 4.3rem);
line-height: 1.02;
letter-spacing: -0.035em;
text-wrap: balance;
max-width: 17ch;
}
.bmg-h2--light { color: #fff; }
.bmg-h2--xl { font-size: clamp(2.6rem, 1.2rem + 4.6vw, 5.8rem); max-width: 13ch; line-height: .98; }
.bmg-head {
display: grid;
grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr);
gap: 24px 64px;
align-items: end;
margin-bottom: clamp(48px, 6vw, 88px);
}
.bmg-head--single { grid-template-columns: 1fr; }
.bmg-head__lead { color: var(--bmg-muted); max-width: 44ch; font-size: 1.125rem; justify-self: end; } .bmg-btn {
--h: 54px;
display: inline-flex; align-items: center; justify-content: center; gap: 10px;
min-height: var(--h); padding: 0 24px 0 20px;
border-radius: 999px; border: 1px solid transparent;
font-family: var(--bmg-text); font-size: .98rem; font-weight: 500; letter-spacing: -0.005em;
text-decoration: none; white-space: nowrap; cursor: pointer;
transition: background-color .35s var(--bmg-ease), color .35s var(--bmg-ease), transform .35s var(--bmg-ease), border-color .35s, box-shadow .35s;
position: relative; isolation: isolate; overflow: hidden;
}
.bmg-btn__icon { display: inline-flex; width: 20px; height: 20px; }
.bmg-btn__icon svg { width: 100%; height: 100%; }
.bmg-btn--primary { background: var(--bmg-mint); color: var(--bmg-navy); }
.bmg-btn--primary:hover { background: #fff; box-shadow: 0 10px 30px -12px color-mix(in srgb, var(--bmg-navy) 50%, transparent); } .bmg-btn--line {
color: #fff; background: none; border: 0; border-radius: 0; padding: 0 4px; gap: 10px;
background: linear-gradient(currentColor, currentColor) left calc(100% - 12px) / 100% 1px no-repeat;
transition: background-size .5s var(--bmg-ease), color .3s;
}
.bmg-btn--line:hover { background-size: 30% 1px; color: var(--bmg-mint); }
.bmg-btn--ghost { color: var(--bmg-navy); border-color: color-mix(in srgb, var(--bmg-navy) 28%, transparent); background: transparent; }
.bmg-btn--ghost:hover { border-color: var(--bmg-navy); background: #fff; }
.bmg-btn--dark { background: var(--bmg-navy); color: #fff; }
.bmg-btn--dark:hover { background: var(--bmg-navy-2); }
.bmg-btn--block { width: 100%; } .bmg-quote { display: flex; margin-top: clamp(40px, 5vw, 64px); }
.bmg-quote--inline { margin-top: clamp(28px, 3.4vw, 40px); }
.bmg-manifesto__foot .bmg-quote--inline { margin-top: 28px; }
.bmg-manifesto__foot p + .bmg-quote--inline { margin-top: 24px; }
.bmg-catalog__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 28px; }
.bmg-catalog__actions .bmg-quote { margin-top: 0; }
.bmg-projects .bmg-quote { justify-content: center; } .bmg-quote--mob { display: none; }
@media (max-width: 900px) {
.bmg-quote--desk { display: none; }
.bmg-quote--mob { display: flex; grid-column: 1 / -1; justify-content: center; margin-top: 0; order: 99; }
}
.bmg-btn:active { transform: scale(.98); }
.bmg-link {
display: inline-flex; align-items: center; gap: 10px; margin-top: 16px;
font-weight: 500; text-decoration: none; padding: 12px 0 6px; min-height: 44px;
background: linear-gradient(currentColor, currentColor) left bottom / 100% 1px no-repeat;
transition: background-size .5s var(--bmg-ease);
}
.bmg-link:hover { background-size: 30% 1px; }
.bmg-link__icon { width: 18px; height: 18px; display: inline-flex; transition: transform .4s var(--bmg-ease); }
.bmg-link:hover .bmg-link__icon { transform: translate(3px, -3px); }  .bmg-loader { display: none; }
html.bmg-loading .bmg-loader,
.bmg-loader.is-leaving {
display: block; position: fixed; inset: 0; z-index: 10000; overflow: hidden; cursor: pointer;
background: var(--bmg-navy); color: #fff;
--sp: 1.2;
}
.bmg-loader.is-leaving {
pointer-events: none;
transform: translate3d(0, -101%, 0);
transition: transform calc(.62s * var(--sp)) var(--bmg-ease-io);
} .bmg-loader__drape { position: absolute; inset: 0; pointer-events: none; opacity: 0; transition: opacity calc(.7s * var(--sp)) var(--bmg-ease); }
.bmg-loader.is-in .bmg-loader__drape { opacity: 1; }
.bmg-loader__rod {
position: absolute; left: 4%; right: 4%; top: clamp(28px, 6vh, 56px); height: 2px; border-radius: 2px;
background: rgba(255, 255, 255, .10);
}
.bmg-loader__panel {
position: absolute; top: clamp(28px, 6vh, 56px); width: min(40%, 42vh); height: calc(100% - clamp(28px, 6vh, 56px));
fill: #fff; overflow: visible;
transform-origin: 50% 0;
transition: transform calc(1.1s * var(--sp)) var(--bmg-ease);
}
.bmg-loader__tie { fill: var(--bmg-mint); fill-opacity: .1; }
.bmg-loader__panel--l { left: 0; transform: translate3d(-14%, 0, 0); }
.bmg-loader__panel--r { right: 0; transform: translate3d(14%, 0, 0) scaleX(-1); }
.bmg-loader.is-in .bmg-loader__panel--l { transform: none; animation: bmg-drape-l 4.8s ease-in-out calc(1.1s * var(--sp)) infinite alternate; }
.bmg-loader.is-in .bmg-loader__panel--r { transform: scaleX(-1); animation: bmg-drape-r 5.4s ease-in-out calc(1.1s * var(--sp)) infinite alternate; }
.bmg-loader.is-out .bmg-loader__panel--l { animation: none; transform: translate3d(-26%, 0, 0); }
.bmg-loader.is-out .bmg-loader__panel--r { animation: none; transform: translate3d(26%, 0, 0) scaleX(-1); } @keyframes bmg-drape-l { to { transform: skewX(.6deg); } }
@keyframes bmg-drape-r { to { transform: scaleX(-1) skewX(.6deg); } }
@media (max-width: 760px) {
.bmg-loader__panel { width: 36%; }
.bmg-loader__rod { left: 0; right: 0; }
}
.bmg-loader__stage {
position: absolute; inset: 0;
display: flex; flex-direction: column; align-items: center; justify-content: center;
gap: clamp(22px, 3.4vh, 34px); padding: 24px; text-align: center;
transition: opacity calc(.35s * var(--sp)) var(--bmg-ease), transform calc(.5s * var(--sp)) var(--bmg-ease);
}
.bmg-loader.is-out .bmg-loader__stage { opacity: 0; transform: translateY(-14px); } .bmg-loader__frame { position: relative; width: clamp(230px, 24vw, 330px); padding: 0 0 30px; }
.bmg-loader__frame::before, .bmg-loader__frame::after {
content: ""; position: absolute; bottom: 14px; width: 1px; height: calc(100% - 6px);
background: linear-gradient(0deg, var(--bmg-mint), color-mix(in srgb, var(--bmg-mint) 0%, transparent));
transform: scaleY(0); transform-origin: bottom;
transition: transform calc(.45s * var(--sp)) var(--bmg-ease) calc(.3s * var(--sp));
}
.bmg-loader__frame::before { left: 0; }
.bmg-loader__frame::after { right: 0; transition-delay: calc(.4s * var(--sp)); }
.bmg-loader.is-in .bmg-loader__frame::before, .bmg-loader.is-in .bmg-loader__frame::after { transform: scaleY(1); }
.bmg-loader__logo { position: relative; width: 72%; margin: 0 auto 18px; aspect-ratio: 720 / 528; }
.bmg-loader__part { position: absolute; inset: 0; width: 100%; height: 100%; } .bmg-loader__part--roof { clip-path: inset(0 50% 73.5% 50%); transition: clip-path calc(.55s * var(--sp)) var(--bmg-ease-io) calc(.18s * var(--sp)); }
.bmg-loader__part--mark {
clip-path: inset(26.5% 0 31.3% 0); opacity: 0; transform: translateY(8px) scale(.97); filter: blur(8px);
transition: opacity calc(.5s * var(--sp)) var(--bmg-ease) calc(.32s * var(--sp)), transform calc(.6s * var(--sp)) var(--bmg-ease) calc(.32s * var(--sp)), filter calc(.5s * var(--sp)) var(--bmg-ease) calc(.32s * var(--sp));
}
.bmg-loader__part--words { clip-path: inset(68.7% 100% 0 0); transition: clip-path calc(.5s * var(--sp)) var(--bmg-ease-io) calc(.5s * var(--sp)); }
.bmg-loader.is-in .bmg-loader__part--roof { clip-path: inset(0 0 73.5% 0); }
.bmg-loader.is-in .bmg-loader__part--mark { opacity: 1; transform: none; filter: blur(0); }
.bmg-loader.is-in .bmg-loader__part--words { clip-path: inset(68.7% 0 0 0); }
.bmg-loader__phrase {
font-family: var(--bmg-display); font-weight: 250; color: #fff;
font-size: clamp(1.3rem, .95rem + 1.4vw, 2.1rem); line-height: 1.14; letter-spacing: -0.03em;
max-width: 19ch; text-wrap: balance;
}
.bmg-loader__phrase strong { font-weight: 600; color: var(--bmg-mint); }
.bmg-w { display: inline-block; overflow: hidden; vertical-align: top; padding-bottom: .1em; margin-bottom: -.1em; }
.bmg-w > span { display: inline-block; transform: translate3d(0, 108%, 0); transition: transform 1s var(--bmg-ease); }
.bmg-loader .bmg-w > span { transition-duration: calc(.55s * var(--sp)); transition-delay: calc((.45s + var(--w) * 35ms) * var(--sp)); }
.bmg-loader.is-in .bmg-w > span { transform: none; } .bmg-tape {
--t: 0;
position: relative; display: block; height: 30px; width: 100%;
color: var(--bmg-mint);
}
.bmg-tape__case {
position: absolute; left: -14px; top: 1px; width: 28px; height: 28px; border-radius: 8px;
background: var(--bmg-mint); box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .06);
display: grid; place-items: center; z-index: 2;
}
.bmg-tape__case i { width: 9px; height: 9px; border-radius: 50%; border: 2px solid var(--bmg-navy); opacity: .7; }
.bmg-tape__blade {
position: absolute; left: 0; right: 0; top: 7px; height: 16px; border-radius: 2px;
background: color-mix(in srgb, var(--bmg-mint) 92%, #fff);
transform-origin: left; transform: scaleX(var(--t)); overflow: hidden;
} .bmg-tape__ticks {
position: absolute; inset: 0;
background:
repeating-linear-gradient(90deg, var(--bmg-navy) 0 1px, transparent 1px 60px) 0 0 / 100% 11px no-repeat,
repeating-linear-gradient(90deg, var(--bmg-navy) 0 1px, transparent 1px 30px) 0 0 / 100% 8px no-repeat,
repeating-linear-gradient(90deg, color-mix(in srgb, var(--bmg-navy) 60%, transparent) 0 1px, transparent 1px 6px) 0 0 / 100% 4px no-repeat;
opacity: .8;
}
.bmg-tape__tip { position: absolute; top: 0; left: calc(var(--t) * 100%); height: 30px; }
.bmg-tape__hook { position: absolute; left: -2px; top: 4px; width: 4px; height: 22px; border-radius: 2px; background: var(--bmg-mint); }
.bmg-tape__read {
position: absolute; left: 8px; top: 50%; transform: translateY(-50%);
white-space: nowrap; font-size: .78rem; letter-spacing: .08em; color: rgba(255, 255, 255, .7); font-variant-numeric: tabular-nums;
}
.bmg-tape__read b { font-weight: 600; color: var(--bmg-mint); font-size: .95rem; letter-spacing: .02em; }
.bmg-tape--loader { position: absolute; left: 0; right: 0; bottom: 0; }
.bmg-tape--loader .bmg-tape__read { left: auto; right: 10px; top: auto; bottom: -26px; transform: none; }
html:not(.bmg-js) .bmg-tape, body.bmg-no-anim .bmg-tape { --t: 1; } .bmg-header {
position: fixed; inset: 0 0 auto 0; z-index: 900;
padding-top: env(safe-area-inset-top);
color: #fff;
transition: transform .55s var(--bmg-ease), background-color .45s, color .45s, box-shadow .45s;
}
.admin-bar .bmg-header { top: 32px; }
@media (max-width: 782px) { .admin-bar .bmg-header { top: var(--bmg-adminbar, 46px); } }
.bmg-header__inner {
width: min(var(--bmg-max), 100% - var(--bmg-gutter) * 2); margin-inline: auto;
height: var(--bmg-header-h);
display: flex; align-items: center; gap: 28px;
}
.bmg-header.is-scrolled {
color: var(--bmg-navy);
background: color-mix(in srgb, var(--bmg-mist) 84%, transparent);
-webkit-backdrop-filter: saturate(1.4) blur(18px); backdrop-filter: saturate(1.4) blur(18px);
box-shadow: 0 1px 0 var(--bmg-line);
}
.bmg-header.is-hidden { transform: translateY(-110%); }
.bmg-header__brand { position: relative; display: block; width: 84px; height: 62px; flex: none; }
.bmg-header__logo { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; transition: opacity .4s; }
.bmg-header__logo--dark { opacity: 0; }
.bmg-header.is-scrolled .bmg-header__logo--light { opacity: 0; }
.bmg-header.is-scrolled .bmg-header__logo--dark { opacity: 1; }
.bmg-nav { margin-inline: auto; }
.bmg-nav ul { display: flex; gap: clamp(18px, 2.4vw, 40px); }
.bmg-nav ul a {
position: relative; display: inline-block; padding: 8px 0;
font-size: .95rem; font-weight: 450; text-decoration: none; letter-spacing: -0.005em;
}
.bmg-nav ul a::after {
content: ""; position: absolute; left: 0; right: 0; bottom: 3px; height: 1px; background: currentColor;
transform: scaleX(0); transform-origin: right; transition: transform .45s var(--bmg-ease);
}
.bmg-nav ul a:hover::after, .bmg-nav ul a.is-current::after { transform: scaleX(1); transform-origin: left; }
.bmg-nav .bmg-nav__cta-mobile { display: none; }
.bmg-header__cta {
display: inline-flex; align-items: center; gap: 9px; min-height: 46px; padding: 0 20px 0 16px;
border-radius: 999px; background: var(--bmg-mint); color: var(--bmg-navy);
font-size: .94rem; font-weight: 500; text-decoration: none;
transition: background-color .3s, transform .3s var(--bmg-ease);
}
.bmg-header__cta:hover { background: #fff; }
.bmg-header.is-scrolled .bmg-header__cta:hover { background: var(--bmg-navy); color: #fff; }
.bmg-header__cta-icon { width: 19px; height: 19px; display: inline-flex; }
.bmg-header__cta-icon svg { width: 100%; height: 100%; }
.bmg-burger {
display: none; width: 48px; height: 48px; border: 0; padding: 0; border-radius: 50%;
background: transparent; cursor: pointer; position: relative; z-index: 2;
}
.bmg-burger__bars { position: absolute; inset: 0; display: grid; place-content: center; gap: 6px; }
.bmg-burger__bars i { display: block; width: 24px; height: 1.6px; background: currentColor; border-radius: 2px; transition: transform .45s var(--bmg-ease), opacity .3s; } .bmg-hero {
position: relative; min-height: max(640px, 100svh);
display: flex; align-items: flex-end;
color: #fff; overflow: hidden; background: var(--bmg-navy);
}
.bmg-hero__media { position: absolute; inset: -6% 0 0 0; will-change: transform; }
.bmg-hero__img {
width: 100%; height: 100%; object-fit: cover; object-position: 50% 42%;
transform: scale(1.14); transition: transform 2.4s var(--bmg-ease);
} html:not(.bmg-loading) .bmg-hero__img { transform: scale(1.02); }
html.bmg-js:not(.bmg-loading) .bmg-hero__img { animation: bmg-hero-zoom 2.4s var(--bmg-ease) both; }
@keyframes bmg-hero-zoom { from { transform: scale(1.14); } to { transform: scale(1.02); } }
.bmg-hero__shade {
position: absolute; inset: 0;
background:
linear-gradient(180deg, color-mix(in srgb, var(--bmg-navy) 60%, transparent) 0%, transparent 26%),
linear-gradient(0deg, color-mix(in srgb, var(--bmg-navy) 92%, transparent) 0%, color-mix(in srgb, var(--bmg-navy) 45%, transparent) 38%, transparent 66%);
}
.bmg-hero__content { position: relative; padding-bottom: clamp(36px, 6vh, 72px); padding-top: 140px; }
.bmg-hero__title {
font-size: clamp(2.7rem, 1.1rem + 6.1vw, 7.4rem);
font-weight: 250; line-height: .96; letter-spacing: -0.045em;
max-width: 14ch; text-wrap: balance;
}
.bmg-hero__title strong { font-weight: 600; }
html:not(.bmg-js) .bmg-hero__title .bmg-w > span { transform: none; } .bmg-hero__title .bmg-w { overflow: visible; }
html.bmg-js .bmg-hero__title .bmg-w > span { transform: translate3d(0, 40%, 0); opacity: 0; }
html.bmg-js:not(.bmg-loading) .bmg-hero__title .bmg-w > span { transform: none; opacity: 1; animation: bmg-word-up 1s var(--bmg-ease) calc(.05s + var(--w) * 50ms) both; }
@keyframes bmg-word-up { from { transform: translate3d(0, 40%, 0); opacity: .01; } to { transform: none; opacity: 1; } }
@keyframes bmg-fade-up { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }
@keyframes bmg-fade-in { from { opacity: 0; } to { opacity: 1; } }
.bmg-hero__bottom {
display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 28px 48px;
margin-top: clamp(28px, 4vh, 48px); padding-top: clamp(22px, 3vh, 32px);
border-top: 1px solid rgba(255, 255, 255, .22);
}
.bmg-hero__lead { max-width: 46ch; color: rgba(255, 255, 255, .84); font-size: clamp(1rem, .95rem + .3vw, 1.15rem); }
.bmg-hero__actions { display: flex; flex-wrap: wrap; gap: 12px; }
html.bmg-loading .bmg-hero__bottom, html.bmg-loading .bmg-header__inner { opacity: 0; }
html.bmg-js:not(.bmg-loading) .bmg-hero__bottom { animation: bmg-fade-up 1.1s var(--bmg-ease) .55s both; }
html.bmg-js:not(.bmg-loading) .bmg-header__inner { animation: bmg-fade-in .9s var(--bmg-ease) .4s both; } html.bmg-js [data-bmg-reveal]:not(.bmg-roll) {
opacity: 0; transform: translate3d(0, var(--bmg-rise), 0);
transition: opacity .9s var(--bmg-ease) var(--delay, 0ms), transform 1.15s var(--bmg-ease) var(--delay, 0ms);
}
html.bmg-js [data-bmg-reveal].is-in:not(.bmg-roll) { opacity: 1; transform: none; } .bmg-roll { position: relative; overflow: hidden; border-radius: var(--bmg-r-lg); background: var(--bmg-navy); isolation: isolate; }
.bmg-roll img { width: 100%; height: 100%; object-fit: cover; }
html.bmg-js .bmg-roll img {
transform: scale(1.1); filter: blur(14px) brightness(.45) saturate(.6);
transition: transform 2s var(--bmg-ease) var(--delay, 0ms), filter 1.5s var(--bmg-ease) var(--delay, 0ms);
}
html.bmg-js .bmg-roll::after {
content: ""; position: absolute; inset: -10% -70%; z-index: 1; pointer-events: none;
background: linear-gradient(110deg, transparent 40%, rgba(255, 244, 222, .42) 50%, transparent 60%);
transform: translate3d(-55%, 0, 0); opacity: 0;
}
html.bmg-js .bmg-roll.is-in img, html.bmg-js .is-in .bmg-roll img { transform: scale(1); filter: none; }
html.bmg-js .bmg-roll.is-in::after, html.bmg-js .is-in .bmg-roll::after { animation: bmg-sheen 1.7s var(--bmg-ease) calc(var(--delay, 0ms) + .45s) both; } .bmg-proj__media::before {
content: ""; position: absolute; inset: 0; z-index: 2; pointer-events: none;
background: radial-gradient(260px circle at var(--mx, 50%) var(--my, 50%), rgba(255, 246, 228, .38), transparent 65%);
mix-blend-mode: soft-light; opacity: 0; transition: opacity .45s var(--bmg-ease);
}
.bmg-proj__zoom {
position: absolute; top: 16px; right: 16px; z-index: 3;
width: 46px; height: 46px; border-radius: 50%; display: grid; place-items: center;
background: color-mix(in srgb, var(--bmg-mist) 88%, transparent); color: var(--bmg-navy);
-webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
opacity: 0; transform: scale(.6) rotate(-45deg);
transition: opacity .4s var(--bmg-ease), transform .55s var(--bmg-ease);
}
.bmg-proj__zoom svg { width: 20px; height: 20px; }
@media (hover: hover) and (pointer: fine) {
.bmg-proj__btn:hover .bmg-proj__media::before { opacity: 1; }
.bmg-proj__btn:hover .bmg-proj__zoom, .bmg-proj__btn:focus-visible .bmg-proj__zoom { opacity: 1; transform: none; }
html.bmg-js .bmg-proj.is-in .bmg-proj__btn:hover .bmg-proj__media img, .bmg-proj__btn:hover .bmg-proj__media img { transform: scale(1.045); filter: brightness(1.04); transition-delay: 0s; }
} .bmg-manifesto { padding: var(--bmg-section) 0 calc(var(--bmg-section) * .8); }
.bmg-manifesto__text {
font-family: var(--bmg-display); font-weight: 300;
font-size: clamp(1.9rem, .95rem + 3.5vw, 4.6rem);
line-height: 1.06; letter-spacing: -0.035em; max-width: 21ch; text-wrap: pretty;
}
.bmg-manifesto__text strong { font-weight: 600; }
.bmg-fill-w { transition: color .5s var(--bmg-ease); }
html.bmg-js [data-bmg-fill].is-ready .bmg-fill-w { color: color-mix(in srgb, var(--bmg-navy) 50%, var(--bmg-mist)); }
html.bmg-js [data-bmg-fill].is-ready .bmg-fill-w.on { color: var(--bmg-navy); } .bmg-manifesto__grid {
display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
gap: clamp(40px, 6vw, 112px); align-items: stretch;
}
.bmg-manifesto__copy { display: flex; flex-direction: column; align-items: flex-start; }
.bmg-manifesto .bmg-manifesto__text { margin-top: 22px; font-size: clamp(1.9rem, .9rem + 2.5vw, 3.6rem); line-height: 1.07; max-width: 17ch; }
.bmg-manifesto__foot { margin-top: auto; padding-top: clamp(40px, 5vw, 64px); width: 100%; }
.bmg-manifesto__foot p { color: var(--bmg-muted); font-size: 1.125rem; max-width: 42ch; padding-top: 28px; border-top: 1px solid var(--bmg-line); }
.bmg-manifesto__media { position: relative; display: flex; flex-direction: column; }
.bmg-manifesto__media.has-two { padding-bottom: clamp(40px, 5vw, 72px); }
.bmg-manifesto__img--a { flex: 1 1 auto; width: 100%; min-height: clamp(420px, 40vw, 600px); }
.bmg-manifesto__img--a img { position: absolute; inset: 0; }
.bmg-manifesto__media.has-two .bmg-manifesto__img--a { width: 88%; margin-left: auto; }
.bmg-manifesto__img--b {
position: absolute; left: calc(clamp(40px, 6vw, 112px) * -.45); bottom: 0; width: 44%; aspect-ratio: 4 / 5;
border: clamp(6px, .7vw, 10px) solid var(--bmg-mist); border-radius: calc(var(--bmg-r-lg) + 6px);
box-shadow: 0 30px 60px -30px color-mix(in srgb, var(--bmg-navy) 55%, transparent);
z-index: 2;
}
.bmg-eyebrow {
display: inline-flex; align-items: center; gap: 12px;
font-size: .78rem; font-weight: 600; letter-spacing: .16em; text-transform: uppercase;
color: color-mix(in srgb, var(--bmg-navy) 70%, var(--bmg-green));
}
.bmg-eyebrow::before {
content: ""; width: 34px; height: 9px;
background:
linear-gradient(var(--bmg-green), var(--bmg-green)) left bottom / 100% 1.5px no-repeat,
repeating-linear-gradient(90deg, var(--bmg-green) 0 1.5px, transparent 1.5px 8px) left bottom / 100% 9px no-repeat;
} .bmg-solutions { padding: var(--bmg-section) 0; background: var(--bmg-paper); }
.bmg-solutions__layout { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 24px; }
.bmg-solutions__stage { grid-column: 1 / span 5; }
.bmg-solutions__frame {
position: sticky; top: calc(var(--bmg-header-h) + 32px);
height: min(640px, calc(100vh - var(--bmg-header-h) - 64px));
border-radius: var(--bmg-r-lg); overflow: hidden; background: var(--bmg-navy);
} .bmg-solutions__pane { position: absolute; inset: 0; opacity: 0; transition: opacity .9s var(--bmg-ease); }
.bmg-solutions__pane img {
width: 100%; height: 100%; object-fit: cover;
transform: scale(1.08); filter: brightness(.82) saturate(.9);
transition: transform 2.2s var(--bmg-ease), filter 1.4s var(--bmg-ease);
}
.bmg-solutions__pane.is-active { opacity: 1; z-index: 2; }
.bmg-solutions__pane.is-active img { transform: scale(1); filter: none; }
.bmg-solutions__pane::after {
content: ""; position: absolute; inset: -20% -60%; z-index: 1; pointer-events: none;
background: linear-gradient(105deg, transparent 38%, rgba(255, 246, 228, .34) 50%, transparent 62%);
transform: translate3d(-60%, 0, 0); opacity: 0;
}
.bmg-solutions__pane.is-active::after { animation: bmg-sheen 1.5s var(--bmg-ease) .1s both; }
@keyframes bmg-sheen {
0% { transform: translate3d(-60%, 0, 0); opacity: 0; }
25% { opacity: 1; }
100% { transform: translate3d(60%, 0, 0); opacity: 0; }
}
.bmg-solutions__frame::after {
content: ""; position: absolute; inset: auto 0 0 0; height: 45%; z-index: 3; pointer-events: none;
background: linear-gradient(0deg, color-mix(in srgb, var(--bmg-navy) 78%, transparent), transparent);
}
.bmg-solutions__caption {
position: absolute; left: clamp(20px, 2.4vw, 32px); right: clamp(20px, 2.4vw, 32px); bottom: clamp(20px, 2.4vw, 30px); z-index: 4;
display: flex; align-items: baseline; justify-content: space-between; gap: 16px; color: #fff;
}
.bmg-solutions__count { font-size: .85rem; letter-spacing: .12em; color: rgba(255, 255, 255, .7); font-variant-numeric: tabular-nums; order: 2; }
.bmg-solutions__count b { color: var(--bmg-mint); font-weight: 600; }
.bmg-solutions__name {
font-family: var(--bmg-display); font-weight: 300; font-size: clamp(1.3rem, .9rem + 1vw, 1.9rem); letter-spacing: -0.03em; line-height: 1.1;
transition: opacity .35s var(--bmg-ease), transform .5s var(--bmg-ease);
}
.bmg-solutions__name.is-swap { opacity: 0; transform: translateY(10px); }
.bmg-solutions__caption.is-plain .bmg-solutions__name { visibility: hidden; }
.bmg-solutions__frame .bmg-solutions__pane.is-empty { padding-bottom: clamp(64px, 6vw, 84px); }
.bmg-solutions__pane.is-empty {
background:
repeating-linear-gradient(180deg, transparent 0 22px, rgba(255, 255, 255, .06) 22px 23px),
linear-gradient(160deg, var(--bmg-navy-2), var(--bmg-navy));
display: flex; align-items: flex-end; padding: clamp(24px, 3vw, 40px);
}
.bmg-solutions__pane-name {
font-family: var(--bmg-display); font-weight: 250; color: #fff;
font-size: clamp(2rem, 1rem + 2.4vw, 3.4rem); line-height: 1; letter-spacing: -0.035em; max-width: 12ch;
}
.bmg-solutions__list { grid-column: 7 / span 6; counter-reset: sol; }
.bmg-sol {
position: relative; padding: clamp(26px, 3vw, 40px) 0 clamp(26px, 3vw, 40px) 40px;
border-top: 1px solid var(--bmg-line); cursor: default;
}
.bmg-sol:last-child { border-bottom: 1px solid var(--bmg-line); }
.bmg-sol::before {
content: ""; position: absolute; left: 0; top: clamp(40px, calc(3vw + 16px), 56px);
width: 18px; height: 1.5px; background: var(--bmg-navy);
transform: scaleX(.35); transform-origin: left; opacity: .35;
transition: transform .6s var(--bmg-ease), opacity .4s, background-color .4s;
}
.bmg-sol__title {
font-size: clamp(1.55rem, .95rem + 1.7vw, 2.6rem); line-height: 1.08; letter-spacing: -0.03em;
color: color-mix(in srgb, var(--bmg-navy) 34%, var(--bmg-paper));
transition: color .5s var(--bmg-ease);
}
.bmg-sol__desc {
margin-top: 12px; max-width: 46ch; color: var(--bmg-muted);
opacity: .55; transition: opacity .5s var(--bmg-ease);
}
.bmg-sol.is-active .bmg-sol__title { color: var(--bmg-navy); }
.bmg-sol.is-active .bmg-sol__desc { opacity: 1; }
.bmg-sol.is-active::before { transform: scaleX(1); opacity: 1; background: var(--bmg-green); }
.bmg-sol__thumb { display: none; } .bmg-sol__bar { position: absolute; left: 40px; right: 0; bottom: -1px; height: 2px; overflow: hidden; z-index: 1; pointer-events: none; }
.bmg-sol__bar i {
position: absolute; inset: 0; background: var(--bmg-green);
transform-origin: left; transform: scaleX(var(--sp, 0)); opacity: 0; transition: opacity .4s;
}
.bmg-sol.is-active .bmg-sol__bar i { opacity: 1; }
.bmg-sol { transition: padding-left .6s var(--bmg-ease); }
.bmg-sol.is-active { padding-left: 52px; }
.bmg-sol.is-active::before { width: 30px; } .bmg-sim { background: var(--bmg-navy); color: #fff; padding: var(--bmg-section) 0; overflow: hidden; }
.bmg-sim__grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(40px, 6vw, 96px); align-items: center; }
.bmg-sim__text { color: var(--bmg-on-dark-muted); font-size: 1.125rem; max-width: 40ch; margin-top: 24px; }
.bmg-sim__control { margin-top: clamp(36px, 5vw, 64px); }
.bmg-sim__readout { display: flex; align-items: baseline; gap: 18px; flex-wrap: wrap; }
.bmg-sim__value {
font-family: var(--bmg-display); font-weight: 200; font-size: clamp(4rem, 2.5rem + 4.5vw, 7.5rem);
line-height: .9; letter-spacing: -0.05em; font-variant-numeric: tabular-nums;
}
.bmg-sim__value b { font-weight: 200; }
.bmg-sim__state { font-size: 1.05rem; color: var(--bmg-mint); }
.bmg-sim__label { display: block; margin: 26px 0 12px; font-size: .9rem; color: var(--bmg-on-dark-muted); }
.bmg-sim__range { display: flex; align-items: center; gap: 16px; }
.bmg-sim__icon { width: 22px; height: 22px; flex: none; color: var(--bmg-on-dark-muted); }
.bmg-sim__icon svg { width: 100%; height: 100%; }
.bmg-sim__range input[type="range"] {
-webkit-appearance: none; appearance: none; flex: 1; height: 44px; margin: 0; background: transparent; cursor: pointer;
--fill: 70%;
}
.bmg-sim__range input[type="range"]::-webkit-slider-runnable-track {
height: 3px; border-radius: 3px;
background: linear-gradient(90deg, var(--bmg-mint) 0 var(--fill), rgba(255, 255, 255, .2) var(--fill) 100%);
}
.bmg-sim__range input[type="range"]::-moz-range-track { height: 3px; border-radius: 3px; background: rgba(255, 255, 255, .2); }
.bmg-sim__range input[type="range"]::-moz-range-progress { height: 3px; border-radius: 3px; background: var(--bmg-mint); }
.bmg-sim__range input[type="range"]::-webkit-slider-thumb {
-webkit-appearance: none; width: 28px; height: 28px; margin-top: -12.5px; border-radius: 50%;
background: #fff; border: 0; box-shadow: 0 0 0 6px color-mix(in srgb, var(--bmg-mint) 30%, transparent), 0 6px 18px rgba(0, 0, 0, .35);
transition: box-shadow .3s;
}
.bmg-sim__range input[type="range"]::-moz-range-thumb {
width: 28px; height: 28px; border-radius: 50%; background: #fff; border: 0;
box-shadow: 0 0 0 6px color-mix(in srgb, var(--bmg-mint) 30%, transparent), 0 6px 18px rgba(0, 0, 0, .35);
}
.bmg-sim__range input[type="range"]:focus-visible { outline: none; }
.bmg-sim__range input[type="range"]:focus-visible::-webkit-slider-thumb { box-shadow: 0 0 0 6px var(--bmg-green), 0 6px 18px rgba(0, 0, 0, .35); }
.bmg-sim__range input[type="range"]:focus-visible::-moz-range-thumb { box-shadow: 0 0 0 6px var(--bmg-green), 0 6px 18px rgba(0, 0, 0, .35); }
.bmg-sim__window {
--open: .7;
position: relative; aspect-ratio: 5 / 4; border-radius: var(--bmg-r-lg); overflow: hidden;
background: #1b2235;
box-shadow: 0 40px 90px -40px rgba(0, 0, 0, .7), 0 0 0 1px rgba(255, 255, 255, .06);
}
.bmg-sim__img {
position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover;
filter: brightness(calc(.32 + var(--open) * .74)) saturate(calc(.7 + var(--open) * .35));
}
.bmg-sim__blind {
position: absolute; inset: 14px 0 0 0;
display: flex; flex-direction: column; perspective: 900px;
}
.bmg-sim__blind span {
flex: 1 1 0; margin-bottom: -.5px;
background: linear-gradient(180deg, #fbf8f2 0%, var(--bmg-fabric) 48%, #d6cfc1 100%);
box-shadow: 0 1px 0 rgba(0, 0, 0, .1), inset 0 1px 0 rgba(255, 255, 255, .7);
transform: rotateX(calc(var(--open) * 86deg));
transform-origin: 50% 50%;
}
.bmg-sim__rail {
position: absolute; inset: 0 0 auto 0; height: 16px;
background: linear-gradient(180deg, #ffffff, #dcd6ca);
box-shadow: 0 4px 14px rgba(0, 0, 0, .25);
}  .bmg-projects { padding: var(--bmg-section) 0; --bmg-strip-h: clamp(250px, 25vw, 370px); }
.bmg-projects__strip {
overflow-x: auto; overflow-y: hidden; overscroll-behavior-x: contain;
scrollbar-width: none; cursor: grab; outline: 0;
-webkit-mask-image: linear-gradient(90deg, transparent 0, #000 var(--bmg-gutter), #000 calc(100% - var(--bmg-gutter)), transparent 100%);
mask-image: linear-gradient(90deg, transparent 0, #000 var(--bmg-gutter), #000 calc(100% - var(--bmg-gutter)), transparent 100%);
}
.bmg-projects__strip::-webkit-scrollbar { display: none; }
.bmg-projects__strip:focus-visible { box-shadow: inset 0 0 0 2px var(--bmg-green); }
.bmg-projects__strip.is-drag { cursor: grabbing; -webkit-user-select: none; user-select: none; }
.bmg-projects__strip img { -webkit-user-drag: none; }
.bmg-projects__track {
display: flex; gap: clamp(14px, 1.6vw, 24px); width: max-content;
margin: 0; padding: 0 var(--bmg-gutter); list-style: none;
}
.bmg-proj { flex: 0 0 auto; width: calc(var(--bmg-strip-h) * .8); }
.bmg-proj--b { width: calc(var(--bmg-strip-h) * 1.34); }
.bmg-proj--c { width: var(--bmg-strip-h); }
.bmg-proj__btn {
display: block; width: 100%; padding: 0; border: 0; background: none; text-align: left; cursor: zoom-in;
border-radius: var(--bmg-r-lg);
}
.bmg-proj__media { display: block; height: var(--bmg-strip-h); }
.bmg-proj__media img { transition: transform 1.8s var(--bmg-ease), filter .6s; }
.bmg-proj__btn:hover .bmg-proj__media img { transform: scale(1.045); }
.bmg-proj__cap { display: grid; gap: 2px; margin-top: 14px; }
.bmg-proj__title { font-family: var(--bmg-display); font-size: 1.125rem; font-weight: 500; letter-spacing: -0.02em; transition: transform .5s var(--bmg-ease), color .4s; }
.bmg-proj__title::after { content: ""; display: block; height: 1px; margin-top: 4px; background: var(--bmg-green); transform: scaleX(0); transform-origin: left; transition: transform .6s var(--bmg-ease); }
@media (hover: hover) and (pointer: fine) { .bmg-proj__btn:hover .bmg-proj__title { transform: translateX(6px); } .bmg-proj__btn:hover .bmg-proj__title::after { transform: scaleX(1); } }
.bmg-proj__desc { color: var(--bmg-muted); font-size: .9rem; }  .bmg-steps { padding: var(--bmg-section) 0; background: var(--bmg-paper); }
.bmg-steps__track { position: relative; height: 2px; background: var(--bmg-line); border-radius: 2px; }
.bmg-steps__track i {
position: absolute; inset: 0; border-radius: inherit;
background: linear-gradient(90deg, var(--bmg-navy), var(--bmg-green));
transform-origin: left; transform: scaleX(var(--progress, 0));
}
.bmg-steps__track b {
position: absolute; top: 50%; left: calc(var(--progress, 0) * 100%);
width: 14px; height: 14px; margin: -7px 0 0 -7px; border-radius: 50%;
background: var(--bmg-green);
box-shadow: 0 0 0 6px color-mix(in srgb, var(--bmg-green) 22%, transparent), 0 0 24px 4px color-mix(in srgb, var(--bmg-mint) 70%, transparent);
opacity: calc(var(--progress, 0) * 40); transition: opacity .3s;
}
.bmg-steps__list { display: grid; grid-template-columns: repeat(var(--count, 4), minmax(0, 1fr)); gap: 32px; }
.bmg-step { position: relative; padding-top: 44px; padding-right: 12px; }
.bmg-step::before {
content: ""; position: absolute; top: -7px; left: 0; width: 12px; height: 12px; border-radius: 50%;
background: var(--bmg-paper); border: 1.5px solid color-mix(in srgb, var(--bmg-navy) 30%, var(--bmg-paper));
transition: background-color .5s var(--bmg-ease), border-color .5s var(--bmg-ease), transform .6s var(--bmg-ease);
}
.bmg-step.is-lit::before { background: var(--bmg-green); border-color: var(--bmg-green); transform: scale(1.25); }
html.bmg-js .bmg-step[data-bmg-reveal] { transition-delay: calc(var(--d) * 110ms); }
.bmg-step__top { display: flex; align-items: center; gap: 18px; }
.bmg-step__icon {
position: relative; flex: none; width: 64px; height: 64px; border-radius: 50%;
display: grid; place-items: center;
border: 1px solid var(--bmg-line); color: color-mix(in srgb, var(--bmg-navy) 40%, var(--bmg-paper));
background: var(--bmg-paper);
transition: background-color .6s var(--bmg-ease), color .6s var(--bmg-ease), border-color .6s var(--bmg-ease), transform .6s var(--bmg-ease);
}
.bmg-step__icon svg { width: 30px; height: 30px; }
html.bmg-js .bmg-step__icon path { stroke-dasharray: 1; stroke-dashoffset: 1; transition: stroke-dashoffset 1.1s var(--bmg-ease) .15s; }
.bmg-step:not(.is-lit) .bmg-step__icon { border-style: dashed; border-color: color-mix(in srgb, var(--bmg-navy) 22%, var(--bmg-paper)); }
html:not(.bmg-js) .bmg-step__icon, body.bmg-no-anim .bmg-step__icon { border-style: solid; }
.bmg-step.is-lit .bmg-step__icon { background: var(--bmg-navy); border-color: var(--bmg-navy); color: var(--bmg-mint); }
html.bmg-js .bmg-step.is-lit .bmg-step__icon path { stroke-dashoffset: 0; }
html.bmg-js .bmg-step.is-lit .bmg-step__icon path:nth-child(2) { transition-delay: .45s; }
html.bmg-js .bmg-step.is-lit .bmg-step__icon path:nth-child(3) { transition-delay: .7s; }
.bmg-step__icon::after {
content: ""; position: absolute; inset: -1px; border-radius: 50%;
border: 1px solid var(--bmg-green); opacity: 0; transform: scale(1);
}
.bmg-step.is-lit .bmg-step__icon::after { animation: bmg-ping 1.4s var(--bmg-ease) .2s 1 both; }
@keyframes bmg-ping { 0% { opacity: .8; transform: scale(1); } 100% { opacity: 0; transform: scale(1.6); } }
.bmg-step__num {
display: inline-flex; font-family: var(--bmg-display); font-weight: 200;
font-size: clamp(3rem, 2rem + 2.6vw, 4.8rem); line-height: 1; letter-spacing: -0.05em;
color: color-mix(in srgb, var(--bmg-navy) 22%, var(--bmg-paper));
transition: color .8s var(--bmg-ease);
}
.bmg-step.is-lit .bmg-step__num { color: var(--bmg-navy); }
.bmg-odo { display: inline-block; height: 1em; overflow: hidden; }
.bmg-odo > span { display: flex; flex-direction: column; transform: translate3d(0, calc(var(--n) * -1em), 0); }
.bmg-odo i { display: block; height: 1em; font-style: normal; text-align: center; }
html.bmg-js .bmg-odo > span { transform: translate3d(0, 0, 0); transition: transform 1.3s var(--bmg-ease) .1s; }
html.bmg-js .bmg-step.is-lit .bmg-odo > span { transform: translate3d(0, calc(var(--n) * -1em), 0); }
.bmg-step__title { font-size: 1.4rem; font-weight: 500; letter-spacing: -0.02em; margin-top: 26px; line-height: 1.2; }
.bmg-step__text { color: var(--bmg-muted); margin-top: 10px; max-width: 30ch; }
@media (hover: hover) and (pointer: fine) {
.bmg-step:hover .bmg-step__icon { transform: translateY(-4px) rotate(-6deg); border-color: var(--bmg-green); }
.bmg-step:hover .bmg-step__num { color: var(--bmg-green); }
} .bmg-catalog { background: var(--bmg-navy); color: #fff; padding: var(--bmg-section) 0; overflow: hidden; }
.bmg-catalog__grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 24px; align-items: center; }
.bmg-catalog__media { grid-column: 1 / span 5; position: relative; display: grid; place-items: center; }
.bmg-catalog__media::before {
content: ""; position: absolute; width: 90%; aspect-ratio: 1; border-radius: 50%;
background: radial-gradient(closest-side, color-mix(in srgb, var(--bmg-mint) 28%, transparent), transparent);
filter: blur(10px);
}
.bmg-catalog__device { position: relative; width: min(100%, 400px); }
.bmg-catalog__device img { filter: drop-shadow(0 50px 60px rgba(0, 0, 0, .55)); }
.bmg-catalog__copy { grid-column: 7 / span 6; }
.bmg-catalog__text { color: var(--bmg-on-dark-muted); font-size: 1.125rem; max-width: 44ch; margin-top: 24px; }
.bmg-catalog__tags { display: flex; flex-wrap: wrap; gap: 10px; margin: 36px 0 40px; max-width: 560px; }
.bmg-catalog__tags li {
padding: 9px 16px; border-radius: 999px; font-size: .92rem;
border: 1px solid rgba(255, 255, 255, .18); color: rgba(255, 255, 255, .88);
transition: border-color .3s, background-color .3s;
}
.bmg-catalog__tags li:hover { border-color: var(--bmg-mint); background: rgba(163, 234, 187, .08); } .bmg-contact { padding: var(--bmg-section) 0; } .bmg-contact__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(40px, 5vw, 80px); align-items: stretch; }
.bmg-contact__copy { display: flex; flex-direction: column; }
.bmg-contact__copy > .bmg-channels { margin-top: auto; }
.bmg-contact__copy > .bmg-contact__text { margin-bottom: clamp(40px, 5vw, 64px); }
.bmg-contact__text { color: var(--bmg-muted); font-size: 1.125rem; max-width: 42ch; margin-top: 28px; }
.bmg-channels { margin-top: clamp(40px, 5vw, 64px); border-top: 1px solid var(--bmg-line); }
.bmg-channels li { border-bottom: 1px solid var(--bmg-line); }
.bmg-channels a {
display: grid; grid-template-columns: 48px 120px 1fr; align-items: center; gap: 18px;
padding: 18px 0; text-decoration: none; transition: padding .45s var(--bmg-ease);
}
.bmg-channels a:hover { padding-left: 10px; }
.bmg-channels__icon {
width: 48px; height: 48px; border-radius: 50%; display: grid; place-items: center;
background: var(--bmg-navy); color: #fff; transition: background-color .35s, color .35s;
}
.bmg-channels__icon svg { width: 22px; height: 22px; }
.bmg-channels a:hover .bmg-channels__icon { background: var(--bmg-mint); color: var(--bmg-navy); }
.bmg-channels__label { color: var(--bmg-muted); font-size: .92rem; }
.bmg-channels__value { font-family: var(--bmg-display); font-size: clamp(1.1rem, .9rem + .7vw, 1.5rem); letter-spacing: -0.02em; overflow-wrap: anywhere; }
.bmg-form {
background: var(--bmg-paper); border-radius: var(--bmg-r-lg); padding: clamp(24px, 3vw, 40px);
box-shadow: 0 1px 0 var(--bmg-line), 0 30px 80px -50px color-mix(in srgb, var(--bmg-navy) 45%, transparent);
display: grid; gap: 18px;
}
.bmg-form__title { font-size: 1.6rem; font-weight: 400; letter-spacing: -0.025em; margin-bottom: 4px; }
.bmg-field { display: grid; gap: 8px; }
.bmg-field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.bmg-field label { font-size: .88rem; font-weight: 600; }
.bmg-field__opt { font-weight: 400; color: var(--bmg-muted); }
.bmg-field input, .bmg-field select, .bmg-field textarea {
width: 100%; min-height: 52px; padding: 13px 16px; border-radius: 14px;
border: 1px solid var(--bmg-line); background: var(--bmg-mist); color: var(--bmg-navy);
font: inherit; font-size: 1rem; transition: border-color .25s, box-shadow .25s, background-color .25s;
}
.bmg-field textarea { resize: vertical; min-height: 96px; }
.bmg-field select {
appearance: none; -webkit-appearance: none; padding-right: 40px;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%2308122a' stroke-width='1.6' stroke-linecap='round' d='m7 10 5 5 5-5'/%3E%3C/svg%3E");
background-repeat: no-repeat; background-position: right 12px center; background-size: 20px;
}
.bmg-field input:focus, .bmg-field select:focus, .bmg-field textarea:focus {
outline: none; border-color: var(--bmg-navy); background-color: #fff;
box-shadow: 0 0 0 4px color-mix(in srgb, var(--bmg-mint) 70%, transparent);
}
.bmg-field.has-error input { border-color: #c2412d; box-shadow: 0 0 0 4px rgba(194, 65, 45, .14); }
.bmg-field__err { font-size: .85rem; color: #b13a28; min-height: 0; }
.bmg-field__err:empty { display: none; }
.bmg-form__note { font-size: .85rem; color: var(--bmg-muted); }
.bmg-form__status { font-size: .9rem; color: var(--bmg-navy); font-weight: 500; }
.bmg-form__status:empty { display: none; } .bmg-footer { background: var(--bmg-navy-deep); color: #fff; padding: clamp(72px, 8vw, 120px) 0 32px; }
body:has(#bmg-dock) .bmg-footer { padding-bottom: 104px; }
.bmg-footer__top { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 3fr) minmax(0, 3fr); gap: 48px; }
.bmg-footer__brand img { width: 140px; height: auto; }
.bmg-footer__slogan {
font-family: var(--bmg-display); font-weight: 250; font-size: clamp(1.6rem, 1rem + 1.8vw, 2.6rem);
line-height: 1.1; letter-spacing: -0.03em; margin-top: 36px; max-width: 16ch;
}
.bmg-footer__slogan strong { color: var(--bmg-mint); font-weight: 600; }
.bmg-footer__nav ul, .bmg-footer__contact { display: grid; gap: 12px; align-content: start; }
.bmg-footer a { color: rgba(255, 255, 255, .78); text-decoration: none; transition: color .25s; }
.bmg-footer a:hover { color: #fff; }
.bmg-footer__contact { color: rgba(255, 255, 255, .78); overflow-wrap: anywhere; }
.bmg-footer__bottom {
display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px 32px;
margin-top: clamp(56px, 7vw, 96px); padding-top: 24px; border-top: 1px solid rgba(255, 255, 255, .1);
font-size: .88rem; color: rgba(255, 255, 255, .55);
}
.bmg-footer__bottom a { color: rgba(255, 255, 255, .55); } .bmg-dock {
position: fixed; z-index: 800; right: max(24px, env(safe-area-inset-right)); bottom: max(20px, env(safe-area-inset-bottom));
display: flex; align-items: stretch; gap: 4px; padding: 5px;
background: var(--bmg-navy); color: #fff; border-radius: 18px;
box-shadow: 0 18px 40px -16px color-mix(in srgb, var(--bmg-navy) 80%, #000), inset 0 0 0 1px rgba(255, 255, 255, .06);
transform: translate3d(0, calc(100% + 40px), 0); opacity: 0; pointer-events: none;
transition: transform .6s var(--bmg-ease), opacity .4s;
}
.bmg-dock.is-visible { transform: none; opacity: 1; pointer-events: auto; }
.bmg-dock__item {
position: relative; display: inline-flex; align-items: center; gap: 9px; min-height: 48px; padding: 0 16px 0 13px;
border-radius: 13px; text-decoration: none; font-size: .92rem; font-weight: 500; letter-spacing: -0.005em; white-space: nowrap;
transition: background-color .3s, color .3s;
}
.bmg-dock__item:hover { background: rgba(255, 255, 255, .08); }
.bmg-dock__icon { width: 20px; height: 20px; display: inline-flex; flex: none; }
.bmg-dock__icon svg { width: 100%; height: 100%; }
.bmg-dock__item--main {
background: var(--bmg-mint); color: var(--bmg-navy); padding-right: 20px; overflow: hidden;
font-family: var(--bmg-display); font-weight: 600; font-size: .98rem;
} .bmg-dock__item--main::before {
content: ""; position: absolute; left: 0; right: 0; top: 0; height: 7px; opacity: .32;
background:
repeating-linear-gradient(90deg, var(--bmg-navy) 0 1px, transparent 1px 30px) 0 0 / auto 7px repeat-x,
repeating-linear-gradient(90deg, var(--bmg-navy) 0 1px, transparent 1px 6px) 0 0 / auto 4px repeat-x;
transition: background-position 1.2s var(--bmg-ease);
}
.bmg-dock__item--main:hover { background: #c4f3d3; }
.bmg-dock__item--main:hover::before { background-position: 30px 0, 30px 0; }
body.bmg-consent-open .bmg-dock { transform: translate3d(0, calc(100% + 40px), 0); opacity: 0; pointer-events: none; } .bmg-lightbox {
width: 100vw; height: 100dvh; max-width: none; max-height: none; margin: 0; padding: 0; border: 0;
background: transparent; color: #fff; overflow: hidden;
}
.bmg-lightbox::backdrop { background: color-mix(in srgb, var(--bmg-navy) 94%, transparent); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.bmg-lightbox[open] { display: grid; place-items: center; animation: bmg-fade .35s var(--bmg-ease); }
@keyframes bmg-fade { from { opacity: 0; } to { opacity: 1; } }
.bmg-lightbox__fig { display: grid; gap: 16px; justify-items: center; padding: 72px 84px 32px; }
.bmg-lightbox__fig img { max-height: calc(100dvh - 180px); max-width: min(1200px, 100%); width: auto; border-radius: var(--bmg-r); object-fit: contain; }
.bmg-lightbox__fig figcaption { text-align: center; color: rgba(255, 255, 255, .8); }
.bmg-lightbox__fig figcaption strong { color: #fff; font-weight: 600; }
.bmg-lightbox__cta { margin-top: 4px; }
.bmg-lightbox__btn {
position: absolute; width: 52px; height: 52px; border-radius: 50%; border: 1px solid rgba(255, 255, 255, .25);
background: rgba(255, 255, 255, .08); color: #fff; display: grid; place-items: center; cursor: pointer;
transition: background-color .25s;
}
.bmg-lightbox__btn:hover { background: rgba(255, 255, 255, .18); }
.bmg-lightbox__btn svg { width: 22px; height: 22px; }
.bmg-lightbox__close { top: 20px; right: 20px; }
.bmg-lightbox__prev { left: 20px; top: 50%; transform: translateY(-50%); }
.bmg-lightbox__next { right: 20px; top: 50%; transform: translateY(-50%); } .bmg-sol__cta {
display: inline-flex; align-items: center; gap: 8px; margin-top: 14px; min-height: 44px;
font-weight: 500; font-size: .95rem; text-decoration: none; color: var(--bmg-navy);
background: linear-gradient(var(--bmg-green), var(--bmg-green)) left calc(100% - 10px) / 100% 1.5px no-repeat;
transition: opacity .4s var(--bmg-ease), transform .5s var(--bmg-ease), background-size .5s var(--bmg-ease);
}
.bmg-sol__cta:hover { background-size: 35% 1.5px; }
.bmg-sol__cta .bmg-link__icon { width: 16px; height: 16px; }
@media (min-width: 901px) {
.bmg-sol:not(.is-active):not(:focus-within) .bmg-sol__cta { opacity: 0; transform: translateY(6px); pointer-events: none; }
} .bmg-check { display: flex; align-items: flex-start; gap: 12px; font-size: .92rem; font-weight: 400; line-height: 1.45; cursor: pointer; color: var(--bmg-muted); }
.bmg-check input { position: absolute; opacity: 0; width: 22px; height: 22px; margin: 0; }
.bmg-check__box {
flex: none; width: 22px; height: 22px; border-radius: 7px; margin-top: 0;
border: 1.5px solid color-mix(in srgb, var(--bmg-navy) 35%, transparent); background: var(--bmg-mist);
display: grid; place-items: center; transition: background-color .25s, border-color .25s;
}
.bmg-check__box::after { content: ""; width: 10px; height: 6px; border: 2px solid var(--bmg-navy); border-top: 0; border-right: 0; transform: rotate(-45deg) translate(1px, -1px) scale(0); transition: transform .3s var(--bmg-ease); }
.bmg-check input:checked + .bmg-check__box { background: var(--bmg-mint); border-color: var(--bmg-navy); }
.bmg-check input:checked + .bmg-check__box::after { transform: rotate(-45deg) translate(1px, -1px) scale(1); }
.bmg-check input:focus-visible + .bmg-check__box { outline: 2px solid var(--bmg-green); outline-offset: 3px; }
.bmg-check a { color: var(--bmg-navy); }
.bmg-field.has-error .bmg-check__box { border-color: #c2412d; } .bmg-footer__legal { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 22px; }
.bmg-footer__legal a, .bmg-footer__prefs {
color: rgba(255, 255, 255, .62); text-decoration: none; background: none; border: 0; padding: 6px 0; cursor: pointer; font: inherit;
transition: color .25s;
}
.bmg-footer__legal a:hover, .bmg-footer__prefs:hover { color: #fff; }
.bmg-footer__credit { color: rgba(255, 255, 255, .72) !important; }
.bmg-footer__credit:hover { color: var(--bmg-mint) !important; } .bmg-consent {
position: fixed; z-index: 9000; left: max(24px, env(safe-area-inset-left)); bottom: max(24px, env(safe-area-inset-bottom));
width: min(460px, calc(100% - 32px)); padding: 26px 26px 22px;
background: var(--bmg-navy); color: #fff; border-radius: 22px; overflow: hidden;
box-shadow: 0 30px 70px -30px rgba(0, 0, 0, .65), inset 0 0 0 1px rgba(255, 255, 255, .07);
transform: translate3d(0, 24px, 0); opacity: 0;
transition: transform .6s var(--bmg-ease), opacity .45s var(--bmg-ease);
}
.bmg-consent[hidden] { display: none; }
.bmg-consent:focus { outline: none; }
.bmg-consent.is-in { transform: none; opacity: 1; }
.bmg-consent__rule {
display: block; position: absolute; left: 0; right: 0; top: 0; height: 9px; background: var(--bmg-mint);
}
.bmg-consent__rule::after {
content: ""; position: absolute; inset: 0;
background:
repeating-linear-gradient(90deg, var(--bmg-navy) 0 1px, transparent 1px 30px) 0 0 / auto 7px repeat-x,
repeating-linear-gradient(90deg, var(--bmg-navy) 0 1px, transparent 1px 6px) 0 0 / auto 4px repeat-x;
opacity: .45;
}
.bmg-consent__title, .bmg-prefs__title {
font-family: var(--bmg-display); font-weight: 300; font-size: clamp(1.35rem, 1.1rem + .6vw, 1.6rem);
letter-spacing: -0.03em; line-height: 1.12; margin-top: 4px;
}
.bmg-consent__text { margin-top: 10px; font-size: .95rem; line-height: 1.55; color: rgba(255, 255, 255, .78); }
.bmg-consent__text a, .bmg-prefs a { color: var(--bmg-mint); }
.bmg-consent__actions { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-top: 20px; } .bmg-cbtn {
min-height: 46px; padding: 0 10px; border-radius: 999px; cursor: pointer;
font: inherit; font-size: .92rem; font-weight: 500; color: #fff; background: transparent;
border: 1px solid rgba(255, 255, 255, .42);
transition: background-color .25s, color .25s, border-color .25s;
}
.bmg-cbtn:hover { background: var(--bmg-mint); border-color: var(--bmg-mint); color: var(--bmg-navy); }
.bmg-cbtn:focus-visible { outline: 2px solid var(--bmg-mint); outline-offset: 3px; }
.bmg-prefs {
width: min(560px, calc(100% - 24px)); max-height: calc(100dvh - 24px); margin: auto; padding: 0; border: 0;
background: transparent; color: #fff; overflow: visible;
}
.bmg-prefs::backdrop { background: color-mix(in srgb, var(--bmg-navy) 70%, transparent); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); }
.bmg-prefs[open] { animation: bmg-fade .35s var(--bmg-ease); }
.bmg-prefs__box {
position: relative; overflow: auto; max-height: calc(100dvh - 24px);
padding: 34px clamp(22px, 4vw, 34px) 26px; background: var(--bmg-navy); border-radius: 24px;
}
.bmg-prefs__intro { margin-top: 8px; color: rgba(255, 255, 255, .75); font-size: .95rem; }
.bmg-prefs__list { margin-top: 22px; border-top: 1px solid rgba(255, 255, 255, .12); }
.bmg-prefs__list li { padding: 16px 0; border-bottom: 1px solid rgba(255, 255, 255, .12); }
.bmg-prefs__list p { margin-top: 6px; font-size: .9rem; color: rgba(255, 255, 255, .68); max-width: 52ch; }
.bmg-prefs__row { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.bmg-prefs__row label { cursor: pointer; }
.bmg-prefs__always { font-size: .82rem; color: var(--bmg-mint); }
.bmg-toggle { position: relative; width: 48px; height: 28px; flex: none; }
.bmg-toggle input { position: absolute; inset: 0; opacity: 0; margin: 0; cursor: pointer; z-index: 1; }
.bmg-toggle span { position: absolute; inset: 0; border-radius: 999px; background: rgba(255, 255, 255, .2); transition: background-color .25s; }
.bmg-toggle span::after { content: ""; position: absolute; left: 4px; top: 4px; width: 20px; height: 20px; border-radius: 50%; background: #fff; transition: transform .35s var(--bmg-ease); }
.bmg-toggle input:checked + span { background: var(--bmg-green); }
.bmg-toggle input:checked + span::after { transform: translateX(20px); }
.bmg-toggle input:focus-visible + span { outline: 2px solid var(--bmg-mint); outline-offset: 3px; }
.bmg-prefs__close {
position: absolute; top: 18px; right: 16px; width: 44px; height: 44px; border-radius: 50%; border: 0; cursor: pointer;
display: grid; place-items: center; background: rgba(255, 255, 255, .08); color: #fff;
}
.bmg-prefs__close svg { width: 20px; height: 20px; } body.bmg-view { background: var(--bmg-mist); }
body.bmg-view .bmg-header { color: var(--bmg-navy); background: color-mix(in srgb, var(--bmg-mist) 88%, transparent); -webkit-backdrop-filter: saturate(1.4) blur(18px); backdrop-filter: saturate(1.4) blur(18px); box-shadow: 0 1px 0 var(--bmg-line); }
body.bmg-view .bmg-header__logo--light { opacity: 0; }
body.bmg-view .bmg-header__logo--dark { opacity: 1; }
body.bmg-view .bmg-header__inner { opacity: 1; }
body.bmg-view .bmg-header__cta:hover { background: var(--bmg-navy); color: #fff; }
.bmg-page { padding: calc(var(--bmg-header-real, 84px) + clamp(56px, 9vh, 120px)) 0 var(--bmg-section); min-height: 82svh; }
.bmg-page__title {
font-size: clamp(2.3rem, 1.2rem + 3.6vw, 4.8rem); font-weight: 250; line-height: 1; letter-spacing: -0.045em;
max-width: 15ch; text-wrap: balance; margin-top: 18px;
}
.bmg-page__title strong { font-weight: 600; }
.bmg-page__lead { margin-top: 22px; max-width: 48ch; font-size: clamp(1.05rem, 1rem + .3vw, 1.2rem); color: var(--bmg-muted); }
.bmg-page__actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 34px; }
.bmg-page__note { margin-top: 18px; font-size: .9rem; color: var(--bmg-muted); }
.bmg-done__inner, .bmg-lost__inner { display: flex; flex-direction: column; align-items: center; text-align: center; }
.bmg-done .bmg-page__title, .bmg-lost .bmg-page__title, .bmg-done .bmg-page__lead, .bmg-lost .bmg-page__lead { margin-inline: auto; }
.bmg-done .bmg-page__actions, .bmg-lost .bmg-page__actions { justify-content: center; }
.bmg-tape--done, .bmg-tape--lost { width: min(420px, 62%); margin: 0 auto 42px; transform: translateX(-24px); color: var(--bmg-navy); }
.bmg-tape--done .bmg-tape__read, .bmg-tape--lost .bmg-tape__read { color: var(--bmg-muted); }
.bmg-tape--done .bmg-tape__read b, .bmg-tape--lost .bmg-tape__read b { color: var(--bmg-navy); }
.bmg-tape--done .bmg-tape__case, .bmg-tape--lost .bmg-tape__case { background: var(--bmg-navy); }
.bmg-tape--done .bmg-tape__case i, .bmg-tape--lost .bmg-tape__case i { border-color: var(--bmg-mint); }
.bmg-tape--lost .bmg-tape__read b { font-size: 1.35rem; }
.bmg-lost__nav { margin-top: 48px; padding-top: 22px; border-top: 1px solid var(--bmg-line); width: min(560px, 100%); }
.bmg-lost__nav ul { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px 26px; }
.bmg-lost__nav a { text-decoration: none; font-weight: 500; padding: 8px 0; display: inline-block; }
.bmg-lost__nav a:hover { color: var(--bmg-green); }
.bmg-legal__head { padding-bottom: clamp(40px, 5vw, 72px); }
.bmg-legal__date { margin-top: 14px; font-size: .9rem; color: var(--bmg-muted); }
.bmg-legal__body { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 8fr); gap: clamp(32px, 5vw, 80px); align-items: start; border-top: 1px solid var(--bmg-line); padding-top: clamp(40px, 5vw, 64px); }
.bmg-legal__body > * { min-width: 0; }
.bmg-legal__toc { position: sticky; top: calc(var(--bmg-header-real, 84px) + 24px); }
.bmg-legal__toc ol { display: grid; gap: 4px; counter-reset: toc; }
.bmg-legal__toc li { counter-increment: toc; }
.bmg-legal__toc a { display: flex; gap: 12px; padding: 8px 0; text-decoration: none; color: var(--bmg-muted); font-size: .95rem; transition: color .25s; }
.bmg-legal__toc a::before { content: counter(toc, decimal-leading-zero); color: var(--bmg-green); font-variant-numeric: tabular-nums; font-weight: 600; font-size: .85rem; padding-top: 2px; }
.bmg-legal__toc a:hover, .bmg-legal__toc a.is-current { color: var(--bmg-navy); }
.bmg-legal__text { max-width: 72ch; }
.bmg-legal__text section + section { margin-top: clamp(40px, 5vw, 64px); }
.bmg-legal__text section { scroll-margin-top: calc(var(--bmg-header-real, 84px) + 24px); }
.bmg-legal__text h2 { font-size: clamp(1.45rem, 1.1rem + 1vw, 2rem); font-weight: 400; letter-spacing: -0.03em; line-height: 1.15; margin-bottom: 16px; }
.bmg-legal__text p, .bmg-legal__text li { color: color-mix(in srgb, var(--bmg-navy) 80%, var(--bmg-mist)); }
.bmg-legal__text p + p, .bmg-legal__text p + ul, .bmg-legal__text ul + p { margin-top: 14px; }
.bmg-legal__text ul:not(.bmg-legal__facts) { list-style: none; display: grid; gap: 8px; }
.bmg-legal__text ul:not(.bmg-legal__facts) li { position: relative; padding-left: 22px; }
.bmg-legal__text ul:not(.bmg-legal__facts) li::before { content: ""; position: absolute; left: 0; top: .72em; width: 10px; height: 1.5px; background: var(--bmg-green); }
.bmg-legal__text a { color: var(--bmg-navy); }
.bmg-legal__facts { margin-top: 18px; border-top: 1px solid var(--bmg-line); }
.bmg-legal__facts li { display: grid; grid-template-columns: minmax(120px, 200px) 1fr; gap: 16px; padding: 12px 0; border-bottom: 1px solid var(--bmg-line); overflow-wrap: anywhere; }
.bmg-legal__facts li span { color: var(--bmg-muted); font-size: .92rem; }
.bmg-legal__table { margin-top: 18px; overflow-x: auto; border-radius: 16px; border: 1px solid var(--bmg-line); background: #fff; }
.bmg-legal__table table { width: 100%; min-width: 560px; border-collapse: collapse; font-size: .93rem; }
.bmg-legal__table th, .bmg-legal__table td { text-align: left; padding: 12px 16px; border-bottom: 1px solid var(--bmg-line); vertical-align: top; }
.bmg-legal__table th { font-weight: 600; background: var(--bmg-mist); }
.bmg-legal__table tr:last-child td { border-bottom: 0; } @media (max-width: 1080px) {
.bmg-nav ul { gap: 20px; }
.bmg-footer__top { grid-template-columns: 1fr 1fr; }
.bmg-footer__brand { grid-column: 1 / -1; }
}
@media (max-width: 900px) {
:root { --bmg-header-h: 72px; }
.bmg-header__brand { width: 70px; height: 52px; }
.bmg-burger { display: block; margin-left: auto; } .bmg-header__cta { display: none; }
.bmg-nav {
position: fixed; inset: 0; z-index: 1; margin: 0;
display: flex; flex-direction: column; justify-content: flex-end; gap: 32px;
padding: calc(var(--bmg-header-h) + 32px) var(--bmg-gutter) max(32px, env(safe-area-inset-bottom));
background:
repeating-linear-gradient(180deg, transparent 0 calc(100% / 12 - 1px), rgba(255, 255, 255, .05) calc(100% / 12 - 1px) calc(100% / 12)),
var(--bmg-navy);
color: #fff;
clip-path: inset(0 0 100% 0);
transition: clip-path .75s var(--bmg-ease-io);
visibility: hidden;
}
.bmg-nav ul { flex-direction: column; gap: 4px; }
.bmg-nav ul a { font-family: var(--bmg-display); font-size: clamp(2.2rem, 9vw, 3rem); font-weight: 300; letter-spacing: -0.035em; padding: 6px 0; }
.bmg-nav ul a::after { bottom: 6px; }
.bmg-nav .bmg-nav__cta-mobile { display: inline-flex; align-self: flex-start; }
.bmg-nav li { opacity: 0; transform: translateY(16px); transition: opacity .5s, transform .6s var(--bmg-ease); }
body.bmg-menu-open .bmg-nav { clip-path: inset(0 0 0 0); visibility: visible; }
body.bmg-menu-open .bmg-nav li { opacity: 1; transform: none; }
body.bmg-menu-open .bmg-nav li:nth-child(1) { transition-delay: .25s; }
body.bmg-menu-open .bmg-nav li:nth-child(2) { transition-delay: .3s; }
body.bmg-menu-open .bmg-nav li:nth-child(3) { transition-delay: .35s; }
body.bmg-menu-open .bmg-nav li:nth-child(4) { transition-delay: .4s; }
body.bmg-menu-open .bmg-nav li:nth-child(5) { transition-delay: .45s; }
body.bmg-menu-open .bmg-header { color: #fff; background: transparent; box-shadow: none; -webkit-backdrop-filter: none; backdrop-filter: none; }
body.bmg-menu-open .bmg-header__logo--light { opacity: 1; }
body.bmg-menu-open .bmg-header__logo--dark { opacity: 0; }
body.bmg-menu-open .bmg-header__cta { visibility: hidden; }
.bmg-header__brand, .bmg-header__cta { position: relative; z-index: 2; }
body.bmg-menu-open .bmg-burger__bars i:nth-child(1) { transform: translateY(7.6px) rotate(45deg); }
body.bmg-menu-open .bmg-burger__bars i:nth-child(2) { opacity: 0; }
body.bmg-menu-open .bmg-burger__bars i:nth-child(3) { transform: translateY(-7.6px) rotate(-45deg); }
body.bmg-menu-open { overflow: hidden; }
.bmg-head { grid-template-columns: 1fr; }
.bmg-head__lead { justify-self: start; }
.bmg-solutions__stage { display: none; }
.bmg-solutions__list { grid-column: 1 / -1; display: grid; gap: 36px; }
.bmg-sol { padding: 0; border: 0; }
.bmg-sol:last-child { border: 0; }
.bmg-sol::before, .bmg-sol__bar { display: none; }
.bmg-sol.is-active { padding-left: 0; }
.bmg-sol__thumb { display: block; aspect-ratio: 16 / 10; margin-bottom: 18px; border-radius: var(--bmg-r); }
.bmg-sol__title { color: var(--bmg-navy); }
.bmg-sol__desc { opacity: 1; }
.bmg-sim__grid { grid-template-columns: 1fr; }
.bmg-sim__view { order: 2; }
.bmg-sim__control { margin-top: 32px; }
.bmg-projects { --bmg-strip-h: clamp(230px, 58vw, 320px); }
.bmg-steps__track { display: none; }
.bmg-steps__list { grid-template-columns: 1fr; gap: 0; }
.bmg-step { padding: 0 0 56px; }
.bmg-step:last-child { padding-bottom: 0; }
.bmg-step::before { display: none; } .bmg-step::after {
content: ""; position: absolute; left: 31px; top: 76px; bottom: 8px; width: 2px; border-radius: 2px;
background: linear-gradient(var(--bmg-green), var(--bmg-green)) top / 100% calc(var(--lp, 0) * 100%) no-repeat, var(--bmg-line);
}
.bmg-step:last-child::after { display: none; }
.bmg-step__num { font-size: 2.6rem; }
.bmg-step__title { margin-top: 16px; }
.bmg-catalog__grid { grid-template-columns: 1fr; gap: 48px; }
.bmg-catalog__media, .bmg-catalog__copy { grid-column: 1 / -1; }
.bmg-catalog__device { width: min(70%, 320px); }
.bmg-contact__grid { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
.bmg-hero__actions { width: 100%; }
.bmg-hero__actions .bmg-btn { flex: 1 1 100%; }
.bmg-hero__bottom { border-top: 0; padding-top: 0; }
.bmg-channels a { grid-template-columns: 44px 1fr; gap: 4px 14px; }
.bmg-channels__icon { width: 44px; height: 44px; grid-row: span 2; }
.bmg-field-row { grid-template-columns: 1fr; }
.bmg-footer__top { grid-template-columns: 1fr; gap: 36px; }
.bmg-lightbox__fig { padding: 72px 12px 96px; }
.bmg-lightbox__prev, .bmg-lightbox__next { top: auto; bottom: 24px; transform: none; }
.bmg-lightbox__prev { left: calc(50% - 64px); }
.bmg-lightbox__next { right: calc(50% - 64px); }
} @media (max-width: 760px) {
.bmg-hero { text-align: center; }
.bmg-hero__shade {
background:
linear-gradient(180deg, color-mix(in srgb, var(--bmg-navy) 55%, transparent) 0%, transparent 22%),
linear-gradient(0deg, color-mix(in srgb, var(--bmg-navy) 95%, transparent) 0%, color-mix(in srgb, var(--bmg-navy) 72%, transparent) 48%, color-mix(in srgb, var(--bmg-navy) 20%, transparent) 78%);
}
.bmg-hero__title { font-weight: 300; }
.bmg-hero__title { margin-inline: auto; }
.bmg-hero__bottom { justify-content: center; }
.bmg-hero__lead { margin-inline: auto; }
.bmg-hero__actions { justify-content: center; }
.bmg-head { text-align: center; justify-items: center; }
.bmg-head__lead { justify-self: center; }
.bmg-h2, .bmg-h2--xl { margin-inline: auto; }
.bmg-manifesto { text-align: center; }
.bmg-manifesto__text { margin-inline: auto; }
.bmg-sol { text-align: center; }
.bmg-sol__desc { margin-inline: auto; }
.bmg-sim__copy { text-align: center; }
.bmg-sim__text { margin-inline: auto; }
.bmg-sim__readout { justify-content: center; }
.bmg-step { text-align: center; }
.bmg-step__top { flex-direction: column; gap: 14px; }
.bmg-step::after { display: none; }
.bmg-step:not(:last-child) .bmg-step__text::after {
content: ""; display: block; width: 2px; height: 48px; margin: 24px auto 0; border-radius: 2px;
background: linear-gradient(var(--bmg-green), var(--bmg-green)) top / 100% calc(var(--lp, 0) * 100%) no-repeat, var(--bmg-line);
}
.bmg-step:not(:last-child) { padding-bottom: 24px; }
.bmg-step__text { margin-inline: auto; }
.bmg-catalog__copy { text-align: center; }
.bmg-catalog__text { margin-inline: auto; }
.bmg-catalog__tags { justify-content: center; margin-inline: auto; }
.bmg-contact__copy { text-align: center; }
.bmg-contact__text { margin-inline: auto; }
.bmg-channels a { grid-template-columns: 1fr; justify-items: center; gap: 6px; padding: 22px 0; }
.bmg-channels a:hover { padding-left: 0; }
.bmg-channels__icon { grid-row: auto; }
.bmg-form__title { text-align: center; }
.bmg-form__note { text-align: center; }
.bmg-proj__cap { justify-items: center; text-align: center; justify-content: center; }
.bmg-footer { text-align: center; }
.bmg-footer__brand img { margin-inline: auto; }
.bmg-footer__slogan { margin-inline: auto; }
.bmg-footer__nav ul, .bmg-footer__contact { justify-items: center; }
.bmg-footer__bottom { justify-content: center; text-align: center; }
.bmg-nav { align-items: center; text-align: center; }
.bmg-nav ul { align-items: center; }
.bmg-nav .bmg-nav__cta-mobile { align-self: center; }
.bmg-quote { justify-content: center; }
.bmg-quote .bmg-btn { width: min(100%, 340px); }
.bmg-catalog__actions { flex-direction: column; justify-content: center; }
.bmg-catalog__actions .bmg-quote .bmg-btn { width: auto; }
body:has(#bmg-dock) .bmg-footer { padding-bottom: 96px; }
} @media (max-width: 900px) {
.bmg-manifesto__grid { grid-template-columns: 1fr; gap: 48px; }
.bmg-manifesto__img--a { flex: none; min-height: 0; aspect-ratio: 4 / 5; }
.bmg-manifesto__foot { padding-top: 32px; }
.bmg-manifesto__media.has-two .bmg-manifesto__img--a { width: 84%; }
.bmg-manifesto__img--b { left: 0; width: 44%; }
.bmg-legal__body { grid-template-columns: 1fr; }
.bmg-legal__toc { position: static; padding-bottom: 8px; border-bottom: 1px solid var(--bmg-line); }
.bmg-legal__toc ol { grid-template-columns: 1fr 1fr; column-gap: 20px; }
.bmg-dock { left: max(12px, env(safe-area-inset-left)); right: max(12px, env(safe-area-inset-right)); bottom: max(12px, env(safe-area-inset-bottom)); }
.bmg-dock__item--main { flex: 1 1 auto; justify-content: center; }
.bmg-consent { left: 10px; right: 10px; bottom: max(10px, env(safe-area-inset-bottom)); width: auto; padding: 24px 18px 16px; }
}
@media (max-width: 760px) {
.bmg-manifesto__copy { align-items: center; text-align: center; }
.bmg-manifesto .bmg-manifesto__text { margin-inline: auto; }
.bmg-manifesto__foot p { margin-inline: auto; }
.bmg-eyebrow { justify-content: center; }
.bmg-sol__cta { margin-inline: auto; }
.bmg-page { text-align: center; }
.bmg-done__inner, .bmg-lost__inner { align-items: center; }
.bmg-page__title, .bmg-page__lead { margin-inline: auto; }
.bmg-page__actions { justify-content: center; }
.bmg-page__actions .bmg-btn { flex: 1 1 100%; }
.bmg-tape--done, .bmg-tape--lost { margin: 0 auto 42px; }
.bmg-lost__nav ul { justify-content: center; } .bmg-legal__head { text-align: center; }
.bmg-legal__text { text-align: left; }
.bmg-legal__text h2 { text-align: center; }
.bmg-legal__toc { text-align: left; }
.bmg-legal__toc ol { grid-template-columns: 1fr; }
.bmg-prefs .bmg-consent__actions { grid-template-columns: 1fr; }
.bmg-legal__facts li { grid-template-columns: 1fr; gap: 2px; }
.bmg-consent { text-align: center; }
.bmg-cbtn { font-size: .86rem; padding: 0 6px; }
.bmg-prefs__box { text-align: left; }
.bmg-footer__legal { justify-content: center; }
} .bmg-hero__content { transition: padding-bottom .5s var(--bmg-ease); }
body.bmg-consent-open .bmg-hero__content { padding-bottom: calc(var(--bmg-consent-h, 0px) + 28px); }
@media (max-width: 900px) {
body.bmg-consent-open .bmg-hero__lead { display: none; }
} @media (min-width: 901px) {
.bmg-consent {
left: max(24px, calc((100% - var(--bmg-max)) / 2)); right: max(24px, calc((100% - var(--bmg-max)) / 2)); width: auto;
display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 4px 40px;
padding: 24px 28px 20px;
}
.bmg-consent__title { grid-column: 1; margin: 0; font-size: 1.3rem; }
.bmg-consent__text { grid-column: 1; margin: 0; max-width: 70ch; }
.bmg-consent__actions { grid-column: 2; grid-row: 1 / span 2; margin: 0; grid-template-columns: repeat(3, 150px); }
}
@media (max-width: 900px) and (max-height: 720px) {
body.bmg-consent-open .bmg-hero__actions .bmg-btn--line { display: none; }
.bmg-consent { padding: 20px 16px 14px; }
.bmg-consent__title { font-size: 1.15rem; }
.bmg-consent__text { font-size: .84rem; margin-top: 6px; line-height: 1.45; }
.bmg-consent__actions { margin-top: 12px; }
.bmg-cbtn { min-height: 44px; }
}
@media (max-width: 420px) {
.bmg-dock__item:not(.bmg-dock__item--main) { padding: 0 14px; }
.bmg-dock__item:not(.bmg-dock__item--main) .bmg-dock__label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
} @media (prefers-reduced-motion: reduce) {
.bmg-loader__panel { animation: none !important; }
html { scroll-behavior: auto; }
.bmg-site *, .bmg-site *::before, .bmg-site *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; transition-delay: 0s !important; }
}
body.bmg-no-anim *, body.bmg-no-anim *::before, body.bmg-no-anim *::after { animation: none !important; transition: none !important; }
html.bmg-js body.bmg-no-anim [data-bmg-reveal], html.bmg-js body.bmg-no-anim .bmg-hero__bottom, html.bmg-js body.bmg-no-anim .bmg-header__inner { opacity: 1; transform: none; }
html.bmg-js body.bmg-no-anim .bmg-roll::after { display: none; }
html.bmg-js body.bmg-no-anim .bmg-roll img { filter: none; }
html.bmg-js body.bmg-no-anim .bmg-roll img, body.bmg-no-anim .bmg-hero__img { transform: none; }
body.bmg-no-anim .bmg-w > span { transform: none; opacity: 1; }
html.bmg-js body.bmg-no-anim .bmg-odo > span { transform: translate3d(0, calc(var(--n) * -1em), 0); }
html.bmg-js body.bmg-no-anim .bmg-step__icon path { stroke-dashoffset: 0; }  body.bmg-view--catalogo {
background:
radial-gradient(90% 55% at 50% -8%, color-mix(in srgb, var(--bmg-navy) 84%, #ffffff) 0%, transparent 70%),
var(--bmg-navy);
background-attachment: fixed;
color: #fff;
}
.bmg-cat { min-height: 100svh; padding: clamp(36px, 7vh, 76px) 16px max(40px, env(safe-area-inset-bottom)); }
.bmg-cat__inner { width: min(560px, 100%); margin-inline: auto; display: flex; flex-direction: column; align-items: center; text-align: center; } .bmg-cat__brand { display: block; text-decoration: none; border-radius: 14px; --sp: 1; }
.bmg-cat__frame { position: relative; display: block; width: clamp(176px, 46vw, 214px); padding: 0 0 30px; }
.bmg-cat__frame::before, .bmg-cat__frame::after {
content: ""; position: absolute; bottom: 14px; width: 1px; height: calc(100% - 6px);
background: linear-gradient(0deg, var(--bmg-mint), color-mix(in srgb, var(--bmg-mint) 0%, transparent));
transform-origin: bottom;
transition: transform .45s var(--bmg-ease) .3s;
}
.bmg-cat__frame::before { left: 0; }
.bmg-cat__frame::after { right: 0; transition-delay: .4s; }
.bmg-cat__logo { position: relative; display: block; width: 74%; margin: 0 auto 16px; aspect-ratio: 720 / 528; }
.bmg-cat__part { position: absolute; inset: 0; width: 100%; height: 100%; }
.bmg-cat__part--roof { clip-path: inset(0 0 73.5% 0); transition: clip-path .55s var(--bmg-ease-io) .18s; }
.bmg-cat__part--mark { clip-path: inset(26.5% 0 31.3% 0); transition: opacity .5s var(--bmg-ease) .32s, transform .6s var(--bmg-ease) .32s, filter .5s var(--bmg-ease) .32s; }
.bmg-cat__part--words { clip-path: inset(68.7% 0 0 0); transition: clip-path .5s var(--bmg-ease-io) .5s; }
.bmg-tape--cat { position: absolute; left: 0; right: 0; bottom: 0; }
.bmg-tape--cat .bmg-tape__read { left: auto; right: 10px; top: auto; bottom: -24px; transform: none; font-size: .72rem; }
.bmg-tape--cat .bmg-tape__read b { font-size: .86rem; }
.bmg-cat__head { margin-top: clamp(34px, 5vh, 46px); }
.bmg-cat__eyebrow {
display: inline-flex; align-items: center; gap: 12px;
font-size: .74rem; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; color: var(--bmg-mint);
}
.bmg-cat__eyebrow::before, .bmg-cat__eyebrow::after {
content: ""; width: 28px; height: 8px;
background:
linear-gradient(currentColor, currentColor) left bottom / 100% 1.5px no-repeat,
repeating-linear-gradient(90deg, currentColor 0 1.5px, transparent 1.5px 7px) left bottom / 100% 8px no-repeat;
opacity: .8;
}
.bmg-cat__eyebrow::after { transform: scaleX(-1); }
.bmg-cat__title {
margin-top: 16px; color: #fff;
font-size: clamp(2.05rem, 1.55rem + 2.2vw, 2.95rem); font-weight: 250; line-height: 1.02; letter-spacing: -0.042em;
text-wrap: balance;
}
.bmg-cat__title strong { font-weight: 600; color: var(--bmg-mint); }
.bmg-cat__lead { margin: 16px auto 0; max-width: 40ch; color: var(--bmg-on-dark-muted); font-size: 1rem; line-height: 1.55; } .bmg-cat__groups { width: 100%; margin-top: clamp(34px, 5vh, 44px); display: grid; gap: 26px; }
.bmg-cat__label {
display: flex; align-items: center; gap: 14px; margin-bottom: 12px;
font-family: var(--bmg-text); font-size: .74rem; font-weight: 600; letter-spacing: .18em; text-transform: uppercase;
color: rgba(255, 255, 255, .56);
}
.bmg-cat__label::before, .bmg-cat__label::after { content: ""; flex: 1; height: 1px; background: rgba(255, 255, 255, .14); }
.bmg-cat__list { display: grid; gap: 10px; }
.bmg-cat__item {
position: relative; isolation: isolate; overflow: hidden;
display: grid; grid-template-columns: auto minmax(0, 1fr) auto auto; align-items: center; gap: 14px;
min-height: 66px; padding: 10px 12px 10px 20px; border-radius: 18px;
border: 1px solid rgba(255, 255, 255, .14); background: rgba(255, 255, 255, .035);
color: #fff; text-decoration: none; text-align: left;
transition: border-color .35s, color .35s var(--bmg-ease), transform .45s var(--bmg-ease), box-shadow .45s var(--bmg-ease);
} .bmg-cat__item::before {
content: ""; position: absolute; inset: 0; z-index: -1; background: var(--bmg-mint);
transform: scaleX(0); transform-origin: left; transition: transform .5s var(--bmg-ease);
}
.bmg-cat__num { font-size: .78rem; font-weight: 600; letter-spacing: .04em; color: var(--bmg-mint); font-variant-numeric: tabular-nums; transition: color .35s; }
.bmg-cat__name { font-size: 1.04rem; font-weight: 500; letter-spacing: -0.01em; line-height: 1.25; }
.bmg-cat__type {
font-size: .66rem; font-weight: 600; letter-spacing: .14em; padding: 4px 8px 3px; border-radius: 999px;
border: 1px solid rgba(255, 255, 255, .2); color: rgba(255, 255, 255, .6); transition: border-color .35s, color .35s;
}
.bmg-cat__dl {
display: grid; place-items: center; width: 42px; height: 42px; border-radius: 50%;
background: color-mix(in srgb, var(--bmg-mint) 14%, transparent); color: var(--bmg-mint);
transition: background-color .35s, color .35s;
}
.bmg-cat__dl svg { width: 19px; height: 19px; transition: transform .45s var(--bmg-ease); }
.bmg-cat__item:hover, .bmg-cat__item:focus-visible { border-color: var(--bmg-mint); color: var(--bmg-navy); transform: translateY(-2px); box-shadow: 0 16px 34px -18px rgba(0, 0, 0, .6); }
.bmg-cat__item:hover::before, .bmg-cat__item:focus-visible::before { transform: scaleX(1); }
.bmg-cat__item:hover .bmg-cat__num, .bmg-cat__item:focus-visible .bmg-cat__num { color: var(--bmg-navy); }
.bmg-cat__item:hover .bmg-cat__type, .bmg-cat__item:focus-visible .bmg-cat__type { border-color: color-mix(in srgb, var(--bmg-navy) 30%, transparent); color: var(--bmg-navy); }
.bmg-cat__item:hover .bmg-cat__dl, .bmg-cat__item:focus-visible .bmg-cat__dl { background: var(--bmg-navy); color: var(--bmg-mint); }
.bmg-cat__item:hover .bmg-cat__dl svg { transform: translateY(2px); }
.bmg-cat__item:active { transform: scale(.985); }
.bmg-cat .bmg-cat__item:focus-visible { outline-color: #fff; } .bmg-cat__cta {
position: relative; width: 100%; margin-top: 34px; padding: 30px 22px 22px; border-radius: 24px;
background: rgba(255, 255, 255, .05); border: 1px solid rgba(255, 255, 255, .1);
}
.bmg-cat__cta::before {
content: ""; position: absolute; top: 0; left: 50%; width: 120px; height: 9px; transform: translateX(-50%);
background: repeating-linear-gradient(90deg, var(--bmg-mint) 0 1.5px, transparent 1.5px 8px) center top / 100% 9px no-repeat;
opacity: .7;
}
.bmg-cat__cta-title { font-size: clamp(1.45rem, 1.2rem + 1vw, 1.8rem); font-weight: 300; line-height: 1.1; letter-spacing: -0.03em; color: #fff; }
.bmg-cat__cta-title strong { font-weight: 600; color: var(--bmg-mint); }
.bmg-cat__cta-text { margin: 10px auto 20px; max-width: 36ch; color: var(--bmg-on-dark-muted); font-size: .97rem; line-height: 1.5; }
.bmg-cat__cta .bmg-btn { white-space: normal; text-align: center; line-height: 1.2; } .bmg-cat__foot { margin-top: 38px; display: flex; flex-direction: column; align-items: center; gap: 18px; }
.bmg-cat__social { display: flex; gap: 10px; }
.bmg-cat__social a {
display: grid; place-items: center; width: 46px; height: 46px; border-radius: 50%;
border: 1px solid rgba(255, 255, 255, .18); color: #fff; transition: background-color .3s, color .3s, border-color .3s;
}
.bmg-cat__social a:hover { background: var(--bmg-mint); border-color: var(--bmg-mint); color: var(--bmg-navy); }
.bmg-cat__social svg { width: 20px; height: 20px; }
.bmg-cat__site {
display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 8px 2px;
color: #fff; text-decoration: none; font-weight: 500;
background: linear-gradient(currentColor, currentColor) left calc(100% - 8px) / 100% 1px no-repeat;
transition: background-size .5s var(--bmg-ease), color .3s;
}
.bmg-cat__site:hover { color: var(--bmg-mint); background-size: 30% 1px; }
.bmg-cat__site-icon { display: inline-flex; width: 17px; height: 17px; }
.bmg-cat__site-icon svg { width: 100%; height: 100%; }
.bmg-cat__legal { display: flex; flex-wrap: wrap; justify-content: center; gap: 4px 0; font-size: .8rem; color: rgba(255, 255, 255, .5); }
.bmg-cat__legal > * + *::before { content: "·"; margin: 0 10px; color: rgba(255, 255, 255, .3); }
.bmg-cat__legal a, .bmg-cat__legal button { color: rgba(255, 255, 255, .62); text-decoration: none; background: none; border: 0; padding: 0; cursor: pointer; font-size: inherit; }
.bmg-cat__legal a:hover, .bmg-cat__legal button:hover { color: var(--bmg-mint); }
.bmg-cat__credit { margin-top: -10px; font-size: .78rem; color: rgba(255, 255, 255, .42); text-decoration: none; }
.bmg-cat__credit:hover { color: var(--bmg-mint); } html.bmg-js body:not(.bmg-no-anim) .bmg-cat:not(.is-in) .bmg-cat__frame::before,
html.bmg-js body:not(.bmg-no-anim) .bmg-cat:not(.is-in) .bmg-cat__frame::after { transform: scaleY(0); }
html.bmg-js body:not(.bmg-no-anim) .bmg-cat:not(.is-in) .bmg-cat__part--roof { clip-path: inset(0 50% 73.5% 50%); }
html.bmg-js body:not(.bmg-no-anim) .bmg-cat:not(.is-in) .bmg-cat__part--mark { opacity: 0; transform: translateY(8px) scale(.97); filter: blur(8px); }
html.bmg-js body:not(.bmg-no-anim) .bmg-cat:not(.is-in) .bmg-cat__part--words { clip-path: inset(68.7% 100% 0 0); }
html.bmg-js body:not(.bmg-no-anim) .bmg-cat__head,
html.bmg-js body:not(.bmg-no-anim) .bmg-cat__label,
html.bmg-js body:not(.bmg-no-anim) .bmg-cat__list > li,
html.bmg-js body:not(.bmg-no-anim) .bmg-cat__cta,
html.bmg-js body:not(.bmg-no-anim) .bmg-cat__foot {
transition: opacity .7s var(--bmg-ease), transform .8s var(--bmg-ease);
transition-delay: calc(.62s + var(--i, 0) * 55ms);
}
html.bmg-js body:not(.bmg-no-anim) .bmg-cat__head { transition-delay: .5s; }
html.bmg-js body:not(.bmg-no-anim) .bmg-cat__foot { transition-delay: calc(.62s + 12 * 55ms); }
html.bmg-js body:not(.bmg-no-anim) .bmg-cat:not(.is-in) :is(.bmg-cat__head, .bmg-cat__label, .bmg-cat__list > li, .bmg-cat__cta, .bmg-cat__foot) { opacity: 0; transform: translateY(16px); }
@media (min-width: 900px) {
.bmg-cat { padding-top: clamp(56px, 9vh, 96px); }
.bmg-cat__frame { width: 230px; }
}
@media (max-width: 420px) {
.bmg-cat__item { gap: 12px; padding-left: 16px; min-height: 62px; }
.bmg-cat__name { font-size: 1rem; }
.bmg-cat__type { display: none; }
}