/* BDO Grotesk, primary typeface (local webfonts) */
@font-face { font-family: "BDO Grotesk"; src: url("../font/webfont/BDOGrotesk-Light.woff2") format("woff2"); font-weight: 300; font-style: normal; font-display: swap; }
@font-face { font-family: "BDO Grotesk"; src: url("../font/webfont/BDOGrotesk-Regular.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "BDO Grotesk"; src: url("../font/webfont/BDOGrotesk-Medium.woff2") format("woff2"); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: "BDO Grotesk"; src: url("../font/webfont/BDOGrotesk-DemiBold.woff2") format("woff2"); font-weight: 600; font-style: normal; font-display: swap; }
@font-face { font-family: "BDO Grotesk"; src: url("../font/webfont/BDOGrotesk-Bold.woff2") format("woff2"); font-weight: 700; font-style: normal; font-display: swap; }
@font-face { font-family: "BDO Grotesk"; src: url("../font/webfont/BDOGrotesk-ExtraBold.woff2") format("woff2"); font-weight: 800; font-style: normal; font-display: swap; }
@font-face { font-family: "BDO Grotesk"; src: url("../font/webfont/BDOGrotesk-Black.woff2") format("woff2"); font-weight: 900; font-style: normal; font-display: swap; }
/* ============================================================
   index-alt-v3, editorial monochrome system (Altitude-style):
   light paper bg, near-black ink, hairlines, numbered sections,
   grayscale imagery, black band + black footer. Matrix Toll content.
   ============================================================ */
:root {
  --paper: #f4f4f2;
  --ink: #101114;
  --ink-2: #5c5e63;
  --ink-3: #9b9da3;
  --hair: #e0e0dc;
  --navy: #1f4eaa;
  --white: #fff;
  --black: #0b0c0e;
  --font: "BDO Grotesk", "Plus Jakarta Sans", -apple-system, sans-serif;
  --font-d: "BDO Grotesk", "Inter Tight", "Plus Jakarta Sans", sans-serif;
  --pad: clamp(20px, 4vw, 64px);
  --mx-mark-mask: url("data:image/svg+xml,%3Csvg%20id%3D%22Layer_1%22%20data-name%3D%22Layer%201%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20version%3D%221.1%22%20viewBox%3D%220%200%20817.5%20154.9%22%3E%20%3Cdefs%3E%20%3Cstyle%3E%20.cls-1%20%7B%20fill%3A%20%230c1014%3B%20stroke-width%3A%200px%3B%20%7D%20%3C%2Fstyle%3E%20%3C%2Fdefs%3E%20%3Cg%3E%20%3Cpath%20class%3D%22cls-1%22%20d%3D%22M546.7%2C72.9c1%2C1.5%2C2.1%2C2%2C3%2C2.7%2C3.9%2C2.8%2C7.8%2C5.6%2C11.7%2C8.4.7.5%2C1.4%2C1.1%2C1.9%2C1.7%2C2%2C2.3%2C2.2%2C5.5.4%2C7.8-2%2C2.6-5.4%2C3.3-8.2%2C1.6-2-1.2-3.9-2.7-5.9-4.1-6-4.2-12.1-8.2-18.7-11.4-5.8-2.8-11.8-5-18.2-6.1-3.4-.6-6.9-.9-10.4-1-8.2-.2-16.4%2C0-24.5-.1-4.8-.1-7.8%2C2.1-7.7%2C7.8%2C0%2C3.2%2C0%2C6.3%2C0%2C9.5%2C0%2C1.5-.3%2C2.8-1.2%2C4-1.7%2C2.1-3.9%2C2.7-6.4%2C2.2-2.2-.4-4.1-2.8-4.4-5.1%2C0-.8%2C0-1.5%2C0-2.3%2C0-7.1-1.1-15.1%2C3.1-21.3%2C3.7-5.5%2C9.3-6.6%2C15.4-6.7%2C7.8%2C0%2C15.6%2C0%2C23.4%2C0%2C14.7%2C0%2C29.4%2C0%2C44.1%2C0%2C1.5%2C0%2C3.1-.1%2C4.5-.5%2C2.7-.7%2C4.3-2.7%2C4.2-5.1%2C0-2.5-2-4.7-4.7-5.2-1.4-.2-2.8-.2-4.2-.3-25.6%2C0-51.2-.1-76.8-.2-1.2%2C0-2.4%2C0-3.6%2C0-3.1-.3-5.3-2.7-5.4-5.9%2C0-3%2C2.3-5.8%2C5.2-6.1.8%2C0%2C1.5%2C0%2C2.3%2C0%2C26.6%2C0%2C53.2%2C0%2C79.8-.1%2C2.3%2C0%2C4.6%2C0%2C6.8.7%2C6.6%2C2.2%2C11.2%2C6.7%2C12.5%2C13.5%2C2.1%2C11.1-4.6%2C18.4-12.5%2C20.9-1.1.4-2.3.5-3.5.7-.5%2C0-1%2C.2-1.9.4Z%22%2F%3E%20%3Cpath%20class%3D%22cls-1%22%20d%3D%22M165.3%2C57.7c-1.7%2C0-2.4.9-3.3%2C1.6-4.1%2C3.1-8.4%2C5.8-13%2C8.1-7.3%2C3.7-15%2C5.9-23.1%2C6.4-10.1.6-20-.2-29.5-4.1-5.7-2.3-10.9-5.4-15.9-9-1.5-1.1-3-2.2-4.7-3.4-.3.7-.5%2C1.2-.6%2C1.6%2C0%2C2.3%2C0%2C4.6%2C0%2C6.9%2C0%2C7.3%2C0%2C14.6%2C0%2C21.9%2C0%2C1%2C0%2C2-.1%2C2.9-.4%2C3-2.8%2C5.2-5.7%2C5.3-3.5.2-6.1-1.5-6.9-4.7-.2-.9-.3-1.9-.3-2.9%2C0-14.7%2C0-29.4%2C0-44.1%2C0-.9%2C0-1.8.2-2.6.7-4.2%2C5.1-6.5%2C9-4.6%2C1.2.6%2C2.4%2C1.6%2C3.5%2C2.4%2C3.8%2C3.1%2C7.6%2C6.2%2C11.5%2C9.2%2C4.4%2C3.3%2C9%2C6.2%2C14%2C8.3%2C4.3%2C1.8%2C8.7%2C2.8%2C13.3%2C3.1%2C4.5.3%2C8.9.3%2C13.4%2C0%2C5.2-.2%2C10.1-1.5%2C14.8-3.7%2C4.6-2.1%2C8.8-4.9%2C12.8-7.9%2C3.9-3%2C7.6-6.2%2C11.5-9.2.9-.7%2C1.9-1.5%2C2.9-2.1%2C4.1-2%2C8.4.2%2C9.1%2C4.7.2%2C1%2C.1%2C2%2C.1%2C2.9%2C0%2C14.3%2C0%2C28.6%2C0%2C42.8%2C0%2C1%2C0%2C2-.1%2C2.9-.5%2C3.4-3.1%2C5.4-6.7%2C5.4-2.8%2C0-6-2.8-5.9-5.8%2C0-1%2C0-2%2C0-2.9%2C0-8.6%2C0-17.2%2C0-25.8%2C0-1.2%2C0-2.4%2C0-3.7Z%22%2F%3E%20%3Cpath%20class%3D%22cls-1%22%20d%3D%22M723%2C66.3c1%2C.7%2C1.7%2C1.3%2C2.4%2C1.7%2C7.5%2C4.8%2C14.2%2C10.5%2C20.9%2C16.2.7.6%2C1.4%2C1.4%2C1.9%2C2.2%2C1.7%2C2.5%2C1.5%2C5.3-.4%2C7.6-1.9%2C2.3-5%2C2.9-7.7%2C1.6-1.1-.5-2-1.3-2.9-2.1-4.8-3.8-9.4-7.7-14.3-11.5-3.5-2.7-7.4-5-11.6-6.7-3.3-1.3-6.6-2.1-10.2-2.2-1.5%2C0-3-.3-4.6-.4-4.5-.2-8.9.1-13.4.7-5.6.8-10.5%2C3.4-15.2%2C6.5-5.6%2C3.8-10.8%2C8.1-16%2C12.5-1.2%2C1.1-2.5%2C2.1-3.9%2C2.9-1.8%2C1.1-3.8%2C1.1-5.6.2-3.4-1.6-4.7-5.6-2.7-8.8.7-1.1%2C1.6-2.1%2C2.6-2.9%2C6.5-5.7%2C13.2-11%2C20.5-15.7.7-.4%2C1.4-1%2C2.2-1.6-.9-.7-1.6-1.2-2.3-1.7-7.6-4.8-14.4-10.6-21.1-16.4-1.6-1.4-2.7-3.1-2.8-5.3%2C0-4.8%2C4.5-7.9%2C8.8-5.9%2C1.2.5%2C2.2%2C1.4%2C3.2%2C2.2%2C4.3%2C3.5%2C8.5%2C7.1%2C12.9%2C10.5%2C3.8%2C2.9%2C7.8%2C5.5%2C12.3%2C7.3%2C3.5%2C1.4%2C7.1%2C2.1%2C10.8%2C2.4%2C5.2.5%2C10.4.1%2C15.7-.2%2C3.8-.2%2C7.5-1.4%2C10.9-3.1%2C5.1-2.5%2C9.7-5.8%2C14.1-9.4%2C3.2-2.5%2C6.2-5.2%2C9.3-7.8%2C1-.8%2C2-1.7%2C3.2-2.2%2C3.7-1.7%2C7.7.2%2C8.9%2C4.1.7%2C2.2%2C0%2C4.1-1.4%2C5.8-.8%2C1-1.8%2C1.9-2.8%2C2.7-6.4%2C5.6-13.1%2C10.9-20.3%2C15.4-.5.3-.9.6-1.7%2C1.2Z%22%2F%3E%20%3Cpath%20class%3D%22cls-1%22%20d%3D%22M379.7%2C49.7c0%2C1.1%2C0%2C2.2%2C0%2C3.3%2C0%2C11.7%2C0%2C23.3%2C0%2C35%2C0%2C.9%2C0%2C1.8%2C0%2C2.6-.4%2C2.5-1.9%2C4.1-4.2%2C5-2.4.8-4.8%2C0-6.5-1.9-.7-.9-1.2-1.8-1.2-3%2C0-.9%2C0-1.7%2C0-2.6%2C0-11.2%2C0-22.5%2C0-33.7%2C0-1.3%2C0-2.6-.2-3.9%2C0-.9-.7-1.4-1.5-1.5-1.2-.1-2.4-.2-3.6-.2-11%2C0-22%2C0-33%2C0-1.3%2C0-2.6%2C0-3.9-.1-3.3-.4-5.5-2.9-5.3-6.3.1-3.1%2C2.4-5.6%2C5.5-5.8.9%2C0%2C1.7%2C0%2C2.6%2C0%2C30.5%2C0%2C61%2C0%2C91.6%2C0%2C.4%2C0%2C.9%2C0%2C1.3%2C0%2C2.9.1%2C5%2C1.8%2C5.7%2C4.5.7%2C2.5-.3%2C5.2-2.5%2C6.6-.7.4-1.6.7-2.4.9-1.1.2-2.2%2C0-3.3%2C0-11.4%2C0-22.9%2C0-34.3%2C0-1.4%2C0-2.8-.2-4.5.9Z%22%2F%3E%20%3Cpath%20class%3D%22cls-1%22%20d%3D%22M256.8%2C33.9c5.6-.9%2C11.5%2C3%2C14.6%2C7.1%2C10.8%2C14.3%2C21.4%2C28.6%2C32.1%2C43%2C.4.5.8%2C1.1%2C1.2%2C1.6%2C1.1%2C1.3%2C1.5%2C2.9%2C1.4%2C4.6-.1%2C2.6-1.5%2C4.7-3.9%2C5.5-2.4.7-4.7.5-6.6-1.5-.5-.5-.8-1-1.2-1.5-10.2-13.6-20.4-27.2-30.6-40.8-1-1.3-2.1-2.5-3.4-3.5-2.2-1.9-3.9-1.9-6.1%2C0-1%2C.8-1.9%2C1.8-2.7%2C2.9-5.3%2C7-10.6%2C14.1-15.9%2C21.1-5%2C6.7-10.1%2C13.4-15.1%2C20.1-.5.7-1.1%2C1.4-1.7%2C2-2.2%2C2.3-6.2%2C1.9-8.1.4-2.5-2-3.2-5.5-1.6-8.2.7-1.2%2C1.6-2.3%2C2.5-3.5%2C10.2-13.7%2C20.5-27.4%2C30.6-41.2%2C2.6-3.5%2C5.8-6.2%2C10.1-7.3%2C1.7-.4%2C3.4-.6%2C4.4-.7Z%22%2F%3E%20%3Cpath%20class%3D%22cls-1%22%20d%3D%22M608.4%2C66.2c0%2C7.2%2C0%2C14.4%2C0%2C21.6%2C0%2C1%2C0%2C2%2C0%2C2.9%2C0%2C2.7-3%2C5.4-6%2C5.4-3.4%2C0-6-2-6.4-5.3-.2-1.2-.2-2.4-.2-3.6%2C0-13.7%2C0-27.4%2C0-41.2%2C0-1.4%2C0-2.8.2-4.2.4-3.2%2C2.9-5.2%2C6.4-5.2%2C3.2%2C0%2C5.6%2C2.2%2C5.9%2C5.4%2C0%2C1%2C0%2C2%2C0%2C2.9%2C0%2C7.1%2C0%2C14.2%2C0%2C21.2Z%22%2F%3E%20%3Cpath%20class%3D%22cls-1%22%20d%3D%22M120.2%2C95.1c-4.4%2C0-7.6-3.2-7.7-7.5%2C0-4.5%2C3.3-7.8%2C7.7-7.8%2C4.9%2C0%2C7.6%2C3.7%2C7.7%2C7.5%2C0%2C4.5-3.2%2C7.8-7.7%2C7.8Z%22%2F%3E%20%3C%2Fg%3E%20%3Cg%3E%20%3Cpath%20class%3D%22cls-1%22%20d%3D%22M71.3%2C121.1v12.7h-3.5v-12.7h-4.9v-3.2h13.2v3.2h-4.9Z%22%2F%3E%20%3Cpath%20class%3D%22cls-1%22%20d%3D%22M111.2%2C129.1c-.4%2C1-1%2C1.9-1.8%2C2.6-.8.8-1.6%2C1.3-2.7%2C1.8-1%2C.4-2.2.6-3.4.6s-2.4-.2-3.4-.6c-1-.4-1.9-1-2.7-1.8-.8-.7-1.3-1.6-1.8-2.6-.4-1-.6-2.1-.6-3.2h0c0-1.2.2-2.2.6-3.2.4-1%2C1-1.9%2C1.8-2.6.8-.8%2C1.6-1.3%2C2.7-1.8%2C1-.4%2C2.2-.6%2C3.4-.6s2.4.2%2C3.4.6c1%2C.4%2C1.9%2C1%2C2.7%2C1.8.8.7%2C1.3%2C1.6%2C1.8%2C2.6.4%2C1%2C.6%2C2.1.6%2C3.2h0c0%2C1.2-.2%2C2.2-.6%2C3.2ZM108.2%2C125.9c0-.7-.1-1.3-.4-1.9-.2-.6-.6-1.1-1-1.6-.4-.5-.9-.8-1.5-1.1-.6-.3-1.2-.4-1.9-.4s-1.4.1-1.9.4c-.6.3-1.1.6-1.5%2C1.1-.4.5-.7%2C1-1%2C1.6-.2.6-.4%2C1.2-.4%2C1.9h0c0%2C.7.1%2C1.4.4%2C2%2C.2.6.6%2C1.1%2C1%2C1.6.4.5.9.8%2C1.5%2C1.1.6.3%2C1.2.4%2C1.9.4s1.3-.1%2C1.9-.4c.6-.3%2C1.1-.6%2C1.5-1.1.4-.5.7-1%2C1-1.6.2-.6.4-1.2.4-1.9h0Z%22%2F%3E%20%3Cpath%20class%3D%22cls-1%22%20d%3D%22M131.7%2C133.8v-15.9h3.5v12.8h7.9v3.2h-11.5Z%22%2F%3E%20%3Cpath%20class%3D%22cls-1%22%20d%3D%22M162.6%2C133.8v-15.9h3.5v12.8h7.9v3.2h-11.5Z%22%2F%3E%20%3Cpath%20class%3D%22cls-1%22%20d%3D%22M229.5%2C133.8v-10.4l-4.5%2C6.8h0l-4.4-6.7v10.3h-3.5v-15.9h3.8l4.2%2C6.7%2C4.2-6.7h3.8v15.9h-3.5Z%22%2F%3E%20%3Cpath%20class%3D%22cls-1%22%20d%3D%22M265.4%2C133.8l-1.5-3.6h-6.7l-1.5%2C3.6h-3.6l6.8-16.1h3.2l6.8%2C16.1h-3.7ZM260.6%2C122l-2.1%2C5.2h4.2l-2.1-5.2Z%22%2F%3E%20%3Cpath%20class%3D%22cls-1%22%20d%3D%22M299.4%2C133.8l-7.7-10.1v10.1h-3.5v-15.9h3.2l7.5%2C9.8v-9.8h3.5v15.9h-3Z%22%2F%3E%20%3Cpath%20class%3D%22cls-1%22%20d%3D%22M336.2%2C130c-.3.9-.8%2C1.6-1.4%2C2.2-.6.6-1.3%2C1-2.2%2C1.3-.9.3-1.8.4-2.9.4-2.1%2C0-3.8-.6-5.1-1.8-1.2-1.2-1.8-3-1.8-5.3v-9.1h3.5v9c0%2C1.3.3%2C2.3.9%2C2.9.6.7%2C1.4%2C1%2C2.5%2C1s1.9-.3%2C2.5-1c.6-.6.9-1.6.9-2.9v-9.1h3.5v9c0%2C1.2-.2%2C2.3-.5%2C3.2Z%22%2F%3E%20%3Cpath%20class%3D%22cls-1%22%20d%3D%22M360.5%2C121.1v3.4h7.6v3.2h-7.6v6.2h-3.5v-15.9h12.1v3.2h-8.6Z%22%2F%3E%20%3Cpath%20class%3D%22cls-1%22%20d%3D%22M400.5%2C133.8l-1.5-3.6h-6.7l-1.5%2C3.6h-3.6l6.8-16.1h3.2l6.8%2C16.1h-3.7ZM395.7%2C122l-2.1%2C5.2h4.2l-2.1-5.2Z%22%2F%3E%20%3Cpath%20class%3D%22cls-1%22%20d%3D%22M436.2%2C132.4c-.4.4-.9.6-1.4.9s-1.1.4-1.7.6c-.6.1-1.3.2-2.1.2-1.2%2C0-2.3-.2-3.3-.6-1-.4-1.9-1-2.6-1.7-.7-.7-1.3-1.6-1.7-2.6-.4-1-.6-2.1-.6-3.2h0c0-1.2.2-2.2.6-3.2.4-1%2C1-1.9%2C1.7-2.6.7-.8%2C1.6-1.3%2C2.6-1.8%2C1-.4%2C2.1-.6%2C3.4-.6s1.4%2C0%2C2%2C.2c.6.1%2C1.2.3%2C1.7.5.5.2%2C1%2C.5%2C1.4.8.4.3.8.6%2C1.2%2C1l-2.2%2C2.6c-.6-.6-1.3-1-1.9-1.3-.6-.3-1.4-.5-2.2-.5s-1.3.1-1.9.4c-.6.3-1.1.6-1.5%2C1.1-.4.5-.7%2C1-1%2C1.6-.2.6-.3%2C1.2-.3%2C1.9h0c0%2C.7.1%2C1.4.3%2C2%2C.2.6.5%2C1.1.9%2C1.6.4.5.9.8%2C1.5%2C1.1.6.3%2C1.2.4%2C1.9.4s1.7-.2%2C2.3-.5%2C1.3-.8%2C1.9-1.4l2.2%2C2.3c-.4.4-.8.8-1.3%2C1.2Z%22%2F%3E%20%3Cpath%20class%3D%22cls-1%22%20d%3D%22M464.2%2C121.1v12.7h-3.5v-12.7h-4.9v-3.2h13.2v3.2h-4.8Z%22%2F%3E%20%3Cpath%20class%3D%22cls-1%22%20d%3D%22M501.7%2C130c-.3.9-.8%2C1.6-1.4%2C2.2-.6.6-1.3%2C1-2.2%2C1.3-.9.3-1.8.4-2.9.4-2.1%2C0-3.8-.6-5.1-1.8-1.2-1.2-1.8-3-1.8-5.3v-9.1h3.5v9c0%2C1.3.3%2C2.3.9%2C2.9.6.7%2C1.4%2C1%2C2.5%2C1s1.9-.3%2C2.5-1c.6-.6.9-1.6.9-2.9v-9.1h3.5v9c0%2C1.2-.2%2C2.3-.5%2C3.2Z%22%2F%3E%20%3Cpath%20class%3D%22cls-1%22%20d%3D%22M532.2%2C133.8l-3.4-5.1h-2.8v5.1h-3.5v-15.9h7.3c1.9%2C0%2C3.4.5%2C4.4%2C1.4%2C1.1.9%2C1.6%2C2.2%2C1.6%2C3.9h0c0%2C1.3-.3%2C2.4-.9%2C3.2-.6.8-1.5%2C1.4-2.5%2C1.8l3.9%2C5.7h-4.1ZM532.2%2C123.3c0-.8-.2-1.3-.7-1.7-.5-.4-1.2-.6-2-.6h-3.5v4.6h3.6c.9%2C0%2C1.5-.2%2C2-.6.5-.4.7-1%2C.7-1.6h0Z%22%2F%3E%20%3Cpath%20class%3D%22cls-1%22%20d%3D%22M555.9%2C133.8v-15.9h3.5v15.9h-3.5Z%22%2F%3E%20%3Cpath%20class%3D%22cls-1%22%20d%3D%22M591.3%2C133.8l-7.7-10.1v10.1h-3.5v-15.9h3.2l7.5%2C9.8v-9.8h3.5v15.9h-3Z%22%2F%3E%20%3Cpath%20class%3D%22cls-1%22%20d%3D%22M626.4%2C133.4c-1.1.5-2.4.7-3.9.7s-2.4-.2-3.4-.6c-1-.4-1.9-1-2.6-1.7-.7-.7-1.3-1.6-1.7-2.6-.4-1-.6-2.1-.6-3.3h0c0-1.2.2-2.2.6-3.2.4-1%2C1-1.9%2C1.7-2.6.7-.8%2C1.6-1.3%2C2.6-1.8%2C1-.4%2C2.1-.6%2C3.3-.6s1.4%2C0%2C1.9.1c.6%2C0%2C1.1.2%2C1.6.4.5.2%2C1%2C.4%2C1.4.7.4.3.9.6%2C1.3.9l-2.2%2C2.7c-.3-.3-.6-.5-.9-.7-.3-.2-.6-.4-.9-.5-.3-.1-.7-.2-1.1-.3-.4%2C0-.8-.1-1.3-.1s-1.2.1-1.8.4c-.6.3-1%2C.6-1.5%2C1.1-.4.4-.7%2C1-1%2C1.6-.2.6-.4%2C1.2-.4%2C1.9h0c0%2C.8.1%2C1.4.4%2C2.1.2.6.6%2C1.2%2C1%2C1.6.4.5.9.8%2C1.5%2C1.1.6.3%2C1.2.4%2C1.9.4%2C1.3%2C0%2C2.4-.3%2C3.3-1v-2.3h-3.5v-3h6.9v6.9c-.8.7-1.8%2C1.3-2.9%2C1.8Z%22%2F%3E%20%3Cpath%20class%3D%22cls-1%22%20d%3D%22M673.1%2C133.8v-15.9h3.5v12.8h7.9v3.2h-11.5Z%22%2F%3E%20%3Cpath%20class%3D%22cls-1%22%20d%3D%22M703.9%2C133.8v-15.9h3.5v12.8h7.9v3.2h-11.5Z%22%2F%3E%20%3Cpath%20class%3D%22cls-1%22%20d%3D%22M747.5%2C132.4c-.4.4-.9.6-1.4.9-.5.3-1.1.4-1.7.6-.6.1-1.3.2-2.1.2-1.2%2C0-2.3-.2-3.3-.6-1-.4-1.9-1-2.6-1.7-.7-.7-1.3-1.6-1.7-2.6-.4-1-.6-2.1-.6-3.2h0c0-1.2.2-2.2.6-3.2.4-1%2C1-1.9%2C1.7-2.6.7-.8%2C1.6-1.3%2C2.6-1.8%2C1-.4%2C2.1-.6%2C3.4-.6s1.4%2C0%2C2%2C.2c.6.1%2C1.2.3%2C1.7.5.5.2%2C1%2C.5%2C1.4.8.4.3.8.6%2C1.2%2C1l-2.2%2C2.6c-.6-.6-1.3-1-1.9-1.3-.6-.3-1.4-.5-2.2-.5s-1.3.1-1.9.4c-.6.3-1.1.6-1.5%2C1.1-.4.5-.7%2C1-1%2C1.6-.2.6-.3%2C1.2-.3%2C1.9h0c0%2C.7.1%2C1.4.3%2C2%2C.2.6.5%2C1.1.9%2C1.6.4.5.9.8%2C1.5%2C1.1.6.3%2C1.2.4%2C1.9.4s1.7-.2%2C2.3-.5%2C1.3-.8%2C1.9-1.4l2.2%2C2.3c-.4.4-.8.8-1.3%2C1.2Z%22%2F%3E%20%3C%2Fg%3E%20%3C%2Fsvg%3E");
}
* { margin: 0; padding: 0; box-sizing: border-box; }
::selection { background: var(--navy); color: #fff; }
::-moz-selection { background: var(--navy); color: #fff; }
html { scroll-behavior: smooth; }
body {
  font-family: var(--font);
  background: var(--paper);
  color: var(--ink);
  line-height: 1.65;
  font-size: 15px;
  -webkit-font-smoothing: antialiased;
  overflow-x: clip;
}
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }
.wrap { width: min(1280px, calc(100% - 2 * var(--pad))); margin: 0 auto; }

.mx-logo {
  display: inline-block; width: 190px; aspect-ratio: 817.5/154.9; height: auto;
  background-color: var(--ink);
  -webkit-mask-image: var(--mx-mark-mask);
  -webkit-mask-position: center; -webkit-mask-size: contain; -webkit-mask-repeat: no-repeat;
  mask-image: var(--mx-mark-mask);
  mask-position: center; mask-size: contain; mask-repeat: no-repeat;
}
.mx-logo.white { background-color: #fff; }

/* ============================================================ Page loader (light) */
.loader {
  position: fixed; inset: 0; z-index: 900;
  background: var(--paper);
  display: flex; align-items: center; justify-content: center;
  overflow: hidden;
  transform: translateY(0);
  transition: transform 1s cubic-bezier(.76, 0, .24, 1);
  will-change: transform;
}
.loader .ld-in { position: relative; display: grid; justify-items: center; gap: 26px; pointer-events: none; }
.loader .mx-logo { width: clamp(190px, 24vw, 300px); }
.loader .ld-art { position: absolute; inset: 0; width: 100%; height: 100%; aspect-ratio: auto; cursor: pointer; }
.loader .ld-art::before { background-image: radial-gradient(rgba(16,17,20,.09) 1px, transparent 1.4px); }
.loader .ld-art::after { display: none; }
.ld-bar {
  width: clamp(130px, 15vw, 190px); height: 1px;
  background: rgba(16,17,20,.14); position: relative; overflow: hidden;
}
.ld-bar i {
  position: absolute; inset: 0; background: var(--ink);
  transform: scaleX(0); transform-origin: left center;
  transition: transform .3s ease;
}
body.white-mode { background: #fff; }
body.is-loading { overflow: hidden; }

/* ============================================================ Slim custom scrollbar */
html { scrollbar-gutter: stable; scrollbar-width: thin; scrollbar-color: rgba(16,17,20,.32) transparent; }
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: rgba(16,17,20,.28); border-radius: 999px; }
::-webkit-scrollbar-thumb:hover { background: rgba(16,17,20,.55); }
::-webkit-scrollbar-corner { background: transparent; }
body.loaded .loader { transform: translateY(-101%); }

/* section eyebrow, matches the dropdown's "Featured Highlights" label */
.lbl {
  font-size: 12.5px; font-weight: 700; letter-spacing: .02em; text-transform: none;
  color: var(--ink);
}
.btn-pill {
  display: inline-flex; align-items: center; gap: 10px; white-space: nowrap;
  background: var(--ink); color: #fff;
  font-size: 13.5px; font-weight: 600;
  padding: 12px 22px; border-radius: 999px;
  transition: background .25s ease, transform .25s ease;
}
.btn-pill:hover { background: var(--navy); }
.btn-pill.ghost { background: transparent; color: var(--ink); box-shadow: inset 0 0 0 1px rgba(16,17,20,.25); }
.btn-pill.ghost:hover { background: rgba(16,17,20,.05); transform: none; }

/* imagery: always full color; gentle zoom on hover */
.mono { overflow: hidden; }
.mono img { transition: transform .6s cubic-bezier(.22,1,.36,1); }
.mono:hover img { transform: scale(1.05); }

/* reveal on scroll */
[data-r] { opacity: 0; transform: translateY(22px); transition: opacity .8s cubic-bezier(.22,1,.36,1), transform .8s cubic-bezier(.22,1,.36,1); }
[data-r].in { opacity: 1; transform: none; }

/* ============================================================ Top utility bar */
.topbar { background: var(--black); color: rgba(255,255,255,.72); font-size: 12px; font-weight: 500; position: relative; z-index: 110; }
.topbar .wrap { display: flex; align-items: center; justify-content: space-between; height: 38px; }
.tb-l { display: flex; gap: 20px; }
.tb-l a:hover { color: #fff; }
.tb-r { display: flex; align-items: center; gap: 16px; }
.tb-r > a { display: flex; align-items: center; align-self: stretch; color: rgba(255,255,255,.72); }
.tb-r > a:hover { color: #fff; }
.tb-r svg { width: 15px; height: 15px; display: block; }
.lang { position: relative; cursor: pointer; display: flex; align-items: center; align-self: stretch; }
.lang:hover { color: #fff; }
.lang-menu {
  position: absolute; right: 0; top: calc(100% + 2px);
  background: #fff; color: var(--ink);
  border: 1px solid var(--hair); border-radius: 8px;
  padding: 8px 14px; white-space: nowrap;
  box-shadow: 0 16px 40px rgba(16,17,20,.15);
  opacity: 0; visibility: hidden; transform: translateY(6px);
  transition: opacity .2s ease, transform .2s ease, visibility 0s linear .2s;
}
.lang:hover .lang-menu { opacity: 1; visibility: visible; transform: none; transition: opacity .2s ease, transform .2s ease; }
.lang-menu a:hover { color: var(--navy); }
@media (max-width: 1000px) { .tb-l a:nth-child(3) { display: none; } }
@media (max-width: 760px) { .tb-l a:not(:first-child) { display: none; } }

/* ============================================================ Header */
.hd {
  position: sticky; top: 0; z-index: 100;
  background: transparent;
  border-bottom: 1px solid transparent;
  transition: border-color .3s ease;
}
/* frosted bar lives on a pseudo-layer so the dropdown blur (a child) still works */
.hd::before {
  content: ""; position: absolute; inset: 0; z-index: -1;
  background: rgba(244,244,242,.78);
  -webkit-backdrop-filter: blur(14px) saturate(1.15);
  backdrop-filter: blur(14px) saturate(1.15);
}
.hd.line { border-bottom-color: var(--hair); }
.hd > .wrap { display: flex; align-items: center; gap: 48px; height: 64px; }
.hd .mx-logo { width: 186px; transform: translateY(1px); }
.hd nav { display: flex; align-items: center; gap: 24px; font-size: 13.5px; font-weight: 600; color: var(--ink-2); }
.hd nav > a { display: inline-block; padding: 6px 0; }
.hd nav a:hover { color: var(--ink); }
.hd .right { margin-left: auto; display: flex; align-items: center; gap: 18px; font-size: 13.5px; font-weight: 600; }
.hd .right .btn-pill { padding: 9px 18px; }
@media (max-width: 800px) { .hd nav { display: none; } }
@media (max-width: 520px) {
  .hd .wrap { gap: 16px; }
  .hd .mx-logo { width: 140px; }
  .hd .right { gap: 10px; font-size: 13px; }
  .hd .right a { white-space: nowrap; }
  .hd .right .btn-pill { padding: 8px 14px; font-size: 12.5px; }
}
@media (max-width: 640px) {
  .acard .ic { margin-bottom: 28px; }
}
/* navy preview mode, toggled by clicking the header logo */
body.navy-mode .topbar { background: var(--navy); }

/* navy preview: wider coverage */
body.navy-mode .lbl, body.navy-mode .tk-label, body.navy-mode .d-right > h6 { color: var(--navy); }
body.navy-mode .band-in:not(.light) .lbl { color: #fff; }
body.navy-mode .mini-card.dark .lbl { color: rgba(255,255,255,.85); }
body.navy-mode .map-pills button:hover { background: var(--navy); border-color: var(--navy); color: #fff; }
body.navy-mode .ft { background: var(--navy); }
body.navy-mode .ft-cta .btn-pill { background: #fff; color: var(--navy); }
body.navy-mode .ft-cta .btn-pill:hover { background: #e6ecfa; color: var(--navy); }
body.navy-mode .news-card:hover { background: var(--navy); border-color: var(--navy); }
body.navy-mode .btn-pill:not(.ghost) { background: var(--navy); color: #fff; }
body.navy-mode .btn-pill:not(.ghost):hover { background: #173b82; }
body.navy-mode .band .btn-pill { background: var(--navy); color: #fff; }
body.navy-mode .band .btn-pill:hover { background: #173b82; }
body.navy-mode .band-in:not(.light) { background: var(--navy); }
body.navy-mode #products .mini-card.dark { background: var(--navy); }
body.navy-mode #global:not(.dotmode) #globalMap .jvm-region[fill="#101114"] { fill: var(--navy); }
/* SLB-style full-width dropdowns */
.nav-item { position: static; }
.nav-item > a { display: inline-block; padding: 20px 0; }
.drop {
  position: absolute; left: 0; right: 0; top: 100%;
  background: rgba(255, 255, 255, .88);
  -webkit-backdrop-filter: blur(14px) saturate(1.2);
  backdrop-filter: blur(14px) saturate(1.2);
  border-top: 1px solid var(--hair); border-bottom: 1px solid var(--hair);
  box-shadow: 0 46px 90px rgba(16,17,20,.14);
  padding: clamp(28px, 3.4vw, 46px) 0 clamp(32px, 3.8vw, 52px);
  opacity: 0; visibility: hidden; transform: translateY(6px);
  transition: opacity .22s ease .1s, transform .22s ease .1s, visibility 0s linear .34s;
}
.drop::before { content: ""; position: absolute; top: -22px; left: 0; right: 0; height: 22px; }
.nav-item:hover .drop, .nav-item:focus-within .drop {
  opacity: 1; visibility: visible; transform: none;
  transition: opacity .22s ease, transform .22s ease;
}
.drop { overflow: hidden; }
.drop .wrap { height: auto; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2.6fr); gap: clamp(30px, 4vw, 70px); align-items: start; }
.d-left h5 {
  font-family: var(--font-d);
  font-size: clamp(20px, 1.8vw, 26px); font-weight: 500; letter-spacing: -.02em;
  margin-bottom: 16px; color: var(--ink);
}
.d-left a {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  padding: 8px 0; font-size: 14px; font-weight: 500; color: var(--ink-2);
  border-bottom: 1px solid transparent;
  overflow-wrap: break-word;
}
.d-left a::after { content: "\203A"; font-size: 16px; color: var(--ink-3); transition: transform .25s ease; }
.d-left a:hover { color: var(--ink); }
.d-left a:hover::after { transform: translateX(4px); color: var(--ink); }
.d-right > h6 {
  font-size: 12px; font-weight: 700; letter-spacing: .02em;
  margin-bottom: 16px; color: var(--ink);
}
.d-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(18px, 2.2vw, 30px); }
.d-card { min-width: 0; }
.d-card strong, .d-card p { overflow-wrap: break-word; }
.d-left a { min-width: 0; }
.d-left a > * { overflow: hidden; }
.d-card { display: block; }
.d-card .dc-img {
  display: block;
  aspect-ratio: 16/10; border-radius: 8px; overflow: hidden;
  border: 1px solid var(--hair); background: #f0f0ee;
}
.d-card .dc-img img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }

.d-card:hover .dc-img img { transform: scale(1.04); }
.d-card strong { display: block; font-size: 14.5px; font-weight: 600; letter-spacing: -.01em; margin: 12px 0 5px; color: var(--ink); }
.d-card p { font-size: 12.5px; line-height: 1.55; color: var(--ink-2); }
.d-card .view {
  display: inline-flex; align-items: center; gap: 7px;
  margin-top: 10px; font-size: 13px; font-weight: 600; color: var(--ink);
}
.d-card .view i { font-style: normal; transition: transform .25s ease; }
.d-card:hover .view i { transform: translateX(4px); }
@media (max-width: 900px) { .drop { display: none; } }

/* ============================================================ Hero */
.hero { padding: clamp(8px, 1.6vh, 18px) 0 clamp(50px, 8vh, 92px); }
.hero-media {
  border-radius: 12px; overflow: hidden;
  aspect-ratio: 8 / 3; max-height: 66vh; width: 100%;
  background: #0b1533;
  box-shadow: 0 30px 70px rgba(16,17,20,.16);
}
.hero-media video { width: 100%; height: 100%; object-fit: cover; display: block; cursor: pointer; }
.hero-media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.hero-media.bare { background: transparent; box-shadow: none; aspect-ratio: auto; height: min(56vh, 640px); }
/* re-click 03: swap image and text back and forth */
.hero.mode-1.flip > .wrap { display: flex; flex-direction: column; }
.hero.mode-1.flip .video-media { order: 2; margin-top: clamp(16px, 2.6vh, 30px); }
.hero.mode-1.flip .hero-top { order: 1; }
.hero.mode-1.flip .hero-line:not(.hero-line-b) { order: 3; }
.hero.mode-1.flip .hero-cta { order: 4; }
.hero.mode-1.flip .hero-line-b { order: 5; }
.hero.mode-3.flip > .wrap { display: flex; flex-direction: column; }
.hero.mode-3.flip .img-media { order: 2; margin: clamp(16px, 2.6vh, 30px) 0 0; }
.hero.mode-3.flip .hero-top { order: 1; }
.hero.mode-3.flip .hero-line:not(.hero-line-b) { order: 3; }
.hero.mode-3.flip .hero-cta { order: 4; }
.hero.mode-3.flip .hero-line-b { order: 5; }
.hero.mode-3.flip .video-media { display: none; }
.hero-media.bare img { object-fit: contain; }
/* three hero options, switched by the 01/02/03 pills */
.hero .video-media, .hero .img-media { display: none; }
.hero.mode-1 .video-media { display: block; }
.hero.mode-3 .img-media { display: block; margin: 0 0 clamp(18px, 3vh, 34px); }
.hero-opts { display: flex; align-items: center; gap: 3px; margin-right: 14px; }
.hero-opts button {
  all: unset; cursor: pointer; font-family: var(--font);
  font-size: 10px; font-weight: 700; color: rgba(255,255,255,.42);
  padding: 3px 6px; font-variant-numeric: tabular-nums; letter-spacing: .04em;
  transition: color .25s ease;
}
.hero-opts button:hover { color: rgba(255,255,255,.85); }
.hero-opts button.on { color: #fff; }
.hero-top {
  display: grid; grid-template-columns: minmax(0, 1.8fr) minmax(0, 1fr);
  gap: 40px; align-items: center;
  margin-top: clamp(28px, 5vh, 54px);
}
.hero h1 {
  font-family: var(--font-d);
  font-size: clamp(42px, 5.8vw, 86px);
  font-weight: 500; letter-spacing: -0.045em; line-height: 0.98;
}
.hero-meta { display: grid; grid-template-columns: 1fr 1fr; gap: 26px; }
.hero-meta p { font-size: 12.5px; line-height: 1.7; color: var(--ink-2); }
.hero-meta p b { font-weight: 700; color: var(--ink); }
.hero-meta p:first-child { max-width: 24ch; }
.hrline.hero-line { margin-top: clamp(28px, 4.8vh, 50px); border-top-color: #c4c4be; width: 100%; opacity: 1 !important; transform: none !important; }
.hrline.hero-line-b { margin-top: clamp(20px, 3.4vh, 34px); }
.hero-cta { margin-top: clamp(20px, 3.4vh, 34px); display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
/* scrolling news ticker */
.ticker { flex: 1; min-width: 0; display: flex; align-items: center; gap: 16px; margin-left: clamp(14px, 2.2vw, 34px); }
.tk-label {
  flex: 0 0 auto;
  font-size: 12.5px; font-weight: 700; letter-spacing: .02em;
  color: var(--ink);
  cursor: pointer;
}
.tk-label:hover { color: var(--navy); }
/* bigger option, toggled by clicking the News eyebrow */
.ticker.big .tk-track { animation-duration: 46s; }
.ticker.big .tk-track span {
  font-size: clamp(16px, 1.3vw, 19px); font-weight: 600; color: var(--ink);
  padding-right: 26px; margin-right: 26px;
}
.ticker.big .tk-track span:hover { color: var(--navy); cursor: pointer; }
.tk-mask {
  flex: 1; min-width: 0; overflow: hidden;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 14%, #000 95%, transparent);
  mask-image: linear-gradient(90deg, transparent, #000 14%, #000 95%, transparent);
}
.tk-mask { cursor: grab; user-select: none; -webkit-user-select: none; touch-action: pan-y; }
.tk-mask:active { cursor: grabbing; }
.tk-track {
  display: inline-flex; white-space: nowrap; will-change: transform;
  animation: tkmove 36s linear infinite;
}
.ticker:hover .tk-track { animation-play-state: paused; }
.tk-track span {
  font-size: 12.5px; font-weight: 500; color: var(--ink-2);
  padding-right: 18px; margin-right: 18px;
  border-right: 1px solid #c4c4be;
  transition: color .25s ease;
}
.tk-track span:hover { color: var(--navy); cursor: pointer; }
@keyframes tkmove { to { transform: translateX(-50%); } }
/* static section navigator (stimulation hero) */
.sec-nav {
  flex: 1; min-width: 0; display: flex; align-items: center;
  gap: clamp(14px, 1.9vw, 30px); margin-left: clamp(14px, 2.2vw, 34px);
  overflow-x: auto; scrollbar-width: none;
}
.sec-nav::-webkit-scrollbar { display: none; }
.sn-label { font-size: 12.5px; font-weight: 700; letter-spacing: .02em; color: var(--ink); flex: 0 0 auto; }
.sec-nav a { font-size: clamp(14px, 1.05vw, 16.5px); font-weight: 600; color: var(--ink-2); white-space: nowrap; transition: color .25s ease; }
.sec-nav a:hover { color: var(--navy); }
@media (max-width: 760px) { .sec-nav { display: none; } }
@media (max-width: 900px) {
  .hero-top { grid-template-columns: minmax(0, 1fr); }
  .hero-media { aspect-ratio: 16/9; }
}


/* ============================================================ Statement (Not a better bank) */
.hrline { border: 0; border-top: 1px solid var(--hair); width: min(1280px, calc(100% - 2 * var(--pad))); margin: 0 auto; }
.state { padding: clamp(38px, 7vh, 86px) 0 clamp(60px, 11vh, 130px); }
.state .wrap { display: grid; grid-template-columns: 1.05fr 1.4fr; gap: clamp(20px, 3.4vh, 38px) clamp(28px, 5vw, 90px); align-items: start; }
.state h2 {
  font-family: var(--font-d);
  font-size: clamp(32px, 3.5vw, 52px); font-weight: 500; letter-spacing: -0.04em; line-height: 1.02;
}
.state-left p { margin: 22px 0 0; color: var(--ink-2); font-size: 12.5px; line-height: 1.6; max-width: 34ch; }
.state-left p.diff { margin-top: 14px; }
.state-left .lbl { display: block; margin-bottom: 14px; }
.state-head {
  grid-column: 1 / -1;
  display: grid; grid-template-columns: 1.05fr 1.4fr; gap: clamp(28px, 5vw, 90px);
  align-items: center; margin-bottom: 0;
}
.state-head .lbl { display: block; margin-bottom: 12px; }
.state-head h2 {
  font-family: var(--font-d);
  font-size: clamp(26px, 3.1vw, 46px); font-weight: 500; letter-spacing: -0.04em; line-height: 1.06;
}
.state-head .nb { white-space: nowrap; }
.state-head > p {
  font-size: 13.5px; line-height: 1.75; color: var(--ink-2);
  max-width: none; padding-left: 76px;
}
.state-left .intro { margin-top: 16px; max-width: 36ch; font-size: 13px; line-height: 1.7; }
.state-left .more { display: inline-block; margin-top: 14px; font-size: 12.5px; font-weight: 600; border-bottom: 1px solid rgba(16,17,20,.3); padding-bottom: 2px; }
.state-media-wrap { position: relative; margin-top: 0; }
.state-media {
  position: relative; width: 100%; aspect-ratio: 5/4;
  border-radius: 4px; overflow: hidden; background: #e9e9e6;
}
.state-media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transition: opacity .55s ease, transform .6s cubic-bezier(.22,1,.36,1); }
.state-media img.in { opacity: 1; }
/* items act as tabs for the media slider */
.state-item { cursor: pointer; }
.state-item h4, .state-item p { transition: color .3s ease; }
.state-item:not(.on) h4 { color: var(--ink-3); }
.state-item:not(.on) p { color: rgba(16,17,20,.26); }
.state-item:hover h4 { color: var(--ink); }
.state-item.on h4 { color: var(--ink); }
.state-item.on p { color: var(--ink-3); }
.state-arrow { font-family: var(--font-d); font-size: 30px; font-weight: 300; padding-top: 14px; color: var(--ink); }
.state-right h2 { max-width: 17ch; margin-bottom: 34px; }
.state-item {
  border-top: 1px solid var(--hair); padding: 13px 0;
  display: grid; grid-template-columns: auto 1fr auto; gap: 30px; align-items: center;
}
.state-item .sic { width: 46px; height: 46px; color: var(--ink); transition: color .3s ease; }
.state-item .sic svg { width: 100%; height: 100%; display: block; }
.state-item:not(.on) .sic { color: rgba(16,17,20,.28); }
.state-item:hover .sic, .state-item.on .sic { color: var(--ink); }
.state-item:last-child { border-bottom: 1px solid var(--hair); }
.state-item h4 { font-size: 15.5px; font-weight: 600; letter-spacing: -.008em; margin-bottom: 3px; }
.state-item p { font-size: 15.5px; font-weight: 500; letter-spacing: -.008em; color: var(--ink-3); max-width: 44ch; line-height: 1.5; }
.state-item .ino { font-size: 17px; font-weight: 300; color: var(--ink-3); padding-top: 1px; transition: transform .3s ease, color .3s ease; }
.state-item:hover .ino, .state-item.on .ino { color: var(--ink); transform: translateX(4px); }
@media (max-width: 900px) { .state .wrap { grid-template-columns: minmax(0, 1fr); } .state-arrow { display: none; } .state-head { grid-template-columns: minmax(0, 1fr); } .state-head > p { padding-left: 0; } }

/* ============================================================ Big words */
.words { padding: clamp(30px, 6vh, 70px) 0 clamp(6px, 1.2vh, 14px); }
#applications { padding-top: clamp(10px, 2vh, 26px); }
.words h2 {
  font-family: var(--font-d);
  font-size: clamp(34px, 4.6vw, 68px); font-weight: 500; letter-spacing: -0.045em; line-height: 1.0;
}
.words .alt { color: var(--navy); }

/* ============================================================ Feature splits */
.feat { padding: clamp(44px, 8vh, 100px) 0; }
.feat .lbl { display: block; margin-bottom: 12px; }
.feat-grid { display: grid; grid-template-columns: 1fr 1.08fr; gap: clamp(30px, 5vw, 80px); align-items: start; }
.feat h3 {
  font-family: var(--font-d);
  font-size: clamp(24px, 2.4vw, 36px); font-weight: 500; letter-spacing: -0.03em; line-height: 1.12;
  max-width: 18ch; margin-bottom: 8px;
}
.feat-head {
  display: grid; grid-template-columns: 1fr 1.08fr; gap: clamp(30px, 5vw, 80px);
  align-items: center; margin-bottom: clamp(18px, 3vh, 32px);
}
.feat-intro { padding-top: 0; }
.feat-intro { font-size: 13.5px; color: var(--ink-2); max-width: 44ch; padding-top: 0; }
.rows { border-top: 1px solid var(--hair); }
.row { border-bottom: 1px solid var(--hair); }
.row button {
  all: unset; cursor: pointer; display: flex; align-items: flex-start; gap: 16px;
  width: 100%; padding: 17px 2px; font-family: var(--font);
}
.row .ric { width: 36px; height: 36px; flex: 0 0 36px; color: var(--ink); margin: -8px 0; transition: opacity .3s ease; }
.row:not(.open) .ric { opacity: .35; }
.row:hover .ric, .row.open .ric { opacity: 1; }
.row .ric svg { width: 100%; height: 100%; display: block; stroke-width: 1; }
.row .tt { font-size: 15px; font-weight: 600; letter-spacing: -.01em; transition: color .3s ease; }
.row .num { margin-left: auto; font-size: 11px; color: var(--ink-3); font-variant-numeric: tabular-nums; }
.row.open .num { color: var(--ink); font-weight: 700; }
.row:not(.open) .tt { color: var(--ink-2); }
.row:hover .tt, .row.open .tt { color: var(--ink); }
.row .bd { max-height: 0; overflow: hidden; margin-top: 0; transition: max-height .45s cubic-bezier(.22,1,.36,1), margin-top .45s cubic-bezier(.22,1,.36,1); }
.row.open .bd { margin-top: -9px; }
.row .bd p { padding: 5px 2px 28px 54px; font-size: 13px; color: var(--ink-2); max-width: 52ch; }
@media (max-width: 900px) { .feat-head { grid-template-columns: 1fr; } }
.row .bd a { font-weight: 600; color: var(--ink); border-bottom: 1px solid rgba(16,17,20,.3); white-space: nowrap; }
.feat-media { position: relative; }
.feat-media .frame {
  position: relative; border-radius: 14px; overflow: hidden;
  height: clamp(320px, 42vw, 560px);
  box-shadow: 0 30px 70px rgba(16,17,20,.16);
  background: #e9e9e6;
}
.feat-media .frame img {
  position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover;
  opacity: 0; transition: opacity .55s ease, transform .6s cubic-bezier(.22,1,.36,1);
}
.feat-media .frame img.in { opacity: 1; }
.feat-media .frame img.fit { object-fit: contain; background: #fff; padding: 6%; }
/* products: image left, list right */
#products .feat-grid > div:first-child { order: 2; }
#products .feat-grid .feat-media { order: 1; }
#products .feat-media .frame { box-shadow: none; }
/* numbered pager pill (bottom center of media) */
.frame .dots, .state-media .dots {
  position: absolute; left: 50%; bottom: 12px; transform: translateX(-50%);
  display: flex; align-items: center; gap: 2px; z-index: 2;
  background: #fff; border-radius: 999px; padding: 6px 10px;
  box-shadow: 0 6px 18px rgba(16,17,20,.14);
}
.dots button {
  all: unset; cursor: pointer; font-family: var(--font);
  font-size: 10.5px; font-weight: 600; color: #b6b6b0;
  padding: 2px 5px; font-variant-numeric: tabular-nums;
  transition: color .25s ease;
}
.dots button:hover { color: var(--ink-2); }
.dots button.on { color: var(--ink); }
.dots .pa { color: var(--ink-2); font-size: 12px; padding: 2px 4px; }
/* dot navigators on every image slider */
.dots .pa { display: none; }
.dots .pn {
  font-size: 0; line-height: 0;
  width: 7px; height: 7px; border-radius: 50%;
  background: #c9c9c4; padding: 0; margin: 3px 4px;
  transition: background .25s ease, transform .25s ease;
}
.dots .pn:hover { background: var(--ink-2); }
.dots .pn.on { background: var(--ink); transform: scale(1.2); }
/* feat frames: mini-card left, number nav right, same baseline row */
.frame .dots { left: auto; right: 16px; bottom: 16px; transform: none; }
.mini-card {
  position: absolute; left: 16px; bottom: 16px;
  background: #fff; border-radius: 12px; padding: 14px 16px;
  box-shadow: 0 6px 18px rgba(16,17,20,.10);
  min-width: 190px;
}
.mini-card .lbl { font-size: 12px; font-weight: 700; letter-spacing: .02em; text-transform: none; color: var(--ink); margin-bottom: 5px; display: block; }
.mini-card strong { font-size: 14.5px; font-weight: 600; letter-spacing: -.01em; display: block; }
.mini-card span { font-size: 11.5px; color: var(--ink-2); }
.mini-card.dark { background: var(--black); color: #fff; transition: background .45s ease; }
.mini-card.dark span { color: rgba(255,255,255,.65); }
.mini-card.dark .lbl { color: rgba(255,255,255,.85); }
@media (max-width: 900px) { .feat-grid { grid-template-columns: minmax(0, 1fr); } }

/* ============================================================ Black band (sustainability) */
.band { padding: clamp(24px, 5vh, 60px) 0; }
.band-in {
  background: var(--black); color: #fff;
  border-radius: 22px; overflow: hidden;
  display: grid; grid-template-columns: 1fr 1.05fr; gap: clamp(30px, 4.5vw, 64px);
  padding: clamp(28px, 4vw, 60px);
  align-items: center;
}
.band .lbl { color: #fff; display: block; margin-bottom: 14px; }
.band h3 {
  font-family: var(--font-d);
  font-size: clamp(20px, 1.9vw, 28px); font-weight: 600; letter-spacing: -0.02em; line-height: 1.22;
  margin-bottom: 26px;
}
.band p { font-size: 13.5px; color: rgba(255,255,255,.72); max-width: 46ch; margin-bottom: 26px; }
.band-copy {
  border-top: 1px solid rgba(255,255,255,.22);
  border-bottom: 1px solid rgba(255,255,255,.22);
  padding: clamp(20px, 2.6vh, 30px) 0;
}
.band-copy p {
  font-family: var(--font-d);
  font-size: clamp(19px, 1.8vw, 27px); line-height: 1.32; letter-spacing: -0.015em;
  color: #fff; max-width: none; margin-bottom: 0;
}
.band-copy .band-sub {
  font-family: var(--font); font-size: 13.5px; line-height: 1.75; letter-spacing: 0;
  color: rgba(255,255,255,.72); max-width: 52ch;
  margin-top: 20px; padding-top: 20px; border-top: 1px solid rgba(255,255,255,.22);
}
.band .btn-pill { background: #fff; color: var(--ink); }
.band .btn-pill:hover { background: #e8e8e4; }
/* light-mode variant, toggled by clicking the band eyebrow */
.band .lbl { cursor: pointer; user-select: none; }
.band-in { transition: background .45s ease, color .45s ease, box-shadow .45s ease; }
.band-in.light { background: #fff; color: var(--ink); box-shadow: inset 0 0 0 1px var(--hair); }
.band-in.light .lbl { color: var(--ink); }
.band-in.light p { color: var(--ink-2); }
.band-in.light .band-copy { border-top-color: var(--hair); border-bottom-color: var(--hair); }
.band-in.light .band-copy p { color: var(--ink); }
.band-in.light .band-copy .band-sub { color: var(--ink-2); border-top-color: var(--hair); }
.band-in.light .btn-pill { background: var(--black); color: #fff; }
.band-media { border-radius: 14px; overflow: hidden; min-height: 260px; }
.band-media img { width: 100%; height: 100%; object-fit: cover; }
.band-logos { margin-top: 20px; }
.band-logos img { display: block; width: 100%; height: auto; }
@media (max-width: 900px) { .band-in { grid-template-columns: 1fr; } }

/* ============================================================ Verified */
.verify { padding: clamp(60px, 11vh, 130px) 0; }
.verify h2 {
  font-family: var(--font-d);
  font-size: clamp(38px, 5.2vw, 78px); font-weight: 500; letter-spacing: -0.045em; line-height: 1.0;
  max-width: 14ch; margin-bottom: clamp(30px, 5vh, 60px);
}
.verify-grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(30px, 6vw, 90px); align-items: center; }
.dot-art {
  position: relative;
  aspect-ratio: 1 / 1; width: 100%;
  cursor: default;
}
.dot-art::before {
  content: ""; position: absolute; inset: 0;
  background-image: radial-gradient(rgba(16,17,20,.13) 1px, transparent 1.4px);
  background-size: 9px 9px;
}
.dot-art::after {
  content: ""; position: absolute; inset: 10% 4%;
  background: var(--ink);
  -webkit-mask-image: var(--mx-mark-mask);
  -webkit-mask-position: center; -webkit-mask-size: contain; -webkit-mask-repeat: no-repeat;
  mask-image: var(--mx-mark-mask);
  mask-position: center; mask-size: contain; mask-repeat: no-repeat;
}
/* hover: waves ripple outward through the background dot field */
.dot-art .dwave {
  position: absolute; inset: 0; pointer-events: none; opacity: 0;
  background-image: radial-gradient(rgba(16,17,20,.55) 1.1px, transparent 1.5px);
  background-size: 9px 9px;
  -webkit-mask-image: radial-gradient(circle, transparent 30%, #000 35%, #000 41%, transparent 46%);
  mask-image: radial-gradient(circle, transparent 30%, #000 35%, #000 41%, transparent 46%);
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  -webkit-mask-position: center; mask-position: center;
  -webkit-mask-size: 0% 0%; mask-size: 0% 0%;
}
.dot-art:hover .dwave { animation: dwave 2.6s linear infinite; }
.dot-art:hover .dwave.d2 { animation-delay: 1.3s; }
@keyframes dwave {
  0%   { -webkit-mask-size: 0% 0%; mask-size: 0% 0%; opacity: .95; }
  75%  { opacity: .55; }
  100% { -webkit-mask-size: 300% 300%; mask-size: 300% 300%; opacity: 0; }
}
.vrows { border-top: 1px solid var(--hair); }
.vrow { border-bottom: 1px solid var(--hair); padding: 16px 2px; display: grid; grid-template-columns: 1fr; gap: 4px; }
.vrow strong { font-size: 15px; font-weight: 600; letter-spacing: -.01em; }
.vrow span { font-size: 12.5px; color: var(--ink-2); max-width: 52ch; }
.vrow.last strong { font-family: var(--font-d); font-size: 19px; font-weight: 500; }
@media (max-width: 900px) { .verify-grid { grid-template-columns: minmax(0, 1fr); } }

/* ============================================================ Three disciplines */
.stack { padding: clamp(50px, 9vh, 110px) 0; }
.stack-head { display: grid; grid-template-columns: 1.4fr 1fr; gap: 40px; align-items: end; margin-bottom: clamp(30px, 6vh, 66px); }
.stack-head h2 {
  font-family: var(--font-d);
  font-size: clamp(38px, 5.2vw, 78px); font-weight: 500; letter-spacing: -0.045em; line-height: 1.0;
}
.stack-head p { font-size: 13px; color: var(--ink-2); max-width: 38ch; justify-self: end; }
.stack-grid { display: grid; grid-template-columns: 1fr 1.15fr; gap: clamp(30px, 5vw, 80px); align-items: center; }
.disc { border-top: 1px solid var(--hair); padding: 20px 2px; }
.disc:last-child { border-bottom: 1px solid var(--hair); }
.disc .no { font-size: 11px; color: var(--ink-3); }
.disc h4 { font-size: 16px; font-weight: 600; letter-spacing: -.01em; margin: 6px 0 8px; }
.disc p { font-size: 13px; color: var(--ink-2); max-width: 48ch; }
.collage { position: relative; height: clamp(340px, 40vw, 520px); }
.collage .c { position: absolute; border-radius: 12px; overflow: hidden; box-shadow: 0 8px 20px rgba(16,17,20,.12); }
.collage .c img { width: 100%; height: 100%; object-fit: cover; }
.c1 { left: 4%;  top: 2%;   width: 46%; aspect-ratio: 4/3; transform: rotate(-3deg); z-index: 1; }
.c2 { right: 6%; top: 18%;  width: 42%; aspect-ratio: 1/1.05; transform: rotate(4deg);  z-index: 2; }
.c3 { left: 16%; bottom: 4%; width: 48%; aspect-ratio: 16/10; transform: rotate(-1deg); z-index: 3; }
.c4 {
  position: absolute; right: 12%; bottom: 10%; z-index: 4;
  background: #fff; border-radius: 10px; padding: 12px 14px;
  box-shadow: 0 6px 18px rgba(16,17,20,.10); transform: rotate(2deg);
}
.c4 strong { display: block; font-size: 13px; font-weight: 600; }
.c4 span { font-size: 10.5px; color: var(--ink-2); }
@media (max-width: 900px) { .stack-grid { grid-template-columns: 1fr; } .stack-head { grid-template-columns: 1fr; } .stack-head p { justify-self: start; } }

/* ============================================================ Frontier */
.front { padding: clamp(50px, 9vh, 110px) 0 0; }
.front-head { display: grid; grid-template-columns: 1.4fr 1fr; gap: 40px; align-items: end; margin-bottom: clamp(30px, 6vh, 60px); }
.front-head h2 {
  font-family: var(--font-d);
  font-size: clamp(38px, 5.2vw, 78px); font-weight: 500; letter-spacing: -0.045em; line-height: 1.0; max-width: 14ch;
}
.front-head p { font-size: 13px; color: var(--ink-2); max-width: 36ch; justify-self: end; }
.front-cols { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(20px, 3vw, 44px); border-top: 1px solid var(--hair); padding-top: 30px; padding-bottom: clamp(60px, 10vh, 120px); }
.fcol { display: flex; flex-direction: column; }
.fcol .tags { margin-bottom: 26px; }
.fcol .fc-img {
  margin-top: auto;
  width: 100%; aspect-ratio: 4 / 5;
  border-radius: 8px; overflow: hidden;
}
.fcol .fc-img img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s cubic-bezier(.22,1,.36,1), filter .45s ease; }
.front-cols:has(.fcol:hover) .fcol:not(:hover) .fc-img img { filter: grayscale(1); }
/* alternate view: white halftone cards (toggle: click a column label) */
.front-cols .fc-top .lbl { cursor: pointer; transition: color .25s ease; }
.front-cols .fc-top .lbl:hover { color: var(--navy); }
.fcol .fc-art { display: none; }
.front-cols.artmode .fc-img { display: none; }
.front-cols.artmode .fc-art {
  display: block; position: relative;
  margin-top: auto; width: 100%; aspect-ratio: 4 / 5;
  background: #fff; border: 1px solid var(--hair); border-radius: 8px;
  overflow: hidden;
}
.fc-art::before {
  content: ""; position: absolute; inset: 0;
  background-image: radial-gradient(rgba(16,17,20,.12) 1px, transparent 1.4px);
  background-size: 9px 9px;
  transition: opacity .6s ease, background-size .6s ease;
}
.fc-art::after {
  content: ""; position: absolute; inset: 0;
  background-image: radial-gradient(rgba(21,46,113,.5) 1.1px, transparent 1.5px);
  background-size: 7px 7px;
  opacity: 0;
  transition: opacity .6s ease;
}
.fc-art .fa-dots {
  position: absolute; inset: 14%; z-index: 1;
  background-image: radial-gradient(var(--ink) 1.3px, transparent 1.7px);
  background-size: 9px 9px;
  -webkit-mask: var(--fa-mask) center / contain no-repeat;
  mask: var(--fa-mask) center / contain no-repeat;
}
.fc-art .fa-dots.nv { display: none; }
.fc-art:hover::before { opacity: 0; }
.fc-art:hover::after { opacity: 1; }
.fcol .fc-top { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 14px; }
.fcol .lbl { font-size: 13px; }
.fcol .idx { font-family: var(--font-d); font-size: 15px; color: var(--ink-3); }
.fcol h4 { font-family: var(--font-d); font-size: clamp(19px, 1.7vw, 25px); font-weight: 500; letter-spacing: -0.02em; line-height: 1.15; margin-bottom: 12px; }
.fcol p { font-size: 12.5px; color: var(--ink-2); margin-bottom: 16px; }
.tags { display: flex; flex-wrap: wrap; gap: 7px; }
.tags span { font-size: 11px; font-weight: 600; padding: 6px 12px; border: 1px solid rgba(16,17,20,.22); border-radius: 999px; color: var(--ink-2); }
/* Applications: alternate cards view (toggle: click the eyebrow) */
#applications .lbl { cursor: pointer; transition: color .25s ease; }
#applications .lbl:hover { color: var(--navy); }
.app-cards { display: none; }
#applications.cards-view .feat-grid { display: none; }
#applications.cards-view .app-cards {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
  column-gap: 0; row-gap: clamp(40px, 6.5vh, 70px);
}
.acard {
  display: flex; flex-direction: column;
  background: transparent; border: 0; border-left: 1px solid var(--hair); border-radius: 0;
  padding: clamp(20px, 2.6vh, 30px) clamp(20px, 2.4vw, 34px);
}
.acard:nth-of-type(3n) { border-right: 1px solid var(--hair); }
.acard:hover { background: #f1f1ee; }
.acard .ic { display: block; margin-bottom: clamp(70px, 12vh, 150px); }
.acard .ic svg { width: 72px; height: 72px; display: block; color: var(--ink); transition: color .3s ease, transform .4s ease; }
.acard h4 {
  font-family: var(--font-d);
  font-size: clamp(19px, 1.6vw, 23px); font-weight: 500; letter-spacing: -.02em; line-height: 1.12;
  max-width: 11ch; margin-bottom: 14px;
  transition: color .25s ease;
}
.acard p { font-size: 13px; color: var(--ink-2); line-height: 1.6; max-width: 32ch; }
@media (max-width: 900px) {
  #applications.cards-view .app-cards { grid-template-columns: 1fr; }
  .acard { border-right: 1px solid var(--hair); }
}

/* ============================================================ News */
.news { padding: clamp(50px, 9vh, 110px) 0 clamp(60px, 10vh, 120px); }
.news-head { display: grid; grid-template-columns: 1.4fr 1fr; gap: 40px; align-items: end; margin-bottom: clamp(30px, 6vh, 60px); }
.news-head .lbl { display: block; margin-bottom: 12px; }
.news-head h2 {
  font-family: var(--font-d);
  font-size: clamp(38px, 5.2vw, 78px); font-weight: 500; letter-spacing: -0.045em; line-height: 1.0;
}
.news-head > p { font-size: 13px; color: var(--ink-2); max-width: 36ch; justify-self: end; }
.news-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(16px, 2vw, 28px); }
.news-card {
  display: flex; flex-direction: column; min-width: 0;
  background: #fff; color: var(--ink);
  border: 1px solid var(--hair);
  border-radius: 14px;
  padding: clamp(24px, 2.4vw, 36px);
  min-height: clamp(300px, 38vh, 420px);
  transition: border-color .3s ease, transform .35s ease, box-shadow .35s ease;
}
.news-card { transition: none; }
.news-card .nc-tag, .news-card h4, .news-card .nc-meta { transition: none; }
.news-card:hover {
  background: #0a0c12; border-color: #0a0c12;
  box-shadow: 0 6px 16px rgba(16,17,20,.07);
}
.news-card:hover .nc-tag, .news-card:hover h4 { color: #fff; }
.news-card:hover .nc-meta { color: rgba(255,255,255,.68); }
#portfolio .news-card { transition: none; }
#portfolio .news-card .nc-tag, #portfolio .news-card h4, #portfolio .news-card .nc-meta { transition: none; }
#portfolio .news-card:hover { background: #0a0c12; border-color: #0a0c12; }
#portfolio .news-card:hover .nc-tag, #portfolio .news-card:hover h4 { color: #fff; }
#portfolio .news-card:hover .nc-meta { color: rgba(255,255,255,.68); }
.news-card .nc-tag { font-size: 12.5px; font-weight: 700; letter-spacing: .02em; color: var(--ink); }
.news-card h4 {
  font-family: var(--font-d);
  font-size: clamp(19px, 1.8vw, 26px); font-weight: 500; letter-spacing: -0.025em; line-height: 1.18;
  margin: auto 0 12px; padding-top: 40px; max-width: 22ch; color: var(--ink);
  transition: color .25s ease;
}
.news-card .nc-meta { font-size: 12.5px; color: var(--ink-3); }
.news-card .nc-meta b { color: var(--ink); font-weight: 700; }
.news-card:hover .nc-meta b { color: #fff; }
@media (max-width: 900px) { .news-grid { grid-template-columns: 1fr; } .news-head { grid-template-columns: 1fr; } .news-head > p { justify-self: start; } }

/* ============================================================ Press-paper popup (A4) */
.paper-modal {
  position: fixed; inset: 0; z-index: 500;
  display: flex; align-items: center; justify-content: center;
  background: rgba(16, 17, 20, .45);
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
  opacity: 0; visibility: hidden; will-change: opacity;
  transition: opacity .4s cubic-bezier(.22, 1, .36, 1), visibility 0s linear .4s;
}
.paper-modal.open { opacity: 1; visibility: visible; transition: opacity .4s cubic-bezier(.22, 1, .36, 1); }
.paper-sheet {
  position: relative;
  width: min(940px, 94vw);
  max-height: 90vh;
  background: #fff; color: var(--ink);
  border: 1px solid var(--hair);
  border-radius: 14px;
  box-shadow: 0 40px 90px rgba(0,0,0,.35);
  transform: translateY(28px) scale(.97); opacity: 0;
  will-change: transform, opacity;
  transition: transform .55s cubic-bezier(.22,1,.36,1), opacity .35s ease;
  display: flex; flex-direction: column;
  overflow: hidden;
}
.paper-modal.open .paper-sheet { transform: none; opacity: 1; }
.pm-close {
  position: absolute; top: 14px; right: 14px; z-index: 2;
  width: 34px; height: 34px; border: 1px solid var(--hair); border-radius: 50%;
  background: #fff; color: var(--ink); font-size: 15px; line-height: 1;
  display: grid; place-items: center; cursor: pointer;
  transition: background .25s ease, transform .25s ease;
}
.pm-close:hover { background: var(--paper); transform: rotate(90deg); }
.pm-scroll { overflow-y: auto; padding: clamp(26px, 4.6vw, 46px) clamp(24px, 4.4vw, 44px); }
.pm-mast { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.pm-mast .mx-logo { width: 112px; transform: translateY(2px); }
.pm-mast span { font-size: 12.5px; font-weight: 700; letter-spacing: .02em; color: var(--ink); }
.pm-mast span:last-child { font-weight: 500; color: var(--ink-2); }
.pm-rule { height: 1px; background: var(--hair); margin: 18px 0 26px; }
.pm-rule-thin { display: none; }
.paper-sheet h1 {
  font-family: var(--font-d);
  font-size: clamp(26px, 3.2vw, 40px); font-weight: 500; letter-spacing: -.045em; line-height: 1.04;
  max-width: 22ch; margin-bottom: 14px;
}
.pm-dateline { font-size: 12.5px; color: var(--ink-2); margin-bottom: 24px; }
.pm-facts {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px;
  border-top: 1px solid var(--hair); border-bottom: 1px solid var(--hair);
  padding: 16px 0; margin-bottom: 26px;
}
.pm-facts strong { font-family: var(--font-d); font-size: 21px; font-weight: 700; letter-spacing: -.02em; display: block; white-space: nowrap; }
.pm-facts span { font-size: 11px; color: var(--ink-2); line-height: 1.4; display: block; margin-top: 3px; }
.pm-body { column-count: 2; column-gap: 30px; column-rule: 1px solid var(--hair); }
.pm-body p { font-size: 12.5px; line-height: 1.7; color: var(--ink-2); margin-bottom: 12px; }
.pm-quote {
  break-inside: avoid;
  border-top: 1px solid var(--ink);
  padding: 14px 0 4px; margin: 8px 0 14px;
}
.pm-quote p { font-family: var(--font-d); font-size: 16.5px; line-height: 1.3; font-weight: 500; letter-spacing: -.02em; color: var(--ink); margin-bottom: 8px; }
.pm-quote cite { font-style: normal; font-size: 11px; font-weight: 700; color: var(--ink-3); }
.pm-foot { margin-top: 20px; }
.pm-links { display: flex; flex-wrap: wrap; gap: 10px; }
.pm-links a {
  display: inline-flex; align-items: center; gap: 9px;
  background: var(--black); color: #fff;
  border: 0; border-radius: 999px;
  padding: 12px 22px; font-size: 13px; font-weight: 600;
  transition: background .25s ease;
}
.pm-links a i { font-style: normal; transition: transform .25s ease; }
.pm-links a:hover { background: var(--navy); color: #fff; }
.pm-links a:hover i { transform: translate(2px, -2px); }
.pm-note { display: block; margin-top: 12px; font-size: 10.5px; color: var(--ink-3); }
@media (max-width: 640px) { .pm-body { column-count: 1; } .pm-facts { grid-template-columns: repeat(2, 1fr); } }
/* fullscreen video popup */
.vid-modal {
  position: fixed; inset: 0; z-index: 520;
  display: flex; align-items: center; justify-content: center;
  background: rgba(10, 12, 18, .74);
  -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
  opacity: 0; visibility: hidden;
  transition: opacity .3s ease, visibility 0s linear .3s;
}
.vid-modal.open { opacity: 1; visibility: visible; transition: opacity .3s ease; }
.vid-modal video {
  width: min(1240px, 94vw); max-height: 86vh;
  border-radius: 12px; background: #000; display: block;
  transform: translateY(14px) scale(.985);
  transition: transform .35s cubic-bezier(.22, 1, .36, 1);
}
.vid-modal.open video { transform: none; }
.vid-modal .pm-close { position: absolute; top: 22px; right: 22px; }
body.paper-open { overflow: hidden; }
@media print {
  body.paper-open > *:not(.paper-modal) { display: none !important; }
  .paper-modal { position: static; background: none; -webkit-backdrop-filter: none; backdrop-filter: none; opacity: 1; visibility: visible; }
  .paper-sheet { width: 100%; max-height: none; border: 0; border-radius: 0; box-shadow: none; transform: none; }
  .pm-scroll { overflow: visible; }
  .pm-close, .pm-foot { display: none !important; }
}

/* ============================================================ PDF viewer (v3) */
.pdfv {
  position: fixed; inset: 0; z-index: 520;
  display: flex; align-items: center; justify-content: center; padding: 22px;
  background: rgba(16, 17, 20, .45);
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
  opacity: 0; visibility: hidden;
  transition: opacity .3s ease, visibility 0s linear .3s;
}
.pdfv.open { opacity: 1; visibility: visible; transition: opacity .3s ease; }
.pdfv-card {
  width: min(1180px, 96vw); height: min(92vh, 1100px);
  background: var(--paper); border-radius: 14px; overflow: hidden;
  box-shadow: 0 60px 140px rgba(0,0,0,.4);
  display: flex; flex-direction: column;
  transform: translateY(18px) scale(.98);
  transition: transform .35s cubic-bezier(.22,1,.36,1);
}
.pdfv.open .pdfv-card { transform: none; }
.pdfv-head {
  display: flex; align-items: center; gap: 16px;
  padding: 12px 16px; background: #fff; border-bottom: 1px solid var(--hair);
}
.pdfv-head .pv-label { font-size: 12.5px; font-weight: 700; letter-spacing: .02em; color: var(--ink); white-space: nowrap; }
.pdfv-head .pv-name { font-size: 12.5px; color: var(--ink-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pdfv-zoom {
  display: flex; align-items: center; gap: 2px; margin-left: auto;
  border: 1px solid var(--hair); border-radius: 999px; padding: 3px 6px;
}
.pdfv-zoom button {
  all: unset; cursor: pointer; width: 24px; height: 24px;
  display: grid; place-items: center; border-radius: 50%;
  font-size: 15px; color: var(--ink-2);
  transition: background .2s ease, color .2s ease;
}
.pdfv-zoom button:hover { background: var(--paper); color: var(--ink); }
.pdfv-zoom span { font-size: 11.5px; font-weight: 700; min-width: 42px; text-align: center; }
.pdfv-dl {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: 12.5px; font-weight: 700; color: var(--ink);
  border: 1px solid var(--hair); border-radius: 999px; padding: 8px 15px;
  transition: border-color .25s ease, color .25s ease;
}
.pdfv-dl:hover { border-color: var(--ink); color: var(--navy); }
.pdfv-dl svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 2; }
.pdfv-close {
  width: 32px; height: 32px; border: 1px solid var(--hair); border-radius: 50%;
  background: #fff; color: var(--ink); font-size: 14px; line-height: 1;
  display: grid; place-items: center; cursor: pointer;
  transition: background .25s ease, transform .25s ease;
}
.pdfv-close:hover { background: var(--paper); transform: rotate(90deg); }
.pdfv-viewer {
  flex: 1; overflow: auto; padding: 26px;
  display: flex; flex-direction: column; align-items: center; gap: 18px;
}
.pdfv-viewer canvas { background: #fff; border: 1px solid var(--hair); box-shadow: 0 18px 44px rgba(16,17,20,.08); }
.pdfv-viewer.is-iframe { padding: 0; display: block; }
.pdfv-viewer.is-iframe iframe { width: 100%; height: 100%; border: 0; display: block; }
.pdfv-status { font-size: 12.5px; color: var(--ink-3); padding: 46px 0; }

/* ============================================================ Footer */
.ft { background: var(--black); color: #fff; padding: clamp(60px, 10vh, 120px) 0 40px; position: relative; overflow: hidden; }
.ft .ft-bg, .ft .ft-shade { content: ""; position: absolute; inset: 0; opacity: 0; transition: opacity .9s ease; pointer-events: none; }
.ft .ft-bg { background: url('../images/water-footer.jpg') center / cover no-repeat; }
.ft .ft-shade { background: linear-gradient(90deg, rgba(4,7,18,.5) 0%, rgba(4,7,18,0) 20%, rgba(4,7,18,0) 82%, rgba(4,7,18,.38) 100%), linear-gradient(180deg, rgba(6,10,25,.3) 0%, rgba(6,10,25,.48) 32%, rgba(4,7,18,.96) 64%, rgba(3,5,13,1) 100%); }
.ft.ocean .ft-bg, .ft.ocean .ft-shade { opacity: 1; }
.ft > .wrap { position: relative; z-index: 1; }
.ft-big { cursor: pointer; }
.ft-big h2 {
  font-family: var(--font-d);
  font-size: clamp(40px, 5.6vw, 84px); font-weight: 500; letter-spacing: -0.045em; line-height: 1.0;
}
.ft-big .second { text-align: right; margin-top: clamp(24px, 5vh, 60px); }
.ft-big .second h2 { display: inline-block; text-align: left; }
.ft-cta { text-align: right; margin-top: 34px; }
.ft-cta .btn-pill { background: #fff; color: var(--ink); }
.ft-cta .btn-pill:hover { background: #e6e6e2; }
.ft-cols {
  display: grid; grid-template-columns: 2fr 1fr 1fr 1fr; gap: 30px;
  border-top: 1px solid rgba(255,255,255,.14);
  margin-top: clamp(50px, 9vh, 100px); padding-top: 44px;
}
.ft-cols h5 { font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: rgba(255,255,255,.45); margin-bottom: 14px; font-weight: 700; }
.ft-cols a { display: block; font-size: 13.5px; color: rgba(255,255,255,.78); padding: 4px 0; }
.ft-cols a:hover { color: #fff; }
.ft-brand p { font-size: 12.5px; color: rgba(255,255,255,.55); max-width: 30ch; margin-top: 18px; }
.ft-base { display: flex; justify-content: space-between; align-items: center; margin-top: 56px; font-size: 11.5px; color: rgba(255,255,255,.4); }
@media (max-width: 900px) { .ft-cols { grid-template-columns: 1fr 1fr; } }
/* ocean variant: lift link contrast over the photo */
.ft.ocean .ft-big h2 { text-shadow: 0 2px 26px rgba(3, 8, 20, .5); }
.ft.ocean .ft-cols { border-top-color: rgba(255,255,255,.3); }
.ft.ocean .ft-cols h5 { color: rgba(255,255,255,.68); }
.ft.ocean .ft-cols a { color: rgba(255,255,255,.94); }
.ft.ocean .ft-brand p { color: rgba(255,255,255,.78); }
.ft.ocean .ft-base { color: rgba(255,255,255,.62); }

/* ============================================================ Matrix additions */
/* footer option 3: light paper with halftone dots, collapsing to center on hover */
.ft-dots { position: absolute; inset: 0; opacity: 0; pointer-events: none; transition: opacity .6s ease; }
.ft-dots::before {
  content: ""; position: absolute; inset: 0;
  background-image: radial-gradient(rgba(16,17,20,.2) 1.2px, transparent 1.6px);
  background-size: 9px 9px;
}
.ft-dots i {
  position: absolute; inset: 0; opacity: 0;
  background-image: radial-gradient(rgba(16,17,20,.62) 1.4px, transparent 1.8px);
  background-size: 9px 9px;
  -webkit-mask-image: radial-gradient(circle 300px at var(--mx, 50%) var(--my, 50%), #000 0, rgba(0,0,0,.5) 55%, transparent 100%);
  mask-image: radial-gradient(circle 300px at var(--mx, 50%) var(--my, 50%), #000 0, rgba(0,0,0,.5) 55%, transparent 100%);
  filter: url(#ftLiquid);
  transition: opacity .5s ease;
}
.ft-dots i.d2 {
  background-image: radial-gradient(rgba(16,17,20,.34) 1.3px, transparent 1.7px);
  -webkit-mask-image: radial-gradient(circle 560px at var(--mx, 50%) var(--my, 50%), #000 0, rgba(0,0,0,.35) 55%, transparent 100%);
  mask-image: radial-gradient(circle 560px at var(--mx, 50%) var(--my, 50%), #000 0, rgba(0,0,0,.35) 55%, transparent 100%);
}
.ft.lightmode { background: var(--paper); color: var(--ink); }
body.navy-mode .ft.lightmode { background: var(--paper); }
.ft.lightmode .ft-bg, .ft.lightmode .ft-shade { opacity: 0; }
.ft.lightmode .ft-dots { opacity: 1; }
.ft.lightmode:hover .ft-dots i { opacity: 1; }
.ft.lightmode .ft-big h2 { color: var(--ink); text-shadow: none; }
.ft.lightmode .ft-cols { border-top-color: var(--hair); }
.ft.lightmode .ft-cols h5 { color: var(--ink-3); }
.ft.lightmode .ft-cols a { color: var(--ink-2); }
.ft.lightmode .ft-cols a:hover { color: var(--ink); }
.ft.lightmode .ft-brand p { color: var(--ink-2); }
.ft.lightmode .ft-base { color: var(--ink-3); }
.ft.lightmode .mx-logo.white { background-color: var(--ink); }
.ft.lightmode .ft-cta .btn-pill { background: var(--ink); color: #fff; }
.ft.lightmode .ft-cta .btn-pill:hover { background: var(--navy); color: #fff; }
/* the side navigator keeps its dark scheme over the light footer */
body.ft-lightmode .page-toc.lit .pt-card strong { color: var(--ink); }
body.ft-lightmode .page-toc.lit .pt-list { border-left-color: var(--hair); }
body.ft-lightmode .page-toc.lit .pt-list a { color: var(--ink-3); }
body.ft-lightmode .page-toc.lit .pt-list a:hover, body.ft-lightmode .page-toc.lit .pt-list a.on { color: var(--ink); }
body.ft-lightmode .page-toc.lit .pt-list a.on::before { background: var(--ink); }

/* band: big matrix logo on the right */
.band-media.logo { display: flex; align-items: center; justify-content: center; min-height: 260px; overflow: visible; }
.band-media.logo img { width: min(76%, 440px); height: auto; object-fit: contain; }
.band-in:not(.light) .band-media.logo img { filter: invert(1) hue-rotate(180deg) brightness(1.6); }

/* service popups: entry photo banner */
.pm-hero { border-radius: 10px; overflow: hidden; aspect-ratio: 3 / 1; margin-bottom: 26px; background: #e9e9e6; }
.pm-hero img { width: 100%; height: 100%; object-fit: cover; display: block; }

#why { padding-bottom: clamp(24px, 4vh, 52px); }
/* why choose: hover highlight on each row */
#why .vrow { transition: background .25s ease; }
#why .vrow:not(.last):hover { background: #f1f1ee; }
/* why choose: matrix template icons on each row */
.vrow { grid-template-columns: 40px 1fr; grid-template-rows: auto auto; column-gap: 16px; align-items: start; }
.vrow .vic { grid-column: 1; grid-row: 1 / span 2; width: 28px; height: 28px; color: var(--ink); margin-top: 3px; }
.vrow .vic svg { width: 100%; height: 100%; display: block; }
.vrow strong, .vrow span { grid-column: 2; }
.vrow.last { grid-template-columns: 1fr; }
.vrow.last strong { grid-column: 1; }
body.navy-mode .vrow .vic { color: var(--navy); }
/* blue mode: active accordion and tab icons follow */
body.navy-mode .row.open .ric { color: var(--navy); }
body.navy-mode .row:hover .ric { color: var(--navy); }
body.navy-mode .state-item.on .sic, body.navy-mode .state-item:hover .sic { color: var(--navy); }

/* services: matrix template card view, toggled by the eyebrow */
#services .lbl { cursor: pointer; transition: color .25s ease; }
#services .lbl:hover { color: var(--navy); }
.svc-cards-wrap { display: none; }
#services.cards-mode .app-cards { display: none; }
#services.cards-mode .svc-cards-wrap { display: block; }
.svc-cards {
  display: flex; gap: 24px;
  overflow-x: auto; scroll-snap-type: x mandatory;
  scrollbar-width: none; padding-bottom: 6px;
}
.svc-cards::-webkit-scrollbar { display: none; }
.svc-card {
  position: relative; flex: 0 0 calc((100% - 48px) / 3);
  scroll-snap-align: start;
  border-radius: 16px; overflow: hidden;
  background: linear-gradient(155deg, var(--navy) 0%, #1a2654 100%);
  cursor: pointer; display: flex; flex-direction: column;
  height: 600px;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.18);
  transition: filter .35s cubic-bezier(.16, 1, .3, 1), box-shadow .35s cubic-bezier(.16, 1, .3, 1);
}
.svc-card:hover { filter: brightness(1.18) saturate(1.08); box-shadow: 0 22px 50px rgba(31, 78, 170, .42); }
.svc-card .sc-icon {
  position: absolute; top: 28px; left: 28px;
  width: 46px; height: 46px; display: inline-flex; align-items: center; justify-content: center;
  color: rgba(255,255,255,.85); transition: color .3s ease, transform .3s ease;
}
.svc-card .sc-icon svg { width: 32px; height: 32px; stroke: currentColor; stroke-width: 1.6; fill: none; }
.svc-card:hover .sc-icon { color: #fff; transform: translateY(-2px); }
.svc-card .sc-body {
  position: relative; margin-top: auto; padding: 28px;
  display: flex; flex-direction: column; gap: 12px; color: #fff;
}
.svc-card .sc-title {
  font-family: var(--font-d);
  font-size: 29px; font-weight: 700; color: #fff; line-height: 1.15;
  min-height: calc(29px * 1.15 * 2); display: flex; align-items: flex-end;
}
.svc-card .sc-sub {
  font-size: 16px; color: rgba(255,255,255,.78); line-height: 1.5;
  max-width: 90%; min-height: calc(16px * 1.5 * 3);
}
.svc-card .sc-cta {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: 12px; font-weight: 700; letter-spacing: 2px; text-transform: uppercase; color: #fff;
}
.svc-card .sc-cta svg { transition: transform .3s ease; }
.svc-card:hover .sc-cta svg { transform: translateX(8px); }
.svc-nav { display: flex; align-items: center; gap: 8px; justify-content: flex-start; margin-top: 18px; }
.svc-nav button {
  all: unset; cursor: pointer; width: 38px; height: 38px;
  display: grid; place-items: center; border-radius: 50%;
  border: 1px solid var(--hair); color: var(--ink); font-size: 16px;
  transition: background .25s ease, border-color .25s ease, color .25s ease;
}
.svc-nav button:hover { background: var(--black); border-color: var(--black); color: #fff; }
body.navy-mode .svc-nav button:hover { background: var(--navy); border-color: var(--navy); }
@media (max-width: 1024px) { .svc-card { flex-basis: calc((100% - 24px) / 2); } }
@media (max-width: 640px) { .svc-card { flex-basis: 92%; height: 500px; } }

/* facilities: embedded location map with site toggle */
#facilities .front-cols { padding-bottom: clamp(24px, 4vh, 44px); }
.fac-map { padding-bottom: clamp(60px, 10vh, 120px); }
.fac-head { display: flex; align-items: center; gap: 10px; margin-bottom: 16px; flex-wrap: wrap; }
.fac-head .lbl { margin-right: 8px; }
.fac-pill {
  all: unset; cursor: pointer; font-family: var(--font);
  font-size: 12.5px; font-weight: 600; color: var(--ink);
  border: 1px solid var(--hair); border-radius: 999px; padding: 9px 16px;
  transition: border-color .25s ease, color .25s ease, background .25s ease;
}
.fac-pill:hover { border-color: var(--ink); }
.fac-pill.on { background: var(--ink); border-color: var(--ink); color: #fff; }
body.navy-mode .fac-pill.on { background: var(--navy); border-color: var(--navy); }
.fac-dir { margin-left: auto; font-size: 12.5px; font-weight: 600; color: var(--ink); border-bottom: 1px solid rgba(16,17,20,.3); padding-bottom: 2px; }
.fac-dir:hover { color: var(--navy); border-bottom-color: var(--navy); }
.fac-frame {
  border-radius: 14px; overflow: hidden; border: 1px solid var(--hair);
  aspect-ratio: 21 / 8; background: #e9e9e6;
}
.fac-frame iframe { width: 100%; height: 100%; border: 0; display: block; }
@media (max-width: 760px) { .fac-frame { aspect-ratio: 4 / 3; } }

/* hero rotating specialty word: one line each, sized so the longest term fits its column */
.hero h1 .rot { display: block; white-space: nowrap; height: 1.06em; overflow: hidden; }
body.navy-mode .hero h1 .rot { color: var(--navy); }
.hero h1 .rot .w { display: block; }
.hero h1 .rot .caret {
  display: inline-block; width: .045em; height: .82em;
  background: currentColor; margin-left: .07em;
  opacity: 0; transform: translateY(.06em);
}
.hero h1 .rot.typing .caret { opacity: .75; animation: caretBlink .9s steps(1) infinite; }
@keyframes caretBlink { 50% { opacity: .1; } }
.hero-media video { background: #0b1533; }
/* services: numbered editorial cards, 4-up */
#services .app-cards {
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr));
  column-gap: 0; row-gap: clamp(34px, 5.5vh, 56px);
  margin-top: clamp(10px, 2vh, 22px);
}
#services .acard { border-left: 1px solid var(--hair); border-right: 0; cursor: pointer; }
#services .acard:nth-of-type(4n) { border-right: 1px solid var(--hair); }
#services .acard .no {
  font-family: var(--font-d); font-size: 15px; color: var(--ink-3);
  display: block; margin-bottom: clamp(44px, 8vh, 92px);
  font-variant-numeric: tabular-nums;
}
#services .acard h4 { max-width: none; font-size: clamp(17px, 1.35vw, 21px); }
#services .acard p { font-size: 12.5px; max-width: 30ch; }
@media (max-width: 1100px) {
  #services .app-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #services .acard:nth-of-type(2n) { border-right: 1px solid var(--hair); }
}
@media (max-width: 640px) {
  #services .app-cards { grid-template-columns: 1fr; }
  #services .acard { border-right: 1px solid var(--hair); }
}
/* product rows: document pill buttons */
.row .bd .bd-btns { display: flex; flex-wrap: wrap; gap: 8px; padding: 0 2px 28px 54px; margin-top: -12px; }
.row .bd .bd-btns a.bd-btn {
  display: inline-flex; align-items: center; gap: 7px;
  font-size: 12px; font-weight: 600; padding: 8px 15px; border-radius: 999px;
  background: var(--ink); color: #fff; border-bottom: 0; white-space: nowrap;
  transition: background .25s ease, color .25s ease;
}
.row .bd .bd-btns a.bd-btn:hover { background: var(--navy); }
.row .bd .bd-btns a.bd-btn.ghost { background: transparent; color: var(--ink); box-shadow: inset 0 0 0 1px rgba(16,17,20,.25); }
.row .bd .bd-btns a.bd-btn.ghost:hover { background: rgba(16,17,20,.05); }
body.navy-mode .row .bd .bd-btns a.bd-btn:not(.ghost) { background: var(--navy); }
/* products accordion: plain spec line between full-width hairlines */
.row .bd .meta {
  display: flex; flex-wrap: wrap; gap: 8px 28px;
  padding: 11px 2px 11px 54px; margin: -12px 0 26px;
  border-top: 1px solid var(--hair); border-bottom: 1px solid var(--hair);
}
.row .bd .meta span { font-size: 12px; font-weight: 500; color: var(--ink-2); white-space: nowrap; }
/* why choose: wider headline over the verify layout */
#why h2 { max-width: 24ch; font-size: clamp(32px, 4.2vw, 62px); }
#why .lbl { display: block; margin-bottom: 12px; }
/* certifications strip */
.certs { padding: clamp(4px, 1vh, 12px) 0 clamp(50px, 9vh, 110px); }
.certs .wrap { display: grid; grid-template-columns: 1fr 1.6fr; gap: clamp(28px, 5vw, 90px); align-items: center; }
.certs p { font-size: 13px; color: var(--ink-2); max-width: 40ch; margin-top: 12px; }
.certs img { mix-blend-mode: multiply; width: 100%; max-width: 640px; justify-self: end; }
@media (max-width: 900px) { .certs .wrap { grid-template-columns: 1fr; } .certs img { justify-self: start; } }
/* facilities: two wide columns with fact strips */
#facilities .front-cols { grid-template-columns: repeat(2, minmax(0, 1fr)); }
#facilities .front-head h2 { max-width: 20ch; }
#facilities .fcol h4 { max-width: none; }
#facilities .tags { margin-bottom: 4px; }
#facilities .fc-img { aspect-ratio: 16 / 10; margin-top: 20px; cursor: pointer; }
.fc-facts { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; border-top: 1px solid var(--hair); margin-top: 16px; padding-top: 14px; }
.fc-facts strong { font-family: var(--font-d); font-size: 19px; font-weight: 600; letter-spacing: -.02em; display: block; }
.fc-facts span { font-size: 11.5px; color: var(--ink-2); }
@media (max-width: 900px) { #facilities .front-cols { grid-template-columns: 1fr; } }

/* ==================================================== */

/* "On this page" side navigator */
.page-toc {
  position: fixed; left: clamp(16px, 1.6vw, 30px); top: 50%;
  transform: translateY(-50%); z-index: 60;
  width: 150px;
  transition: transform .55s cubic-bezier(.22, 1, .36, 1), opacity .4s ease;
}
.page-toc.hide { transform: translate(-140%, -50%); opacity: 0; pointer-events: none; }
.pt-tab { display: none; }
.pt-card { background: transparent; border: 0; padding: 0; }
.pt-card strong { display: block; font-size: 12px; font-weight: 700; color: var(--ink); margin-bottom: 10px; }
.pt-list { border-left: 1px solid var(--hair); display: grid; }
.pt-list a {
  position: relative; display: block; padding: 6px 0 6px 14px;
  font-size: 12px; color: var(--ink-3); line-height: 1.35;
  transition: color .25s ease;
}
.pt-list a:hover { color: var(--ink); }
.pt-list a.on { color: var(--ink); font-weight: 600; }
.pt-list a.on::before { content: ""; position: absolute; left: -1px; top: 5px; bottom: 5px; width: 2px; background: var(--ink); }
.page-toc.lit .pt-card strong { color: #fff; }
.page-toc.lit .pt-list { border-left-color: rgba(255,255,255,.28); }
.page-toc.lit .pt-list a { color: rgba(255,255,255,.55); }
.page-toc.lit .pt-list a:hover, .page-toc.lit .pt-list a.on { color: #fff; }
.page-toc.lit .pt-list a.on::before { background: #fff; }
@media (max-width: 1279px) { .page-toc { display: none; } }

/* ==================================================== */

/* ============ mobile UX pack: hamburger menu, bottom TOC, accordion, swipe ============ */
.menu-btn {
  all: unset; cursor: pointer; width: 38px; height: 38px; border-radius: 50%;
  display: inline-flex; flex-direction: column; align-items: center; justify-content: center; gap: 5px;
  -webkit-tap-highlight-color: transparent;
}
.menu-btn span { display: block; width: 20px; height: 2px; background: var(--ink); border-radius: 2px; transition: transform .38s cubic-bezier(.22,1,.36,1), opacity .25s ease; }
.menu-btn:hover span { background: var(--navy); }
@media (min-width: 801px) { .menu-btn { display: none; } }
@media (max-width: 800px) { .hd .right .hd-about { display: none; } }
body.menu-open .menu-btn span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
body.menu-open .menu-btn span:nth-child(2) { opacity: 0; transform: scaleX(0); visibility: hidden; }
body.menu-open .menu-btn span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
.mmenu {
  position: fixed; inset: 0; z-index: 96;
  background: rgba(244,244,242,.9);
  -webkit-backdrop-filter: blur(20px) saturate(1.15); backdrop-filter: blur(20px) saturate(1.15);
  opacity: 0; pointer-events: none; transition: opacity .35s ease;
  display: flex; flex-direction: column;
  overflow-y: auto; -webkit-overflow-scrolling: touch; overscroll-behavior: contain;
  padding: 106px var(--pad) calc(22px + env(safe-area-inset-bottom));
}
body.white-mode .mmenu { background: rgba(255,255,255,.92); }
body.menu-open .mmenu { opacity: 1; pointer-events: auto; }
body.menu-open { overflow: hidden; }
.mmenu-in {
  width: 100%; max-width: 560px; margin: 0 auto;
  display: grid; flex: 0 0 auto;
}
.mmenu-in a {
  display: flex; align-items: baseline;
  font-family: var(--font-d); font-size: clamp(24px, 4.2vh, 36px); font-weight: 500; letter-spacing: -.035em;
  padding: clamp(7px, 1.2vh, 11px) 0; border-bottom: 1px solid var(--hair);
  color: var(--ink); transform: translateY(16px); opacity: 0;
  transition: transform .55s cubic-bezier(.22,1,.36,1), opacity .4s ease, color .25s ease, padding-left .3s ease;
}
.mmenu-in a:hover { color: var(--navy); padding-left: 8px; }
.mmenu-in a em { font-style: normal; font-family: var(--font); font-size: 11px; font-weight: 700; color: var(--ink-3); font-variant-numeric: tabular-nums; }
body.menu-open .mmenu-in a { transform: none; opacity: 1; }
body.menu-open .mmenu-in a:nth-child(1) { transition-delay: .05s; }
body.menu-open .mmenu-in a:nth-child(2) { transition-delay: .09s; }
body.menu-open .mmenu-in a:nth-child(3) { transition-delay: .13s; }
body.menu-open .mmenu-in a:nth-child(4) { transition-delay: .17s; }
body.menu-open .mmenu-in a:nth-child(5) { transition-delay: .21s; }
body.menu-open .mmenu-in a:nth-child(6) { transition-delay: .25s; }
body.menu-open .mmenu-in a:nth-child(7) { transition-delay: .29s; }
body.menu-open .mmenu-in a:nth-child(8) { transition-delay: .33s; }
.mmenu-foot {
  width: 100%; max-width: 560px; margin: auto auto 0; padding-top: 24px;
  display: flex; flex-wrap: wrap; align-items: center; gap: 16px;
  opacity: 0; transition: opacity .4s ease .3s;
  flex: 0 0 auto;
}
body.menu-open .mmenu-foot { opacity: 1; }
.mmenu-foot > a:not(.btn-pill) { font-size: 13px; font-weight: 600; color: var(--ink-2); }
.mmenu-foot > a:not(.btn-pill):hover { color: var(--navy); }

/* bottom "On this page" bar on small screens, toggled by the globe icon */
@media (max-width: 1279px) {
  .page-toc {
    display: block; left: 0; right: 0; top: auto; bottom: 0; transform: none; width: auto; z-index: 95;
    background: rgba(244,244,242,.92);
    -webkit-backdrop-filter: blur(14px) saturate(1.15); backdrop-filter: blur(14px) saturate(1.15);
    border-top: 1px solid var(--hair);
    padding: 10px 12px calc(10px + env(safe-area-inset-bottom));
    transition: transform .5s cubic-bezier(.22,1,.36,1), opacity .4s ease;
  }
  .page-toc.hide { transform: translateY(110%); opacity: 0; pointer-events: none; }
  .page-toc .pt-card strong { display: none; }
  .page-toc .pt-list { border-left: 0; display: flex; gap: 7px; overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
  .page-toc .pt-list::-webkit-scrollbar { display: none; }
  .page-toc .pt-list a {
    flex: 0 0 auto; padding: 8px 14px; border: 1px solid var(--hair); border-radius: 999px;
    font-size: 12px; font-weight: 600; color: var(--ink-2); white-space: nowrap; line-height: 1;
    transition: color .25s ease, background .25s ease, border-color .25s ease;
  }
  .page-toc .pt-list a.on { color: #fff; background: var(--ink); border-color: var(--ink); }
  .page-toc .pt-list a.on::before { display: none; }
  body.navy-mode .page-toc .pt-list a.on { background: var(--navy); border-color: var(--navy); }
  .page-toc.lit { background: rgba(16,17,20,.85); border-top-color: rgba(255,255,255,.14); }
  .page-toc.lit .pt-list a { color: rgba(255,255,255,.6); border-color: rgba(255,255,255,.2); }
  .page-toc.lit .pt-list a.on { color: #101114; background: #fff; border-color: #fff; }
  body.ft-lightmode .page-toc.lit { background: rgba(244,244,242,.92); border-top-color: var(--hair); }
  body.ft-lightmode .page-toc.lit .pt-list a { color: var(--ink-2); border-color: var(--hair); }
  body.ft-lightmode .page-toc.lit .pt-list a.on { color: #fff; background: var(--ink); border-color: var(--ink); }
}

/* accordions on small screens: image inside the open row + clear +/x affordance */
.bd-mimg { display: none; }
@media (max-width: 900px) {
  .feat .feat-media { display: none; }
  .feat .row button { position: relative; padding-right: 36px; box-sizing: border-box; }
  .feat .row .num { display: none; }
  .feat .row button::after {
    content: '+'; position: absolute; right: 5px; top: 50%;
    font-size: 24px; font-weight: 300; line-height: 1; color: var(--ink-3);
    transform: translateY(-50%);
    transition: transform .4s cubic-bezier(.22,1,.36,1), color .3s ease;
  }
  .feat .row.open button::after { transform: translateY(-50%) rotate(45deg); color: var(--ink); }
  body.navy-mode .feat .row.open button::after { color: var(--navy); }
  .bd-mimg { display: block; border-radius: 10px; overflow: hidden; aspect-ratio: 16 / 10; margin: 2px 0 16px; background: #e9e9e6; }
  .bd-mimg img { width: 100%; height: 100%; object-fit: cover; display: block; }
}

/* mobile: news / case studies slider above the cta pills */
@media (max-width: 760px) {
  .hero-cta .ticker { order: -1; flex: 1 1 100%; min-width: 100%; margin: 0 0 16px; gap: 12px; padding-bottom: 14px; border-bottom: 1px solid #c4c4be; }
  .hero-cta { margin-top: 14px; }
  .hero-cta .ticker .tk-track span, .hero-cta .ticker.big .tk-track span { font-size: 13px; font-weight: 600; color: var(--ink); padding-right: 18px; margin-right: 18px; border-right: 0; }
}


/* mobile accordions: horizontal title tabs, active always visible */
.acc-tabs, .acc-tabs-wrap { display: none; }
@media (max-width: 900px) {
  .acc-tabs-wrap { display: block; position: relative; margin: 0 0 16px; border-top: 1px solid var(--hair); border-bottom: 1px solid var(--hair); }
  .acc-tabs { display: flex; gap: 4px; overflow-x: auto; scrollbar-width: none; margin: 0; padding: 9px 48px 9px 0; }
  .acc-tabs::-webkit-scrollbar { display: none; }
  .acc-more { position: absolute; top: 0; right: 0; bottom: 0; width: 76px; border: 0; padding: 0 2px 0 0; background: linear-gradient(90deg, rgba(244,244,242,0), #f4f4f2 60%); display: flex; align-items: center; justify-content: flex-end; cursor: pointer; transition: opacity .3s ease; }
  body.white-mode .acc-more { background: linear-gradient(90deg, rgba(255,255,255,0), #fff 60%); }
  .acc-more span { width: 30px; height: 30px; border-radius: 999px; border: 1px solid rgba(16,17,20,.25); display: inline-flex; align-items: center; justify-content: center; font-size: 14px; color: var(--ink); }
  .acc-tabs-wrap.end .acc-more { opacity: 0; pointer-events: none; }
  .acc-tab { all: unset; -webkit-tap-highlight-color: transparent; flex: 0 0 auto; cursor: pointer; padding: 8px 14px; border-radius: 999px; font-family: var(--font); font-size: 12.5px; font-weight: 600; color: var(--ink-2); white-space: nowrap; transition: color .25s ease, background .25s ease; }
  .acc-tab.on { background: var(--ink); color: #fff; }
  body.navy-mode .acc-tab.on { background: var(--navy); }
  .feat .row button { display: none; }
  .feat .row:not(.open) { display: none; }
  .feat .row.open { border: 0; }
  .feat .row.open .bd { max-height: none !important; margin-top: 0; }
  .feat .row .bd p, .feat .row .bd .meta, .feat .row .bd .bd-btns { padding-left: 0; }
}

/* mobile popups: smaller header labels and tighter title */
@media (max-width: 640px) {
  .pm-mast { gap: 10px; }
  .pm-mast .mx-logo { width: 72px; }
  .pm-mast span { font-size: 10px; white-space: nowrap; letter-spacing: 0; }
  .pm-mast span:last-child { overflow: hidden; text-overflow: ellipsis; max-width: 38vw; }
  .pm-rule { margin: 12px 0 18px; }
  .paper-sheet h1 { font-size: 22px; line-height: 1.02; }
  .pm-dateline { margin-bottom: 18px; }
}

/* mobile: "what we do" heading wraps naturally */
@media (max-width: 640px) { .words h2 br { display: none; } }

/* mobile certifications: flush left and larger */
@media (max-width: 900px) {
  .certs .wrap { overflow: hidden; }
  .certs img { width: 124%; max-width: none; margin-left: -10.5%; }
}

/* mobile facilities: highlights already live in the popups */
@media (max-width: 900px) { .fc-facts { display: none; } }

/* mobile map: directions button under the map, left aligned */
@media (max-width: 900px) {
  .fac-map { position: relative; padding-bottom: 96px; }
  .fac-dir { position: absolute; left: 0; bottom: 44px; margin-left: 0; }
}

/* mobile band: logo above the statement */
@media (max-width: 900px) {
  .band-in { display: flex; flex-direction: column; }
  .band-in > div:last-child { order: -1; }
  .band-media.logo { min-height: 0; margin-bottom: 6px; }
  .band-media.logo img { width: min(64%, 300px); }
}

/* footer: logo flush left, mobile column fitting */
.ft .mx-logo { margin-left: -14px; }
@media (max-width: 900px) {
  .ft-cols a { font-size: 12.5px; }
  .ft-base .ft-rights { display: block; }
  .ft-base .ft-mfg { display: none; }
  .ft-base .ft-dot { display: none; }
  .ft-base .ft-loc2 { display: block; }
}


/* mobile: 03 island hero cropped evenly top + bottom */
@media (max-width: 900px) {
  .hero.mode-3 .img-media { height: auto; aspect-ratio: auto; overflow: visible; border-radius: 0; }
  .hero.mode-3 .img-media img { width: 100%; height: auto; object-fit: contain; }
}

/* mobile: tap the hero video for the fullscreen light look */
@media (max-width: 900px) {
  .hero.mode-1.vfull { position: relative; min-height: 100vh; min-height: 100dvh; display: flex; align-items: flex-end; }
  .hero.mode-1.vfull > .wrap > *:not(.hero-media) { position: relative; z-index: 1; }
  .hero.mode-1.vfull .video-media { position: absolute; top: 0; left: 0; width: 100%; height: 100% !important; max-height: none; z-index: 0; aspect-ratio: auto; border-radius: 0; box-shadow: none; margin: 0; }
  .hero.mode-1.vfull .video-media video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
  .hero.mode-1.vfull .video-media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(10,11,14,.18), rgba(10,11,14,.6) 75%); pointer-events: none; }
  .hero.mode-1.vfull h1, .hero.mode-1.vfull .rot { color: #fff; }
  .hero.mode-1.vfull .hero-meta p { color: rgba(255,255,255,.8); }
  .hero.mode-1.vfull .hero-meta p b { color: #fff; }
  .hero.mode-1.vfull .hero-meta p + p { border-top-color: rgba(255,255,255,.3); }
  .hero.mode-1.vfull .hrline.hero-line { border-top-color: rgba(255,255,255,.35); }
  .hero.mode-1.vfull .btn-pill:not(.ghost) { background: #fff; color: #101114; }
  .hero.mode-1.vfull .btn-pill.ghost { color: #fff; box-shadow: inset 0 0 0 1px rgba(255,255,255,.55); }
  .hero.mode-1.vfull .ticker, .hero.mode-1.vfull .tk-label, .hero.mode-1.vfull .tk-track span { color: #fff; }
}

/* ==================================================== */

/* index hero: stack the two hero paragraphs on small screens */
@media (max-width: 640px) {
  .hero-meta { grid-template-columns: 1fr; gap: 14px; }
  .hero-meta p:first-child { max-width: none; }
  .hero-meta p + p { border-top: 1px solid var(--hair); padding-top: 14px; }
}
