/* Design iterations 13–16 (2026-09-26): dossier, dossier cards, science,
   contact and careers. One stylesheet, scoped under body.xd, so nothing here
   reaches the shop, the product campaigns or the private dashboards. Measures
   resolve to the 1280px artboard and scale from there. */

.xd{
  --xd-ink:#121314;
  --xd-red:#b3271a;
  --xd-blue:#285f86;
  --xd-paper:#fbfbfa;
  --xd-stone:#f4f4f2;
  --xd-rule:rgba(18,19,20,.08);
  --xd-t40:rgba(18,19,20,.4);
  --xd-t50:rgba(18,19,20,.5);
  --xd-t60:rgba(18,19,20,.6);
  --xd-t72:rgba(18,19,20,.72);
  --xd-pad:clamp(20px,4.375vw,72px);
  --display:'Michroma',var(--sans);
  background:var(--xd-paper);
  color:var(--xd-ink);
}
.xd .frame{background:var(--xd-paper)}
.xd main{overflow:clip}
.xd a:focus-visible,.xd button:focus-visible,.xd input:focus-visible,.xd textarea:focus-visible{outline:3px solid var(--xd-red);outline-offset:3px}

.xd-kicker{margin:0 0 22px;font:500 10px/1.3 var(--mono);letter-spacing:.3em;color:var(--xd-t50)}
.xd-kicker--red{color:var(--xd-red)}
.xd-label{font:400 9px/1.4 var(--mono);letter-spacing:.24em;color:var(--xd-t50)}
.xd-lede{margin:0;font:400 clamp(17px,1.48vw,19px)/1.55 var(--sans);color:var(--xd-t60);text-wrap:pretty}
.xd-visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.xd-btn{
  display:inline-flex;align-items:center;justify-content:center;
  padding:14px 26px;border-radius:999px;border:1px solid var(--xd-ink);
  background:var(--xd-ink);color:#fff;font:500 14px/1 var(--sans);cursor:pointer;
  transition:opacity .18s ease,transform .18s ease;
}
.xd-btn:hover{opacity:.88;color:#fff;transform:translateY(-1px)}
.xd-btn--ghost{background:transparent;color:var(--xd-ink)}
.xd-btn--ghost:hover{background:var(--xd-ink);color:#fff}
.xd-btn--light{background:var(--xd-paper);border-color:var(--xd-paper);color:var(--xd-ink)}
.xd-btn--light:hover{color:var(--xd-ink)}
.xd-btn--outline-light{background:transparent;border-color:rgba(251,251,250,.4);color:var(--xd-paper)}
.xd-btn--outline-light:hover{background:var(--xd-paper);color:var(--xd-ink)}
.xd-num{font:400 clamp(30px,3.44vw,46px)/1 var(--display);color:var(--xd-red)}

/* ================================================================ /dossier */
.xd-dossier__hero{
  display:flex;flex-direction:column;align-items:center;text-align:center;
  padding:clamp(80px,9.4vw,130px) var(--xd-pad) 56px;background:var(--xd-stone);
}
.xd-dossier__hero h1{margin:0 0 20px;font:600 clamp(40px,5.6vw,78px)/1.02 var(--sans);letter-spacing:-.05em;text-wrap:balance}
.xd-dossier__hero h1 span{color:var(--xd-t40)}
.xd-dossier__hero .xd-lede{max-width:580px;margin-bottom:48px}
.xd-search{
  display:flex;align-items:center;width:min(640px,100%);
  padding:6px 6px 6px 30px;background:#fff;border:1px solid rgba(18,19,20,.16);border-radius:999px;
  box-shadow:0 10px 30px rgba(18,19,20,.06);
}
.xd-search:focus-within{border-color:var(--xd-ink)}
.xd-search input{
  flex:1;min-width:0;border:0;background:transparent;outline:none;
  font:400 clamp(15px,1.56vw,20px)/1 var(--display);letter-spacing:.06em;color:var(--xd-ink);
}
.xd-search input::placeholder{color:rgba(18,19,20,.3)}
.xd-search__count{padding:0 16px;font:400 9.5px/1 var(--mono);letter-spacing:.14em;color:var(--xd-t40);white-space:nowrap}
.xd-search button{
  flex:none;padding:15px 28px;border:0;border-radius:999px;background:var(--xd-ink);color:#fff;
  font:500 14px/1 var(--sans);cursor:pointer;
}
.xd-search button:hover{opacity:.88}
/* Button inline loader: the label keeps the button's width while hidden, and
   the site's three-triangle loader sits centred on it in white. */
.xd-search button{position:relative}
.xd-search button.is-loading{cursor:progress;opacity:1}
.xd-search button.is-loading .xd-search__label{visibility:hidden}
.xd-search__loader{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%)}
.xd-search button.is-loading .xd-search__loader{display:flex}
.xd-search__loader i:nth-child(odd){border-top-color:#fff!important}
.xd-search__loader i:nth-child(2){border-bottom-color:#fff!important}
.xd-search__hint{margin:16px 0 0;font:400 9.5px/1.4 var(--mono);letter-spacing:.18em;color:var(--xd-t50)}
.xd-result{width:min(640px,100%);margin-top:32px;min-height:118px;text-align:left}
.xd-result [hidden]{display:none!important}
.xd-result__loading{margin:0;display:flex;align-items:center;gap:10px;font:500 9.5px/1 var(--mono);letter-spacing:.22em;color:var(--xd-t50)}
.xd-result__found{
  display:grid;grid-template-columns:110px 1fr auto;align-items:center;gap:22px;
  padding:12px 24px 12px 12px;background:#fff;border:1px solid rgba(18,19,20,.12);border-radius:18px;
  transition:border-color .18s ease,transform .18s ease;
}
.xd-result__found:hover{border-color:var(--xd-ink);transform:translateY(-1px)}
.xd-result__thumb{display:block;height:94px;border-radius:10px;overflow:hidden;background:#faf9f6}
.xd-result__thumb img{width:100%;height:100%;object-fit:contain;padding:6px;display:block}
.xd-result__copy{display:flex;flex-direction:column;gap:6px}
.xd-result__status{font:400 9px/1 var(--mono);letter-spacing:.22em;color:#2f7a4f}
.xd-result__sku{font:400 22px/1.1 var(--display)}
.xd-result__name{font:400 14px/1.3 var(--sans);color:var(--xd-t60)}
.xd-result__open{font:500 15px/1 var(--sans)}
.xd-result__note{display:flex;flex-direction:column;gap:6px;padding:22px 26px;background:#fff;border:1px solid rgba(18,19,20,.14);border-radius:18px}
.xd-result__note span{font:500 9.5px/1 var(--mono);letter-spacing:.22em;color:var(--xd-t60)}
.xd-result__note p{margin:0;font:400 15px/1.5 var(--sans);color:var(--xd-t72)}
.xd-result__note--format{background:#fbf3f1;border-color:rgba(179,39,26,.3)}
.xd-result__note--format span{color:var(--xd-red)}

.xd-dossier__facts{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--xd-rule);border-bottom:1px solid var(--xd-rule)}
.xd-dossier__facts > div{display:flex;flex-direction:column;gap:14px;padding:44px clamp(24px,3.75vw,56px);border-right:1px solid var(--xd-rule)}
.xd-dossier__facts > div:last-child{border-right:0}
.xd-dossier__facts strong{font:600 22px/1.25 var(--sans);letter-spacing:-.02em}
.xd-dossier__facts small{font:400 13px/1.4 var(--sans);color:rgba(18,19,20,.55)}
.xd-count{font:400 36px/1 var(--display)!important;letter-spacing:0!important}
.xd-serial-shape{display:flex;gap:6px;font:400 17px/1 var(--display)}
.xd-serial-shape i{font-style:normal;color:rgba(18,19,20,.3)}
.xd-serial-shape b{font-weight:400;color:var(--xd-red)}
.xd-serial-parts{display:flex;gap:18px;font:400 9px/1 var(--mono);letter-spacing:.16em;color:var(--xd-t50)}

@media (max-width:820px){
  .xd-dossier__facts{grid-template-columns:1fr}
  .xd-dossier__facts > div{border-right:0;border-bottom:1px solid var(--xd-rule)}
  .xd-dossier__facts > div:last-child{border-bottom:0}
}
@media (max-width:560px){
  .xd-search{flex-wrap:wrap;padding:8px;border-radius:24px;gap:8px}
  .xd-search input{flex:1 1 100%;padding:12px 14px 4px;font-size:15px}
  .xd-search__count{padding:0 14px}
  .xd-search button{margin-left:auto}
  .xd-result__found{grid-template-columns:76px 1fr;gap:14px;padding-right:16px}
  .xd-result__thumb{height:72px}
  .xd-result__open{grid-column:2}
}
@media (prefers-reduced-motion:reduce){
  .xd-btn,.xd-result__found{transition:none}
  .xd-btn:hover,.xd-result__found:hover{transform:none}
}

/* ========================================================= dossier cards */
.xd-card{--xd-acc:var(--xd-red);--xd-tint:#f1ece4}
.xd-card--hya{--xd-acc:var(--xd-blue);--xd-tint:#eaf0f5}
.xd-card__bar{
  display:flex;align-items:center;justify-content:space-between;height:56px;padding:0 var(--xd-pad);
  border-bottom:1px solid var(--xd-rule);font:400 9.5px/1 var(--mono);letter-spacing:.2em;color:var(--xd-t60);
}
.xd-card__bar a{color:var(--xd-t60)}
.xd-card__bar a:hover{color:var(--xd-ink)}
.xd-card__hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(340px,40.6%);min-height:clamp(520px,48.4vw,720px);border-bottom:1px solid var(--xd-rule)}
.xd-card__intro{display:flex;flex-direction:column;justify-content:space-between;gap:40px;padding:clamp(48px,5.6vw,80px) var(--xd-pad) clamp(40px,4.4vw,60px)}
.xd-card__kicker{margin:0 0 26px;font:500 10px/1.3 var(--mono);letter-spacing:.3em;color:var(--xd-acc)}
.xd-card__intro h1{margin:0 0 28px;font:400 clamp(38px,4.69vw,66px)/1.25 var(--display);letter-spacing:-.02em}
.xd-card__intro h1 span,.xd-card__intro h1 b{display:block;font-weight:400}
.xd-card__intro h1 b{color:var(--xd-acc)}
.xd-card__desc{margin:0;max-width:480px;font:400 clamp(17px,1.56vw,20px)/1.5 var(--sans);color:rgba(18,19,20,.66);text-wrap:pretty}
.xd-safety{
  display:inline-flex;align-items:center;gap:16px;align-self:flex-start;margin:0;
  padding:12px 22px 12px 12px;border:1px solid rgba(47,122,79,.3);border-radius:999px;background:#eef6f0;
}
.xd-safety > span:first-child{
  width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  background:#2f7a4f;color:#fff;font:400 14px/1 var(--display);
}
.xd-safety > span:last-child{display:flex;flex-direction:column;gap:2px}
.xd-safety small{font:400 8.5px/1 var(--mono);letter-spacing:.22em;color:rgba(18,19,20,.55)}
.xd-safety b{font:600 15px/1.2 var(--sans);color:#245f3d}
.xd-card__photo{position:relative;margin:0;overflow:hidden;background:var(--xd-tint)}
.xd-card__photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}

.xd-card__specs{margin:0;display:grid;grid-template-columns:repeat(5,1fr);border-bottom:1px solid var(--xd-rule)}
.xd-card__specs > div{display:flex;flex-direction:column;gap:10px;padding:30px clamp(18px,2.2vw,28px) 32px;border-right:1px solid var(--xd-rule)}
.xd-card__specs > div:last-child{border-right:0}
.xd-card__specs dt{order:1;font:400 8.5px/1.4 var(--mono);letter-spacing:.22em;color:var(--xd-t50)}
.xd-card__specs dd{order:2;margin:0;font:600 18px/1.25 var(--sans);letter-spacing:-.015em}
.xd-card__specs small{order:3;font:400 8.5px/1.5 var(--mono);letter-spacing:.14em;color:rgba(18,19,20,.45)}

.xd-card__section{
  display:grid;grid-template-columns:minmax(160px,240px) minmax(0,1fr);gap:clamp(28px,3.75vw,48px);
  padding:clamp(64px,6.9vw,96px) var(--xd-pad);border-bottom:1px solid var(--xd-rule);
}
.xd-card__index{display:flex;flex-direction:column;gap:10px}
.xd-card__n{font:400 30px/1 var(--display);color:var(--xd-acc)}
.xd-card__index .xd-label{font-weight:500;font-size:9.5px;color:rgba(18,19,20,.55)}
.xd-card__body{display:flex;flex-direction:column;gap:22px}
.xd-card__body h2{margin:0;max-width:700px;font:600 clamp(32px,3.44vw,46px)/1.06 var(--sans);letter-spacing:-.04em;text-wrap:balance}
.xd-card__body > p{margin:0;max-width:640px;font:400 17px/1.65 var(--sans);color:rgba(18,19,20,.66);text-wrap:pretty}

.xd-tiles{margin:14px 0 0;padding:0;list-style:none;display:grid;gap:14px}
.xd-tiles--3{grid-template-columns:repeat(3,1fr)}
.xd-tiles--2{grid-template-columns:repeat(2,1fr)}
.xd-tile{display:flex;flex-direction:column;overflow:hidden;background:#fff;border:1px solid var(--xd-rule);border-radius:18px}
.xd-tile__art{display:flex;align-items:center;justify-content:center;height:220px;padding:20px;background:var(--xd-tint)}
.xd-tile__art img{max-width:100%;max-height:100%;object-fit:contain;mix-blend-mode:multiply;display:block}
.xd-tile__body{display:flex;flex-direction:column;gap:8px;padding:22px 24px 26px}
.xd-tile__body small{font:500 9px/1.2 var(--mono);letter-spacing:.22em;color:var(--xd-acc)}
.xd-tile__body strong{font:600 19px/1.25 var(--sans);letter-spacing:-.02em}
.xd-tile__body > span{font:400 14.5px/1.55 var(--sans);color:rgba(18,19,20,.64)}
.xd-tile__body em{font:400 9px/1.6 var(--mono);letter-spacing:.14em;color:rgba(18,19,20,.55);font-style:normal;white-space:pre-wrap}

.xd-card__notice{
  display:grid;grid-template-columns:minmax(160px,240px) 1fr;gap:40px;align-items:start;
  margin:clamp(32px,4.4vw,56px) var(--xd-pad);padding:36px 40px;border-radius:20px;background:var(--xd-ink);color:var(--xd-paper);
}
.xd-card__notice span{font:500 10px/1.4 var(--mono);letter-spacing:.26em}
.xd-card__notice p{margin:0;font:400 15px/1.65 var(--sans);color:rgba(251,251,250,.78)}

@media (max-width:980px){
  .xd-card__specs{grid-template-columns:repeat(2,1fr)}
  .xd-card__specs > div{border-bottom:1px solid var(--xd-rule)}
  .xd-card__specs > div:nth-child(2n){border-right:0}
  .xd-tiles--3{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:820px){
  .xd-card__hero{grid-template-columns:1fr}
  .xd-card__photo{order:-1;aspect-ratio:4/3}
  .xd-card__section{grid-template-columns:1fr}
  .xd-card__notice{grid-template-columns:1fr;gap:14px;padding:28px}
}
@media (max-width:560px){
  .xd-tiles--3,.xd-tiles--2{grid-template-columns:1fr}
  .xd-card__specs{grid-template-columns:1fr}
  .xd-card__specs > div{border-right:0}
}

/* ================================================================ /science */
.xd-sci__hero{position:relative;height:clamp(540px,56.25vw,820px);overflow:hidden;background:#e9e2d6}
.xd-sci__hero > img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.xd-sci__hero::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(90deg,rgba(251,251,250,.94) 0%,rgba(251,251,250,.8) 34%,rgba(251,251,250,0) 60%);
}
.xd-sci__hero-copy{position:relative;z-index:1;height:100%;max-width:760px;display:flex;flex-direction:column;justify-content:center;padding:0 var(--xd-pad)}
.xd-sci__hero h1{margin:0 0 22px;font:600 clamp(42px,5.3vw,74px)/1.02 var(--sans);letter-spacing:-.05em}
.xd-sci__hero h1 span{color:rgba(18,19,20,.45)}
.xd-sci__hero .xd-lede{max-width:440px;color:var(--xd-t72)}

.xd-sci__principles{display:grid;grid-template-columns:repeat(3,1fr);border-bottom:1px solid var(--xd-rule)}
.xd-sci__principles article{display:flex;flex-direction:column;gap:14px;padding:clamp(48px,5vw,72px) clamp(24px,3.75vw,56px) clamp(56px,5.6vw,80px);border-right:1px solid var(--xd-rule)}
.xd-sci__principles article:last-child{border-right:0}
.xd-sci__principles .xd-num{font-size:clamp(32px,3.125vw,44px)}
.xd-sci__k{font-weight:500;font-size:9.5px;letter-spacing:.26em;margin-bottom:18px}
.xd-sci__principles h2{margin:0;font:600 clamp(24px,2.34vw,32px)/1.1 var(--sans);letter-spacing:-.035em}
.xd-sci__principles p{margin:0;font:400 16px/1.65 var(--sans);color:rgba(18,19,20,.64);text-wrap:pretty}

.xd-sci__scientias{display:grid;grid-template-columns:1fr 1fr;background:var(--xd-ink);color:var(--xd-paper)}
.xd-sci__scientias-copy{padding:clamp(64px,7.5vw,104px) var(--xd-pad);border-right:1px solid rgba(255,255,255,.1)}
.xd-sci__scientias .xd-kicker{color:rgba(251,251,250,.55);margin-bottom:28px}
.xd-sci__scientias h2{margin:0 0 28px;font:400 clamp(40px,4.4vw,60px)/1.05 var(--display);letter-spacing:-.02em}
.xd-sci__scientias-copy > p:not(.xd-kicker){margin:0 0 40px;max-width:460px;font:400 18px/1.65 var(--sans);color:rgba(251,251,250,.75);text-wrap:pretty}
.xd-actions{display:flex;flex-wrap:wrap;gap:12px}
.xd-sci__path{margin:0;padding:clamp(64px,7.5vw,104px) var(--xd-pad);list-style:none;display:flex;flex-direction:column;justify-content:center}
.xd-sci__path li{display:grid;grid-template-columns:64px 1fr;gap:20px;align-items:baseline;padding:28px 0;border-top:1px solid rgba(255,255,255,.14)}
.xd-sci__path li:last-child{border-bottom:1px solid rgba(255,255,255,.14)}
.xd-sci__path li > span{font:400 18px/1 var(--display);color:rgba(251,251,250,.45)}
.xd-sci__path strong{display:block;margin-bottom:6px;font:600 24px/1.2 var(--sans);letter-spacing:-.025em}
.xd-sci__path p{margin:0;font:400 15px/1.5 var(--sans);color:rgba(251,251,250,.65)}

.xd-sci__photos{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:12px}
.xd-sci__photos figure{margin:0;height:clamp(360px,40.6vw,600px);overflow:hidden;background:#ecebe8}
.xd-sci__photos img{width:100%;height:100%;object-fit:cover;display:block}
.xd-sci__close{display:flex;flex-direction:column;align-items:center;text-align:center;padding:clamp(80px,8.6vw,120px) var(--xd-pad) clamp(72px,7.8vw,110px)}
.xd-sci__close h2{margin:0 0 20px;font:600 clamp(36px,4.4vw,60px)/1.05 var(--sans);letter-spacing:-.045em;text-wrap:balance}
.xd-sci__close .xd-lede{max-width:560px}

@media (max-width:820px){
  .xd-sci__hero{height:auto;display:flex;flex-direction:column}
  .xd-sci__hero > img{position:static;height:auto;aspect-ratio:3/2}
  .xd-sci__hero::after{display:none}
  .xd-sci__hero-copy{height:auto;max-width:none;padding:36px var(--xd-pad) 48px;background:var(--xd-paper)}
  .xd-sci__principles{grid-template-columns:1fr}
  .xd-sci__principles article{border-right:0;border-bottom:1px solid var(--xd-rule)}
  .xd-sci__scientias{grid-template-columns:1fr}
  .xd-sci__scientias-copy{border-right:0;border-bottom:1px solid rgba(255,255,255,.1)}
  .xd-sci__photos{grid-template-columns:1fr}
  .xd-sci__photos figure{height:auto;aspect-ratio:4/3}
}

/* ================================================================ /contact */
.xd-contact__hero{display:flex;flex-direction:column;align-items:center;text-align:center;padding:clamp(80px,8.6vw,120px) var(--xd-pad) 0;background:var(--xd-stone)}
.xd-contact__hero h1{margin:0 0 20px;font:600 clamp(44px,5.6vw,78px)/1.02 var(--sans);letter-spacing:-.05em}
.xd-contact__hero .xd-lede{max-width:560px;margin-bottom:72px}
.xd-vip-card{
  position:relative;overflow:hidden;width:min(640px,86vw);aspect-ratio:640/370;margin-bottom:-120px;
  display:flex;flex-direction:column;justify-content:space-between;padding:clamp(22px,3.4vw,40px) clamp(24px,3.75vw,44px);
  background:#fdfdfb;border:1px solid rgba(18,19,20,.06);border-radius:14px;text-align:left;transform:rotate(-4deg);
  box-shadow:0 40px 80px -20px rgba(18,19,20,.28),0 2px 6px rgba(18,19,20,.08);
}
.xd-vip-card::after{
  content:"";position:absolute;right:-70px;bottom:-90px;width:300px;height:300px;pointer-events:none;opacity:.12;
  background-color:var(--xd-red);
  -webkit-mask:url("../assets/xilo-radial-x-outline.svg") center/contain no-repeat;
  mask:url("../assets/xilo-radial-x-outline.svg") center/contain no-repeat;
}
.xd-vip-card__row{position:relative;z-index:1;display:flex;justify-content:space-between;align-items:flex-start;gap:16px}
.xd-vip-card__row img{height:21px;width:auto;display:block}
.xd-vip-card__row span{font:400 8.5px/1.8 var(--mono);letter-spacing:.24em;color:var(--xd-t50)}
.xd-vip-card__row--foot{align-items:flex-end;color:rgba(18,19,20,.55)}
.xd-vip-card__row--foot span{letter-spacing:.2em}
.xd-vip-card__row--foot span:last-child{text-align:right}
.xd-vip-card__title{position:relative;z-index:1}
.xd-vip-card__title span{display:block;margin-bottom:14px;font:400 clamp(18px,2.34vw,30px)/1.1 var(--display);letter-spacing:-.01em}
.xd-vip-card__title i{display:block;width:56px;height:1px;background:var(--xd-red)}

.xd-contact__steps{margin:0;padding:190px var(--xd-pad) 88px;list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.xd-contact__steps li{display:flex;flex-direction:column;gap:12px;padding:28px 40px 0 0;border-top:1px solid rgba(18,19,20,.14)}
.xd-contact__steps li > span{font:400 18px/1 var(--display);color:var(--xd-red)}
.xd-contact__steps strong{font:600 26px/1.2 var(--sans);letter-spacing:-.03em}
.xd-contact__steps p{margin:0;font:400 16px/1.6 var(--sans);color:rgba(18,19,20,.62);text-wrap:pretty}

.xd-contact__panels{display:grid;grid-template-columns:minmax(0,1fr) minmax(300px,420px);gap:12px;margin:0 var(--xd-pad) 88px}
.xd-contact__closed{display:flex;flex-direction:column;align-items:flex-start;gap:18px;padding:clamp(36px,4.4vw,56px) clamp(28px,4vw,52px);background:var(--xd-stone);border-radius:20px}
.xd-dot-label{margin:0;display:flex;align-items:center;gap:12px;font:500 9.5px/1 var(--mono);letter-spacing:.26em;color:var(--xd-t60)}
.xd-dot-label i{width:8px;height:8px;border-radius:50%;background:var(--xd-red)}
.xd-contact__closed h2{margin:0;font:600 clamp(34px,3.75vw,50px)/1.05 var(--sans);letter-spacing:-.045em}
.xd-contact__closed > p:not(.xd-dot-label){margin:0;max-width:520px;font:400 17px/1.65 var(--sans);color:rgba(18,19,20,.64);text-wrap:pretty}
.xd-contact__closed .xd-btn{margin-top:10px}
.xd-contact__note{display:flex;flex-direction:column;gap:16px;padding:44px 40px;background:var(--xd-ink);color:var(--xd-paper);border-radius:20px}
.xd-contact__note span{font:500 9.5px/1 var(--mono);letter-spacing:.26em;color:rgba(251,251,250,.55)}
.xd-contact__note strong{font:600 22px/1.3 var(--sans);letter-spacing:-.02em}
.xd-contact__note p{margin:0;font:400 15px/1.65 var(--sans);color:rgba(251,251,250,.72)}

@media (max-width:820px){
  .xd-contact__hero .xd-lede{margin-bottom:48px}
  .xd-vip-card{margin-bottom:-60px}
  .xd-contact__steps{grid-template-columns:1fr;padding-top:120px;gap:28px}
  .xd-contact__panels{grid-template-columns:1fr}
}

/* ================================================================ /careers */
.xd-careers__hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(360px,43.75%);min-height:clamp(560px,59.4vw,860px);border-bottom:1px solid var(--xd-rule)}
.xd-careers__copy{display:flex;flex-direction:column;justify-content:center;padding:56px var(--xd-pad)}
.xd-careers__copy h1{margin:0 0 22px;font:600 clamp(42px,5.3vw,74px)/1.02 var(--sans);letter-spacing:-.05em}
.xd-careers__copy h1 span{color:rgba(18,19,20,.45)}
.xd-careers__copy .xd-lede{max-width:470px;margin-bottom:40px;color:var(--xd-t72)}
.xd-careers .xd-btn--ghost{border-color:rgba(18,19,20,.2)}
.xd-careers__photo{margin:0;overflow:hidden;background:#ecebe6}
.xd-careers__photo img{width:100%;height:100%;object-fit:cover;display:block}

.xd-roles{display:grid;grid-template-columns:1fr 1fr}
.xd-role{display:flex;flex-direction:column;gap:18px;padding:clamp(56px,5.6vw,80px) var(--xd-pad) clamp(64px,6.25vw,88px);border-right:1px solid var(--xd-rule);background:var(--xd-paper)}
.xd-role--formulation{background:var(--xd-stone);border-right:0}
.xd-role__top{display:flex;justify-content:space-between;align-items:baseline;gap:16px}
.xd-role__top .xd-num{font-size:clamp(32px,3.125vw,42px)}
.xd-role__top .xd-label{font-weight:500;font-size:9.5px;letter-spacing:.26em}
.xd-role h2{margin:6px 0 0;font:600 clamp(32px,3.125vw,42px)/1.05 var(--sans);letter-spacing:-.045em}
.xd-role > p{margin:0;max-width:480px;font:400 16.5px/1.65 var(--sans);color:rgba(18,19,20,.66);text-wrap:pretty}
.xd-role__look{margin-top:14px;font-weight:500}
.xd-role ul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:8px}
.xd-role li{position:relative;padding-left:24px;font:400 15px/1.5 var(--sans);color:var(--xd-t72)}
.xd-role li::before{content:"\2014";position:absolute;left:0;color:var(--xd-red)}
.xd-role .xd-btn{align-self:flex-start;margin-top:18px}

.xd-apply{display:grid;grid-template-columns:minmax(280px,420px) minmax(0,1fr);gap:clamp(40px,5.6vw,80px);padding:clamp(64px,7.5vw,104px) var(--xd-pad);background:var(--xd-ink);color:var(--xd-paper);scroll-margin-top:20px}
.xd-apply__intro .xd-kicker{color:rgba(251,251,250,.55);margin-bottom:28px}
.xd-apply__intro h2{margin:0 0 24px;font:400 clamp(32px,3.44vw,46px)/1.08 var(--display);letter-spacing:-.02em}
.xd-apply__intro > p:not(.xd-kicker){margin:0;font:400 16px/1.65 var(--sans);color:rgba(251,251,250,.72);text-wrap:pretty}
.xd-apply__form{display:flex;flex-direction:column;gap:14px}
.xd-apply__form[hidden],.xd-apply__done[hidden]{display:none}
.xd-apply__roles{display:flex;gap:4px;align-self:flex-start;padding:4px;background:rgba(251,251,250,.08);border-radius:999px}
.xd-apply__roles label{position:relative;cursor:pointer}
.xd-apply__roles input{position:absolute;opacity:0;inset:0;cursor:pointer}
.xd-apply__roles span{display:block;padding:10px 22px;border-radius:999px;font:500 13.5px/1 var(--sans);color:rgba(251,251,250,.7);transition:background .15s ease,color .15s ease}
.xd-apply__roles input:checked + span{background:var(--xd-paper);color:var(--xd-ink)}
.xd-apply__roles input:focus-visible + span{outline:3px solid var(--xd-red);outline-offset:2px}
.xd-apply__grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.xd-dfield{display:flex;flex-direction:column;gap:8px;padding:16px 20px;border:1px solid rgba(251,251,250,.18);border-radius:14px;cursor:text}
.xd-dfield:focus-within{border-color:rgba(251,251,250,.6)}
.xd-dfield span{font:400 8.5px/1 var(--mono);letter-spacing:.24em;color:rgba(251,251,250,.55)}
.xd-dfield input,.xd-dfield textarea{border:0;outline:none;padding:0;background:transparent;color:var(--xd-paper);font:500 16px/1.4 var(--sans)}
.xd-dfield textarea{resize:vertical;min-height:72px;font-weight:400;font-size:15px;line-height:1.55}
.xd-dfield input::placeholder,.xd-dfield textarea::placeholder{color:rgba(251,251,250,.35)}
.xd .xd-dfield input:focus-visible,.xd .xd-dfield textarea:focus-visible{outline:none}
.xd-apply__trap{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
.xd-apply__foot{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:6px}
.xd-apply__hint{font:400 9px/1.5 var(--mono);letter-spacing:.2em;color:rgba(251,251,250,.55)}
.xd-apply__hint.is-error{color:#f08a7e}
.xd-apply__send{flex:none;padding:15px 30px;border:0;border-radius:999px;cursor:pointer;background:rgba(251,251,250,.4);color:var(--xd-ink);font:500 14px/1 var(--sans);transition:background .18s ease}
.xd-apply__form.is-ready .xd-apply__send{background:var(--xd-paper)}
.xd-apply__send:disabled{cursor:progress;opacity:.7}
.xd-apply__done{display:flex;flex-direction:column;justify-content:center;gap:16px;padding:clamp(28px,3.75vw,48px);border:1px solid rgba(251,251,250,.18);border-radius:20px;outline:none}
.xd-apply__received{margin:0;display:flex;align-items:center;gap:10px;font:500 9.5px/1.4 var(--mono);letter-spacing:.26em;color:rgba(251,251,250,.7)}
.xd-apply__received i{width:8px;height:8px;border-radius:50%;background:#4fb47a}
.xd-apply__done h3{margin:0;font:600 34px/1.1 var(--sans);letter-spacing:-.035em}
.xd-apply__done > p:not(.xd-apply__received){margin:0;max-width:520px;font:400 16px/1.65 var(--sans);color:rgba(251,251,250,.72)}
.xd-apply__done .xd-btn{align-self:flex-start;margin-top:8px}

@media (max-width:980px){
  .xd-apply{grid-template-columns:1fr}
}
@media (max-width:820px){
  .xd-careers__hero{grid-template-columns:1fr}
  .xd-careers__photo{order:-1;aspect-ratio:4/3}
  .xd-roles{grid-template-columns:1fr}
  .xd-role{border-right:0;border-bottom:1px solid var(--xd-rule)}
}
@media (max-width:560px){
  .xd-apply__grid{grid-template-columns:1fr}
  .xd-apply__roles{align-self:stretch}
  .xd-apply__roles label{flex:1;text-align:center}
  .xd-apply__roles span{padding:10px 12px}
  .xd-apply__foot{flex-direction:column;align-items:stretch}
  .xd-apply__send{width:100%}
}

/* ============================================ catalogue cards (design 17)
   Shared by /development and the landing page's "The rest of the system."
   Written without the .xd tokens so it renders the same on both pages. */
.xd-pc-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.xd-pc-grid[hidden]{display:none}
.xd-pc{display:flex;flex-direction:column;overflow:hidden;background:#f4f4f2;border-radius:18px;color:#121314}
.xd-pc__head{display:flex;justify-content:space-between;gap:12px;padding:26px 28px 0;font:500 9px/1.4 var(--mono);letter-spacing:.24em;color:rgba(18,19,20,.5)}
.xd-pc__tag{color:#b3271a;text-align:right}
.xd-pc__tag.is-ok{color:#2f7a4f}
.xd-pc__mark{margin:0;padding:22px 28px 0;font:400 clamp(30px,3.28vw,44px)/1.1 'Michroma',var(--sans);letter-spacing:-.01em;white-space:nowrap}
.xd-pc__art{
  position:relative;display:block;margin:22px 28px 0;height:clamp(240px,23.4vw,340px);overflow:hidden;border-radius:12px;
  background:repeating-linear-gradient(135deg,rgba(18,19,20,.045) 0 1px,transparent 1px 9px);
}
.xd-pc__photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s cubic-bezier(.2,0,0,1)}
.xd-pc__render{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;padding:18px;background:#faf9f6;display:block}
.xd-pc__art:hover .xd-pc__photo{transform:scale(1.03)}
.xd-pc__art:focus-visible{outline:3px solid #b3271a;outline-offset:3px}
/* The catalogue's typographic face, fitted to the card. */
.xd-pc__face{position:absolute;inset:0;padding:0 26px;background:#fff;overflow:hidden}
.xd-pc__face .face__seam{right:26px;top:26px;bottom:26px}
.xd-pc__face .face__mark{font-size:clamp(26px,2.5vw,36px)}
.xd-pc__face .face__num{font-size:clamp(56px,5.3vw,78px)}
.xd-pc__face .face__rule{width:min(150px,60%);margin:14px 0 10px}
.xd-pc__face .face__spec{font:400 10px/1.3 var(--mono);letter-spacing:.14em;color:rgba(18,19,20,.55)}
.xd-pc__face .face__sub{margin-top:4px;font-size:9.5px}
.xd-pc__face .face__logo{left:26px;bottom:22px;height:15px;opacity:.8}
.xd-pc__body{display:flex;flex-direction:column;gap:6px;padding:22px 28px 26px}
.xd-pc__name{margin:0;font:500 18px/1.3 var(--sans);letter-spacing:-.015em}
.xd-pc__spec{margin:0;font:400 9.5px/1.5 var(--mono);letter-spacing:.18em;color:rgba(18,19,20,.5)}
.xd-pc__foot{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:16px;padding-top:16px;border-top:1px solid rgba(18,19,20,.1)}
.xd-pc__price{font:400 12px/1 var(--mono);letter-spacing:.14em}
.xd-pc__links{display:flex;gap:20px;font:500 14px/1 var(--sans)}
.xd-pc__links a{color:#b3271a}
.xd-pc__links a:hover{text-decoration:underline;text-underline-offset:4px}
.xd-pc__links a:focus-visible{outline:3px solid #b3271a;outline-offset:3px}

/* ============================================================ /development */
.xd-dev__head{display:flex;justify-content:space-between;align-items:flex-end;gap:48px;padding:clamp(64px,7.5vw,104px) var(--xd-pad) 56px}
.xd-dev__head h1{margin:0 0 20px;font:600 clamp(44px,5.6vw,78px)/1.02 var(--sans);letter-spacing:-.05em}
.xd-dev__head .xd-lede{max-width:520px}
.xd-dev__count{padding-bottom:8px;font:400 9.5px/1.4 var(--mono);letter-spacing:.22em;color:rgba(18,19,20,.55);white-space:nowrap}
.xd-dev__bar{display:flex;justify-content:space-between;align-items:center;gap:16px;margin:0 var(--xd-pad);padding:16px 0;border-top:1px solid rgba(18,19,20,.12);border-bottom:1px solid rgba(18,19,20,.12)}
.xd-dev__pills{display:flex;flex-wrap:wrap;gap:6px}
.xd-pill{display:flex;gap:8px;padding:9px 16px;border:1px solid rgba(18,19,20,.16);border-radius:999px;background:transparent;cursor:pointer;font:500 9.5px/1 var(--mono);letter-spacing:.2em;color:rgba(18,19,20,.7)}
.xd-pill:hover{border-color:#121314}
.xd-pill[aria-pressed="true"]{background:#121314;border-color:#121314;color:#fff}
.xd-pill__n{opacity:.55}
.xd-dev__sort{flex:none;border:0;background:none;cursor:pointer;font:500 9.5px/1 var(--mono);letter-spacing:.2em;color:rgba(18,19,20,.7)}
.xd-dev__sort:hover{color:#121314}
.xd-dev .xd-pc-grid{padding:40px var(--xd-pad) 96px}
.xd-dev__empty{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:40px;margin:40px var(--xd-pad) 96px;padding:clamp(48px,6.9vw,88px) clamp(28px,4.4vw,56px);background:var(--xd-stone);border-radius:20px}
.xd-dev__empty[hidden]{display:none}
.xd-dev__empty-label{margin:0 0 16px;font:500 9.5px/1.4 var(--mono);letter-spacing:.26em;color:rgba(18,19,20,.55)}
.xd-dev__empty h2{margin:0 0 16px;font:600 clamp(34px,3.9vw,52px)/1.05 var(--sans);letter-spacing:-.045em}
.xd-dev__empty-body{margin:0;max-width:520px;font:400 18px/1.6 var(--sans);color:rgba(18,19,20,.62);text-wrap:pretty}
.xd-dev__empty-index{font:400 clamp(72px,9.4vw,120px)/1 'Michroma',var(--sans);color:rgba(18,19,20,.08)}

@media (max-width:980px){
  .xd-pc-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:820px){
  .xd-dev__head{flex-direction:column;align-items:flex-start;gap:20px}
  .xd-dev__bar{flex-direction:column;align-items:flex-start}
  .xd-dev__empty{grid-template-columns:1fr}
}
@media (max-width:620px){
  .xd-pc-grid{grid-template-columns:1fr}
  .xd-pc__mark{font-size:34px}
}
@media (prefers-reduced-motion:reduce){
  .xd-pc__photo{transition:none}
  .xd-pc__art:hover .xd-pc__photo{transform:none}
}

/* /development — iteration A (owner, 2026-09-26): the old catalogue card,
   three-up in a hairline grid, on the catalogue's off-white product stage. */
.xd-dev-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin:40px var(--xd-pad) 96px;border-top:1px solid var(--r10);border-left:1px solid var(--r10)}
.xd-dev-grid[hidden]{display:none}
.xd-dev-grid.xd-dev-grid--home{margin:40px 0 0}
.xd-ctile{display:flex;flex-direction:column;background:#fff;border-right:1px solid var(--r10);border-bottom:1px solid var(--r10);color:var(--ink)}
.xd-ctile .face{height:clamp(300px,26vw,400px);padding:0 36px}
.xd-ctile .face__seam{right:36px;top:36px;bottom:36px}
.xd-ctile .face__mark{font-size:clamp(34px,2.8vw,46px)}
.xd-ctile .face__num{font-size:clamp(70px,5.6vw,92px);line-height:1.02}
.xd-ctile .face__rule{width:min(160px,55%);margin:14px 0 10px}
.xd-ctile .face__spec{font:400 10.5px/1.3 var(--mono);letter-spacing:.14em;color:var(--t55)}
.xd-ctile .face__sub{font-size:10.5px;color:var(--t40);margin-top:4px}
.xd-ctile .face__logo{left:36px;bottom:30px;height:16px;opacity:.8}
.xd-ctile .face--product-image{background:#faf9f6;border-bottom:1px solid var(--r06)}
.xd-ctile .face__product-image{padding:22px}
.xd-ctile .pmeta{flex:1;padding:24px 26px 28px}
.xd-ctile .pmeta__sku{font-size:16px}
.xd-ctile .pmeta__price{font-size:14px}
.xd-ctile .pmeta__name{font-size:16px}
.pmeta__state{margin-top:10px;font:500 9px/1 var(--mono);letter-spacing:.2em;color:var(--red)}
.xd-ctile:hover .face__product-image{transform:scale(1.02)}
.xd-ctile .face__product-image{transition:transform .5s cubic-bezier(.2,0,0,1)}
.xd-ctile:focus-visible{outline:3px solid var(--red);outline-offset:-3px}
@media (max-width:980px){.xd-dev-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* Phones keep the old catalogue's compact two-up ("a collection, not a
   slideshow", 2026-09-22): site.css's .pcard phone rules do the rest. */
@media (max-width:680px){
  .xd-dev-grid{grid-template-columns:1fr 1fr;margin:24px var(--xd-pad) 64px}
  .xd-ctile .face{height:196px;padding:18px}
  .xd-ctile .face__mark{font-size:24px}
  .xd-ctile .face__num{font-size:50px}
  .xd-ctile .face__rule{width:70%;margin:10px 0 0}
  .xd-ctile .face__product-image{padding:10px}
  .xd-ctile .pmeta{padding:13px 14px 16px}
  .xd-ctile .pmeta__sku{font-size:12px}
  .xd-ctile .pmeta__price{font-size:12.5px}
  .xd-ctile .pmeta__name{font-size:12.5px}
  .pmeta__state{margin-top:6px;font-size:8.5px}
}
@media (prefers-reduced-motion:reduce){.xd-ctile .face__product-image{transition:none}.xd-ctile:hover .face__product-image{transform:none}}
