/* =========================================================
   P581H — SECTION 08 / TARHE43
   DIGITAL MARKETING GROWTH ORBIT
   ========================================================= */

.ph-t43{
  --t43-cyan:#22d3ee;
  --t43-blue:#3b82f6;
  --t43-purple:#a855f7;
  --t43-pink:#ec4899;
  --t43-orange:#ff7a3d;
  --t43-gold:#f7c85d;
  --t43-green:#55d66b;

  position:relative;
  overflow:hidden;
  padding:clamp(90px,8vw,138px) 0 42px;
  color:#f4f8fa;

  background:
    radial-gradient(circle at 18% 42%,rgba(34,211,238,.13),transparent 28%),
    radial-gradient(circle at 34% 29%,rgba(168,85,247,.08),transparent 25%),
    radial-gradient(circle at 82% 25%,rgba(34,211,238,.055),transparent 28%),
    linear-gradient(180deg,#03111b 0%,#061a27 55%,#04131e 100%);
}

.ph-t43::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background-image:
    linear-gradient(rgba(88,185,211,.025) 1px,transparent 1px),
    linear-gradient(90deg,rgba(88,185,211,.025) 1px,transparent 1px);
  background-size:48px 48px;
}


/* MAIN */

.ph-t43-layout{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:minmax(0,1.08fr) minmax(430px,.92fr);
  gap:clamp(40px,5vw,80px);
  align-items:center;
  direction:ltr;
}

.ph-t43-content{
  min-width:0;
  direction:rtl;
  text-align:right;
}

.ph-t43-visual{
  position:relative;
  min-width:0;
  min-height:680px;
  perspective:1200px;
}


/* PARTICLES */

.ph-t43-space{
  position:absolute;
  inset:0;
  pointer-events:none;
}

.ph-t43-space i{
  position:absolute;
  width:4px;
  height:4px;
  border-radius:50%;
  background:#8be8ff;
  box-shadow:0 0 12px rgba(80,220,255,.9);
  animation:t43Particle 4.5s ease-in-out infinite;
}

.ph-t43-space i:nth-child(1){top:9%;left:15%}
.ph-t43-space i:nth-child(2){top:18%;left:71%;animation-delay:1s}
.ph-t43-space i:nth-child(3){top:43%;left:4%;animation-delay:2s}
.ph-t43-space i:nth-child(4){top:67%;left:81%;animation-delay:.7s}
.ph-t43-space i:nth-child(5){top:84%;left:25%;animation-delay:1.6s}
.ph-t43-space i:nth-child(6){top:56%;left:54%;animation-delay:2.7s}

@keyframes t43Particle{
  0%,100%{opacity:.25;transform:scale(.7)}
  50%{opacity:1;transform:scale(1.35)}
}


/* ORBIT */

.ph-t43-orbit{
  position:absolute;
  width:min(660px,100%);
  aspect-ratio:1/.9;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%) rotate(-3deg);
  transform-style:preserve-3d;
}

.ph-t43-ring{
  position:absolute;
  left:50%;
  top:50%;
  border-radius:50%;
  border:1px solid rgba(93,221,255,.22);
  box-shadow:
    inset 0 0 28px rgba(0,196,255,.05),
    0 0 34px rgba(0,196,255,.04);
  pointer-events:none;
}

.ph-t43-ring::before{
  content:"";
  position:absolute;
  inset:-2px;
  border-radius:inherit;
  border-top:2px solid rgba(56,211,255,.75);
  border-right:1px solid rgba(168,85,247,.34);
  filter:drop-shadow(0 0 8px rgba(45,213,255,.45));
}

.ph-t43-ring--outer{
  width:94%;
  height:58%;
  transform:translate(-50%,-50%) rotate(-13deg) rotateX(57deg);
  animation:t43Outer 18s linear infinite;
}

