/* Product Role system -----------------------------------------------------
   A deliberately product-specific section. Pure Nicotine branches outward
   into finished-product manufacturing. Alkaloid 95% moves linearly through
   further refinement. Shared typography and motion keep both in one family. */

.product-detail93 .product-role93{
  position:relative;
  overflow:hidden;
  padding:clamp(48px,5vw,74px) clamp(28px,4.7vw,72px) clamp(54px,5.5vw,82px);
  color:#f6f7f3;
  background:linear-gradient(112deg,#0d251e 0%,#113128 58%,#0c241d 100%);
}
.product-detail93 .product-role93:before{
  content:"";
  position:absolute;
  width:420px;height:420px;
  border:1px solid rgba(190,165,99,.14);
  border-radius:50%;
  right:-240px;top:-285px;
  pointer-events:none;
}
.product-detail93 .role-head93{
  display:grid;
  grid-template-columns:minmax(0,.92fr) minmax(360px,1.08fr);
  gap:clamp(32px,6vw,110px);
  align-items:end;
  margin-bottom:34px;
}
.product-detail93 .role-head93 .v08-display{
  margin:0;
  max-width:760px;
  font-size:clamp(42px,4.1vw,68px);
  line-height:.98;
}
.product-detail93 .role-head93>p{
  margin:0 0 4px;
  max-width:680px;
  justify-self:end;
  color:#c3cec7;
  font-size:15px;
  line-height:1.58;
}
.product-detail93 .role-position93{
  position:relative;
  border-top:1px solid rgba(255,255,255,.20);
  padding:20px 0 4px;
}
.product-detail93 .role-eyebrow93{
  display:block;
  margin-bottom:12px;
  font:9px ui-monospace,SFMono-Regular,Menlo,monospace;
  text-transform:uppercase;
  letter-spacing:.11em;
  color:#aebbb3;
}
.product-detail93 .role-position93>strong{
  display:block;
  margin-bottom:10px;
  font-size:clamp(25px,2.2vw,36px);
  line-height:1;
  letter-spacing:-.035em;
}
.product-detail93 .role-position93>p{
  margin:0;
  max-width:520px;
  color:#bdc9c1;
  font-size:13px;
  line-height:1.6;
}
.product-detail93 .role-tags93{
  display:flex;
  flex-wrap:wrap;
  gap:7px;
  margin-top:18px;
}
.product-detail93 .role-tags93 span{
  padding:6px 9px 5px;
  border:1px solid rgba(255,255,255,.20);
  font:8px ui-monospace,SFMono-Regular,Menlo,monospace;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:#d9e0dc;
}

/* PURE NICOTINE: one finished grade branching into several manufacturing routes. */
.product-detail93 .pure-role93{
  background:
    radial-gradient(circle at 66% 53%,rgba(151,185,115,.07),transparent 29%),
    linear-gradient(112deg,#0b251d 0%,#103229 61%,#0d281f 100%);
}
.product-detail93 .pure-role-grid93{
  display:grid;
  grid-template-columns:minmax(260px,.62fr) minmax(650px,1.38fr);
  gap:clamp(36px,5vw,84px);
  align-items:center;
}
.product-detail93 .pure-network93{
  display:grid;
  grid-template-columns:minmax(185px,.40fr) 82px minmax(390px,1fr);
  align-items:stretch;
  min-height:292px;
}
.product-detail93 .pure-source93{
  position:relative;
  display:flex;
  gap:14px;
  align-items:center;
  align-self:stretch;
  padding:22px;
  background:rgba(255,255,255,.045);
  border:1px solid rgba(255,255,255,.18);
  transition:background-color .45s ease,border-color .45s ease,transform .55s cubic-bezier(.2,.75,.2,1);
}
.product-detail93 .pure-source93>span,
.product-detail93 .pure-destinations93>a>span,
.product-detail93 .alkaloid-route-list93>a>span{
  display:grid;
  place-items:center;
  flex:0 0 auto;
  width:29px;height:29px;
  border:1px solid rgba(255,255,255,.28);
  border-radius:50%;
  font:9px ui-monospace,SFMono-Regular,Menlo,monospace;
  color:#d9e2dc;
}
.product-detail93 .pure-source93 small,
.product-detail93 .pure-destinations93 small,
.product-detail93 .alkaloid-route-list93 small{
  display:block;
  color:#aebcb4;
  font-size:10px;
  line-height:1.4;
}
.product-detail93 .pure-source93 small{
  margin-bottom:8px;
  font:8px ui-monospace,SFMono-Regular,Menlo,monospace;
  text-transform:uppercase;
  letter-spacing:.09em;
}
.product-detail93 .pure-source93 b{
  font-size:22px;
  line-height:1.06;
  letter-spacing:-.035em;
}
.product-detail93 .pure-branch-lines93{
  position:relative;
}
.product-detail93 .pure-branch-lines93:before{
  content:"";
  position:absolute;
  left:0;right:0;top:50%;
  height:1px;
  background:linear-gradient(90deg,rgba(202,220,154,.52),rgba(202,220,154,.22));
  transform-origin:left;
  transition:transform .8s cubic-bezier(.16,.76,.18,1);
}
.product-detail93 .pure-branch-lines93:after{
  content:"";
  position:absolute;
  right:0;top:12.5%;bottom:12.5%;
  width:1px;
  background:rgba(202,220,154,.25);
}
.product-detail93 .pure-branch-lines93 i{
  position:absolute;
  right:0;
  width:18px;height:1px;
  background:rgba(202,220,154,.25);
}
.product-detail93 .pure-branch-lines93 i:nth-child(1){top:12.5%}
.product-detail93 .pure-branch-lines93 i:nth-child(2){top:37.5%}
.product-detail93 .pure-branch-lines93 i:nth-child(3){top:62.5%}
.product-detail93 .pure-branch-lines93 i:nth-child(4){top:87.5%}
.product-detail93 .pure-destinations93{
  display:grid;
  grid-template-rows:repeat(4,1fr);
  border-top:1px solid rgba(255,255,255,.15);
}
.product-detail93 .pure-destinations93>a,
.product-detail93 .alkaloid-route-list93>a{
  position:relative;
  display:grid;
  grid-template-columns:auto 1fr auto;
  gap:14px;
  align-items:center;
  padding:12px 12px;
  color:#f5f7f3;
  text-decoration:none;
  border-bottom:1px solid rgba(255,255,255,.15);
  overflow:hidden;
  isolation:isolate;
  transition:padding .45s cubic-bezier(.2,.75,.2,1),background-color .42s ease;
}
.product-detail93 .pure-destinations93>a:before,
.product-detail93 .alkaloid-route-list93>a:before{
  content:"";
  position:absolute;inset:0;
  background:linear-gradient(90deg,rgba(190,165,99,.13),rgba(255,255,255,.018) 65%,transparent);
  opacity:0;
  z-index:-1;
  transition:opacity .42s ease;
}
.product-detail93 .pure-destinations93 b,
.product-detail93 .alkaloid-route-list93 b{
  display:block;
  margin-bottom:3px;
  font-size:14px;
  letter-spacing:-.01em;
}
.product-detail93 .pure-destinations93 em,
.product-detail93 .alkaloid-route-list93 em{
  font-style:normal;
  color:#d8e99d;
  font-size:10px;
  white-space:nowrap;
  transition:transform .42s cubic-bezier(.2,.75,.2,1);
}
@media (hover:hover){
  .product-detail93 .pure-role93:hover .pure-source93{
    border-color:rgba(203,222,155,.35);
    background:rgba(255,255,255,.06);
  }
  .product-detail93 .pure-destinations93>a:hover,
  .product-detail93 .alkaloid-route-list93>a:hover{
    padding-left:18px;
    background:rgba(255,255,255,.018);
  }
  .product-detail93 .pure-destinations93>a:hover:before,
  .product-detail93 .alkaloid-route-list93>a:hover:before{opacity:1}
  .product-detail93 .pure-destinations93>a:hover>span,
  .product-detail93 .alkaloid-route-list93>a:hover>span{
    background:#b99e58;
    border-color:#b99e58;
    color:#142219;
  }
  .product-detail93 .pure-destinations93>a:hover em,
  .product-detail93 .alkaloid-route-list93>a:hover em{transform:translateX(3px)}
}

/* ALKALOID 95%: linear material progression through a buyer's refining process. */
.product-detail93 .alkaloid-role93{
  background:
    radial-gradient(circle at 28% 54%,rgba(196,137,80,.075),transparent 32%),
    linear-gradient(112deg,#111f19 0%,#182e25 55%,#2c261f 125%);
}
.product-detail93 .alkaloid-role93:before{
  border-radius:22px;
  transform:rotate(16deg);
  border-color:rgba(211,157,101,.18);
}
.product-detail93 .alkaloid-role-grid93{
  display:grid;
  grid-template-columns:minmax(620px,1.22fr) minmax(360px,.78fr);
  gap:clamp(42px,6vw,92px);
  align-items:stretch;
}
.product-detail93 .alkaloid-flow93{
  position:relative;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:44px;
  align-items:center;
  min-height:310px;
  padding:26px 0;
}
.product-detail93 .flow-line93{
  position:absolute;
  left:12%;right:12%;top:50%;
  height:1px;
  background:rgba(213,157,103,.26);
  overflow:hidden;
}
.product-detail93 .flow-line93 i{
  position:absolute;
  width:34%;height:100%;
  background:linear-gradient(90deg,transparent,#d6a06d,transparent);
  transform:translateX(-120%);
}
@media (prefers-reduced-motion:no-preference){
  .product-detail93 .alkaloid-role93:hover .flow-line93 i{
    animation:alkaloidFlow93 2.25s ease-in-out infinite;
  }
  @keyframes alkaloidFlow93{to{transform:translateX(430%)}}
}
.product-detail93 .flow-node93{
  position:relative;
  z-index:1;
  min-height:198px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:24px 20px;
  background:#152a22;
  border:1px solid rgba(255,255,255,.16);
  box-shadow:0 16px 35px rgba(5,12,9,.08);
  transition:transform .55s cubic-bezier(.2,.75,.2,1),border-color .42s ease,background-color .42s ease;
}
.product-detail93 .flow-node93>span{
  position:absolute;
  top:-14px;left:18px;
  display:grid;place-items:center;
  width:29px;height:29px;
  border-radius:50%;
  background:#bd8b58;
  color:#172018;
  font:9px ui-monospace,SFMono-Regular,Menlo,monospace;
}
.product-detail93 .flow-node93 small{
  margin-bottom:11px;
  font:8px ui-monospace,SFMono-Regular,Menlo,monospace;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:#a9b6ae;
}
.product-detail93 .flow-node93 b{
  font-size:clamp(21px,1.7vw,28px);
  line-height:1.02;
  letter-spacing:-.04em;
}
.product-detail93 .flow-node93 em{
  margin-top:13px;
  font-style:normal;
  color:#9fada5;
  font-size:10px;
  line-height:1.45;
}
.product-detail93 .flow-feed93{transform:translateY(15px)}
.product-detail93 .flow-process93{background:#25352c;border-color:rgba(211,157,101,.30)}
.product-detail93 .flow-output93{transform:translateY(-15px)}
@media (hover:hover){
  .product-detail93 .flow-node93:hover{
    transform:translateY(-4px);
    border-color:rgba(211,157,101,.42);
    background:#1a3128;
  }
  .product-detail93 .flow-feed93:hover{transform:translateY(10px)}
  .product-detail93 .flow-output93:hover{transform:translateY(-20px)}
}
.product-detail93 .alkaloid-buyers93{
  display:grid;
  grid-template-rows:auto 1fr;
  gap:20px;
}
.product-detail93 .alkaloid-route-list93{
  border-top:1px solid rgba(255,255,255,.15);
  align-self:end;
}
.product-detail93 .alkaloid-route-list93>a{
  min-height:65px;
}
.product-detail93 .alkaloid-route-list93>a>span{
  width:26px;height:26px;
  font-size:8px;
}

@media(max-width:1100px){
  .product-detail93 .pure-role-grid93,
  .product-detail93 .alkaloid-role-grid93{grid-template-columns:1fr;}
  .product-detail93 .pure-network93{grid-template-columns:minmax(175px,.35fr) 70px 1fr;}
  .product-detail93 .alkaloid-flow93{max-width:900px;}
}
@media(max-width:760px){
  .product-detail93 .product-role93{padding:42px 24px 48px;}
  .product-detail93 .role-head93{grid-template-columns:1fr;gap:18px;margin-bottom:28px;}
  .product-detail93 .role-head93>p{justify-self:start;}
  .product-detail93 .pure-network93{grid-template-columns:1fr;gap:16px;min-height:0;}
  .product-detail93 .pure-branch-lines93{display:none;}
  .product-detail93 .pure-source93{min-height:130px;}
  .product-detail93 .alkaloid-flow93{grid-template-columns:1fr;gap:18px;min-height:0;padding-left:18px;}
  .product-detail93 .flow-line93{left:7px;right:auto;top:12%;bottom:12%;width:1px;height:auto;}
  .product-detail93 .flow-line93 i{width:1px;height:34%;transform:translateY(-120%);}
  .product-detail93 .flow-feed93,.product-detail93 .flow-output93{transform:none;}
  .product-detail93 .flow-node93{min-height:150px;}
  @media (prefers-reduced-motion:no-preference){
    .product-detail93 .alkaloid-role93:hover .flow-line93 i{animation:none;}
  }
}
