/* Magnet Studio M13 / M17 — complete premium menu pages. */
:root {
  --m17-ink:#101a38;
  --m17-copy:#667087;
  --m17-blue:#3158ff;
  --m17-violet:#7854ff;
  --m17-pink:#ea3ba8;
  --m17-green:#20aa7b;
  --m17-bg:#f4f6fa;
  --m17-line:rgba(20,33,70,.095);
  --m17-shadow:0 28px 82px rgba(31,45,83,.11);
  --m17-ease:cubic-bezier(.2,.75,.25,1);
}

body:has(.m17-page) {
  background:
    radial-gradient(circle at 2% 0%,rgba(49,88,255,.07),transparent 28%),
    radial-gradient(circle at 98% 8%,rgba(234,59,168,.05),transparent 28%),
    var(--m17-bg);
  color:var(--m17-ink);
}

body:has(.m17-page) .ms-topbar { display:none; }
body:has(.m17-page) .ms-header {
  width:min(1390px,calc(100vw - 32px));
  min-height:70px;
  margin:12px auto 0;
  padding:9px 12px 9px 18px;
  top:10px;
  border:1px solid rgba(255,255,255,.88);
  border-radius:22px;
  background:rgba(255,255,255,.89);
  box-shadow:0 14px 42px rgba(29,42,78,.095);
  backdrop-filter:blur(28px) saturate(155%);
  -webkit-backdrop-filter:blur(28px) saturate(155%);
}
body:has(.m17-page) .ms-header::before {
  content:'';
  position:absolute;
  inset:-1px;
  z-index:-1;
  padding:1px;
  border-radius:inherit;
  background:linear-gradient(110deg,rgba(49,88,255,.25),rgba(255,255,255,.75) 36%,rgba(234,59,168,.17));
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;
  mask-composite:exclude;
  pointer-events:none;
}
body:has(.m17-page) .ms-brand__mark { box-shadow:0 9px 22px rgba(87,70,238,.23); }
body:has(.m17-page) .ms-nav { gap:clamp(6px,1.1vw,16px); }
body:has(.m17-page) .ms-nav a { font-weight:650; }
body:has(.m17-page) .ms-nav a.is-active { color:var(--m17-ink); background:transparent; box-shadow:none; }
body:has(.m17-page) .ms-nav a.is-active::after { content:''; position:absolute; left:10px; right:10px; bottom:3px; height:2px; border-radius:999px; background:linear-gradient(90deg,var(--m17-blue),var(--m17-pink)); }
body:has(.m17-page) .ms-account-link { background:transparent; }
body:has(.m17-page) .ms-button--small { min-width:166px; }
body:has(.m17-page) .ms-footer { margin-top:100px; }

.m17-page { padding:18px 0 40px; overflow:clip; }
.m17-page .ms-container { width:min(1360px,calc(100vw - 40px)); }
.m17-page img { display:block; }
.m17-page h1,.m17-page h2,.m17-page h3 { margin-top:0; text-wrap:balance; }
.m17-page p { color:var(--m17-copy); }
.m17-page .ms-button { min-height:54px; padding-inline:22px; box-shadow:0 15px 34px rgba(49,88,255,.20); }
.m17-page .ms-button svg:last-child { transition:transform .22s ease; }
.m17-page .ms-button:hover svg:last-child { transform:translateX(3px); }
.m17-label { display:inline-flex; align-items:center; gap:8px; color:var(--m17-blue); font-size:10px; font-weight:900; letter-spacing:.15em; text-transform:uppercase; }
.m17-label svg { width:16px; height:16px; }
.m17-link { display:inline-flex; align-items:center; gap:8px; color:var(--m17-ink); font-size:12px; font-weight:850; }
.m17-link svg { width:16px; color:var(--m17-blue); transition:transform .22s ease; }
.m17-link:hover svg { transform:translateX(3px); }

[data-m17-reveal] { opacity:0; transform:translateY(24px); transition:opacity .72s var(--m17-ease),transform .72s var(--m17-ease); }
[data-m17-reveal].is-visible { opacity:1; transform:none; }

