/* =========================================================
   V31 · Fluid reveal / cursor motion
   - removes editorial section numbering
   - tightens vertical rhythm so no section feels empty
   - adds scroll reveals and pointer-reactive surfaces
   - keeps the cinematic image scenes already present
   ========================================================= */

body.paypal-motion-home{
  --pp-x:50%;
  --pp-y:50%;
  --pp-spot:0;
  background:#f3f8f8!important;
}

/* Section numbers were removed from the markup; keep this as a safety net. */
body.paypal-motion-home .cinema-section-number,
body.paypal-motion-home .scene-meta{display:none!important}

/* Removing the number column also removes the awkward empty gutter it left behind. */
body.paypal-motion-home .cinema-intro-grid,
body.paypal-motion-home .cinema-process-head,
body.paypal-motion-home .cinema-pricing-head{
  grid-template-columns:minmax(0,1.12fr) minmax(300px,.68fr)!important;
  gap:clamp(34px,5vw,76px)!important;
  align-items:end!important;
}
body.paypal-motion-home .cinema-strip-head{
  grid-template-columns:1fr!important;
  gap:0!important;
  margin-bottom:clamp(34px,4vw,52px)!important;
}
body.paypal-motion-home .cinema-intro-grid>p,
body.paypal-motion-home .cinema-process-head>p{
  padding-top:0!important;
  align-self:end;
  margin-bottom:.25rem;
}
body.paypal-motion-home .cinema-dark-link{
  align-self:end!important;
  justify-self:end!important;
}

