/* Portfolio hero — AllBee's static equivalent of Hero with Cards. */
.page-hero.pf-fan-hero {
  padding: calc(var(--nav-h) + 46px) 20px 0;
  background: radial-gradient(ellipse at 15% 30%,rgba(15,123,110,.10),transparent 48%),radial-gradient(ellipse at 88% 65%,rgba(220,165,12,.12),transparent 44%),#fbf8f0;
  isolation: isolate;
}
.pf-fan-hero::before { display:none; }
.pf-hero-copy { position:relative;z-index:6;max-width:760px;margin:0 auto; }
.pf-fan-hero h1 { font-size:clamp(2.35rem,5vw,4.35rem);line-height:1.12;letter-spacing:-1.8px; }
.pf-fan-hero h1 em { font-style:italic; }
.pf-fan-hero p { max-width:565px;font-size:1rem;margin-bottom:24px; }
.pf-hero-actions { display:flex;align-items:center;justify-content:center;gap:18px;flex-wrap:wrap; }
.pf-hero-actions .btn-primary { border-radius:999px;padding:13px 24px;box-shadow:0 6px 20px rgba(15,123,110,.15); }
.pf-orb-dot { width:8px;height:8px;border-radius:50%;background:#ffdc73;box-shadow:0 0 12px rgba(255,220,115,.6); }
.pf-hero-browse { display:inline-flex;align-items:center;gap:7px;font-size:13px;font-weight:800;color:var(--teal-d);padding:10px 4px; }
.pf-hero-browse:hover { text-decoration:underline;text-underline-offset:5px; }
#all-projects,#featured { scroll-margin-top:calc(var(--nav-h) + 20px); }
.pf-hero-fan { --card-w:224px;--card-h:282px;--step:118px;position:relative;width:min(100%,960px);height:350px;margin:30px auto 0; }
.pf-hero-card { position:absolute;left:50%;bottom:-24px;width:var(--card-w);height:var(--card-h);border:3px solid #fff;border-radius:20px;background:#fff;box-shadow:0 20px 46px rgba(8,60,55,.18);overflow:hidden;text-align:left;transform-origin:50% 100%;transform:translateX(calc(-50% + var(--slot) * var(--step))) rotate(var(--angle));z-index:var(--layer);animation:pf-fan-enter .85s var(--ease) both;animation-delay:var(--delay);transition:box-shadow .25s,border-color .25s; }
.pf-hero-card:hover,.pf-hero-card:focus-visible { z-index:8;box-shadow:0 20px 55px rgba(8,60,55,.3);border-color:#e8b527;outline:3px solid var(--teal);outline-offset:4px; }
.pf-hero-card img { width:100%;height:100%;object-fit:cover;object-position:center top; }
.pf-hero-card-chrome { position:absolute;inset:0 0 auto;height:24px;display:flex;align-items:center;gap:4px;padding:0 10px;background:rgba(255,255,255,.92);border-bottom:1px solid rgba(15,123,110,.1); }
.pf-hero-card-chrome i { width:4px;height:4px;border-radius:50%;background:#94b8ae; }
.pf-hero-card img { padding-top:24px; }
.pf-hero-card-label { position:absolute;inset:auto 0 0;padding:40px 13px 35px;background:linear-gradient(transparent,rgba(4,30,27,.95));color:#fff;font-size:14px;font-weight:800;line-height:1.35; }
.pf-hero-card-label small { display:block;color:#ffe09a;font-size:9px;letter-spacing:1.2px;text-transform:uppercase;margin-bottom:5px; }
.pf-hero-copy > * { animation:pf-copy-enter .65s var(--ease) both; }
.pf-hero-copy h1 { animation-delay:.10s; }
.pf-hero-copy p { animation-delay:.20s; }
.pf-hero-copy .pf-hero-actions { animation-delay:.30s; }
@keyframes pf-copy-enter { from { opacity:0;transform:translateY(18px); } to { opacity:1;transform:translateY(0); } }
@keyframes pf-fan-enter { from { opacity:0;translate:0 55px; } to { opacity:1;translate:0 0; } }
@media(max-width:980px) {
  .pf-hero-fan { --card-w:185px;--card-h:254px;--step:94px;height:305px; }
}
@media(max-width:600px) {
  .page-hero.pf-fan-hero { padding:calc(var(--nav-h) + 30px) 16px 0; }
  .pf-fan-hero h1 { font-size:clamp(2rem,8.2vw,3rem);letter-spacing:-1px; }
  .pf-fan-hero p { font-size:.94rem;line-height:1.65;max-width:340px; }
  .pf-hero-actions { gap:8px 15px; }
  .pf-hero-actions .btn-primary { font-size:13px;padding:12px 20px; }
  .pf-hero-fan { --card-w:124px;--card-h:192px;--step:38px;height:255px;margin-top:20px; }
  .pf-hero-card { border-width:2px;border-radius:14px; }
  .pf-hero-card-label { font-size:11px;padding:30px 9px 30px; }
  .pf-hero-card-label small { font-size:8px;letter-spacing:.5px; }
  .pf-hero-card-chrome { height:18px;padding:0 7px; }
  .pf-hero-card img { padding-top:18px; }
}
@media(max-width:360px) {
  .pf-hero-fan { --card-w:108px;--card-h:172px;--step:30px;height:232px; }
}
@media(prefers-reduced-motion:reduce) {
  .pf-hero-copy > *,.pf-hero-card { animation:none;transition:none; }
}

/* Preserve the approved storefront composition in the tall hero card. */
.pf-hero-card[data-id="suplaykart"] { background:#f8cb46; }
.pf-hero-card[data-id="suplaykart"] img { object-fit:contain;object-position:center 35%;background:#f8cb46; }

.pf-card[data-id="suplaykart"] .pf-thumb { background:#f8cb46; }
.pf-card[data-id="suplaykart"] .pf-thumb img { object-fit:contain;object-position:center; }