/* Shared hero */
.m17-hero {
  min-height:650px;
  display:grid;
  grid-template-columns:minmax(430px,.88fr) minmax(560px,1.12fr);
  overflow:hidden;
  border:1px solid rgba(255,255,255,.9);
  border-radius:34px;
  background:#fff;
  box-shadow:var(--m17-shadow);
}
.m17-hero__copy { padding:clamp(52px,5vw,78px); display:flex; flex-direction:column; justify-content:center; position:relative; z-index:2; min-width:0; }
.m17-hero__copy::after { content:''; width:260px; height:260px; position:absolute; left:-125px; bottom:-145px; border-radius:50%; background:radial-gradient(circle,rgba(49,88,255,.13),transparent 70%); pointer-events:none; }
.m17-hero h1 { max-width:760px; margin:19px 0 0; padding-right:.12em; margin-right:-.12em; color:var(--m17-ink); font-size:clamp(55px,5vw,80px); font-weight:830; line-height:.97; letter-spacing:-.058em; overflow:visible; }
.m17-hero h1 em { font-style:normal; background:linear-gradient(105deg,#3158ff,#655bff 52%,#ea3ba8); -webkit-background-clip:text; background-clip:text; color:transparent; }
.m17-hero__copy > p { max-width:600px; margin:25px 0 0; font-size:16px; line-height:1.72; }
.m17-hero__actions { margin-top:32px; display:flex; align-items:center; flex-wrap:wrap; gap:19px; }
.m17-hero__visual { min-height:650px; display:grid; place-items:center; position:relative; overflow:hidden; background:linear-gradient(145deg,#e8edf9,#f7f2ec); }
.m17-hero__visual::before { content:''; width:76%; aspect-ratio:1; position:absolute; border:1px solid rgba(49,88,255,.12); border-radius:50%; box-shadow:0 0 0 42px rgba(49,88,255,.028),0 0 0 84px rgba(49,88,255,.016); }
.m17-hero__visual::after { content:''; position:absolute; inset:0; z-index:2; background:radial-gradient(circle at var(--m17-x,50%) var(--m17-y,50%),rgba(255,255,255,.28),transparent 34%); mix-blend-mode:soft-light; pointer-events:none; }
.m17-hero__visual img { width:88%; max-height:570px; position:relative; z-index:1; object-fit:contain; filter:drop-shadow(0 28px 26px rgba(28,42,80,.24)); transform:translate3d(calc(var(--m17-shift-x,0px) * -.4),calc(var(--m17-shift-y,0px) * -.4),0); transition:transform .45s var(--m17-ease); }
.m17-hero__badge { padding:10px 13px; display:inline-flex; align-items:center; gap:7px; position:absolute; top:24px; right:24px; z-index:3; border:1px solid rgba(255,255,255,.78); border-radius:999px; color:#283654; background:rgba(255,255,255,.86); box-shadow:0 10px 28px rgba(22,34,68,.12); backdrop-filter:blur(18px); font-size:9px; font-weight:850; }
.m17-hero__badge svg { width:15px; color:var(--m17-green); }
.m17-hero.is-navy { color:#fff; border-color:rgba(255,255,255,.13); background:linear-gradient(145deg,#101b3f,#192957 72%,#273b78); }
.m17-hero.is-navy .m17-hero__copy { background:radial-gradient(circle at 4% 9%,rgba(83,108,255,.32),transparent 30%); }
.m17-hero.is-navy h1 { color:#fff; }
.m17-hero.is-navy .m17-hero__copy > p { color:#bcc6db; }
.m17-hero.is-navy .m17-label { color:#9eb0ff; }
.m17-hero.is-navy .m17-link { color:#fff; }
.m17-hero.is-navy .m17-hero__visual { background:radial-gradient(circle at 46% 45%,#243a78,#142248 70%); }
.m17-hero.is-navy .m17-hero__visual::before { border-color:rgba(255,255,255,.11); box-shadow:0 0 0 42px rgba(255,255,255,.025),0 0 0 84px rgba(255,255,255,.014); }

/* Shared section headings and final CTA */
.m17-section-head { margin-bottom:36px; display:grid; grid-template-columns:minmax(0,1.15fr) minmax(330px,.85fr); gap:60px; align-items:end; }
.m17-section-head h2 { max-width:880px; margin:13px 0 0; font-size:clamp(40px,4.2vw,64px); font-weight:820; line-height:1.02; letter-spacing:-.05em; }
.m17-section-head > p { max-width:540px; margin:0 0 6px; font-size:14px; line-height:1.72; }
.m17-final { margin-top:92px; padding:50px 56px; display:flex; align-items:center; justify-content:space-between; gap:40px; overflow:hidden; position:relative; border:1px solid rgba(255,255,255,.9); border-radius:29px; background:linear-gradient(135deg,#fff 0%,#fff 58%,#f7f4ff 100%); box-shadow:0 22px 64px rgba(31,45,83,.085); }
.m17-final::after { content:''; width:270px; height:270px; position:absolute; right:-80px; top:-150px; border-radius:50%; background:radial-gradient(circle,rgba(234,59,168,.13),transparent 70%); }
.m17-final > div { position:relative; z-index:1; }
.m17-final h2 { max-width:850px; margin:13px 0 0; font-size:clamp(36px,3.7vw,55px); line-height:1.02; letter-spacing:-.05em; }
.m17-final p { margin:12px 0 0; font-size:13px; }
.m17-final .ms-button { flex:0 0 auto; position:relative; z-index:2; }

/* Products */
.m17-product-intro { padding:112px 30px 42px; }
.m17-product-showcase { display:grid; gap:22px; }
.m17-product-row { min-height:500px; padding:20px; display:grid; grid-template-columns:minmax(520px,1.05fr) minmax(390px,.95fr); gap:clamp(42px,6vw,86px); align-items:center; overflow:hidden; border:1px solid rgba(255,255,255,.9); border-radius:31px; background:#fff; box-shadow:0 20px 62px rgba(31,45,83,.075); }
.m17-product-row.is-reverse .m17-product-row__visual { order:2; }
.m17-product-row__visual { min-height:450px; display:grid; place-items:center; position:relative; overflow:hidden; border-radius:23px; background:linear-gradient(145deg,#e9eefb,#f8f3eb); }
.m17-product-row__visual::after { content:''; position:absolute; inset:0; background:radial-gradient(circle at var(--m17-x,50%) var(--m17-y,50%),rgba(255,255,255,.55),transparent 35%); pointer-events:none; }
.m17-product-row__visual img { width:85%; max-height:410px; object-fit:contain; filter:drop-shadow(0 25px 25px rgba(31,45,83,.20)); transform:translate3d(var(--m17-shift-x,0px),var(--m17-shift-y,0px),0); transition:transform .4s var(--m17-ease); }
.m17-product-row__visual > span { padding:8px 11px; display:inline-flex; align-items:center; gap:6px; position:absolute; left:16px; bottom:16px; z-index:2; border-radius:999px; color:#35425f; background:rgba(255,255,255,.86); box-shadow:0 8px 22px rgba(31,45,83,.10); font-size:8px; font-weight:850; }
.m17-product-row__visual > span svg { width:14px; color:var(--m17-blue); }
.m17-product-row.is-photo .m17-product-row__visual { background:linear-gradient(145deg,#f1e5e5,#faf5ef); }
.m17-product-row.is-sheet .m17-product-row__visual { background:linear-gradient(145deg,#e4eafb,#f5f7fc); }
.m17-product-row.is-business .m17-product-row__visual { background:linear-gradient(145deg,#e7eefb,#f4f7fb); }
.m17-product-row__copy { padding:20px 28px; }
.m17-product-row__copy h2 { margin:14px 0 0; font-size:clamp(40px,4.1vw,63px); line-height:1; letter-spacing:-.05em; }
.m17-product-row__copy > p { max-width:560px; margin:20px 0 0; font-size:14px; line-height:1.72; }
.m17-product-facts { margin:25px 0; display:flex; flex-wrap:wrap; gap:9px; }
.m17-product-facts span { padding:8px 11px; display:inline-flex; align-items:center; gap:6px; border:1px solid var(--m17-line); border-radius:999px; color:#516078; background:#f8f9fc; font-size:9px; font-weight:800; }
.m17-product-facts svg { width:13px; color:var(--m17-green); }
.m17-compare { padding-top:110px; }
.m17-compare__table { overflow:hidden; border:1px solid var(--m17-line); border-radius:23px; background:rgba(255,255,255,.88); box-shadow:0 18px 52px rgba(31,45,83,.055); }
.m17-compare__table > div { min-height:72px; display:grid; grid-template-columns:1.2fr 1.2fr 1fr .8fr; align-items:center; border-bottom:1px solid var(--m17-line); }
.m17-compare__table > div:last-child { border-bottom:0; }
.m17-compare__table > div.is-head { min-height:50px; color:#7b8498; background:#f5f7fb; font-size:8px; font-weight:900; letter-spacing:.1em; text-transform:uppercase; }
.m17-compare__table span { padding:16px 22px; display:flex; align-items:center; gap:7px; font-size:11px; }
.m17-compare__table div:not(.is-head) span:first-child { font-weight:850; }
.m17-compare__table svg { width:14px; color:var(--m17-green); }
.m17-dark-story { margin-top:105px; padding:clamp(46px,6vw,80px); display:grid; grid-template-columns:minmax(400px,.86fr) minmax(430px,1.14fr); gap:80px; align-items:center; overflow:hidden; border-radius:34px; color:#fff; background:radial-gradient(circle at var(--m17-x,80%) var(--m17-y,20%),rgba(91,112,255,.30),transparent 35%),linear-gradient(145deg,#101b3f,#1a2a59 72%,#263b79); box-shadow:0 30px 82px rgba(15,27,61,.21); }
.m17-dark-story .m17-label { color:#9eb0ff; }
.m17-dark-story h2 { margin:14px 0 0; font-size:clamp(40px,4.3vw,64px); line-height:1.01; letter-spacing:-.05em; }
.m17-dark-story p { max-width:560px; margin:20px 0 0; color:#bdc6da; font-size:14px; line-height:1.72; }
.m17-dark-story ul { margin:25px 0 0; padding:0; display:grid; gap:11px; list-style:none; }
.m17-dark-story li { display:flex; align-items:center; gap:9px; color:#d8dfed; font-size:11px; font-weight:700; }
.m17-dark-story li svg { width:16px; color:#6ee0b5; }
.m17-proof-card { min-height:440px; padding:24px; display:grid; grid-template-rows:auto 1fr auto; border:1px solid rgba(255,255,255,.18); border-radius:25px; background:rgba(255,255,255,.08); box-shadow:inset 0 1px 0 rgba(255,255,255,.12); backdrop-filter:blur(18px); }
.m17-proof-card > span { color:#aab9ff; font-size:8px; font-weight:900; letter-spacing:.13em; }
.m17-proof-card img { width:75%; max-height:300px; place-self:center; object-fit:contain; filter:drop-shadow(0 22px 20px rgba(2,8,24,.35)); }
.m17-proof-card > div { padding:14px 16px; display:grid; gap:4px; border-radius:15px; background:rgba(255,255,255,.1); }
.m17-proof-card b { font-size:14px; }
.m17-proof-card small { color:#bbc6da; font-size:9px; }

/* How it works */
.m17-process { padding-top:112px; }
.m17-process__list { display:grid; gap:16px; }
.m17-process__list article { min-height:240px; padding:16px; display:grid; grid-template-columns:68px minmax(260px,.62fr) minmax(340px,1.38fr); gap:24px; align-items:center; overflow:hidden; border:1px solid rgba(255,255,255,.9); border-radius:27px; background:#fff; box-shadow:0 17px 50px rgba(31,45,83,.06); }
.m17-process__number { width:46px; height:46px; display:grid; place-items:center; border-radius:50%; color:#fff; background:linear-gradient(135deg,var(--m17-blue),var(--m17-violet)); box-shadow:0 10px 24px rgba(49,88,255,.22); font-size:10px; font-weight:900; }
.m17-process__visual { min-height:205px; display:grid; place-items:center; overflow:hidden; border-radius:18px; background:linear-gradient(145deg,#edf1fb,#f8f4ed); }
.m17-process__visual img { width:80%; height:190px; object-fit:contain; filter:drop-shadow(0 14px 14px rgba(31,45,83,.16)); }
.m17-process__copy { padding:15px 30px; }
.m17-process__copy > svg { width:23px; color:var(--m17-blue); }
.m17-process__copy h3 { margin:14px 0 0; font-size:clamp(27px,2.7vw,40px); letter-spacing:-.04em; }
.m17-process__copy p { max-width:620px; margin:12px 0 0; font-size:13px; line-height:1.65; }
.m17-deep-dive { margin-top:105px; padding:clamp(42px,6vw,76px); display:grid; grid-template-columns:minmax(390px,.86fr) minmax(520px,1.14fr); gap:70px; align-items:center; overflow:hidden; border:1px solid rgba(255,255,255,.9); border-radius:33px; background:#fff; box-shadow:0 24px 72px rgba(31,45,83,.08); }
.m17-deep-dive__copy h2,.m17-proof-story__copy h2 { margin:14px 0 0; font-size:clamp(40px,4.2vw,63px); line-height:1.02; letter-spacing:-.05em; }
.m17-deep-dive__copy > p,.m17-proof-story__copy > p { margin:20px 0 0; font-size:14px; line-height:1.72; }
.m17-mini-grid { margin-top:26px; display:grid; grid-template-columns:repeat(3,1fr); gap:9px; }
.m17-mini-grid span { min-height:100px; padding:15px; display:grid; align-content:center; gap:4px; border:1px solid var(--m17-line); border-radius:16px; background:#f8f9fc; }
.m17-mini-grid svg { width:18px; color:var(--m17-blue); }
.m17-mini-grid b { font-size:10px; }
.m17-mini-grid small { color:#8490a4; font-size:7.5px; }
.m17-before-after { display:grid; grid-template-columns:1fr auto 1fr; gap:14px; align-items:center; }
.m17-before-after > svg { width:24px; color:var(--m17-blue); }
.m17-before-after article { min-width:0; padding:13px; border:1px solid var(--m17-line); border-radius:21px; background:#f7f9fc; }
.m17-before-after article small { display:block; padding:4px 3px 11px; color:#748096; font-size:7.5px; font-weight:900; letter-spacing:.11em; }
.m17-before-after img { width:100%; height:310px; object-fit:contain; border-radius:15px; background:linear-gradient(145deg,#edf1fa,#f8f4ed); }
.m17-proof-story { margin-top:105px; display:grid; grid-template-columns:minmax(560px,1.1fr) minmax(380px,.9fr); gap:75px; align-items:center; }
.m17-proof-story__visual { min-height:520px; display:grid; place-items:center; border-radius:30px; background:linear-gradient(145deg,#e6ecf9,#f7f3eb); }
.m17-proof-screen { width:82%; overflow:hidden; border:1px solid rgba(255,255,255,.9); border-radius:23px; background:#fff; box-shadow:0 28px 62px rgba(31,45,83,.18); transform:rotate(-1deg); }
.m17-proof-screen header { min-height:46px; padding:12px; display:flex; align-items:center; gap:6px; border-bottom:1px solid var(--m17-line); }
.m17-proof-screen header i { width:8px; height:8px; border-radius:50%; background:#ff6d63; }
.m17-proof-screen header i:nth-child(2) { background:#ffc74b; }
.m17-proof-screen header i:nth-child(3) { background:#36c98a; }
.m17-proof-screen header b { margin-left:8px; font-size:9px; }
.m17-proof-screen img { width:100%; height:330px; object-fit:contain; padding:22px; background:#f5f7fb; }
.m17-proof-screen footer { padding:15px; display:flex; justify-content:space-between; gap:10px; }
.m17-proof-screen footer span { display:flex; align-items:center; gap:5px; color:#617086; font-size:7.5px; font-weight:800; }
.m17-proof-screen footer svg { width:12px; color:var(--m17-green); }
.m17-proof-story__copy ul { margin:25px 0 0; padding:0; display:grid; gap:11px; list-style:none; }
.m17-proof-story__copy li { display:flex; align-items:center; gap:9px; color:#516078; font-size:11px; font-weight:700; }
.m17-proof-story__copy li svg { width:16px; color:var(--m17-green); }
.m17-local-strip { margin-top:90px; padding:20px 24px; display:grid; grid-template-columns:auto 1fr auto; gap:16px; align-items:center; border:1px solid rgba(25,159,115,.12); border-radius:19px; background:#eef8f4; }
.m17-local-strip > svg { width:24px; color:var(--m17-green); }
.m17-local-strip > div { display:grid; gap:3px; }
.m17-local-strip b { font-size:11px; }
.m17-local-strip span { color:#6e7e79; font-size:9px; }

/* Pricing */
.m17-calculator { margin-top:100px; display:grid; grid-template-columns:minmax(520px,1.05fr) minmax(390px,.95fr); gap:24px; align-items:stretch; }
.m17-calculator__controls { padding:48px; border:1px solid rgba(255,255,255,.9); border-radius:30px; background:#fff; box-shadow:0 22px 65px rgba(31,45,83,.075); }
.m17-calculator__controls h2 { margin:13px 0 30px; font-size:clamp(38px,4vw,58px); line-height:1.02; letter-spacing:-.05em; }
.m17-control { padding:20px 0; border-top:1px solid var(--m17-line); }
.m17-control > b { display:block; margin-bottom:12px; font-size:11px; }
.m17-control > div { display:flex; flex-wrap:wrap; gap:8px; }
.m17-control button { min-height:42px; padding:0 14px; border:1px solid var(--m17-line); border-radius:12px; color:#566178; background:#f8f9fc; font-size:10px; font-weight:800; cursor:pointer; transition:.2s ease; }
.m17-control button:hover { transform:translateY(-1px); border-color:rgba(49,88,255,.25); }
.m17-control button.is-selected { color:#fff; border-color:transparent; background:linear-gradient(110deg,var(--m17-blue),var(--m17-violet)); box-shadow:0 9px 20px rgba(49,88,255,.20); }
.m17-calculator__summary { padding:42px; display:flex; flex-direction:column; overflow:hidden; position:relative; border-radius:30px; color:#fff; background:radial-gradient(circle at var(--m17-x,80%) var(--m17-y,20%),rgba(100,120,255,.35),transparent 35%),linear-gradient(145deg,#101b3f,#1b2b5c 72%,#263c7a); box-shadow:0 30px 80px rgba(15,27,61,.22); }
.m17-calculator__summary > span { color:#a9b8ff; font-size:9px; font-weight:900; letter-spacing:.13em; }
.m17-calculator__summary > strong { margin-top:13px; font-size:clamp(53px,5vw,76px); letter-spacing:-.06em; }
.m17-calculator__summary > p { margin:7px 0 0; color:#bec7da; font-size:12px; }
.m17-calculator__summary > em { margin-top:17px; padding:10px 12px; display:flex; align-items:center; gap:7px; width:fit-content; border-radius:999px; color:#bff0dd; background:rgba(41,190,139,.13); font-size:9px; font-style:normal; font-weight:800; }
.m17-calculator__summary > em svg { width:14px; }
.m17-price-preview { min-height:280px; display:grid; place-items:center; flex:1; }
.m17-price-preview img { width:78%; max-height:270px; object-fit:contain; filter:drop-shadow(0 22px 20px rgba(2,8,24,.35)); }
.m17-calculator__summary .ms-button { width:100%; justify-content:center; color:var(--m17-blue); background:#fff; box-shadow:0 14px 30px rgba(3,10,30,.23); }
.m17-calculator__summary > small { margin-top:12px; color:#9faac0; font-size:7.5px; line-height:1.5; text-align:center; }
.m17-price-includes { padding-top:105px; }
.m17-price-includes > div:last-child { display:grid; grid-template-columns:repeat(4,1fr); gap:13px; }
.m17-price-includes article { min-height:230px; padding:28px; border:1px solid rgba(255,255,255,.9); border-radius:23px; background:#fff; box-shadow:0 16px 46px rgba(31,45,83,.06); }
.m17-price-includes article > span { width:46px; height:46px; display:grid; place-items:center; border-radius:15px; color:var(--m17-blue); background:#edf1ff; }
.m17-price-includes article svg { width:21px; }
.m17-price-includes h3 { margin:22px 0 0; font-size:21px; letter-spacing:-.035em; }
.m17-price-includes p { margin:10px 0 0; font-size:11px; line-height:1.6; }
.m17-volume { margin-top:105px; padding:clamp(45px,6vw,76px); display:grid; grid-template-columns:minmax(360px,.82fr) minmax(540px,1.18fr); gap:70px; align-items:center; border-radius:32px; color:#fff; background:linear-gradient(145deg,#101b3f,#1b2b5c 72%,#273b78); box-shadow:0 28px 78px rgba(15,27,61,.20); }
.m17-volume h2 { margin:14px 0 0; font-size:clamp(40px,4.2vw,62px); line-height:1.02; letter-spacing:-.05em; }
.m17-volume > div:first-child > p { margin:20px 0 0; color:#bdc6d9; font-size:14px; line-height:1.72; }
.m17-volume .m17-label { color:#a8b7ff; }
.m17-volume__tiers { display:grid; grid-template-columns:repeat(5,1fr); overflow:hidden; border:1px solid rgba(255,255,255,.14); border-radius:19px; }
.m17-volume__tiers article { min-height:150px; padding:18px 13px; display:grid; align-content:center; gap:7px; border-right:1px solid rgba(255,255,255,.12); background:rgba(255,255,255,.045); }
.m17-volume__tiers article:last-child { border-right:0; }
.m17-volume__tiers article.is-highlighted { background:linear-gradient(145deg,rgba(49,88,255,.48),rgba(120,84,255,.34)); }
.m17-volume__tiers span { color:#aebaf0; font-size:9px; font-weight:900; }
.m17-volume__tiers b { font-size:11px; }
.m17-volume__tiers small { color:#aeb7cb; font-size:7.5px; line-height:1.35; }

/* FAQ */
.m17-faq { padding-top:105px; }
.m17-faq > div:last-child { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.m17-faq details { border:1px solid rgba(255,255,255,.9); border-radius:18px; background:#fff; box-shadow:0 13px 38px rgba(31,45,83,.045); }
.m17-faq summary { min-height:72px; padding:20px 22px; display:flex; align-items:center; justify-content:space-between; gap:20px; list-style:none; cursor:pointer; font-size:12px; font-weight:850; }
.m17-faq summary::-webkit-details-marker { display:none; }
.m17-faq summary svg { width:17px; flex:0 0 auto; color:var(--m17-blue); transition:transform .2s ease; }
.m17-faq details[open] summary svg { transform:rotate(45deg); }
.m17-faq details p { margin:0; padding:0 22px 22px; font-size:11px; line-height:1.65; }

/* Support */
.m17-help-topics { padding-top:105px; }
.m17-help-topics > div:last-child { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
.m17-help-topics article { min-height:270px; padding:29px; border:1px solid rgba(255,255,255,.9); border-radius:24px; background:#fff; box-shadow:0 17px 48px rgba(31,45,83,.06); transition:transform .25s ease,box-shadow .25s ease; }
.m17-help-topics article:hover { transform:translateY(-4px); box-shadow:0 24px 58px rgba(31,45,83,.10); }
.m17-help-topics article > span { width:48px; height:48px; display:grid; place-items:center; border-radius:15px; color:var(--m17-blue); background:#edf1ff; }
.m17-help-topics h3 { margin:23px 0 0; font-size:23px; letter-spacing:-.04em; }
.m17-help-topics p { margin:11px 0 0; font-size:11px; line-height:1.62; }
.m17-help-topics button { margin-top:20px; padding:0; display:flex; align-items:center; gap:7px; border:0; color:var(--m17-blue); background:transparent; font-size:9px; font-weight:850; }
.m17-help-topics button svg { width:14px; }
.m17-photo-guide { margin-top:105px; padding:clamp(42px,6vw,72px); display:grid; grid-template-columns:minmax(420px,.9fr) minmax(510px,1.1fr); gap:75px; align-items:center; border:1px solid rgba(255,255,255,.9); border-radius:32px; background:#fff; box-shadow:0 23px 68px rgba(31,45,83,.075); }
.m17-photo-guide__copy h2 { margin:14px 0 0; font-size:clamp(40px,4.2vw,62px); line-height:1.02; letter-spacing:-.05em; }
.m17-photo-guide__copy > p { margin:20px 0 0; font-size:14px; line-height:1.72; }
.m17-photo-guide__copy > div { margin-top:28px; display:grid; gap:10px; }
.m17-photo-guide__copy article { padding:14px 16px; display:grid; grid-template-columns:auto 1fr; gap:13px; align-items:center; border:1px solid var(--m17-line); border-radius:15px; background:#f8f9fc; }
.m17-photo-guide__copy article > span { width:34px; height:34px; display:grid; place-items:center; border-radius:50%; color:#fff; background:var(--m17-ink); font-size:8px; font-weight:900; }
.m17-photo-guide__copy article > div { display:grid; gap:3px; }
.m17-photo-guide__copy b { font-size:10px; }
.m17-photo-guide__copy small { color:#7e899c; font-size:8px; line-height:1.35; }
.m17-photo-guide__visual { min-height:500px; display:grid; place-items:center; position:relative; overflow:hidden; border-radius:24px; background:linear-gradient(145deg,#e7edf9,#f8f3eb); }
.m17-photo-guide__visual img { width:82%; height:430px; object-fit:cover; border-radius:18px; box-shadow:0 24px 44px rgba(31,45,83,.16); }
.m17-photo-guide__visual span { padding:9px 12px; display:flex; align-items:center; gap:6px; position:absolute; left:20px; bottom:20px; border-radius:999px; color:#426052; background:rgba(255,255,255,.88); box-shadow:0 8px 22px rgba(31,45,83,.10); font-size:8px; font-weight:850; }
.m17-photo-guide__visual svg { width:14px; color:var(--m17-green); }
.m17-support-human { margin-top:105px; padding:clamp(46px,6vw,78px); display:grid; grid-template-columns:minmax(420px,1fr) minmax(370px,.78fr); gap:75px; align-items:center; border-radius:34px; color:#fff; background:radial-gradient(circle at var(--m17-x,80%) var(--m17-y,20%),rgba(99,118,255,.32),transparent 35%),linear-gradient(145deg,#101b3f,#1a2a59 72%,#263b79); box-shadow:0 30px 82px rgba(15,27,61,.21); }
.m17-support-human .m17-label { color:#a8b7ff; }
.m17-support-human h2 { margin:14px 0 0; font-size:clamp(40px,4.2vw,63px); line-height:1.02; letter-spacing:-.05em; }
.m17-support-human p { margin:20px 0 0; color:#bdc6da; font-size:14px; line-height:1.72; }
.m17-support-human > div:first-child > div { margin-top:27px; display:grid; gap:10px; }
.m17-support-human > div:first-child span:not(.m17-label) { display:flex; align-items:center; gap:8px; color:#d8dfed; font-size:10px; font-weight:700; }
.m17-support-human > div:first-child svg { width:16px; color:#6ee0b5; }
.m17-human-card { padding:28px; border:1px solid rgba(255,255,255,.17); border-radius:24px; background:rgba(255,255,255,.08); backdrop-filter:blur(18px); }
.m17-human-card > span { color:#aab9ff; font-size:8px; font-weight:900; letter-spacing:.13em; }
.m17-human-card strong { display:block; margin-top:13px; font-size:27px; letter-spacing:-.04em; }
.m17-human-card p { font-size:11px; }
.m17-human-card button { width:100%; min-height:48px; margin-top:18px; display:flex; align-items:center; justify-content:center; gap:7px; border:0; border-radius:13px; color:#12684e; background:#dff7ed; font-size:9px; font-weight:850; }
.m17-human-card button svg { width:15px; }

/* B2B */
.m17-b2b-benefits { padding-top:105px; }
.m17-b2b-benefits > div:last-child { display:grid; grid-template-columns:repeat(4,1fr); gap:13px; }
.m17-b2b-benefits article { min-height:250px; padding:28px; border:1px solid rgba(255,255,255,.9); border-radius:23px; background:#fff; box-shadow:0 16px 46px rgba(31,45,83,.06); }
.m17-b2b-benefits article > span { width:48px; height:48px; display:grid; place-items:center; border-radius:15px; color:var(--m17-blue); background:#edf1ff; }
.m17-b2b-benefits h3 { margin:22px 0 0; font-size:23px; letter-spacing:-.04em; }
.m17-b2b-benefits p { margin:10px 0 0; font-size:11px; line-height:1.6; }
.m17-b2b-workspace { margin-top:105px; padding:clamp(44px,6vw,78px); display:grid; grid-template-columns:minmax(390px,.82fr) minmax(510px,1.18fr); gap:75px; align-items:center; border-radius:34px; color:#fff; background:linear-gradient(145deg,#101b3f,#1a2a59 72%,#263b79); box-shadow:0 30px 82px rgba(15,27,61,.21); }
.m17-b2b-workspace .m17-label { color:#a8b7ff; }
.m17-b2b-workspace h2 { margin:14px 0 0; font-size:clamp(40px,4.2vw,63px); line-height:1.02; letter-spacing:-.05em; }
.m17-b2b-workspace p { margin:20px 0 0; color:#bdc6da; font-size:14px; line-height:1.72; }
.m17-b2b-workspace ul { margin:26px 0 0; padding:0; display:grid; gap:10px; list-style:none; }
.m17-b2b-workspace li { display:flex; align-items:center; gap:8px; color:#d8dfed; font-size:10px; font-weight:700; }
.m17-b2b-workspace li svg { width:16px; color:#6ee0b5; }
.m17-b2b-board { padding:23px; border:1px solid rgba(255,255,255,.17); border-radius:24px; background:rgba(255,255,255,.08); backdrop-filter:blur(18px); }
.m17-b2b-board header { padding:4px 4px 17px; display:flex; align-items:center; justify-content:space-between; gap:20px; }
.m17-b2b-board header span { color:#aab9ff; font-size:8px; font-weight:900; letter-spacing:.13em; }
.m17-b2b-board header b { font-size:10px; }
.m17-b2b-board article { min-height:72px; padding:13px; display:grid; grid-template-columns:auto 1fr auto; gap:12px; align-items:center; border-bottom:1px solid rgba(255,255,255,.1); }
.m17-b2b-board article > span { width:34px; height:34px; display:grid; place-items:center; border-radius:11px; color:#fff; background:rgba(255,255,255,.1); font-size:8px; font-weight:900; }
.m17-b2b-board article > div { display:grid; gap:3px; }
.m17-b2b-board article b { font-size:10px; }
.m17-b2b-board article small { color:#aeb8cc; font-size:7.5px; }
.m17-b2b-board article em { padding:6px 8px; border-radius:999px; color:#bff0dd; background:rgba(41,190,139,.13); font-size:7px; font-style:normal; font-weight:800; }
.m17-b2b-board button { width:100%; min-height:46px; margin-top:15px; display:flex; align-items:center; justify-content:center; gap:7px; border:0; border-radius:13px; color:var(--m17-blue); background:#fff; font-size:9px; font-weight:850; }
.m17-b2b-board button svg { width:15px; }
.m17-b2b-uses { padding-top:105px; }
.m17-b2b-uses > div:last-child { display:grid; grid-template-columns:repeat(3,1fr); gap:15px; }
.m17-b2b-uses article { padding:14px 14px 27px; border:1px solid rgba(255,255,255,.9); border-radius:25px; background:#fff; box-shadow:0 17px 48px rgba(31,45,83,.06); }
.m17-b2b-uses article > div { min-height:250px; display:grid; place-items:center; overflow:hidden; border-radius:18px; background:linear-gradient(145deg,#e6ecf9,#f8f3eb); }
.m17-b2b-uses img { width:84%; height:235px; object-fit:contain; filter:drop-shadow(0 18px 18px rgba(31,45,83,.17)); }
.m17-b2b-uses .m17-label { margin:22px 10px 0; }
.m17-b2b-uses h3 { margin:9px 10px 0; font-size:27px; letter-spacing:-.04em; }
.m17-b2b-uses p { margin:10px 10px 0; font-size:11px; line-height:1.6; }
.m17-b2b-flow { margin-top:105px; padding:50px; border:1px solid rgba(255,255,255,.9); border-radius:29px; background:#fff; box-shadow:0 20px 62px rgba(31,45,83,.07); }
.m17-b2b-flow > div:first-child { display:flex; align-items:flex-end; justify-content:space-between; gap:40px; }
.m17-b2b-flow h2 { max-width:700px; margin:13px 0 0; font-size:clamp(38px,4vw,58px); line-height:1.02; letter-spacing:-.05em; }
.m17-b2b-flow > div:last-child { margin-top:35px; display:grid; grid-template-columns:repeat(4,1fr); gap:0; overflow:hidden; border:1px solid var(--m17-line); border-radius:18px; }
.m17-b2b-flow article { min-height:180px; padding:22px; display:grid; align-content:center; gap:7px; border-right:1px solid var(--m17-line); background:#f8f9fc; }
.m17-b2b-flow article:last-child { border-right:0; }
.m17-b2b-flow article span { color:var(--m17-blue); font-size:9px; font-weight:900; }
.m17-b2b-flow article b { font-size:12px; }
.m17-b2b-flow article small { color:#7d879a; font-size:8px; line-height:1.45; }
.m17-b2b-volume { margin-top:105px; display:grid; grid-template-columns:minmax(390px,.82fr) minmax(520px,1.18fr); gap:75px; align-items:center; }
.m17-b2b-volume h2 { margin:14px 0 0; font-size:clamp(40px,4.2vw,62px); line-height:1.02; letter-spacing:-.05em; }
.m17-b2b-volume p { margin:20px 0 0; font-size:14px; line-height:1.72; }
.m17-b2b-volume__cards { display:grid; grid-template-columns:repeat(3,1fr); gap:11px; }
.m17-b2b-volume__cards article { min-height:210px; padding:23px; display:grid; align-content:center; gap:9px; border:1px solid rgba(255,255,255,.9); border-radius:21px; background:#fff; box-shadow:0 16px 46px rgba(31,45,83,.06); }
.m17-b2b-volume__cards article.is-primary { color:#fff; background:linear-gradient(145deg,var(--m17-blue),var(--m17-violet)); box-shadow:0 24px 52px rgba(49,88,255,.22); }
.m17-b2b-volume__cards small { color:var(--m17-blue); font-size:7.5px; font-weight:900; letter-spacing:.11em; }
.m17-b2b-volume__cards .is-primary small { color:#d4dbff; }
.m17-b2b-volume__cards strong { font-size:22px; letter-spacing:-.035em; }
.m17-b2b-volume__cards span { color:#7c8799; font-size:8px; line-height:1.4; }
.m17-b2b-volume__cards .is-primary span { color:#d5dcf0; }

/* Responsive */
@media (max-width:1180px) {
  body:has(.m17-page) .ms-account-link { display:none; }
  .m17-hero { grid-template-columns:minmax(390px,.92fr) minmax(480px,1.08fr); }
  .m17-product-row { grid-template-columns:1fr 1fr; gap:40px; }
  .m17-dark-story,.m17-deep-dive,.m17-b2b-workspace { gap:45px; }
}

@media (max-width:980px) {
  body:has(.m17-page) .ms-header { width:calc(100vw - 20px); margin-top:8px; }
  .m17-page .ms-container { width:min(100% - 24px,820px); }
  .m17-hero { min-height:0; grid-template-columns:1fr; }
  .m17-hero__visual { min-height:560px; }
  .m17-section-head { grid-template-columns:1fr; gap:17px; }
  .m17-section-head > p { max-width:680px; }
  .m17-product-row,.m17-dark-story,.m17-deep-dive,.m17-proof-story,.m17-calculator,.m17-volume,.m17-photo-guide,.m17-support-human,.m17-b2b-workspace,.m17-b2b-volume { grid-template-columns:1fr; }
  .m17-product-row.is-reverse .m17-product-row__visual { order:0; }
  .m17-process__list article { grid-template-columns:55px minmax(220px,.75fr) minmax(300px,1.25fr); }
  .m17-price-includes > div:last-child,.m17-b2b-benefits > div:last-child { grid-template-columns:1fr 1fr; }
  .m17-help-topics > div:last-child,.m17-b2b-uses > div:last-child { grid-template-columns:1fr 1fr; }
  .m17-volume__tiers { grid-template-columns:repeat(5,minmax(115px,1fr)); overflow-x:auto; }
  .m17-final { align-items:flex-start; flex-direction:column; }
}

@media (max-width:680px) {
  body:has(.m17-page) .ms-header { border-radius:18px; }
  body:has(.m17-page) .ms-button--small { display:none; }
  .m17-page { padding-top:9px; }
  .m17-page .ms-container { width:calc(100% - 16px); }
  .m17-hero { border-radius:25px; }
  .m17-hero__copy { padding:42px 24px 44px; }
  .m17-hero h1 { font-size:clamp(44px,13vw,60px); }
  .m17-hero__copy > p { font-size:14px; line-height:1.65; }
  .m17-hero__actions { align-items:stretch; flex-direction:column; }
  .m17-hero__actions .ms-button { width:100%; }
  .m17-hero__visual { min-height:470px; }
  .m17-hero__badge { top:14px; right:14px; }
  .m17-section-head h2,.m17-product-row__copy h2,.m17-deep-dive__copy h2,.m17-proof-story__copy h2,.m17-photo-guide__copy h2,.m17-support-human h2,.m17-b2b-workspace h2,.m17-b2b-volume h2 { font-size:39px; }
  .m17-product-intro,.m17-process,.m17-price-includes,.m17-help-topics,.m17-b2b-benefits,.m17-b2b-uses { padding-top:78px; }
  .m17-product-row { min-height:0; padding:12px; border-radius:24px; }
  .m17-product-row__visual { min-height:310px; }
  .m17-product-row__visual img { max-height:290px; }
  .m17-product-row__copy { padding:24px 12px 18px; }
  .m17-compare { padding-top:75px; overflow-x:auto; }
  .m17-compare__table { min-width:700px; }
  .m17-dark-story,.m17-deep-dive,.m17-photo-guide,.m17-support-human,.m17-b2b-workspace { margin-top:78px; padding:38px 20px; border-radius:25px; }
  .m17-proof-card { min-height:370px; }
  .m17-process__list article { padding:12px; grid-template-columns:42px 1fr; gap:12px; }
  .m17-process__visual { grid-column:2; min-height:190px; }
  .m17-process__copy { grid-column:2; padding:10px 5px 18px; }
  .m17-before-after { grid-template-columns:1fr; }
  .m17-before-after > svg { place-self:center; transform:rotate(90deg); }
  .m17-before-after img { height:260px; }
  .m17-proof-story { margin-top:78px; }
  .m17-proof-story__visual { min-height:410px; }
  .m17-proof-screen { width:94%; }
  .m17-proof-screen img { height:250px; }
  .m17-proof-screen footer { flex-direction:column; }
  .m17-local-strip { margin-top:65px; grid-template-columns:auto 1fr; }
  .m17-local-strip .m17-link { grid-column:1 / -1; }
  .m17-calculator { margin-top:75px; }
  .m17-calculator__controls,.m17-calculator__summary { padding:29px 20px; border-radius:24px; }
  .m17-control > div { display:grid; grid-template-columns:1fr 1fr; }
  .m17-control button { width:100%; }
  .m17-price-includes > div:last-child,.m17-help-topics > div:last-child,.m17-b2b-benefits > div:last-child,.m17-b2b-uses > div:last-child,.m17-faq > div:last-child { grid-template-columns:1fr; }
  .m17-volume { margin-top:78px; padding:38px 20px; border-radius:25px; }
  .m17-volume__tiers { grid-template-columns:1fr; overflow:visible; }
  .m17-volume__tiers article { min-height:100px; border-right:0; border-bottom:1px solid rgba(255,255,255,.12); }
  .m17-volume__tiers article:last-child { border-bottom:0; }
  .m17-photo-guide__visual { min-height:390px; }
  .m17-photo-guide__visual img { height:330px; }
  .m17-b2b-flow { margin-top:78px; padding:30px 20px; }
  .m17-b2b-flow > div:last-child { grid-template-columns:1fr; }
  .m17-b2b-flow article { min-height:120px; border-right:0; border-bottom:1px solid var(--m17-line); }
  .m17-b2b-flow article:last-child { border-bottom:0; }
  .m17-b2b-volume__cards { grid-template-columns:1fr; }
  .m17-final { margin-top:75px; padding:36px 24px; border-radius:24px; }
  .m17-final h2 { font-size:39px; }
  .m17-final .ms-button { width:100%; }
  body:has(.m17-page) .ms-footer { margin-top:70px; }
}

@media (prefers-reduced-motion:reduce) {
  [data-m17-reveal] { opacity:1 !important; transform:none !important; transition:none !important; }
  .m17-hero__visual img,.m17-product-row__visual img { transform:none !important; transition:none !important; }
}