/* Malva x Xenocs microsite - every rule is scoped under .xnx so it cannot leak into the theme.
   Layout: one 1120px column; product pages = title, image|baseline split, features, specs, gallery, contact. */
.xnx{
  --x-blue:#001E60;      /* Xenocs blue (brand guide 4.2) */
  --x-grey:#878A8F;      /* Xenocs grey (brand guide 4.2) */
  --x-ink:#2B2F38;       /* body text, blue-biased charcoal */
  --x-mute:#5A5F6B;      /* secondary text */
  --x-line:#DDE1EA;      /* hairlines */
  --x-wash:#F3F5F9;      /* section wash */
  --x-tint:#E6EBF5;      /* blue tint for chips */
  --x-white:#FFFFFF;
  --x-font:'Source Sans 3','Myriad Pro',Myriad,'Segoe UI',Helvetica,Arial,sans-serif;
  font-family:var(--x-font);font-size:17px;line-height:1.6;color:var(--x-ink);background:var(--x-white);
  -webkit-font-smoothing:antialiased;
}
.xnx *,.xnx *::before,.xnx *::after{box-sizing:border-box}
.xnx img{max-width:100%;height:auto;display:block}
.xnx a{color:var(--x-blue);text-underline-offset:3px}
.xnx a:focus-visible{outline:2px solid var(--x-blue);outline-offset:3px;border-radius:2px}
.xnx .x-wrap{max-width:1120px;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.xnx .x-band{padding-block:56px}
.xnx .x-band--wash{background:var(--x-wash)}
.xnx h1,.xnx h2,.xnx h3{color:var(--x-blue);text-wrap:balance;margin:0;overflow-wrap:anywhere}
.xnx p,.xnx dd,.xnx li{overflow-wrap:anywhere}
.xnx h1{font-weight:300;font-size:clamp(2.2rem,4.5vw,3.25rem);line-height:1.1;letter-spacing:-.01em}
.xnx h2{font-weight:600;font-size:clamp(1.35rem,2.4vw,1.7rem);line-height:1.25}
.xnx h3{font-weight:600;font-size:1.2rem;line-height:1.3}
.xnx p{margin:0;max-width:68ch}
.xnx .x-eyebrow{font-size:.78rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--x-grey)}
.xnx .x-lead{font-size:1.12rem;color:var(--x-ink)}
.xnx .x-stack{display:flex;flex-direction:column;gap:16px}
.xnx .x-crumbs{font-size:.85rem;color:var(--x-mute);display:flex;flex-wrap:wrap;gap:6px;margin-bottom:20px}
.xnx .x-crumbs a{color:var(--x-mute);text-decoration:none}
.xnx .x-crumbs a:hover{color:var(--x-blue);text-decoration:underline}
.xnx .x-crumbs span[aria-hidden]{color:var(--x-line)}

