/* Original Animasite pricing cards, scoped to preserve the surrounding projection. */
.original-pricing{--text:#21183a;--muted:#675978;--blue:#a832d4;--blue-dark:#43238f;--navy:#17122f;display:block;margin:36px 0 22px;color:var(--text);font:16px/1.65 Arial,Helvetica,sans-serif;container-type:inline-size}
.original-pricing p{font-size:inherit;line-height:inherit}
.original-pricing .pricing-card h3{font-family:inherit;font-weight:700;letter-spacing:normal}
.original-pricing .pricing-button{display:inline-flex;align-items:center;justify-content:center;padding:14px 22px;border:0;border-radius:999px;font:800 16px/1.65 Arial,Helvetica,sans-serif;color:#fff;background:linear-gradient(135deg,var(--blue-dark),var(--blue));box-shadow:0 16px 40px rgba(149,55,216,.30);text-decoration:none;clip-path:none;transition:.22s ease}
.original-pricing .pricing-button:hover{transform:translateY(-2px)}
.original-pricing .pricing-button:focus-visible{outline:3px solid #43238f;outline-offset:5px}
.original-pricing .pricing-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 20px;
  align-items: stretch;
}
.original-pricing .pricing-card {
  position: relative;
  display: flex;
  flex-direction: column;
  min-width: 0;
  overflow: hidden;
  border-radius: 30px;
  background: rgba(255,255,255,.92);
  border: 1px solid rgba(149,55,216,.16);
  box-shadow: 0 28px 70px rgba(74,35,126,.13);
  transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease;
}
.original-pricing .pricing-card:hover {
  transform: translateY(-7px);
  border-color: rgba(149,55,216,.38);
  box-shadow: 0 36px 90px rgba(74,35,126,.20);
}
.original-pricing .pricing-paypal-ribbon {
  position: absolute;
  z-index: 3;
  top: 52px;
  right: -54px;
  width: 240px;
  padding: 8px 34px;
  transform: rotate(35deg);
  background: linear-gradient(135deg, #003087, #0070e0);
  color: #fff;
  box-shadow: 0 8px 22px rgba(0, 48, 135, .28);
  font-size: .68rem;
  font-weight: 800;
  line-height: 1.2;
  letter-spacing: .025em;
  text-align: center;
  white-space: nowrap;
  pointer-events: none;
}
.original-pricing .pricing-paypal-ribbon::after {
  content: "";
  display: inline-block;
  width: 7px;
  height: 7px;
  margin-left: 6px;
  border-radius: 50%;
  background: #ffc439;
  box-shadow: 0 0 0 2px rgba(255,255,255,.32);
  vertical-align: 1px;
}
.original-pricing .pricing-card-featured {
  border-color: rgba(149,55,216,.42);
  box-shadow: 0 32px 86px rgba(104,45,158,.21);
}
.original-pricing .pricing-card-signature {
  background:
    radial-gradient(circle at top right, rgba(230,64,210,.11), transparent 30%),
    rgba(255,255,255,.94);
  border-color: rgba(230,64,210,.34);
}
.original-pricing .pricing-media {
  display: grid;
  place-items: center;
  width: 100%;
  aspect-ratio: 16 / 10;
  padding: 14px;
  overflow: hidden;
  background:
    radial-gradient(circle at 50% 50%, rgba(149,55,216,.07), transparent 58%),
    linear-gradient(180deg, #fff, #faf7fe);
  border-bottom: 1px solid rgba(149,55,216,.12);
}
.original-pricing .pricing-media img {
  display: block;
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  object-position: center;
}
.original-pricing .pricing-content {
  display: flex;
  flex: 1;
  flex-direction: column;
  align-items: flex-start;
  padding: 26px;
}
.original-pricing .pricing-badge {
  display: inline-flex;
  padding: 7px 11px;
  margin-bottom: 16px;
  border-radius: 999px;
  color: #fff;
  background: linear-gradient(135deg, #43238f, #a832d4 68%, #e640d2);
  font-size: .7rem;
  font-weight: 900;
  letter-spacing: .13em;
  box-shadow: 0 10px 24px rgba(149,55,216,.22);
}
.original-pricing .pricing-card h3 {
  margin: 0 0 12px;
  font-size: clamp(1.55rem, 2vw, 2.1rem);
  line-height: 1.05;
  background: linear-gradient(90deg, #17122f, #43238f 45%, #a832d4 78%, #e640d2);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
}
.original-pricing .pricing-description {
  min-height: 5.2em;
  margin: 0 0 18px;
  color: var(--muted);
}
.original-pricing .pricing-price {
  display: flex;
  align-items: flex-start;
  gap: 5px;
  margin-top: 4px;
  color: var(--navy);
}
.original-pricing .pricing-price strong {
  font-size: clamp(2.55rem, 3.6vw, 4.1rem);
  line-height: .9;
  letter-spacing: -.05em;
}
.original-pricing .pricing-price span {
  margin-top: 2px;
  color: var(--blue);
  font-size: 1.45rem;
  font-weight: 900;
}
.original-pricing .pricing-content > small {
  margin: 8px 0 20px;
  color: var(--muted);
  font-weight: 700;
  letter-spacing: .04em;
}
.original-pricing .pricing-features {
  flex: 1;
  width: 100%;
  margin: 0 0 24px;
  padding: 0;
  list-style: none;
}
.original-pricing .pricing-features li {
  position: relative;
  padding: 9px 0 9px 27px;
  color: #3c3151;
  border-bottom: 1px solid rgba(149,55,216,.09);
}
.original-pricing .pricing-features li::before {
  content: "✓";
  position: absolute;
  left: 0;
  top: 9px;
  color: var(--blue);
  font-weight: 900;
}
.original-pricing .pricing-button {
  width: 100%;
  margin-top: auto;
  min-height: 54px;
}

/* The source changes to two columns at 1360px and one at 760px.
   Also account for the smaller usable width inside the current projection. */
@media(max-width:1360px){.original-pricing .pricing-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.original-pricing .pricing-description{min-height:auto}}
@container(max-width:970px){.original-pricing .pricing-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.original-pricing .pricing-description{min-height:auto}}
@media(max-width:760px){.original-pricing{margin-top:30px}.original-pricing .pricing-grid{grid-template-columns:1fr}.original-pricing .pricing-card{border-radius:22px}.original-pricing .pricing-content{padding:24px 22px}.original-pricing .pricing-price strong{font-size:3rem}}
@container(max-width:510px){.original-pricing .pricing-grid{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.original-pricing .pricing-card,.original-pricing .pricing-button{transition:none}.original-pricing .pricing-card:hover,.original-pricing .pricing-button:hover{transform:none}}
.motion-paused .original-pricing .pricing-card,.motion-paused .original-pricing .pricing-button{transition:none}

/* Project presentations retain their existing styling. */
.portfolio-heading{display:flex;gap:25px;justify-content:space-between;align-items:center}.portfolio-heading .page-heading{font-size:clamp(30px,3.2vw,44px);margin-bottom:16px}.project-count{font-size:42px;line-height:1;font-weight:200;color:#82dbe7;text-align:right;letter-spacing:-.06em}.project-count small{display:block;font:7px var(--mono);letter-spacing:.1em;color:#7299aa;margin-top:10px}
.project-list{margin-top:45px;display:grid;gap:52px}.project-case{display:grid;grid-template-columns:minmax(0,1.13fr) minmax(0,1fr);gap:28px;align-items:start;padding:24px 0 0;border-top:1px solid #709fa940;position:relative}.project-case:before{content:'';position:absolute;top:-1px;left:0;width:70px;height:2px;background:var(--project-accent)}
.project-image{position:relative;display:block;text-decoration:none;background:#0b1723;overflow:hidden;border:1px solid #6a879c35;transition:border-color .3s}.project-image img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;object-position:top;transition:transform .5s ease;filter:none}.project-image>span{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:15px 17px;color:#b6d6e2;font:8px var(--mono);letter-spacing:.09em;background:#102333}.project-image b{font-size:17px;color:var(--project-accent);font-weight:400}.project-image:hover{border-color:var(--project-accent)}.project-image:hover img{transform:scale(1.025)}
.project-meta{display:flex;justify-content:space-between;gap:15px;color:#89b2c4;font:8px/1.7 var(--mono);text-transform:uppercase;letter-spacing:.06em}.project-meta>span:last-child{color:var(--project-accent);font-size:12px}.project-copy h2{font-size:30px;line-height:1.16;letter-spacing:-.035em;font-weight:400;color:#eff8fc;margin:12px 0 16px}.project-copy>p{font-size:13px;line-height:1.85;color:#aebfcd;margin:0 0 19px}
.project-highlights{list-style:none;margin:0;padding:0;display:grid;gap:9px}.project-highlights li{position:relative;padding-left:15px;color:#b4cbd5;font-size:11px;line-height:1.75}.project-highlights li:before{content:'';position:absolute;left:0;top:7px;width:4px;height:4px;background:var(--project-accent);transform:rotate(45deg)}
.project-tech{margin-top:23px;padding-top:17px;border-top:1px solid #779eb327}.project-tech>span{font:7px var(--mono);letter-spacing:.16em;color:#6f97a9}.project-tech ul{display:flex;flex-wrap:wrap;gap:6px;list-style:none;margin:10px 0 0;padding:0}.project-tech li{padding:5px 8px;background:#42798f15;border:1px solid #5b8a9b25;color:#9bc7d3;font:8px var(--mono);line-height:1.5}
.project-links{display:flex;gap:15px;flex-wrap:wrap;align-items:center;margin-top:23px}.project-links>a{color:#a7edf0;font-size:12px;text-underline-offset:6px}.project-links>a>span{color:var(--project-accent);margin-left:10px}.project-links .company-site{font-size:9px;color:#7ca0b0}.portfolio-end{margin-top:58px;padding:38px 0 15px;border-top:1px solid #709fa940}.portfolio-end h2{font-weight:300;font-size:48px;letter-spacing:-.04em;margin:14px 0 24px}
@media(max-width:1270px){.project-case{grid-template-columns:1fr;gap:23px}.project-image img{aspect-ratio:16/9}.project-copy>p{font-size:14px}.project-highlights li{font-size:12px}.project-copy h2{font-size:34px}}
@media(min-width:761px) and (max-width:1000px){.portfolio-heading .page-heading{font-size:31px}.project-count{display:none}}
@media(max-width:760px){.portfolio-heading{gap:8px}.portfolio-heading .page-heading{font-size:30px}.project-count{display:none}.project-list{margin-top:30px;gap:36px}.project-case{gap:21px;padding-top:20px}.project-image img{aspect-ratio:3/2}.project-image>span{font-size:7px;padding:12px}.project-copy h2{font-size:29px}.project-copy>p{font-size:13px}.project-meta{font-size:7px}.project-highlights li{font-size:11px}.project-tech li{font-size:8px}.portfolio-end h2{font-size:40px}}
@media(prefers-reduced-motion:reduce){.project-image img{transition:none}.project-image:hover img{transform:none}}
.motion-paused .project-image img{transition:none}
.project-image{width:100%;padding:0;text-align:left;color:inherit;align-self:start;cursor:pointer}
.project-image:focus-visible{outline:2px solid #adf3fa;outline-offset:4px}
.project-live{grid-column:1/-1;min-width:0;scroll-margin-top:12px;border:1px solid #6fced859;background:#091824;padding:14px;animation:preview-project .4s ease both}
.project-live-toolbar{display:flex;justify-content:space-between;align-items:center;gap:15px}.project-live-toolbar>div:first-child{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.project-live-toolbar strong{font-size:15px;color:#e7f5f7;font-weight:400}.project-live-toolbar small{font:7px var(--mono);letter-spacing:.12em;color:#7696aa}.project-live-controls{display:flex;gap:14px;align-items:center;flex-wrap:wrap}.project-live-controls button{color:#acdae4;font-size:10px;padding:8px 0;border-bottom:1px solid #79b9c248}.project-live-controls button[aria-pressed="true"]{color:#ac97ec}.project-live-hint{font-size:11px;line-height:1.7;color:#829dab;margin:15px 0}
.project-frame-stage{display:flex;justify-content:center;background:#020912;overflow:hidden;min-width:0}.project-frame-stage iframe{display:block;width:100%;max-width:100%;height:560px;border:0;background:white;transition:width .3s ease}.project-live--mobile iframe{width:390px;height:650px}
@keyframes preview-project{from{opacity:0;transform:perspective(1200px) rotateX(4deg) translateY(12px)}to{opacity:1;transform:none}}
@media(max-width:760px){.project-live{padding:9px;margin-inline:-10px}.project-live-toolbar{align-items:flex-start;flex-direction:column;gap:7px}.project-live-controls{gap:17px;justify-content:space-between;width:100%}.project-live-toolbar small{display:none}.project-live-hint{font-size:10px}.project-frame-stage iframe,.project-live--mobile iframe{height:520px}.project-live-controls [data-frame-size]{display:none}}
@media(prefers-reduced-motion:reduce){.project-live{animation:none}.project-frame-stage iframe{transition:none}}
