/* Fabrics & textiles: the cloth shop — a woven texture, three rolls standing, a stitch line sewing itself, pinked swatches.
   Palette: madder, indigo and saffron dyes on natural linen. Font: Gulzar. */
body.skin-fabrics{--bg:#F5EFE6;--card:#FFFBF5;--card-2:#EFE5D6;--border:#DDCDB5;--fg:#2A1E3F;--secondary-fg:#3B2D55;--muted:#625675;
  --primary:#9F1239;--on-primary:#FFFFFF;--accent:#3730A3;--i-font:"Gulzar";--i-w:400;--i-r:6px;--peak:#1D4ED8;color-scheme:light}
.skin-fabrics .ih{padding-bottom:clamp(170px,24vw,300px);
  background:repeating-linear-gradient(0deg,rgba(42,30,63,.045) 0 2px,transparent 2px 7px),repeating-linear-gradient(90deg,rgba(159,18,57,.045) 0 2px,transparent 2px 7px)}
.skin-fabrics .ih h1{font-size:clamp(42px,6vw,80px);line-height:1.6}
.skin-fabrics .sx-head h2,.skin-fabrics .ic h2{line-height:1.6}
.skin-fabrics .ih-art{place-items:end center}
.skin-fabrics .ih-art .art{width:min(900px,100vw);max-height:44%}
.skin-fabrics .roll rect,.skin-fabrics .roll ellipse{stroke:rgba(42,30,63,.25);stroke-width:2}
.skin-fabrics .r1 rect{fill:#9F1239}.skin-fabrics .r1 ellipse{fill:#BE3155}
.skin-fabrics .r2 rect{fill:#3730A3}.skin-fabrics .r2 ellipse{fill:#5149C4}
.skin-fabrics .r3 rect{fill:#D97706}.skin-fabrics .r3 ellipse{fill:#F0A23A}
.skin-fabrics .drape{fill:#9F1239;opacity:.16}
.skin-fabrics .stitch{fill:none;stroke:var(--fg);stroke-opacity:.45;stroke-width:3;stroke-dasharray:12 9;animation:fa-sew 1.4s linear infinite}
@keyframes fa-sew{to{stroke-dashoffset:-21}}
.skin-fabrics .roll{transform-box:fill-box;transform-origin:50% 100%}
.js.ready .skin-fabrics .roll{animation:fa-up .9s var(--ease-out) backwards}
.js.ready .skin-fabrics .r2{animation-delay:.12s}.js.ready .skin-fabrics .r3{animation-delay:.24s}
@keyframes fa-up{from{transform:scaleY(.6);opacity:0}}
/* clients: swatches with pinked edges, each a different dye */
.skin-fabrics .ir-list li{border:0;border-radius:0;padding:14px 26px;font-size:20px;
  -webkit-mask:radial-gradient(6px at 50% 0,#0000 98%,#000) 50% 0/12px 51% repeat-x,radial-gradient(6px at 50% 100%,#0000 98%,#000) 50% 100%/12px 51% repeat-x;
  mask:radial-gradient(6px at 50% 0,#0000 98%,#000) 50% 0/12px 51% repeat-x,radial-gradient(6px at 50% 100%,#0000 98%,#000) 50% 100%/12px 51% repeat-x}
.skin-fabrics .ir-list li:nth-child(4n+1){background:#9F1239;color:#fff}
.skin-fabrics .ir-list li:nth-child(4n+2){background:#3730A3;color:#fff}
.skin-fabrics .ir-list li:nth-child(4n+3){background:#F0A23A;color:#2A1E3F}
.skin-fabrics .ir-list li:nth-child(4n+4){background:var(--card);color:var(--fg)}
/* services: a stitched seam inside every card */
.skin-fabrics .is-list li,.skin-fabrics .ic-box{outline:2px dashed var(--border);outline-offset:-10px}
.skin-fabrics .is-ico{border-radius:50%}