/* Overview hero: logo kept on white with the 1x exclusion zone; faint Debye-ring motif on the right */
.xnx .x-hero{position:relative;overflow:hidden;border-bottom:1px solid var(--x-line)}
.xnx .x-hero::after{content:"";position:absolute;right:-180px;top:50%;width:620px;height:620px;transform:translateY(-50%);
  background:repeating-radial-gradient(circle at center,rgba(0,30,96,.07) 0 1px,transparent 1px 34px);
  -webkit-mask-image:radial-gradient(circle,#000 30%,transparent 70%);mask-image:radial-gradient(circle,#000 30%,transparent 70%);pointer-events:none}
.xnx .x-hero .x-wrap{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:48px;align-items:center;padding-block:56px}
.xnx .x-logo-zone{padding:clamp(22px,4vw,44px);background:var(--x-white);justify-self:start;width:min(100%,460px)}
.xnx .x-logo-zone img{width:100%}
.xnx .x-hero-copy{display:flex;flex-direction:column;gap:18px}

/* Product cards (order fixed by Xenocs: Xeuss Pro, Nano-inXider, XSACT Pro) */
.xnx .x-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;margin-top:32px}
.xnx .x-card{display:flex;flex-direction:column;background:var(--x-white);border:1px solid var(--x-line);text-decoration:none;color:inherit;transition:border-color .2s,transform .2s}
.xnx .x-card:hover{border-color:var(--x-blue);transform:translateY(-2px)}
.xnx .x-card figure{margin:0;aspect-ratio:4/3;max-width:100%;overflow:hidden;background:var(--x-wash)}
.xnx .x-card figure img{width:100%;height:100%;object-fit:cover}
.xnx .x-card figure img.x-contain{object-fit:contain;padding:12px;background:var(--x-white)}
.xnx .x-card-body{display:flex;flex-direction:column;gap:8px;padding:20px 22px 22px;flex:1}
.xnx .x-card-body p{color:var(--x-mute);font-size:.98rem}
.xnx .x-more{margin-top:auto;padding-top:10px;font-weight:600;font-size:.92rem;color:var(--x-blue)}
.xnx .x-more::after{content:" \2192"}

/* Product page head */
.xnx .x-prod-head{padding-block:40px 8px}
.xnx .x-split{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:44px;align-items:center;margin-top:28px}
.xnx .x-split figure{margin:0}
.xnx .x-split figure img{width:100%}
.xnx .x-split--soft figure{background:var(--x-white)}
.xnx .x-split .x-stack h2{font-size:clamp(1.3rem,2.2vw,1.6rem)}

/* Features */
.xnx .x-feats{list-style:none;margin:24px 0 0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 36px}
.xnx .x-feats li{padding-top:16px;border-top:2px solid var(--x-blue);min-width:0}
.xnx .x-feats strong{display:block;color:var(--x-blue);font-weight:600;margin-bottom:4px}
.xnx .x-feats span{color:var(--x-mute);font-size:.98rem}
.xnx .x-feats--simple li{padding-top:12px;border-top:1px solid var(--x-line)}
.xnx .x-feats--simple strong{margin:0}

/* Spec sheet */
.xnx .x-specs{margin:24px 0 0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 40px}
.xnx .x-specs div{display:grid;grid-template-columns:minmax(0,11rem) minmax(0,1fr);gap:16px;padding-block:12px;border-bottom:1px solid var(--x-line)}
.xnx .x-specs dt{font-size:.82rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--x-grey);padding-top:2px}
.xnx .x-specs dd{margin:0;font-variant-numeric:tabular-nums;min-width:0}
.xnx .x-note{font-size:.85rem;color:var(--x-mute);margin-top:14px}

/* Gallery */
.xnx .x-gallery{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin-top:24px}
.xnx .x-gallery figure{margin:0;background:var(--x-wash)}
.xnx .x-gallery img{width:100%;aspect-ratio:16/10;object-fit:cover}