.ph-t43-ring--middle{
  width:76%;
  height:51%;
  border-color:rgba(176,93,255,.24);
  transform:translate(-50%,-50%) rotate(12deg) rotateX(62deg);
  animation:t43Middle 15s linear infinite reverse;
}

.ph-t43-ring--inner{
  width:58%;
  height:44%;
  border-color:rgba(247,200,93,.23);
  transform:translate(-50%,-50%) rotate(-5deg) rotateX(67deg);
  animation:t43Inner 12s linear infinite;
}

@keyframes t43Outer{
  to{transform:translate(-50%,-50%) rotate(347deg) rotateX(57deg)}
}

@keyframes t43Middle{
  to{transform:translate(-50%,-50%) rotate(372deg) rotateX(62deg)}
}

@keyframes t43Inner{
  to{transform:translate(-50%,-50%) rotate(355deg) rotateX(67deg)}
}


/* TRAILS */

.ph-t43-trail{
  position:absolute;
  left:50%;
  top:50%;
  border-radius:50%;
  pointer-events:none;
}

.ph-t43-trail--one{
  width:89%;
  height:52%;
  transform:translate(-50%,-50%) rotate(18deg);
  border-top:4px solid rgba(34,211,238,.72);
  border-left:1px solid rgba(59,130,246,.16);
  filter:drop-shadow(0 0 9px rgba(34,211,238,.75));
}

.ph-t43-trail--two{
  width:70%;
  height:43%;
  transform:translate(-50%,-50%) rotate(-21deg);
  border-bottom:3px solid rgba(236,72,153,.42);
  border-right:2px solid rgba(247,200,93,.53);
  filter:drop-shadow(0 0 8px rgba(236,72,153,.30));
}


/* CORE */

.ph-t43-core{
  position:absolute;
  z-index:6;
  left:50%;
  top:50%;
  width:190px;
  height:190px;
  transform:translate(-50%,-50%);
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  text-align:center;

  background:
    radial-gradient(circle at 37% 28%,rgba(116,229,255,.20),transparent 25%),
    radial-gradient(circle at 50% 65%,rgba(18,91,126,.74),rgba(3,25,39,.96) 66%);

  border:1px solid rgba(131,230,255,.55);

  box-shadow:
    inset 0 0 36px rgba(26,191,241,.18),
    0 0 28px rgba(26,191,241,.18),
    0 0 70px rgba(26,191,241,.08);

  overflow:hidden;
}

.ph-t43-core::before{
  content:"";
  position:absolute;
  inset:11px;
  border-radius:50%;
  border:1px solid rgba(151,232,255,.17);
}

.ph-t43-core-glow{
  position:absolute;
  inset:-25px;
  border-radius:50%;
  background:
    conic-gradient(
      transparent,
      rgba(34,211,238,.15),
      transparent,
      rgba(247,200,93,.12),
      transparent
    );
  animation:t43CoreSpin 7s linear infinite;
}

@keyframes t43CoreSpin{
  to{transform:rotate(360deg)}
}

.ph-t43-core-icon{
  position:relative;
  z-index:2;
  display:flex;
  align-items:flex-end;
  gap:4px;
  height:45px;
  margin-bottom:10px;
}