/* Compact, continuous vertical rhythm. No oversized blank bands. */
body.paypal-motion-home main>section{margin:0!important}
body.paypal-motion-home .cinema-intro{
  padding:clamp(68px,7vw,94px) 0!important;
  background:
    radial-gradient(circle at var(--pp-x) var(--pp-y),rgba(85,203,214,calc(var(--pp-spot)*.13)),transparent 30%),
    linear-gradient(180deg,#f8fbfb 0%,#eef7f7 100%)!important;
}
body.paypal-motion-home .cinema-strip{
  padding:clamp(58px,6vw,82px) 0!important;
  background:
    radial-gradient(circle at var(--pp-x) var(--pp-y),rgba(85,203,214,calc(var(--pp-spot)*.11)),transparent 30%),
    linear-gradient(180deg,#eef7f7 0%,#f7fbfb 100%)!important;
  border-color:rgba(18,53,77,.08)!important;
}
body.paypal-motion-home .cinema-process{
  padding:clamp(68px,7vw,94px) 0!important;
  background:
    radial-gradient(circle at var(--pp-x) var(--pp-y),rgba(85,203,214,calc(var(--pp-spot)*.12)),transparent 30%),
    linear-gradient(180deg,#f7fbfb 0%,#edf6f7 100%)!important;
}
body.paypal-motion-home .cinema-pricing{
  padding:clamp(72px,7vw,98px) 0!important;
  background:
    radial-gradient(circle at var(--pp-x) var(--pp-y),rgba(91,227,236,calc(var(--pp-spot)*.12)),transparent 26%),
    linear-gradient(160deg,#0d2739 0%,#081f2f 58%,#0c283c 100%)!important;
}
body.paypal-motion-home .cinema-pricing-list{margin-top:clamp(38px,5vw,58px)!important}

/* The photographic sections finish as soon as the visual story has been read. */
@media (min-width:901px){
  body.paypal-motion-home .cinema-sticky,
  body.paypal-motion-home .cinema-hero .cinema-sticky{
    height:clamp(620px,84svh,860px)!important;
  }
  body.paypal-motion-home .cinema-hero .cinema-sticky{height:clamp(650px,88svh,900px)!important}
}

/* Paypal-like reveal: visible movement, short travel, no long invisible wait. */
html.pp-motion-ready body.paypal-motion-home .pp-reveal{
  --pp-reveal-y:30px;
  --pp-reveal-scale:.975;
  --pp-rx:0deg;
  --pp-ry:0deg;
  --pp-card-x:0px;
  --pp-card-y:0px;
  opacity:0!important;
  transform:
    translate3d(var(--pp-card-x),calc(var(--pp-card-y) + var(--pp-reveal-y)),0)
    rotateX(var(--pp-rx)) rotateY(var(--pp-ry))
    scale(var(--pp-reveal-scale))!important;
  transition:
    opacity .62s cubic-bezier(.2,.78,.22,1),
    transform .82s cubic-bezier(.16,1,.3,1),
    box-shadow .35s ease,
    border-color .35s ease,
    background .35s ease!important;
  transition-delay:var(--pp-delay,0ms)!important;
  will-change:transform,opacity;
}
html.pp-motion-ready body.paypal-motion-home .pp-reveal.pp-in{
  --pp-reveal-y:0px;
  --pp-reveal-scale:1;
  opacity:1!important;
}

/* Word-by-word headings. */
body.paypal-motion-home .pp-heading{overflow:visible}
body.paypal-motion-home .pp-word-mask{
  display:inline-block;
  overflow:hidden;
  vertical-align:bottom;
  padding:.05em .015em .11em;
  margin-bottom:-.11em;
}
body.paypal-motion-home .pp-word{
  display:inline-block;
  opacity:0;
  transform:translate3d(0,115%,0) rotate(2.5deg);
  transform-origin:left bottom;
  transition:
    opacity .46s ease,
    transform .82s cubic-bezier(.16,1,.3,1);
  transition-delay:calc(var(--pp-word-index,0) * 42ms + 40ms);
}
body.paypal-motion-home .pp-heading.pp-in .pp-word{
  opacity:1;
  transform:translate3d(0,0,0) rotate(0);
}

/* Pointer-reactive cards: spotlight + restrained 3D tilt. */
body.paypal-motion-home .pp-card{
  --pp-mx:50%;
  --pp-my:50%;
  position:relative;
  isolation:isolate;
  transform-style:preserve-3d;
}
body.paypal-motion-home .pp-card::before{
  content:"";
  position:absolute;
  z-index:-1;
  inset:-1px;
  border-radius:inherit;
  pointer-events:none;
  opacity:var(--pp-card-glow,0);
  background:radial-gradient(circle 180px at var(--pp-mx) var(--pp-my),rgba(73,158,218,.23),transparent 72%);
  transition:opacity .28s ease;
}
body.paypal-motion-home .pp-card.pp-in:hover{
  --pp-card-y:-7px;
  --pp-card-glow:1;
  border-color:rgba(30,117,179,.28)!important;
  box-shadow:0 24px 55px rgba(10,47,74,.12)!important;
}
body.paypal-motion-home .cinema-price-row.pp-card::before{
  z-index:0;
  background:radial-gradient(circle 260px at var(--pp-mx) var(--pp-my),rgba(86,173,235,.14),transparent 70%);
}
body.paypal-motion-home .cinema-price-row.pp-card>*{position:relative;z-index:1}
body.paypal-motion-home .cinema-price-row.pp-card.pp-in:hover{
  --pp-card-y:-3px;
  background:rgba(255,255,255,.075)!important;
  box-shadow:none!important;
}

/* Client cards get a small image zoom instead of feeling static. */
body.paypal-motion-home .client-marquee figure.pp-card{overflow:hidden}
body.paypal-motion-home .client-marquee figure.pp-card img{
  transition:transform .65s cubic-bezier(.16,1,.3,1),filter .35s ease;
}
body.paypal-motion-home .client-marquee figure.pp-card:hover img{
  transform:scale(1.055) translateY(-2px);
  filter:saturate(1.06);
}

/* Process cards are denser and fill the section instead of leaving dead air. */
body.paypal-motion-home .process-horizontal{padding-top:clamp(30px,4vw,48px)!important}
body.paypal-motion-home .process-horizontal ol{gap:14px!important}
body.paypal-motion-home .process-horizontal li{
  min-height:176px!important;
  background:rgba(255,255,255,.88)!important;
  backdrop-filter:blur(10px);
}
body.paypal-motion-home .process-horizontal li>b{
  display:inline-flex;
  width:max-content;
  padding:6px 9px;
  border-radius:999px;
  background:rgba(21,104,163,.09);
}

/* Magnetic buttons and links. */
body.paypal-motion-home .pp-magnetic{
  --pp-mag-x:0px;
  --pp-mag-y:0px;
  transform:translate3d(var(--pp-mag-x),var(--pp-mag-y),0)!important;
  transition:transform .2s cubic-bezier(.2,.8,.2,1),background .25s ease,border-color .25s ease!important;
}
body.paypal-motion-home .cinema-text-link.pp-magnetic{display:inline-flex}

/* A soft desktop cursor light gives the page a living surface without hiding content. */
.pp-cursor-light{
  position:fixed;
  z-index:2;
  left:0;top:0;
  width:260px;height:260px;
  border-radius:50%;
  pointer-events:none;
  opacity:0;
  background:radial-gradient(circle,rgba(49,146,214,.13) 0%,rgba(49,146,214,.055) 36%,transparent 72%);
  transform:translate3d(calc(var(--cursor-x,50vw) - 130px),calc(var(--cursor-y,50vh) - 130px),0);
  transition:opacity .28s ease;
  mix-blend-mode:multiply;
}
html.pp-pointer-active .pp-cursor-light{opacity:1}

/* Scene buttons get a lively sheen on hover. */
body.paypal-motion-home .cinema-btn{position:relative;overflow:hidden}
body.paypal-motion-home .cinema-btn::after{
  content:"";
  position:absolute;
  inset:-120% -35%;
  pointer-events:none;
  background:linear-gradient(110deg,transparent 34%,rgba(255,255,255,.56) 48%,transparent 62%);
  transform:translateX(-70%) rotate(7deg);
  transition:transform .65s cubic-bezier(.16,1,.3,1);
}
body.paypal-motion-home .cinema-btn:hover::after{transform:translateX(72%) rotate(7deg)}

@media (max-width:900px){
  body.paypal-motion-home .cinema-intro-grid,
  body.paypal-motion-home .cinema-process-head,
  body.paypal-motion-home .cinema-pricing-head,
  body.paypal-motion-home .cinema-strip-head{
    grid-template-columns:1fr!important;
    gap:18px!important;
  }
  body.paypal-motion-home .cinema-dark-link{justify-self:start!important}
  body.paypal-motion-home .cinema-intro,
  body.paypal-motion-home .cinema-process,
  body.paypal-motion-home .cinema-pricing{padding:56px 0 64px!important}
  body.paypal-motion-home .cinema-strip{padding:52px 0 60px!important}
  body.paypal-motion-home .process-horizontal{padding-top:24px!important}
  body.paypal-motion-home .process-horizontal li{min-height:0!important}
  .pp-cursor-light{display:none}
  body.paypal-motion-home .pp-card.pp-in:hover{--pp-card-y:0px}
}

@media (max-width:600px){
  body.paypal-motion-home .cinema-intro,
  body.paypal-motion-home .cinema-process,
  body.paypal-motion-home .cinema-pricing{padding:46px 0 54px!important}
  body.paypal-motion-home .cinema-strip{padding:44px 0 50px!important}
  html.pp-motion-ready body.paypal-motion-home .pp-reveal{--pp-reveal-y:20px}
}

@media (prefers-reduced-motion:reduce){
  html.pp-motion-ready body.paypal-motion-home .pp-reveal,
  body.paypal-motion-home .pp-word,
  body.paypal-motion-home .pp-magnetic{
    opacity:1!important;
    transform:none!important;
    transition:none!important;
  }
  .pp-cursor-light{display:none!important}
}