/* Contact block */
.xnx .x-contact{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:40px;align-items:start;background:var(--x-blue);color:#fff;padding:40px clamp(20px,4vw,48px)}
.xnx .x-contact h2{color:#fff}
.xnx .x-contact p{color:#D6DCEA}
.xnx .x-contact dl{margin:0;display:grid;gap:12px}
.xnx .x-contact dt{font-size:.75rem;letter-spacing:.12em;text-transform:uppercase;color:#9FAACA}
.xnx .x-contact dd{margin:0;font-size:1.05rem;user-select:all}
.xnx .x-contact a{color:#fff}
.xnx .x-btns{display:flex;flex-wrap:wrap;gap:12px;margin-top:20px}
.xnx .x-btn{display:inline-block;padding:11px 20px;font-weight:600;font-size:.95rem;text-decoration:none;border:1.5px solid var(--x-blue);background:var(--x-blue);color:#fff}
.xnx .x-btn:hover{background:#00143F}
.xnx .x-btn--ghost{background:transparent;color:var(--x-blue)}
.xnx .x-btn--ghost:hover{background:var(--x-tint)}
.xnx .x-contact .x-btn{background:#fff;color:var(--x-blue);border-color:#fff}
.xnx .x-contact .x-btn:hover{background:var(--x-tint)}
.xnx .x-contact .x-btn--ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.6)}
.xnx .x-contact .x-btn--ghost:hover{background:rgba(255,255,255,.1)}

/* External link line required by the guide */
.xnx .x-ext{margin-top:28px;padding:16px 20px;background:var(--x-wash);border-left:3px solid var(--x-blue);font-size:.98rem;max-width:none}
.xnx .x-ext a{font-weight:600;word-break:break-word}

/* Applications */
.xnx .x-apps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;margin-top:28px}
.xnx .x-app{display:flex;flex-direction:column;gap:6px;padding:20px;border:1px solid var(--x-line);text-decoration:none;color:inherit;background:var(--x-white)}
.xnx .x-app:hover{border-color:var(--x-blue)}
.xnx .x-app strong{color:var(--x-blue);font-weight:600}
.xnx .x-app span{font-size:.92rem;color:var(--x-mute)}

/* Malva service row */
.xnx .x-service{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:28px;margin-top:28px}
.xnx .x-service div{display:flex;flex-direction:column;gap:6px}
.xnx .x-service strong{color:var(--x-blue);font-weight:600}
.xnx .x-service span{font-size:.95rem;color:var(--x-mute)}

/* Sibling product switcher */
.xnx .x-siblings{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:20px}
.xnx .x-sib{display:flex;align-items:center;gap:14px;padding:12px;border:1px solid var(--x-line);text-decoration:none;color:inherit}
.xnx .x-sib:hover{border-color:var(--x-blue)}
.xnx .x-sib[aria-current]{background:var(--x-wash);border-color:var(--x-wash);pointer-events:none}
.xnx .x-sib img{width:72px;height:54px;object-fit:cover;flex:none;background:var(--x-white)}
.xnx .x-sib span{display:flex;flex-direction:column;min-width:0}
.xnx .x-sib b{color:var(--x-blue);font-weight:600}
.xnx .x-sib small{color:var(--x-mute);font-size:.82rem}

/* Structure elucidation page: Xenocs block + instrument lines */
.xnx .x-se-band{display:grid;grid-template-columns:minmax(0,260px) minmax(0,1fr);gap:40px;align-items:center}
.xnx .x-se-band .x-logo-zone{padding:24px;width:100%}
.xnx .x-instr{margin-top:14px;font-size:.95rem;color:var(--x-mute);display:flex;flex-wrap:wrap;gap:6px 14px;align-items:baseline}
.xnx .x-instr b{font-size:.75rem;letter-spacing:.1em;text-transform:uppercase;color:var(--x-grey);font-weight:600}
.xnx .x-instr a{font-weight:600}
.xnx .x-se-sec{padding-block:36px;border-top:1px solid var(--x-line)}
.xnx .x-se-sec h2{margin-bottom:14px}
.xnx .x-se-sec p+p{margin-top:14px}

@media (max-width:900px){
  .xnx .x-hero .x-wrap,.xnx .x-split,.xnx .x-contact,.xnx .x-se-band{grid-template-columns:minmax(0,1fr);gap:28px}
  .xnx .x-cards,.xnx .x-siblings{grid-template-columns:minmax(0,1fr)}
  .xnx .x-apps,.xnx .x-service{grid-template-columns:repeat(2,minmax(0,1fr))}
  .xnx .x-specs{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:560px){
  .xnx{font-size:16px}
  .xnx .x-band{padding-block:40px}
  .xnx .x-feats,.xnx .x-gallery,.xnx .x-apps,.xnx .x-service{grid-template-columns:minmax(0,1fr)}
  .xnx .x-specs div{grid-template-columns:minmax(0,1fr);gap:2px}
  .xnx .x-hero::after{right:-320px;opacity:.6}
}
@media (prefers-reduced-motion:reduce){.xnx .x-card{transition:none}.xnx .x-card:hover{transform:none}}