.ph-t43-core-icon span{
  width:8px;
  border-radius:3px 3px 0 0;
  background:linear-gradient(180deg,#65ecff,#1f7de8);
}

.ph-t43-core-icon span:nth-child(1){height:14px}
.ph-t43-core-icon span:nth-child(2){height:25px}
.ph-t43-core-icon span:nth-child(3){height:38px}

.ph-t43-core-icon i{
  position:absolute;
  right:-21px;
  top:-8px;
  color:#8af1ff;
  font-size:26px;
  font-style:normal;
}

.ph-t43-core>strong{
  position:relative;
  z-index:2;
  font-size:19px;
}

.ph-t43-core>small{
  position:relative;
  z-index:2;
  margin-top:7px;
  color:rgba(183,227,237,.44);
  font-size:7px;
  letter-spacing:.12em;
}


/* NODES */

.ph-t43-node{
  position:absolute;
  z-index:8;
  width:142px;
  min-height:128px;
  padding:13px 12px 14px;
  border:1px solid var(--node-color);
  border-radius:17px;
  color:#fff;

  background:
    linear-gradient(145deg,var(--node-bg),rgba(5,19,31,.93));

  box-shadow:
    0 18px 38px rgba(0,0,0,.34),
    0 0 20px var(--node-glow);

  cursor:pointer;
  direction:rtl;

  transition:
    transform .28s ease,
    box-shadow .28s ease,
    filter .28s ease;

  animation:t43Float 4.8s ease-in-out infinite;
}

.ph-t43-node:hover,
.ph-t43-node.is-active{
  z-index:12;
  transform:translateY(-5px) scale(1.065);
  filter:saturate(1.15);
  box-shadow:
    0 22px 48px rgba(0,0,0,.40),
    0 0 32px var(--node-glow);
}

.ph-t43-node-no{
  position:absolute;
  top:9px;
  left:10px;
  color:rgba(255,255,255,.30);
  font-size:8px;
  direction:ltr;
}

.ph-t43-node-icon{
  display:flex;
  width:42px;
  height:42px;
  margin:5px auto 9px;
  align-items:center;
  justify-content:center;
  border-radius:12px;
  color:var(--node-icon);
  background:rgba(255,255,255,.045);
}

.ph-t43-node-icon svg{
  width:29px;
  height:29px;
  fill:none;
  stroke:currentColor;
  stroke-width:2.2;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.ph-t43-node>strong{
  display:block;
  font-size:12px;
  line-height:1.45;
}

.ph-t43-node>small{
  display:block;
  margin-top:4px;
  color:rgba(226,237,242,.46);
  font-size:8.5px;
}

.ph-t43-node--social{
  --node-color:rgba(236,72,153,.75);
  --node-bg:rgba(133,27,104,.66);
  --node-glow:rgba(236,72,153,.28);
  --node-icon:#ff74c5;
  left:12%;
  top:5%;
}

.ph-t43-node--campaign{
  --node-color:rgba(255,122,61,.78);
  --node-bg:rgba(142,54,26,.66);
  --node-glow:rgba(255,122,61,.28);
  --node-icon:#ff9c6d;
  right:4%;
  top:15%;
  animation-delay:.8s;
}

.ph-t43-node--analytics{
  --node-color:rgba(85,214,107,.78);
  --node-bg:rgba(29,105,50,.63);
  --node-glow:rgba(85,214,107,.25);
  --node-icon:#82ee94;
  right:1%;
  top:57%;
  animation-delay:1.4s;
}

.ph-t43-node--landing{
  --node-color:rgba(59,130,246,.80);
  --node-bg:rgba(28,71,139,.64);
  --node-glow:rgba(59,130,246,.28);
  --node-icon:#78b2ff;
  right:25%;
  bottom:1%;
  animation-delay:2s;
}

.ph-t43-node--catalog{
  --node-color:rgba(247,200,93,.82);
  --node-bg:rgba(125,88,17,.63);
  --node-glow:rgba(247,200,93,.26);
  --node-icon:#ffe284;
  left:28%;
  bottom:2%;
  animation-delay:2.6s;
}

.ph-t43-node--video{
  --node-color:rgba(34,211,238,.82);
  --node-bg:rgba(15,94,112,.64);
  --node-glow:rgba(34,211,238,.28);
  --node-icon:#75efff;
  left:1%;
  top:53%;
  animation-delay:3.2s;
}

@keyframes t43Float{
  0%,100%{margin-top:0}
  50%{margin-top:-7px}
}


/* ORBIT COPY */

.ph-t43-orbit-copy{
  position:absolute;
  z-index:3;
  color:rgba(97,224,255,.58);
  font-size:10px;
  white-space:nowrap;
  pointer-events:none;
}

.ph-t43-orbit-copy--one{
  top:13%;
  left:41%;
  transform:rotate(6deg);
}

.ph-t43-orbit-copy--two{
  left:33%;
  bottom:11%;
  transform:rotate(-5deg);
}


/* HEADER */

.ph-t43-meta{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:24px;
}

.ph-t43-meta>span{
  position:relative;
  margin-top:12px;
  padding-right:28px;
  color:#58e5f7;
  font-size:11px;
}

.ph-t43-meta>span::before{
  content:"";
  position:absolute;
  right:0;
  top:50%;
  width:19px;
  height:1px;
  background:var(--t43-gold);
}

.ph-t43-index strong{
  color:rgba(43,216,238,.74);
  font-size:82px;
  line-height:.85;
  font-weight:300;
}

.ph-t43-head h2{
  margin:25px 0 0;
  color:#f5f8fa;
  font-size:clamp(38px,3.3vw,55px);
  line-height:1.24;
}

.ph-t43-head h2>strong{
  display:block;
  margin-top:6px;
  color:transparent;

  background:
    linear-gradient(
      90deg,
      #f5bd58,
      #d8ed71 32%,
      #55e6c5 60%,
      #34d4ef 90%
    );

  -webkit-background-clip:text;
  background-clip:text;
}

.ph-t43-head>p{
  margin:24px 0 0;
  color:rgba(215,232,238,.62);
  font-size:14px;
  line-height:2.05;
}


/* FOCUS */

.ph-t43-focus{
  position:relative;
  margin-top:28px;
  padding:19px;
  border:1px solid rgba(83,196,221,.20);
  border-radius:17px;

  background:
    linear-gradient(145deg,rgba(10,40,55,.72),rgba(5,22,34,.79));

  overflow:hidden;
}

.ph-t43-focus-top{
  display:flex;
  justify-content:space-between;
  align-items:center;
}

.ph-t43-focus-top>span{
  padding:4px 9px;
  border-radius:999px;
  color:#f7cf75;
  background:rgba(247,200,93,.08);
  border:1px solid rgba(247,200,93,.16);
  font-size:8.5px;
}

.ph-t43-focus-top>small{
  color:rgba(210,230,235,.34);
  font-size:9px;
  direction:ltr;
}

.ph-t43-focus-body{
  display:grid;
  grid-template-columns:54px minmax(0,1fr);
  gap:16px;
  align-items:center;
  margin-top:15px;
}

.ph-t43-focus-icon{
  display:flex;
  width:52px;
  height:52px;
  align-items:center;
  justify-content:center;
  border-radius:15px;
  background:rgba(236,72,153,.15);
  border:1px solid rgba(236,72,153,.29);
}

.ph-t43-focus-icon span{
  width:19px;
  height:19px;
  border-radius:50%;
  background:#ff69bd;
  box-shadow:0 0 13px rgba(236,72,153,.60);
}

.ph-t43-focus-body h3{
  margin:0;
  font-size:20px;
}

.ph-t43-focus-body p{
  margin:7px 0 0;
  color:rgba(215,230,235,.58);
  font-size:11.5px;
  line-height:1.9;
}

.ph-t43-focus-result{
  display:flex;
  gap:11px;
  margin-top:14px;
  padding-top:13px;
  border-top:1px solid rgba(255,255,255,.05);
  color:rgba(213,229,234,.55);
  font-size:10px;
}

.ph-t43-focus-result span{
  color:#f4c85f;
}

.ph-t43-focus-result strong{
  font-weight:400;
}


/* SERVICES */

.ph-t43-services{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
  margin-top:14px;
}

.ph-t43-service{
  --svc:#22d3ee;

  display:grid;
  grid-template-columns:10px minmax(0,1fr);
  gap:11px;
  align-items:center;
  min-height:67px;
  padding:12px 13px;

  border:1px solid rgba(115,202,221,.11);
  border-radius:13px;

  color:#fff;
  background:rgba(7,30,43,.68);
  text-align:right;
  cursor:pointer;

  transition:.25s ease;
}

.ph-t43-service:hover,
.ph-t43-service.is-active{
  transform:translateY(-2px);
  border-color:var(--svc);
  background:rgba(8,39,54,.82);
}

.ph-t43-service>i{
  width:7px;
  height:38px;
  border-radius:999px;
  background:var(--svc);
  box-shadow:0 0 11px var(--svc);
}

.ph-t43-service strong{
  display:block;
  color:#eef7f9;
  font-size:11.5px;
}

.ph-t43-service small{
  display:block;
  margin-top:4px;
  color:rgba(208,227,233,.43);
  font-size:8.5px;
}

.ph-t43-service--social{--svc:var(--t43-pink)}
.ph-t43-service--campaign{--svc:var(--t43-orange)}
.ph-t43-service--video{--svc:var(--t43-cyan)}
.ph-t43-service--catalog{--svc:var(--t43-gold)}
.ph-t43-service--landing{--svc:var(--t43-blue)}
.ph-t43-service--analytics{--svc:var(--t43-green)}


/* ACTIONS */

.ph-t43-actions{
  display:flex;
  gap:12px;
  align-items:center;
  margin-top:17px;
}

.ph-t43-actions a{
  text-decoration:none;
}

.ph-t43-primary{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:13px;
  min-height:48px;
  padding:0 20px;
  border-radius:12px;

  color:#07131d;

  background:
    linear-gradient(
      105deg,
      #f4c85e,
      #ff9f67 43%,
      #f05cba 100%
    );

  font-size:11.5px;
  font-weight:700;
}

.ph-t43-secondary{
  display:inline-flex;
  min-height:48px;
  padding:0 18px;
  align-items:center;
  border:1px solid rgba(69,220,239,.19);
  border-radius:12px;
  color:#54e1ef;
  background:rgba(9,38,52,.40);
  font-size:11px;
}


/* OUTCOMES */

.ph-t43-outcomes{
  position:relative;
  z-index:2;

  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));

  margin-top:48px;

  border-top:1px solid rgba(89,188,210,.13);
  border-bottom:1px solid rgba(89,188,210,.08);
}

