/* tryamora.app/max, ported from the Claude Design export "Max Page"
   (design_handoff_date_night/Max Page.dc.html, 2026-10-12). Every value is
   the board's own. The board measures its width with a container (cqi units,
   and "wide" from 760px), so this page does the same on .mxp. Dark only.
   Tokens come from the date night foundations (date-night.css). The checkout
   pop-up keeps its own styles in max.css. */

@font-face { font-family: "Open Runde"; src: url("/assets/fonts/open-runde-regular.woff2") format("woff2"); font-style: normal; font-weight: 400 500; font-display: swap; }
@font-face { font-family: "Open Runde"; src: url("/assets/fonts/open-runde-semibold.woff2") format("woff2"); font-style: normal; font-weight: 600 700; font-display: swap; }

html:has(body.mxp-body) { scroll-padding-top: 72px; background: #0E1216; }
body.mxp-body { margin: 0; background: #0E1216; font-family: var(--dn-font, "SF Pro Rounded", ui-rounded, "Open Runde", system-ui, sans-serif); }
.mxp {
  container-type: inline-size;
  min-height: 100vh; background: #0E1216; color: #E6EBEF;
  font-family: var(--dn-font, "SF Pro Rounded", ui-rounded, "Open Runde", system-ui, sans-serif);
  -webkit-font-smoothing: antialiased; overflow: clip;
}
.mxp *, .mxp *::before, .mxp *::after { box-sizing: border-box; }
.mxp a { color: #FF6B9D; text-decoration: none; }
.mxp a:hover { color: #E6EBEF; }
.mxp h1, .mxp h2, .mxp p { margin: 0; }
.mxp .dn-icon { display: block; flex: none; }
.mxp-lockup { display: inline-flex; }

/* Wide is 760px and up, as on the board. */
.mxp-wide { display: none !important; }
.mxp-narrow { display: contents; }
@container (min-width: 760px) {
  .mxp-wide { display: flex !important; }
  .mxp-narrow { display: none !important; }
}

/* Focus and press, the same everywhere (DN-1B-1). */
.mxp a:focus-visible, .mxp button:focus-visible { outline: 2px solid #FF6B9D; outline-offset: 2px; }

/* Nav */
.mxp-nav { position: sticky; top: 0; z-index: 20; background: rgba(14,18,22,.72); -webkit-backdrop-filter: blur(20px) saturate(150%); backdrop-filter: blur(20px) saturate(150%); border-bottom: 1px solid rgba(255,255,255,.06); }
.mxp-nav-in { max-width: 1280px; margin: 0 auto; height: 60px; padding: 0 clamp(16px, 2.8cqi, 40px); display: flex; align-items: center; gap: 8px; }
.mxp .mxp-nav-brand { display: flex; align-items: center; border-radius: 8px; }
.mxp .mxp-nav-brand:focus-visible { outline-offset: 4px; }
.mxp-nav-links { gap: 4px; margin-left: 40px; }
.mxp .mxp-nav-link { height: 36px; padding: 0 12px; border-radius: 18px; display: flex; align-items: center; font-size: 14.5px; font-weight: 500; color: #A9B1BA; white-space: nowrap; transition: color 160ms ease, background-color 160ms ease; }
.mxp .mxp-nav-link.is-current { color: #E6EBEF; }
.mxp .mxp-nav-link:hover { color: #E6EBEF; background: rgba(255,255,255,.05); }
.mxp .mxp-nav-cta { margin-left: auto; height: 40px; padding: 0 18px; border-radius: 20px; display: flex; align-items: center; gap: 7px; font-size: 14.5px; font-weight: 700; white-space: nowrap; color: #fff; background: linear-gradient(135deg, #FF4F8B, #E91E63 40%, #9C27B0); box-shadow: inset 0 1px 0 rgba(255,255,255,.4), 0 8px 18px -8px rgba(233,30,99,.8); transition: filter 160ms ease, transform 160ms cubic-bezier(.23,1,.32,1); }
.mxp .mxp-nav-cta:hover { filter: brightness(1.08); color: #fff; }
.mxp .mxp-nav-cta:active { transform: scale(.97); filter: brightness(.92); }
@container (min-width: 760px) {
  .mxp-nav-in { height: 72px; }
}

/* Hero */
.mxp-hero { position: relative; padding: clamp(56px, 8.3cqi, 120px) clamp(16px, 2.8cqi, 40px) 0; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 20px; }
.mxp-hero-glow { position: absolute; left: 0; right: 0; top: -72px; height: 900px; background: radial-gradient(60% 55% at 50% 0%, rgba(233,30,99,.26), rgba(156,39,176,.12) 45%, transparent 78%); pointer-events: none; }
.mxp-kicker { position: relative; height: 30px; padding: 0 13px 0 10px; border-radius: 15px; display: flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 700; letter-spacing: .04em; color: #B9A8F2; background: rgba(185,168,242,.12); }
.mxp-h1 { position: relative; font-size: clamp(48px, 6.2cqi, 88px); line-height: 1.04; font-weight: 700; letter-spacing: -.03em; text-wrap: balance; }
.mxp-lead { position: relative; max-width: 520px; font-size: clamp(17px, 1.4cqi, 20px); line-height: 1.5; color: #A9B1BA; text-wrap: balance; }

/* Weekly and Yearly (DN-1B-6) */
.mxp-period { position: relative; margin-top: 16px; display: inline-flex; padding: 4px; gap: 2px; border-radius: 999px; background: #2A323A; }
.mxp-period button { height: 36px; padding: 0 16px; border-radius: 18px; border: 0; display: inline-flex; align-items: center; gap: 8px; font-family: inherit; font-size: 14px; font-weight: 600; cursor: pointer; background: transparent; color: #A9B1BA; transition: background-color 160ms ease, color 160ms ease; }
.mxp-period button[aria-pressed="true"] { background: #E6EBEF; color: #161B20; }
.mxp-period button[aria-pressed="false"]:hover { color: #E6EBEF; background: rgba(255,255,255,.05); }
.mxp-save { font-size: 12px; font-weight: 700; padding: 3px 8px; border-radius: 999px; background: rgba(233,30,99,.18); color: #FF6B9D; }
.mxp-period button[aria-pressed="true"] .mxp-save { background: #D81B60; color: #fff; }
.mxp[data-period="year"] .mxp-w, .mxp[data-period="week"] .mxp-y { display: none !important; }

/* Plan cards */
.mxp-plans { max-width: 1280px; margin: 0 auto; padding: clamp(40px, 4cqi, 56px) clamp(16px, 2.8cqi, 40px) 0; }
.mxp-plans-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); gap: 24px; align-items: stretch; }
.mxp-card { border-radius: 28px; padding: 32px; display: flex; flex-direction: column; gap: 24px; background: #161B20; box-shadow: inset 0 0 0 1px rgba(255,255,255,.06); }
.mxp-free { order: 3; }
.mxp-pro { order: 2; }
.mxp-max-wrap { order: 1; position: relative; }
@container (min-width: 760px) {
  .mxp-free { order: 1; }
  .mxp-max-wrap { order: 3; }
}
.mxp-card-top { display: grid; gap: 8px; }
.mxp-name { font-size: 24px; line-height: 30px; font-weight: 700; }
.mxp-desc { font-size: 15px; line-height: 22px; color: #A9B1BA; text-wrap: pretty; }
.mxp-price-block { display: grid; gap: 4px; }
.mxp-price { display: flex; align-items: baseline; gap: 3px; font-variant-numeric: tabular-nums; }
.mxp-price-big { font-size: 44px; line-height: 44px; font-weight: 700; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.mxp-per { font-size: 15px; color: #A9B1BA; }
.mxp-billed { font-size: 13px; line-height: 18px; color: #A9B1BA; font-variant-numeric: tabular-nums; }
.mxp-list { display: grid; gap: 12px; padding-top: 4px; }
.mxp-list-title { font-size: 13px; font-weight: 600; color: #7E8892; }
.mxp-li { display: flex; gap: 10px; align-items: flex-start; font-size: 15px; line-height: 21px; }
.mxp-li-ic { display: flex; color: #7E8892; padding-top: 1px; }
.mxp-pro .mxp-li-ic { color: #B9A8F2; }
.mxp-max .mxp-li-ic, .mxp-max .mxp-list .mxp-list-title { color: #FF6B9D; }

/* The plan badges: Amora's own Pro and Max pills. */
.mxp-badge { justify-self: start; display: inline-flex; align-items: center; gap: 5px; height: 30px; padding: 0 13px; border-radius: 999px; flex: none; font-size: 14px; font-weight: 700; letter-spacing: .1em; line-height: 1; }
.mxp-badge-pro { color: #3D2400; background: linear-gradient(90deg, #FFB347, #FFD700); box-shadow: 0 1px 4px rgba(255,179,71,.4); }
.mxp-badge-max { color: #fff; background: linear-gradient(90deg, #E91E63, #FF3D5E); box-shadow: 0 1px 4px rgba(233,30,99,.4); }
.mxp-badge-sm { height: 18px; padding: 0 8px; gap: 4px; font-size: 10px; letter-spacing: .12em; }

/* Buttons (DN-1B-1). The page's Get Pro and Continue with Max also carry the
   pop-up's own hooks (mx-cta-pro, mx-cta-max), whose max.css colours are
   overridden here. */
.mxp .mxp-btn { height: 50px; border-radius: 25px; display: flex; align-items: center; justify-content: center; transition: background-color 160ms ease, filter 160ms ease, transform 160ms cubic-bezier(.23,1,.32,1); }
.mxp .mxp-btn-2, .mxp .mxp-btn-2.mx-cta-pro { font-size: 15px; font-weight: 600; color: #E6EBEF !important; background: #2A323A; box-shadow: none; }
.mxp .mxp-btn-2:hover { background: #333C46; color: #E6EBEF; }
.mxp .mxp-btn-2:active { transform: scale(.97); background: #3B4550; }
.mxp .mxp-btn-1, .mxp .mxp-btn-1.mx-cta-max { font-size: 16px; font-weight: 700; color: #fff !important; background: linear-gradient(135deg, #FF4F8B, #E91E63 40%, #9C27B0); box-shadow: inset 0 1px 0 rgba(255,255,255,.4), inset 0 -8px 16px -8px rgba(80,0,60,.35), 0 2px 6px rgba(0,0,0,.35); }
.mxp .mxp-btn-1:hover { filter: brightness(1.08); color: #fff; }
.mxp .mxp-btn-1:active { transform: scale(.97); filter: brightness(.92); }

/* The Max card is the hero card: the one glow on the plans. */
.mxp-max-glow { position: absolute; left: -10%; right: -10%; bottom: -90px; height: 200px; background: radial-gradient(ellipse 50% 50% at 50% 40%, rgba(233,30,99,.5), rgba(200,40,140,.28) 30%, rgba(156,39,176,.12) 58%, transparent); pointer-events: none; }
.mxp-max { position: relative; height: 100%; background: radial-gradient(ellipse 90% 220px at 50% 0%, rgba(233,30,99,.2), transparent), #211A28; box-shadow: inset 0 0 0 1px rgba(255,107,157,.85), 0 0 6px rgba(255,79,139,.4), 0 0 26px rgba(233,30,99,.16), inset 0 0 18px rgba(233,30,99,.08); }
.mxp-flag { position: absolute; top: 30px; right: 28px; font-size: 11px; font-weight: 700; letter-spacing: .06em; color: #FF6B9D; }
.mxp-chips-block { display: grid; gap: 10px; padding-top: 8px; border-top: 1px solid rgba(255,255,255,.08); }
.mxp-chips-block .mxp-list-title { padding-top: 12px; }
.mxp-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.mxp-chip { height: 28px; padding: 0 11px; border-radius: 14px; display: flex; align-items: center; font-size: 13px; font-weight: 600; color: #E6EBEF; background: rgba(255,255,255,.07); }

/* Section type */
.mxp-h2 { font-size: clamp(30px, 3.3cqi, 48px); line-height: 1.12; font-weight: 700; letter-spacing: -.02em; text-wrap: balance; }
.mxp-h3 { font-size: clamp(24px, 2.2cqi, 32px); line-height: 1.2; font-weight: 700; letter-spacing: -.01em; text-wrap: balance; }
.mxp-sub { font-size: 16px; line-height: 24px; color: #A9B1BA; }
.mxp-lead-l { font-size: clamp(16px, 1.4cqi, 20px); line-height: 1.5; color: #A9B1BA; text-wrap: pretty; }
.mxp-head { display: grid; gap: 8px; }

/* Compare plans */
.mxp-compare { max-width: 1000px; margin: 0 auto; padding: clamp(80px, 8.3cqi, 120px) clamp(16px, 2.8cqi, 40px) 0; display: grid; gap: 24px; }
.mxp-table { border-radius: 24px; overflow: clip; background: #161B20; box-shadow: inset 0 0 0 1px rgba(255,255,255,.06); }
.mxp-tr { display: grid; grid-template-columns: minmax(0, 1fr) repeat(3, 52px); gap: 4px; padding: 14px clamp(16px, 2cqi, 28px); align-items: center; font-size: 15px; line-height: 21px; border-bottom: 1px solid rgba(255,255,255,.06); }
.mxp-tr.is-last { border-bottom: 0; }
.mxp-th { padding: 16px clamp(16px, 2cqi, 28px); font-size: 13px; line-height: normal; font-weight: 700; border-bottom: 1px solid rgba(255,255,255,.10); position: sticky; top: 60px; z-index: 2; background: #161B20; border-radius: 24px 24px 0 0; }
.mxp-th-free { text-align: center; color: #A9B1BA; }
.mxp-row-name { text-wrap: pretty; }
.mxp-td { display: flex; justify-content: center; align-items: center; font-size: 13px; font-weight: 600; }
.mxp-none { width: 12px; height: 2px; border-radius: 1px; background: #59636D; display: block; }
@container (min-width: 760px) {
  .mxp-tr { grid-template-columns: minmax(0, 1fr) repeat(3, 96px); }
  .mxp-th { top: 72px; }
}

/* See each other while you watch */
.mxp-see { max-width: 1280px; margin: 0 auto; padding: clamp(80px, 8.3cqi, 120px) clamp(16px, 2.8cqi, 40px) 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 440px), 1fr)); gap: clamp(40px, 4cqi, 64px); align-items: center; }
.mxp-see-copy { display: grid; gap: 16px; max-width: 520px; }
.mxp-eyebrow { font-size: 13px; font-weight: 600; color: #FF6B9D; }
.mxp-services { display: grid; gap: 10px; padding-top: 12px; }
.mxp-services-row { display: flex; gap: 10px; flex-wrap: wrap; }
.mxp-service { height: 52px; padding: 0 22px; border-radius: 16px; display: flex; align-items: center; font-size: 20px; font-weight: 700; background: #242C34; }
.mxp-chrome { height: 52px; padding: 0 16px; display: flex; align-items: center; gap: 8px; font-size: 14px; color: #A9B1BA; }
.mxp-chrome img { width: 18px; height: 18px; display: block; }
.mxp-shot { position: relative; display: flex; justify-content: center; }
.mxp-shot-glow { position: absolute; inset: -60px -40px; background: radial-gradient(ellipse 50% 50% at 50% 50%, rgba(233,30,99,.28), rgba(156,39,176,.14) 50%, transparent 75%); pointer-events: none; }
.mxp-window { position: relative; width: min(100%, 360px); border-radius: 20px; overflow: hidden; background: radial-gradient(ellipse 70% 160px at 50% 0%, rgba(233,30,99,.08), transparent), linear-gradient(#161B20, #1C232A); box-shadow: 0 0 0 1px rgba(255,255,255,.10), 0 30px 80px rgba(0,0,0,.6); }
.mxp-window-top { height: 48px; padding: 0 10px 0 16px; display: flex; align-items: center; justify-content: space-between; }
.mxp-window-more { width: 30px; height: 30px; display: grid; place-items: center; color: #A9B1BA; }
.mxp-window-body { padding: 0 16px 16px; display: grid; gap: 12px; }
/* The call tile, from the final call panel ("Call Panel.dc.html", together
   state): name and talking bars top left, time together top right, the
   controls in one glass pill bottom left, your own view bottom right. */
.mxp-cam { position: relative; aspect-ratio: 4 / 3; border-radius: 20px; overflow: hidden; background: #101216; box-shadow: 0 18px 40px -20px rgba(233,30,99,.55); }
.mxp-cam-them { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 45% 30%; display: block; }
.mxp-cam-glow { position: absolute; left: 12%; right: 12%; bottom: -2px; height: 3px; border-radius: 2px; background: linear-gradient(90deg, transparent, #FF6B9D, transparent); box-shadow: 0 0 18px 4px rgba(255,79,139,.55); }
.mxp-cam-shade-top { position: absolute; left: 0; right: 0; top: 0; height: 24%; background: linear-gradient(rgba(8,9,12,.5), transparent); }
.mxp-cam-shade-bottom { position: absolute; left: 0; right: 0; bottom: 0; height: 30%; background: linear-gradient(transparent, rgba(8,9,12,.55)); }
.mxp-cam-name { position: absolute; left: 14px; top: 14px; display: flex; align-items: center; gap: 8px; font-size: 15px; font-weight: 700; text-shadow: 0 1px 8px rgba(0,0,0,.5); }
.mxp-talking { display: flex; align-items: center; gap: 2px; height: 12px; }
.mxp-talking > span { width: 3px; height: 6px; border-radius: 2px; background: #FF6B9D; }
.mxp-talking > span:nth-child(2) { height: 12px; }
.mxp-talking > span:nth-child(3) { height: 8px; }
.mxp-cam-time, .mxp-cam-controls { background: rgba(18,24,28,.35); -webkit-backdrop-filter: blur(20px) saturate(150%); backdrop-filter: blur(20px) saturate(150%); box-shadow: inset 0 0 0 .5px rgba(255,255,255,.2); }
.mxp-cam-time { position: absolute; right: 12px; top: 14px; height: 24px; padding: 0 9px; border-radius: 12px; display: flex; align-items: center; gap: 5px; font-size: 12px; font-weight: 600; white-space: nowrap; color: rgba(230,235,239,.9); font-variant-numeric: tabular-nums; }
.mxp-cam-dot { width: 6px; height: 6px; border-radius: 3px; background: #3EDB7C; }
.mxp-cam-controls { position: absolute; left: 10px; bottom: 10px; display: flex; gap: 6px; padding: 5px; border-radius: 26px; }
.mxp-round { width: 40px; height: 40px; border-radius: 20px; display: grid; place-items: center; color: #E6EBEF; background: rgba(255,255,255,.12); }
.mxp-round.mxp-hangup { color: #fff; background: #E0645C; }
.mxp-cam-you { position: absolute; right: 10px; bottom: 10px; width: 75px; height: 99px; border-radius: 14px; overflow: hidden; background: #1A1D22; box-shadow: 0 8px 20px rgba(0,0,0,.45); }
.mxp-cam-you > img { width: 100%; height: 100%; object-fit: cover; display: block; }
.mxp-chat { display: flex; flex-direction: column; gap: 6px; padding-top: 4px; }
.mxp-bubble { display: block; flex: none; max-width: 80%; padding: 9px 13px; font-size: 14.5px; line-height: 20px; }
.mxp-bubble-them { align-self: flex-start; border-radius: 18px 18px 18px 6px; background: #323B45; }
.mxp-bubble-you { align-self: flex-end; border-radius: 18px 18px 6px 18px; background: rgba(233,30,99,.16); box-shadow: inset 0 0 0 1px rgba(255,107,157,.45); }
.mxp-bubble-lg { font-size: 15px; }

/* All of Amora comes with it */
.mxp-all { max-width: 1280px; margin: 0 auto; padding: clamp(80px, 8.3cqi, 120px) clamp(16px, 2.8cqi, 40px) 0; display: grid; gap: 40px; }
.mxp-all-head { display: grid; gap: 12px; max-width: 640px; }
.mxp-bento { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 160px), 1fr)); gap: 16px; }
.mxp-tile { grid-column: span 2; border-radius: 24px; padding: 24px; display: grid; align-content: start; background: #161B20; box-shadow: inset 0 0 0 1px rgba(255,255,255,.06); }
.mxp-tile-quiz { gap: 16px; }
.mxp-tile-kind { font-size: 11px; font-weight: 700; letter-spacing: .06em; color: #B9A8F2; }
.mxp-tile-q { font-size: 18px; line-height: 24px; font-weight: 600; text-wrap: pretty; }
.mxp-tile-answers { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.mxp-answer { height: 44px; border-radius: 16px; display: grid; place-items: center; font-size: 14.5px; font-weight: 600; background: #2A323A; }
.mxp-answer.is-picked { background: rgba(233,30,99,.16); box-shadow: inset 0 0 0 1px rgba(255,107,157,.45); }
.mxp-tile-memory { padding: 12px; gap: 12px; }
.mxp-tile-memory img { width: 100%; height: 150px; object-fit: cover; border-radius: 16px; display: block; }
.mxp-memory-text { display: grid; gap: 2px; padding: 0 10px 10px; }
.mxp-memory-title { font-size: 16px; font-weight: 700; }
.mxp-memory-date { font-size: 13px; color: #A9B1BA; font-variant-numeric: tabular-nums; }
.mxp-tile-distance { gap: 10px; }
.mxp-tile-label { display: flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 600; color: #A9B1BA; }
.mxp-distance { font-size: 44px; line-height: 48px; font-weight: 700; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.mxp-distance-sub { font-size: 13.5px; color: #A9B1BA; }
.mxp-tile-translate { grid-column: span 3; display: flex; flex-direction: column; gap: 8px; }
.mxp-tile-translate .mxp-tile-label { margin-bottom: 4px; }
.mxp-translated { display: flex; align-items: center; gap: 6px; padding-left: 4px; font-size: 13px; color: #B9A8F2; }
.mxp-tile-days { grid-column: span 3; gap: 4px; align-content: center; }
.mxp-days { font-size: 64px; line-height: 64px; font-weight: 700; letter-spacing: -.03em; font-variant-numeric: tabular-nums; background: linear-gradient(100deg, #FF6B9D, #E91E63 45%, #B05CD6); -webkit-background-clip: text; background-clip: text; color: transparent; justify-self: start; padding-bottom: 4px; }
.mxp-days-sub { font-size: 15px; color: #A9B1BA; }

/* Just the two of you */
.mxp-two { max-width: 1280px; margin: 0 auto; padding: clamp(80px, 8.3cqi, 120px) clamp(16px, 2.8cqi, 40px) 0; }
.mxp-two-card { border-radius: 28px; padding: clamp(28px, 3.3cqi, 48px); display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); gap: 32px; align-items: center; background: #161B20; box-shadow: inset 0 0 0 1px rgba(255,255,255,.06); }
.mxp-two-head { display: flex; gap: 16px; align-items: flex-start; }
.mxp-two-icon { width: 48px; height: 48px; border-radius: 14px; flex: none; display: grid; place-items: center; background: #2A323A; }
.mxp-two-copy { display: grid; gap: 8px; }

/* Your next date night starts here */
.mxp-end-sec { max-width: 1280px; margin: 0 auto; padding: clamp(80px, 8.3cqi, 120px) clamp(16px, 2.8cqi, 40px) 0; }
.mxp-end { border-radius: 32px; padding: clamp(48px, 5.5cqi, 80px) 24px; display: flex; flex-direction: column; align-items: center; gap: 24px; text-align: center; background: radial-gradient(ellipse 70% 260px at 50% 0%, rgba(233,30,99,.2), transparent), #211A28; box-shadow: inset 0 0 0 1px rgba(255,107,157,.85), 0 0 6px rgba(255,79,139,.4), 0 0 40px rgba(233,30,99,.2), inset 0 0 30px rgba(233,30,99,.1); }
.mxp-end-pop { width: 80px; height: 80px; display: block; }
.mxp-end-title { max-width: 640px; }
.mxp-end-cta { position: relative; display: inline-flex; }
.mxp-pool { position: absolute; left: 6%; right: 6%; bottom: -24px; height: 48px; border-radius: 50%; background: radial-gradient(closest-side, rgba(233,30,99,.9), rgba(156,39,176,.4) 60%, transparent); filter: blur(12px); pointer-events: none; }
.mxp .mxp-btn-lg { position: relative; height: 56px; padding: 0 32px; border-radius: 28px; display: inline-flex; gap: 8px; }
.mxp-end-price { font-size: 14px; color: #A9B1BA; font-variant-numeric: tabular-nums; }

/* Footer */
.mxp-foot { max-width: 1280px; margin: 0 auto; padding: clamp(80px, 8.3cqi, 120px) clamp(16px, 2.8cqi, 40px) 40px; }
.mxp-foot-in { display: flex; align-items: center; justify-content: space-between; gap: 20px; flex-wrap: wrap; padding-top: 32px; border-top: 1px solid rgba(255,255,255,.06); }
.mxp-foot-links { display: flex; gap: 4px; margin-left: -12px; }
.mxp .mxp-foot-links a { height: 44px; padding: 0 12px; border-radius: 22px; display: flex; align-items: center; font-size: 14.5px; color: #A9B1BA; transition: color 160ms ease, background-color 160ms ease; }
.mxp .mxp-foot-links a:hover { color: #E6EBEF; background: rgba(255,255,255,.05); }
.mxp-copy { font-size: 13px; color: #7E8892; }

/* Reduced motion: no press movement. */
@media (prefers-reduced-motion: reduce) {
  .mxp .mxp-btn, .mxp .mxp-nav-cta { transition: background-color 160ms ease, filter 160ms ease; }
  .mxp .mxp-btn:active, .mxp .mxp-nav-cta:active { transform: none; }
}