/* PluginPip 2027 Services: six-service scroll morph. */
.pp-stage--services .pp-service-morph{position:relative;aspect-ratio:1;min-height:0;width:min(100%,650px);max-width:none;overflow:visible;filter:none;isolation:isolate;transform:none}
.pp-stage--services .pp-service-morph::before{content:"";position:absolute;inset:12% 10%;background:radial-gradient(ellipse at 51% 51%,rgba(139,71,222,.27),transparent 69%);filter:blur(18px);pointer-events:none}
.pp-service-morph__centre{position:absolute;inset:30% 19%;z-index:1;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;color:#eadcff;pointer-events:none;transition:opacity .2s ease,transform .2s ease}
.pp-service-morph__centre>span{font-size:clamp(.58rem,.79vw,.75rem);letter-spacing:.18em;font-weight:850;color:#c7ff5b}
.pp-service-morph__centre strong{margin:.85rem 0 1.1rem;font-family:Impact,'Arial Narrow',sans-serif;font-weight:850;line-height:1.04;letter-spacing:-.025em;font-size:clamp(1.65rem,2.55vw,2.9rem)}
.pp-service-morph__centre small{font-size:.59rem;letter-spacing:.19em;font-weight:800;color:#ad98ca}
.pp-service-morph__tiles{position:absolute;inset:0;z-index:2}
.pp-stage--services .pp-service-morph__tile{position:absolute;top:0;left:0;display:flex;flex-direction:column;align-items:stretch;justify-content:space-between;width:27%;height:34%;min-width:0;box-sizing:border-box;padding:clamp(.62rem,1vw,.95rem);border:1px solid rgba(255,255,255,.54);border-radius:17px 17px 6px 17px;background:#a56cec;color:#261238;text-decoration:none;box-shadow:0 12px 26px rgba(5,1,31,.28),inset 0 1px 0 rgba(255,255,255,.32);overflow:hidden;transform-origin:center;will-change:transform;transition:border-color .2s ease,box-shadow .2s ease}
.pp-stage--services .pp-service-morph__tile:hover,.pp-stage--services .pp-service-morph__tile:focus-visible{border-color:#f7ffca;box-shadow:0 18px 35px rgba(5,1,31,.36),0 0 0 2px #d1fa52;outline:none;z-index:4}
.pp-service-morph__tile--websites{background:linear-gradient(155deg,#e5ffb0,#c5f44a 72%,#a8df32)}
.pp-service-morph__tile--wordpress{background:linear-gradient(155deg,#e4d3ff,#c39ef5 72%,#a275ed)}
.pp-service-morph__tile--ecommerce{background:linear-gradient(155deg,#ffd9ed,#f3a4d1 68%,#ea78b7)}
.pp-service-morph__tile--software{background:linear-gradient(155deg,#cab6ff,#9478ee 68%,#7456c9);color:#fff}
.pp-service-morph__tile--hosting{background:linear-gradient(155deg,#ffdfa7,#f5b75e 68%,#e88f45)}
.pp-service-morph__tile--seo{background:linear-gradient(155deg,#d8f3ff,#a1d2ed 68%,#72afda)}
.pp-service-morph__tile-label{position:relative;z-index:2;display:block;font-weight:900;letter-spacing:.055em;font-size:clamp(.55rem,.69vw,.72rem);line-height:1.2;overflow-wrap:normal}
.pp-service-morph__tile-foot{position:relative;z-index:2;font-size:clamp(.42rem,.56vw,.6rem);font-weight:900;letter-spacing:.12em;opacity:.65}
.pp-service-morph__art{position:absolute;inset:14% 10% 12%;display:block}
.pp-service-morph__art i{position:absolute;display:block;border-style:solid;border-color:currentColor}
.pp-service-morph__tile--websites .pp-service-morph__art i:first-child{inset:18% 6% 18%;border-width:3px;border-radius:7px}
.pp-service-morph__tile--websites .pp-service-morph__art i:nth-child(2){top:34%;left:9%;right:9%;border-width:2px 0 0}
.pp-service-morph__tile--websites .pp-service-morph__art i:nth-child(3){top:48%;left:18%;width:28%;height:15%;border:0;background:currentColor;opacity:.3}
.pp-service-morph__tile--wordpress .pp-service-morph__art i:first-child{inset:20% 21%;border-width:4px;border-radius:50%}
.pp-service-morph__tile--wordpress .pp-service-morph__art i:nth-child(2){inset:30% 31%;border-width:2px;transform:rotate(45deg)}
.pp-service-morph__tile--wordpress .pp-service-morph__art i:nth-child(3){left:49%;top:9%;height:79%;border-width:0 0 0 2px;transform:rotate(31deg)}
.pp-service-morph__tile--ecommerce .pp-service-morph__art i:first-child{top:28%;left:15%;width:65%;height:50%;border-width:3px;border-radius:4px}
.pp-service-morph__tile--ecommerce .pp-service-morph__art i:nth-child(2){top:15%;left:31%;width:34%;height:30%;border-width:3px;border-radius:50% 50% 0 0}
.pp-service-morph__tile--ecommerce .pp-service-morph__art i:nth-child(3){top:47%;left:40%;width:19%;height:2px;border:0;background:currentColor}
.pp-service-morph__tile--software .pp-service-morph__art i:first-child{inset:16% 7%;border-width:3px;border-radius:8px}
.pp-service-morph__tile--software .pp-service-morph__art i:nth-child(2){left:17%;top:39%;width:24%;height:25%;border-width:0 0 4px 4px;transform:rotate(45deg)}
.pp-service-morph__tile--software .pp-service-morph__art i:nth-child(3){right:20%;top:39%;width:24%;height:25%;border-width:4px 4px 0 0;transform:rotate(45deg)}
.pp-service-morph__tile--hosting .pp-service-morph__art i:first-child{inset:20% 9% 52%;border-width:3px;border-radius:5px}
.pp-service-morph__tile--hosting .pp-service-morph__art i:nth-child(2){inset:51% 9% 21%;border-width:3px;border-radius:5px}
.pp-service-morph__tile--hosting .pp-service-morph__art i:nth-child(3){right:20%;top:34%;width:10%;height:10%;border:0;border-radius:50%;background:currentColor;box-shadow:0 40px 0 currentColor}
.pp-service-morph__tile--seo .pp-service-morph__art i:first-child{left:13%;top:22%;height:57%;width:58%;border-width:0 0 4px 4px}
.pp-service-morph__tile--seo .pp-service-morph__art i:nth-child(2){left:26%;top:42%;width:38%;height:26%;border-width:4px 4px 0 0;transform:rotate(-26deg)}
.pp-service-morph__tile--seo .pp-service-morph__art i:nth-child(3){left:54%;top:22%;width:20%;height:20%;border-width:4px 4px 0 0;transform:rotate(-10deg)}
/* Static fallback before JS and for reduced motion. Tiles are always navigable. */
.pp-service-morph__tile:nth-child(1){transform:translate(25%,8%) rotate(-13deg)}
.pp-service-morph__tile:nth-child(2){transform:translate(135%,0%) rotate(-3deg)}
.pp-service-morph__tile:nth-child(3){transform:translate(245%,15%) rotate(13deg)}
.pp-service-morph__tile:nth-child(4){transform:translate(25%,178%) rotate(11deg)}
.pp-service-morph__tile:nth-child(5){transform:translate(135%,188%) rotate(2deg)}
.pp-service-morph__tile:nth-child(6){transform:translate(245%,176%) rotate(-12deg)}
@media(max-width:1199px){.pp-stage--services .pp-service-morph__tile{width:28%;height:31%;padding:.65rem}.pp-service-morph__centre strong{font-size:clamp(1.4rem,2.4vw,2.1rem)}}
@media(max-width:780px){
 .pp-stage--services .pp-service-morph{width:min(100%,520px);margin:2rem auto 0;aspect-ratio:1.12;transform:none}
 .pp-service-morph__centre{display:none}
 .pp-stage--services .pp-service-morph__tile{width:30%;height:43%;padding:.72rem}
 .pp-service-morph__tile:nth-child(1){transform:translate(4%,2%) rotate(-4deg)}
 .pp-service-morph__tile:nth-child(2){transform:translate(116%,1%) rotate(0deg)}
 .pp-service-morph__tile:nth-child(3){transform:translate(228%,2%) rotate(4deg)}
 .pp-service-morph__tile:nth-child(4){transform:translate(4%,129%) rotate(3deg)}
 .pp-service-morph__tile:nth-child(5){transform:translate(116%,129%) rotate(0deg)}
 .pp-service-morph__tile:nth-child(6){transform:translate(228%,129%) rotate(-3deg)}
 .pp-service-morph__tile-label{font-size:clamp(.53rem,1.7vw,.73rem)}
}
@media(max-width:460px){.pp-stage--services .pp-service-morph{aspect-ratio:1.08}.pp-stage--services .pp-service-morph__tile{width:30.5%;height:42%;padding:.52rem;border-radius:10px 10px 4px 10px}.pp-service-morph__tile-label{font-size:.51rem}.pp-service-morph__tile-foot{font-size:.4rem}}
@media(prefers-reduced-motion:reduce){.pp-stage--services .pp-service-morph__tile{will-change:auto;transition:none}.pp-service-morph__centre{transition:none}}


/* Restrained editorial revision: fewer visual competing elements, less saturation. */
.pp-stage--services .pp-service-morph::before{
  inset:19% 16%;
  background:radial-gradient(ellipse at 50% 51%,rgba(161,127,205,.12),transparent 72%);
  filter:blur(16px);
}
.pp-stage--services .pp-service-morph__tile{
  width:24%;height:29%;
  padding:clamp(.7rem,1.05vw,1rem);
  border:1px solid rgba(255,255,255,.2);
  border-radius:13px 13px 5px 13px;
  color:#2b2040;
  box-shadow:0 14px 36px rgba(9,3,27,.17);
  backdrop-filter:none;
  transition:border-color .2s ease,box-shadow .2s ease;
}
.pp-stage--services .pp-service-morph__tile--websites{
  background:linear-gradient(147deg,#e7e7db,#b9c6a7);
}
.pp-stage--services .pp-service-morph__tile--wordpress{
  background:linear-gradient(147deg,#eee9e5,#c5bdbf);
}
.pp-stage--services .pp-service-morph__tile--ecommerce{
  background:linear-gradient(147deg,#eee1dd,#c7b0ad);
}
.pp-stage--services .pp-service-morph__tile--software{
  background:linear-gradient(147deg,#c9c5d4,#807b9a);
  color:#201632;
}
.pp-stage--services .pp-service-morph__tile--hosting{
  background:linear-gradient(147deg,#dcded8,#a4b2a8);
}
.pp-stage--services .pp-service-morph__tile--seo{
  background:linear-gradient(147deg,#e1e6df,#acbcb6);
}
.pp-stage--services .pp-service-morph__art{
  inset:18% 12% 18%;
  opacity:.25;
  transform:scale(.78);
}
.pp-stage--services .pp-service-morph__art i{
  border-width:2px;
}
.pp-stage--services .pp-service-morph__tile-label{
  font-size:clamp(.58rem,.77vw,.75rem);
  font-weight:800;
  letter-spacing:.055em;
}
.pp-stage--services .pp-service-morph__tile-foot{display:none}
.pp-stage--services .pp-service-morph__centre{
  inset:34% 16% 36%;
  opacity:1;
  color:#f0e7ff;
}
.pp-stage--services .pp-service-morph__centre>span{
  color:#d1fa52;
  letter-spacing:.16em;
}
.pp-stage--services .pp-service-morph__centre strong{
  font-size:clamp(1.35rem,2vw,2.3rem);
  line-height:1.09;
  margin:.65rem 0 .8rem;
  white-space:nowrap;
}
.pp-stage--services .pp-service-morph__centre small{
  color:#bfb1d6;
}
.pp-stage--services .pp-service-morph__tile:hover,
.pp-stage--services .pp-service-morph__tile:focus-visible{
  border-color:rgba(211,250,82,.85);
  box-shadow:0 20px 36px rgba(8,2,31,.28),0 0 0 1px rgba(211,250,82,.55);
}
@media(max-width:780px){
 .pp-stage--services .pp-service-morph__tile{width:30%;height:42%;padding:.8rem}
 .pp-stage--services .pp-service-morph__centre{display:none}
 .pp-stage--services .pp-service-morph__art{transform:scale(.8)}
 .pp-stage--services .pp-service-morph__tile-label{font-size:clamp(.56rem,1.8vw,.72rem)}
}
@media(max-width:460px){
 .pp-stage--services .pp-service-morph__tile{width:30%;height:41%;padding:.55rem;border-radius:10px 10px 4px 10px}
 .pp-stage--services .pp-service-morph__tile-label{font-size:.55rem}
}


/* PluginPip 2027 | Rich photographic service-morph direction.
   Image photography is illustrative; local portfolio content is unchanged. */
.pp-stage--services .pp-service-morph::before{
  inset:15% 8%;
  background:radial-gradient(ellipse at 50% 49%,rgba(120,50,206,.36),rgba(90,39,148,.10) 50%,transparent 74%);
  filter:blur(24px);
}
.pp-stage--services .pp-service-morph__tile{
  color:#fff;
  border:3px solid #f1eaff;
  border-radius:12px;
  padding:clamp(.85rem,1.15vw,1.1rem);
  isolation:isolate;
  background-color:#492781;
  background-image:linear-gradient(155deg,#7050a1,#2c1c52);
  box-shadow:0 14px 28px rgba(5,1,26,.26);
  transition:box-shadow .25s ease,border-color .25s ease,filter .25s ease;
}
.pp-stage--services .pp-service-morph__tile::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-2;
  border-radius:inherit;
  background-size:cover;
  background-position:center;
  filter:saturate(1.1) contrast(1.08);
  transition:filter .25s ease;
}
.pp-stage--services .pp-service-morph__tile::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  border-radius:inherit;
  background:linear-gradient(180deg,rgba(17,9,40,.30),rgba(14,7,35,.04) 36%,rgba(10,5,25,.15) 61%,rgba(13,5,31,.85) 100%);
  pointer-events:none;
}
.pp-stage--services .pp-service-morph__tile--websites{background:#4b3f83}
.pp-stage--services .pp-service-morph__tile--websites::before{background-image:url('https://images.unsplash.com/photo-1498050108023-c5249f4df085?auto=format&fit=crop&w=640&h=760&q=82')}
.pp-stage--services .pp-service-morph__tile--wordpress{background:#6042a7}
.pp-stage--services .pp-service-morph__tile--wordpress::before{background-image:url('https://images.unsplash.com/photo-1547658719-da2b51169166?auto=format&fit=crop&w=640&h=760&q=82')}
.pp-stage--services .pp-service-morph__tile--ecommerce{background:#b65f92}
.pp-stage--services .pp-service-morph__tile--ecommerce::before{background-image:url('https://images.unsplash.com/photo-1556742049-0cfed4f6a45d?auto=format&fit=crop&w=640&h=760&q=82')}
.pp-stage--services .pp-service-morph__tile--software{background:#6145a0;color:#fff}
.pp-stage--services .pp-service-morph__tile--software::before{background-image:url('https://images.unsplash.com/photo-1555066931-4365d14bab8c?auto=format&fit=crop&w=640&h=760&q=82')}
.pp-stage--services .pp-service-morph__tile--hosting{background:#315b78}
.pp-stage--services .pp-service-morph__tile--hosting::before{background-image:url('https://images.unsplash.com/photo-1558494949-ef010cbdcc31?auto=format&fit=crop&w=640&h=760&q=82')}
.pp-stage--services .pp-service-morph__tile--seo{background:#39786c}
.pp-stage--services .pp-service-morph__tile--seo::before{background-image:url('https://images.unsplash.com/photo-1460925895917-afdab827c52f?auto=format&fit=crop&w=640&h=760&q=82')}
.pp-stage--services .pp-service-morph__art{display:none}
.pp-stage--services .pp-service-morph__tile-label{
  align-self:flex-start;
  margin-top:auto;
  padding:0;
  font-family:inherit;
  font-weight:850;
  font-size:clamp(.72rem,.93vw,.94rem);
  line-height:1.2;
  letter-spacing:.025em;
  color:#fff;
  text-shadow:0 1px 8px rgba(0,0,0,.6);
}
.pp-stage--services .pp-service-morph__tile:hover,
.pp-stage--services .pp-service-morph__tile:focus-visible{
  border-color:#d1fa52;
  box-shadow:0 18px 34px rgba(5,1,26,.36);
  filter:brightness(1.08);
}
.pp-stage--services .pp-service-morph__centre{
  color:#f1e8ff;
  inset:33% 17%;
}
.pp-stage--services .pp-service-morph__centre strong{
  font-size:clamp(1.5rem,2.05vw,2.4rem);
  line-height:1.08;
  text-shadow:0 5px 25px rgba(7,3,33,.5);
}
.pp-stage--services .pp-service-morph__centre>span{color:#cef849}
.pp-stage--services .pp-service-morph__centre small{color:#dbcaef}
@media(max-width:780px){
 .pp-stage--services .pp-service-morph__tile{padding:.7rem}
 .pp-stage--services .pp-service-morph__tile-label{font-size:clamp(.59rem,1.85vw,.8rem)}
}
@media(max-width:460px){
 .pp-stage--services .pp-service-morph__tile{padding:.56rem;border-radius:12px}
 .pp-stage--services .pp-service-morph__tile-label{font-size:.57rem}
}


/* Legible editorial centre, rather than compressed display type. */
.pp-stage--services .pp-service-morph__centre strong{
  font-family:inherit;
  font-weight:850;
  font-size:clamp(1.25rem,1.65vw,1.9rem);
  letter-spacing:-.035em;
  line-height:1.13;
  text-wrap:balance;
}