.ph-t43-outcomes>div{
  display:grid;
  grid-template-columns:34px minmax(0,1fr);
  column-gap:11px;
  padding:24px 18px;
  border-left:1px solid rgba(89,188,210,.09);
  direction:rtl;
}

.ph-t43-outcomes>div:first-child{
  border-left:0;
}

.ph-t43-outcomes span{
  grid-row:1 / span 2;
  display:flex;
  width:32px;
  height:32px;
  align-items:center;
  justify-content:center;
  border:1px solid rgba(95,218,239,.20);
  border-radius:50%;
  color:#67e6f4;
}

.ph-t43-outcomes strong{
  font-size:11.5px;
}

.ph-t43-outcomes small{
  margin-top:4px;
  color:rgba(203,224,229,.42);
  font-size:8.7px;
}


/* TABLET */

@media(max-width:1180px){

  .ph-t43-layout{
    grid-template-columns:minmax(0,1fr) minmax(390px,.9fr);
    gap:34px;
  }

  .ph-t43-visual{
    min-height:610px;
  }

  .ph-t43-node{
    width:128px;
    min-height:118px;
  }

  .ph-t43-core{
    width:168px;
    height:168px;
  }
}


/* STACK */

@media(max-width:900px){

  .ph-t43{
    padding:78px 0 35px;
  }

  .ph-t43-layout{
    grid-template-columns:1fr;
    grid-template-areas:
      "content"
      "visual";
    gap:38px;
    direction:rtl;
  }

  .ph-t43-content{grid-area:content}
  .ph-t43-visual{
    grid-area:visual;
    min-height:640px;
  }

  .ph-t43-index strong{
    font-size:65px;
  }

  .ph-t43-head h2{
    font-size:clamp(34px,7vw,46px);
  }
}


