/* THREAD & INK — cosmetic identity layer only
   Soft CMYK ink accents + subtle needle/thread cues. No copy changes. */

:root{
  --ti-c-soft:#dff7fb;
  --ti-m-soft:#f9dfe9;
  --ti-y-soft:#fbf2c9;
  --ti-k-soft:#dadada;
  --ti-thread-soft:#eadfd6;
  --ti-thread-line:#b88f78;
}

/* Soft CMYK signature line */
.ti-announcement{
  position:relative;
  overflow:hidden;
}
.ti-announcement:before{
  content:"";
  position:absolute;
  left:0;right:0;top:0;
  height:3px;
  background:linear-gradient(
    90deg,
    var(--ti-c-soft) 0 25%,
    var(--ti-m-soft) 25% 50%,
    var(--ti-y-soft) 50% 75%,
    var(--ti-k-soft) 75% 100%
  );
}

/* Wordmark: thread line merging softly into CMYK */
.ti-wordmark{
  position:relative;
  padding-bottom:7px;
}
.ti-wordmark:after{
  content:"";
  position:absolute;
  left:0;bottom:0;
  width:92px;
  height:2px;
  background:linear-gradient(
    90deg,
    var(--ti-thread-line) 0 42%,
    var(--ti-c-soft) 42% 57%,
    var(--ti-m-soft) 57% 72%,
    var(--ti-y-soft) 72% 87%,
    var(--ti-k-soft) 87% 100%
  );
}

/* Header remains clean; add soft depth only */
.ti-header{
  box-shadow:0 8px 28px rgba(17,17,17,.025);
}

/* Hero: soft ink blooms on one side, thread sweep on the other */
.ti-home-hero{
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 90% 18%, rgba(223,247,251,.8) 0 7%, transparent 18%),
    radial-gradient(circle at 94% 32%, rgba(249,223,233,.72) 0 8%, transparent 20%),
    radial-gradient(circle at 83% 37%, rgba(251,242,201,.8) 0 8%, transparent 21%),
    #f8f8f6;
}
.ti-home-hero:before{
  content:"";
  position:absolute;
  left:-110px;
  bottom:-95px;
  width:360px;
  height:250px;
  border:1.5px solid rgba(184,143,120,.25);
  border-color:rgba(184,143,120,.25) transparent transparent rgba(184,143,120,.25);
  border-radius:60% 44% 52% 48%;
  transform:rotate(-10deg);
  pointer-events:none;
}
.ti-home-hero:after{
  content:"";
  position:absolute;
  left:92px;
  bottom:50px;
  width:82px;
  height:1.5px;
  background:rgba(184,143,120,.32);
  transform:rotate(-18deg);
  transform-origin:left center;
  pointer-events:none;
}

/* Main category cards: subtle print/embroidery finishing */
.ti-maincat,
.ti-subcat-card{
  border:1px solid rgba(17,17,17,.045);
  box-shadow:0 10px 26px rgba(17,17,17,.025);
}
.ti-maincat:before,
.ti-subcat-card:before{
  content:"";
  position:absolute;
  left:0;right:0;top:0;
  height:3px;
  z-index:3;
  opacity:.9;
  background:linear-gradient(
    90deg,
    rgba(184,143,120,.72) 0 28%,
    var(--ti-c-soft) 28% 46%,
    var(--ti-m-soft) 46% 64%,
    var(--ti-y-soft) 64% 82%,
    var(--ti-k-soft) 82% 100%
  );
}
.ti-maincat:hover,
.ti-subcat-card:hover{
  box-shadow:0 18px 38px rgba(17,17,17,.055);
}

/* Ink-style CMYK speckles, very soft */
.ti-main-categories{
  position:relative;
  overflow:hidden;
}
.ti-main-categories:after{
  content:"";
  position:absolute;
  right:-60px;
  top:64px;
  width:220px;
  height:220px;
  opacity:.28;
  background:
    radial-gradient(circle at 35% 35%, var(--ti-c-soft) 0 18px, transparent 19px),
    radial-gradient(circle at 66% 42%, var(--ti-m-soft) 0 15px, transparent 16px),
    radial-gradient(circle at 52% 70%, var(--ti-y-soft) 0 20px, transparent 21px),
    radial-gradient(circle at 78% 72%, var(--ti-k-soft) 0 11px, transparent 12px);
  pointer-events:none;
}

/* Thread-like stitched divider for section labels */
.ti-overline{
  position:relative;
  display:inline-block;
  padding-right:30px;
}
.ti-overline:after{
  content:"";
  position:absolute;
  right:0;
  top:50%;
  width:22px;
  border-top:1px dashed rgba(184,143,120,.6);
  transform:translateY(-50%);
}

/* Buttons stay premium, only tiny CMYK accent */
.ti-btn-pro{
  position:relative;
  overflow:hidden;
}
.ti-btn-pro:after{
  content:"";
  position:absolute;
  left:0;right:0;bottom:0;
  height:2px;
  background:linear-gradient(
    90deg,
    var(--ti-c-soft),
    var(--ti-m-soft),
    var(--ti-y-soft),
    var(--ti-k-soft)
  );
  opacity:.9;
}

/* Footer gets a stronger brand finish without becoming loud */
.ti-footer{
  position:relative;
  overflow:hidden;
}
.ti-footer:before{
  content:"";
  position:absolute;
  left:0;right:0;top:0;
  height:3px;
  background:linear-gradient(
    90deg,
    rgba(184,143,120,.95) 0 25%,
    var(--ti-c-soft) 25% 50%,
    var(--ti-m-soft) 50% 75%,
    var(--ti-y-soft) 75% 100%
  );
}
.ti-footer:after{
  content:"";
  position:absolute;
  right:-70px;
  bottom:-90px;
  width:260px;
  height:220px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:50%;
  box-shadow:
    -38px -18px 0 0 rgba(223,247,251,.025),
    -78px -42px 0 0 rgba(249,223,233,.025),
    -112px -20px 0 0 rgba(251,242,201,.02);
  pointer-events:none;
}

/* Contact + category headers pick up the same soft identity */
.ti-shop-head,
.ti-contact-hero{
  position:relative;
  overflow:hidden;
}
.ti-shop-head:after,
.ti-contact-hero:after{
  content:"";
  position:absolute;
  right:-60px;
  top:-65px;
  width:180px;
  height:180px;
  border-radius:50%;
  background:conic-gradient(
    from 20deg,
    rgba(223,247,251,.45) 0 25%,
    rgba(249,223,233,.42) 25% 50%,
    rgba(251,242,201,.48) 50% 75%,
    rgba(218,218,218,.35) 75% 100%
  );
  filter:blur(1px);
  opacity:.55;
  pointer-events:none;
}

@media(max-width:860px){
  .ti-main-categories:after{opacity:.18;right:-100px}
  .ti-home-hero:before{left:-170px}
}
@media(max-width:600px){
  .ti-home-hero{
    background:
      radial-gradient(circle at 93% 14%, rgba(223,247,251,.68) 0 7%, transparent 18%),
      radial-gradient(circle at 94% 25%, rgba(249,223,233,.6) 0 7%, transparent 20%),
      radial-gradient(circle at 84% 31%, rgba(251,242,201,.7) 0 7%, transparent 20%),
      #f8f8f6;
  }
  .ti-home-hero:before{opacity:.6}
  .ti-main-categories:after{display:none}
  .ti-shop-head:after,
  .ti-contact-hero:after{width:120px;height:120px;right:-50px;top:-44px}
}