/* merxion.io — pixel spec from M_Desktop_Fin_Preview.pdf (1440×5264.52) / M_Mobile_Fin_Preview.pdf (390×4560.95) */

/* Type: system Helvetica where installed (macOS/iOS); everywhere else (Windows,
   Android, Linux) fall back to self-hosted Wix Madefor Display so weights stay
   consistent. Family name kept as 'Articulat CF' so the type scale is unchanged. */
@font-face { font-family:'Articulat CF'; src:local('Helvetica Neue'), local('Helvetica'), url('../assets/fonts/WixMadeforDisplay-latin.woff2') format('woff2'); font-weight:400 800; font-style:normal; font-display:swap; }

:root{
  --dark:#1D1D1B;
  --card:#EDEDED;
  --nav-active:#F6F6F6;
  --keen:#888DFF;
  --warm:#E253E0;
  --aware:#BBB7F9;
  --clear:#C7D2E4;
  --loyal:#45C2E8;
  --curious:#FF7865;
}

*{ margin:0; padding:0; box-sizing:border-box; }
html,body{ background:#fff; }
body{ font-family:'Articulat CF', sans-serif; color:var(--dark); -webkit-font-smoothing:antialiased; }
a{ color:inherit; text-decoration:none; }
img{ display:block; }

/* ================= DESKTOP ================= */
.page-d{ position:relative; width:100.0000vw; height:365.5903vw; margin:0 auto; overflow:hidden; }

/* header */
.hd{ position:absolute; left:0; top:0; width:100.0000vw; height:4.0278vw; background:#fff; z-index:10; }
.hd-logo img{ position:absolute; left:2.6181vw; top:1.0208vw; width:6.3194vw; height:1.9792vw; }
.hd-nav{ position:absolute; left:23.4028vw; top:0; width:62.1736vw; height:4.0278vw; display:flex; }
.hd-item{ width:10.3701vw; height:4.0278vw; display:flex; align-items:center; justify-content:center;
  font-size:1.1111vw; font-weight:400; line-height:1; padding-top:0.1389vw; white-space:nowrap; color:var(--dark); }
.hd-item.is-active{ background:var(--nav-active); }
.hd-item.hd-signin{ align-self:center; height:2.5vw; width:auto; min-width:6.5vw; margin-left:0.6vw;
  padding:0 1.4vw 0.05vw; background:var(--dark); color:#fff; border-radius:1.5vw; font-weight:700; }
.hd-item.hd-signin:hover{ opacity:0.85; }

/* section shell */
.sec{ position:static; }

/* photo boxes */
.photo{ position:absolute; width:50.0000vw; height:36.8056vw; overflow:hidden; z-index:3; }
.photo .ph{ position:absolute; }
.photo .ov{ position:absolute; }
.photo-keen   { left:0;     top:4.0278vw;   border-radius:0 0 5.3333vw 0; }
.photo-warm   { left:50.0000vw; top:59.5833vw;  border-radius:5.3333vw 0 0 5.3333vw; }
.photo-aware  { left:0;     top:114.7222vw; border-radius:0 5.3333vw 5.3333vw 0; }
.photo-clear  { left:50.0000vw; top:171.4583vw; border-radius:5.3333vw 0 0 5.3333vw; }
.photo-loyal  { left:0;     top:227.0139vw; border-radius:0 5.3333vw 5.3333vw 0; }
.photo-curious{ left:50.0000vw; top:283.4722vw; border-radius:5.3333vw 0 0 5.3333vw; }

.photo-keen    .ph{ left:-10.4653vw; top:-28.0556vw;   width:93.1944vw; }
.photo-warm    .ph{ left:-8.9861vw; top:-22.8403vw; width:88.0903vw; }
.photo-aware   .ph{ left:-6.8542vw;  top:-8.7569vw; width:56.8681vw; }
.photo-clear   .ph{ left:-0.9097vw;  top:-0.8194vw;  width:57.6597vw; }
.photo-loyal   .ph{ left:-1.2569vw;  top:-7.7847vw; width:51.2431vw; }
.photo-curious .ph{ left:-8.9861vw; top:-15.6875vw; width:66.8264vw; }

/* white overlays on photos (positions relative to photo box) */
.photo-keen    .ov{ left:17.7639vw; top:0.1042vw;   width:29.8819vw; height:29.9514vw; }
.photo-warm    .ov{ left:9.8750vw; top:3.1597vw;  width:20.5764vw; height:33.6597vw; }
.photo-aware   .ov{ left:5.2361vw;  top:0.0208vw;   width:38.0486vw; height:36.8125vw; }
.photo-clear   .ov{ left:0.0556vw;   top:0.2292vw;   width:32.7917vw; height:34.0139vw; }
.photo-loyal   .ov{ left:0.0347vw;   top:-2.1667vw; width:54.5486vw; height:44.5069vw; }
.photo-curious .ov{ left:0.0139vw;   top:0.0278vw;   width:29.2986vw; height:31.4028vw; }

/* colored decors on white background (absolute page coords) */
.decor{ position:absolute; z-index:2; }
.decor-keen   { left:55.5417vw; top:16.7431vw;  width:34.4236vw; height:33.7917vw; }
.decor-warm   { left:27.3681vw; top:74.0972vw;   width:22.6319vw; height:13.9792vw; }
.decor-aware  { left:59.3403vw; top:130.3611vw; width:23.9028vw; height:30.8958vw; }
.decor-clear  { left:36.1389vw; top:185.8889vw; width:13.6875vw; height:14.2014vw; }
.decor-loyal  { left:55.8472vw; top:243.7014vw; width:29.8333vw; height:29.8333vw; }
.decor-curious{ left:14.4583vw; top:297.4236vw; width:17.5556vw; height:18.8194vw; }

/* giant words */
.giant{ position:absolute; font-weight:800; line-height:1; letter-spacing:0; white-space:nowrap; z-index:2; }
.giant-keen   { left:49.1361vw; top:5.9861vw;   font-size:16.7604vw; color:var(--keen); }
.giant-warm   { left:14.4389vw; top:62.2153vw;  font-size:13.6306vw; color:var(--warm); }
.giant-aware  { left:50.0000vw;    top:119.1042vw; font-size:12.8965vw; color:var(--aware); }
.giant-clear  { left:14.1479vw; top:172.5694vw;   font-size:16.1007vw; color:var(--clear); }
.giant-loyal  { left:49.2028vw; top:229.1042vw; font-size:16.9431vw; color:var(--loyal); }
.giant-curious{ left:14.0826vw; top:287.6528vw; font-size:11.1694vw; color:var(--curious); }

/* h2 */
.h2{ position:absolute; font-weight:700; font-size:2.1528vw; line-height:2.2917vw; color:var(--dark); z-index:4; }
.h2-keen   { left:52.9514vw; top:24.6250vw; }
.h2-warm   { left:25.5903vw; top:78.1667vw; }
.h2-aware  { left:52.9514vw; top:135.3542vw; }
.h2-clear  { left:25.5903vw; top:190.0694vw; }
.h2-loyal  { left:52.9514vw; top:247.6458vw; }
.h2-curious{ left:25.5903vw; top:302.0972vw; }

/* gray cards */
.card{ position:absolute; width:37.1528vw; background:var(--card); border-radius:1.6667vw; z-index:1; }
.card-keen   { left:39.5139vw; top:33.9583vw;  height:16.5972vw; }
.card-warm   { left:21.5278vw; top:88.0556vw; height:17.9167vw; }
.card-aware  { left:39.5139vw; top:144.7222vw; height:16.5278vw; }
.card-clear  { left:21.5278vw; top:200.0000vw; height:17.8472vw; }
.card-loyal  { left:39.5139vw; top:256.9444vw; height:16.5972vw; }
.card-curious{ left:21.5278vw; top:312.0139vw; height:17.8472vw; }

/* body copy */
.body{ position:absolute; font-weight:400; font-size:1.3889vw; line-height:1.6667vw; color:var(--dark); z-index:4; }
.body-keen   { left:53.1597vw; top:37.6181vw; }
.body-warm   { left:25.5903vw; top:93.1458vw; }
.body-aware  { left:53.1597vw; top:148.3472vw; }
.body-clear  { left:25.5903vw; top:205.0486vw; }
.body-loyal  { left:53.1597vw; top:261.5417vw; }
.body-curious{ left:25.5903vw; top:319.7500vw; }

/* footer */
.ft{ position:absolute; left:0; top:344.7222vw; width:100.0000vw; height:20.8681vw; background:var(--card); }
.ft-logo{ position:absolute; left:14.4583vw; top:2.5556vw; width:4.9861vw; height:6.8750vw; }
.ft-follow-h { position:absolute; left:30.5556vw;    top:2.6389vw; font-weight:700; font-size:1.4444vw; line-height:1.4444vw; }
.ft-sitemap-h{ position:absolute; left:54.9097vw;  top:2.6389vw; font-weight:700; font-size:1.4444vw; line-height:1.4444vw; }
.ft-contact-h{ position:absolute; left:73.3611vw; top:2.6389vw; font-weight:700; font-size:1.4444vw; line-height:1.4444vw; }
.ft-social{ position:absolute; left:30.3819vw; top:5.5000vw; width:12.7431vw; height:3.4028vw;
  display:flex; align-items:center; justify-content:space-between; }
.ft-social a{ display:block; width:3.4028vw; height:3.4028vw; transition:opacity .2s; }
.ft-social a:hover{ opacity:0.6; }
.ft-social img{ display:block; width:100%; height:100%; }
.ft-sitemap{ position:absolute; left:55.1181vw; top:4.7778vw; display:flex; flex-direction:column; }
.ft-sitemap a{ font-size:1.3889vw; line-height:2.4306vw; font-weight:400; }
.ft-email{ position:absolute; left:73.5694vw; top:5.2986vw; font-size:1.3889vw; line-height:1.3889vw; font-weight:400; }
.ft-legal{ position:absolute; left:14.5486vw; top:13.1806vw; font-size:1.1792vw; line-height:1.1806vw; font-weight:400; }
.ft-copy { position:absolute; left:14.4583vw; top:15.5764vw; font-size:1.1792vw; line-height:1.1806vw; font-weight:400; }
.dot{ display:inline-block; width:0.2083vw; height:0.2083vw; border-radius:0.1042vw; background:var(--dark); vertical-align:middle; margin:0 0.2083vw 0.2083vw; }

/* ================= MOBILE ================= */
.page-m{ display:none; position:relative; width:100.0000vw; height:1169.4872vw; margin:0; overflow:hidden; }

.mhd{ position:absolute; left:0; top:0; width:100.0000vw; height:18.2051vw; background:#fff; z-index:10; }
.mhd-logo img{ position:absolute; left:6.1538vw; top:5.1282vw; width:19.2308vw; height:6.0256vw; }
.mhd-menu{ position:absolute; left:80.5897vw; top:6.3590vw; font-family:'Articulat CF'; font-weight:300;
  font-size:5.1282vw; line-height:6.6667vw; background:none; border:0; color:var(--dark); }

.mphoto{ position:absolute; width:93.8462vw; height:77.4359vw; overflow:hidden; z-index:3; }
.mphoto .ph{ position:absolute; }
.mphoto .ov{ position:absolute; }
.mphoto-keen   { left:0;    top:18.2051vw;   border-radius:0 0 10.2564vw 0; }
.mphoto-warm   { left:6.1538vw; top:197.9487vw;  border-radius:10.2564vw 0 0 10.2564vw; }
.mphoto-aware  { left:0;    top:385.3846vw; border-radius:0 10.2564vw 10.2564vw 0; }
.mphoto-clear  { left:6.1538vw; top:565.8974vw; border-radius:10.2564vw 0 0 10.2564vw; }
.mphoto-loyal  { left:0;    top:745.6410vw; border-radius:0 10.2564vw 10.2564vw 0; }
.mphoto-curious{ left:6.1538vw; top:926.1538vw; border-radius:10.2564vw 10.2564vw 0 10.2564vw; }

.mphoto-keen    .ph{ left:-47.1282vw; top:-51.7179vw; width:188.5128vw; }
.mphoto-warm    .ph{ left:-20.4359vw;  top:-69.9487vw; width:219.0000vw; }
.mphoto-aware   .ph{ left:-20.4615vw;  top:-17.9744vw;  width:117.3077vw; }
.mphoto-clear   .ph{ left:-26.3590vw; top:-3.8718vw;  width:127.8974vw; }
.mphoto-loyal   .ph{ left:-6.1795vw;  top:-11.6410vw;  width:100.4359vw; }
.mphoto-curious .ph{ left:-21.2051vw;  top:-29.2308vw;   width:135.8718vw; }

.mphoto-keen    .ov{ left:5.8974vw;    top:0.5897vw;   width:71.4103vw; height:71.5897vw; }
.mphoto-warm    .ov{ left:16.5385vw;  top:-1.8974vw;  width:48.0000vw; height:78.5385vw; }
.mphoto-aware   .ov{ left:9.3077vw;  top:0;       width:80.0513vw; height:77.4615vw; }
.mphoto-clear   .ov{ left:2.7179vw;  top:0.1538vw;   width:67.5897vw; height:70.1282vw; }
.mphoto-loyal   .ov{ left:-3.0513vw; top:-8.7179vw;   width:105.6154vw; height:94.1282vw; }
.mphoto-curious .ov{ left:3.5897vw;    top:0.4615vw;   width:63.8205vw; height:68.4103vw; }

.mdecor{ position:absolute; z-index:2; }
.mdecor-keen { left:10.2308vw;  top:95.0513vw;  width:89.0256vw; height:87.5385vw; }
.mdecor-warm { left:38.1795vw; top:296.9744vw; width:61.1026vw; height:37.7436vw; }
.mdecor-aware{ left:46.7179vw; top:481.4103vw; width:53.2821vw; height:68.8718vw; }
.mdecor-clear{ left:62.7179vw; top:654.7179vw; width:37.2821vw; height:38.6667vw; }
.mdecor-loyal{ left:27.3590vw; top:837.9487vw;   width:72.6410vw; height:72.6410vw; }

.mgiant{ position:absolute; font-weight:800; line-height:1; white-space:nowrap; z-index:2; }
.mgiant-keen   { left:8.2205vw; top:90.6154vw;  font-size:30.5128vw; color:var(--keen); }
.mgiant-warm   { left:9.4615vw;  top:270.2051vw; font-size:30.5128vw; color:var(--warm); }
.mgiant-aware  { left:8.2205vw; top:457.7692vw; font-size:30.5128vw; color:var(--aware); }
.mgiant-clear  { left:9.4615vw;  top:638.1795vw; font-size:30.5128vw; color:var(--clear); }
.mgiant-loyal  { left:8.2205vw; top:818.0513vw; font-size:30.5128vw; color:var(--loyal); }
.mgiant-curious{ left:8.2205vw; top:1001.1795vw; font-size:26.1615vw; color:var(--curious); }

.mh2{ position:absolute; font-weight:700; font-size:7.9487vw; line-height:7.4359vw; z-index:4; }
.mh2-keen   { left:9.4615vw; top:125.5385vw; }
.mh2-warm   { left:9.4615vw; top:305.4359vw; }
.mh2-aware  { left:9.4615vw; top:493.2051vw; }
.mh2-clear  { left:9.4615vw; top:673.3333vw; }
.mh2-loyal  { left:9.4615vw; top:853.5128vw; }
.mh2-curious{ left:9.4615vw; top:1033.6410vw; }

.mcard{ position:absolute; left:0; width:100.0000vw; height:35.1282vw; background:var(--card); z-index:1; }
.mcard-keen   { top:147.1795vw; }
.mcard-warm   { top:334.6154vw; }
.mcard-aware  { top:515.1282vw; }
.mcard-clear  { top:695.1282vw; }
.mcard-loyal  { top:875.3846vw; }
.mcard-curious{ top:1055.3846vw; }

.mbody{ position:absolute; font-weight:400; font-size:4.6154vw; line-height:5.5385vw; z-index:4; }
.mbody-keen   { left:9.4615vw; top:152.2051vw; }
.mbody-warm   { left:10.4359vw; top:339.3077vw; }
.mbody-aware  { left:9.4615vw; top:520.6410vw; }
.mbody-clear  { left:10.4359vw; top:699.6154vw; }
.mbody-loyal  { left:9.4615vw; top:883.4103vw; }
.mbody-curious{ left:10.4359vw; top:1066.2308vw; }

.mft{ position:absolute; left:0; top:1118.2051vw; width:100.0000vw; height:51.2821vw; background:var(--card); }
.mft-logo{ position:absolute; left:7.4872vw; top:8.1282vw; width:26.0256vw; height:21.5128vw; }
.mft-follow-h{ position:absolute; left:44.4872vw; top:8.3333vw; font-weight:700; font-size:4.5205vw; line-height:4.5128vw; }
.mft-social{ position:absolute; left:43.9487vw; top:17.3590vw; width:39.8974vw; height:10.6667vw;
  display:flex; align-items:center; justify-content:space-between; }
.mft-social a{ display:block; width:10.6667vw; height:10.6667vw; }
.mft-social img{ display:block; width:100%; height:100%; }
.mft-legal{ position:absolute; left:7.6667vw; top:34.5897vw; font-size:3.6897vw; line-height:4.8205vw; letter-spacing:0.045em; }
.mft-copy { position:absolute; left:7.3590vw; top:39.4103vw; font-size:3.6897vw; line-height:4.8205vw; letter-spacing:0.045em; }
.mft .dot{ width:0.6667vw; height:0.6667vw; margin:0 0.6410vw 0.5128vw; }

/* ============ SWITCH ============ */
@media (max-width: 743px){
  .page-d{ display:none; }
  .page-m{ display:block; }
}