/* MOBILE */

@media(max-width:620px){

  .ph-t43{
    padding-top:68px;
  }

  .ph-t43-head h2{
    font-size:32px;
    line-height:1.32;
  }

  .ph-t43-head>p{
    font-size:12.5px;
  }

  .ph-t43-index strong{
    font-size:56px;
  }

  .ph-t43-services{
    grid-template-columns:1fr;
  }

  .ph-t43-actions{
    flex-direction:column;
    align-items:stretch;
  }

  .ph-t43-primary,
  .ph-t43-secondary{
    width:100%;
    justify-content:center;
  }

  .ph-t43-visual{
    min-height:650px;
    overflow:hidden;
  }

  .ph-t43-orbit{
    width:570px;
    transform:
      translate(-50%,-50%)
      scale(.72)
      rotate(-3deg);
  }

  .ph-t43-node{
    width:136px;
  }

  .ph-t43-outcomes{
    grid-template-columns:1fr 1fr;
  }
}


/* ACCESSIBILITY */

@media(prefers-reduced-motion:reduce){

  .ph-t43-ring,
  .ph-t43-core-glow,
  .ph-t43-node,
  .ph-t43-space i{
    animation:none!important;
  }
}

/* END P581H SECTION 08 TARHE43 */

/* P581L TARHE43 MOBILE ORBIT UP */

@media(max-width:620px){

  .ph-t43-orbit{
    top:42%!important;
  }

}

/* END P581L TARHE43 MOBILE ORBIT UP */

/* P581M TARHE43 MOBILE ORBIT POSITION FINAL */

@media(max-width:620px){

  .ph-t43-visual{
    min-height:570px!important;
  }

  .ph-t43-orbit{
    top:31%!important;
  }

}

/* END P581M TARHE43 MOBILE ORBIT POSITION FINAL */

/* P581O TARHE43 GOLD HEADING + PRIMARY CTA */

/* second headline line */
.ph-t43-head h2>strong{
  color:#f4c85e!important;

  background:
    linear-gradient(
      90deg,
      #c99736 0%,
      #f4c85e 30%,
      #ffe29a 52%,
      #e3ad43 76%,
      #bf8628 100%
    )!important;

  -webkit-background-clip:text!important;
  background-clip:text!important;

  -webkit-text-fill-color:transparent!important;

  text-shadow:
    0 0 22px rgba(244,200,94,.10);
}


/* primary digital marketing CTA */
.ph-t43-primary{
  color:#171005!important;

  border:1px solid rgba(255,226,154,.62)!important;

  background:
    linear-gradient(
      110deg,
      #b98024 0%,
      #e7b648 24%,
      #ffe29a 50%,
      #e8b64b 74%,
      #bd8427 100%
    )!important;

  box-shadow:
    0 8px 25px rgba(224,171,60,.16),
    inset 0 1px 0 rgba(255,255,255,.36)!important;
}

.ph-t43-primary:hover{
  filter:brightness(1.08)!important;

  box-shadow:
    0 10px 32px rgba(224,171,60,.24),
    inset 0 1px 0 rgba(255,255,255,.42)!important;
}

/* END P581O TARHE43 GOLD HEADING + PRIMARY CTA */

/* P581P TARHE43 DESKTOP INDEX POSITION */

@media(min-width:901px){

  .ph-t43-meta{
    justify-content:flex-start!important;
    align-items:flex-start!important;
    gap:22px!important;
  }

  .ph-t43-index{
    order:-1!important;
    flex:0 0 auto!important;
    margin:0!important;
  }

  .ph-t43-meta>span{
    margin-top:13px!important;
  }

}

/* END P581P TARHE43 DESKTOP INDEX POSITION */
