/* ========== PORTFOLIO PAGE ========== */

/* Scroll reveal */
.pf-anim { opacity: 0; transform: translateY(30px); transition: opacity 0.7s ease, transform 0.7s ease; }
.pf-anim.visible { opacity: 1; transform: translateY(0); }

/* ========== HERO ========== */
.pf-hero { position: relative; overflow: hidden; padding: 100px 0 60px; background: #0a0a0a; text-align: center; }
.pf-hero__glow { position: absolute; top: -120px; left: 50%; transform: translateX(-50%); width: 700px; height: 700px; border-radius: 50%; background: radial-gradient(circle, rgba(139,26,34,0.35) 0%, transparent 65%); pointer-events: none; animation: glowPulse 4s ease-in-out infinite; }
.pf-hero__title { font-size: 54px; font-weight: 900; color: #fff; line-height: 1.1; margin-bottom: 12px; letter-spacing: -1px; }
.pf-hero__title--gradient { background: linear-gradient(90deg, #c0313c, #fbbf24); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
.pf-hero__subtitle { font-size: 15px; color: #555; max-width: 550px; margin: 0 auto 40px; line-height: 1.5; }
.pf-hero__counters { display: flex; justify-content: center; gap: 50px; }
.pf-counter { text-align: center; }
.pf-counter__number { font-size: 32px; font-weight: 900; display: block; animation: countPulse 2s ease-in-out infinite; }
.pf-counter__number--white { color: #fff; }
.pf-counter__number--red { color: #c0313c; }
.pf-counter__number--gold { color: #fbbf24; }
.pf-counter__label { font-size: 9px; color: #555; text-transform: uppercase; letter-spacing: 2px; font-weight: 600; }

/* ========== CLIENT TICKER ========== */
.pf-ticker { overflow: hidden; background: #0a0a0a; padding: 12px 0; border-top: 1px solid #151515; border-bottom: 1px solid #151515; }
.pf-ticker__track { display: flex; width: max-content; animation: marquee 30s linear infinite; }
.pf-ticker__content { display: flex; align-items: center; gap: 18px; padding-right: 18px; white-space: nowrap; }
.pf-ticker__content span { font-size: 11px; font-weight: 700; color: #2a2a2a; letter-spacing: 1px; }
.pf-ticker__dot { color: rgba(192,49,60,0.3) !important; font-size: 14px !important; }

/* ========== REEL 3D CAROUSEL ========== */
.pf-reels { background: #0a0a0a; padding: 50px 40px 40px; position: relative; overflow: hidden; }
.pf-reels__glow { position: absolute; top: 50%; left: 50%; width: 900px; height: 900px; transform: translate(-50%, -50%); border-radius: 50%; background: radial-gradient(circle, rgba(139,26,34,0.35) 0%, rgba(139,26,34,0.1) 40%, transparent 65%); pointer-events: none; animation: pfGlowBg 6s ease-in-out infinite; }
@keyframes pfGlowBg { 0%, 100% { opacity: 0.4; } 50% { opacity: 0.7; } }

/* Floating emojis */
.pf-reels__emoji { position: absolute; pointer-events: none; z-index: 1; }
.pf-reels__emoji--1 { top: 40px; left: 120px; font-size: 40px; animation: pfFloatE1 5s ease-in-out infinite; }
.pf-reels__emoji--2 { top: 50px; right: 130px; font-size: 36px; animation: pfFloatE2 4s ease-in-out infinite 0.5s; }
.pf-reels__emoji--3 { bottom: 80px; left: 140px; font-size: 34px; animation: pfFloatE1 4.5s ease-in-out infinite 1s; }
.pf-reels__emoji--4 { bottom: 60px; right: 150px; font-size: 38px; animation: pfFloatE2 5.5s ease-in-out infinite 0.3s; }
.pf-reels__emoji--5 { top: 45%; left: 100px; font-size: 30px; animation: pfFloatE1 6s ease-in-out infinite 1.5s; }
.pf-reels__emoji--6 { top: 30%; right: 110px; font-size: 28px; animation: pfFloatE2 4.2s ease-in-out infinite 0.8s; }
.pf-reels__emoji--7 { bottom: 110px; left: 45%; font-size: 26px; animation: pfFloatE1 3.8s ease-in-out infinite 2s; }
@keyframes pfFloatE1 { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-10px)} }
@keyframes pfFloatE2 { 0%,100%{transform:translateY(0) rotate(-3deg)} 50%{transform:translateY(-8px) rotate(3deg)} }

.pf-reels__content { position: relative; z-index: 2; text-align: center; margin-bottom: 20px; }
.pf-section-label { font-size: 9px; font-weight: 800; color: #c0313c; text-transform: uppercase; letter-spacing: 3px; margin-bottom: 8px; }
.pf-reels__title { font-size: 52px; color: #fff; font-weight: 900; letter-spacing: -2px; text-align: center; }
.pf-reels__sub { font-size: 15px; color: #555; margin-top: 6px; text-align: center; }

/* Stage */
.pf-reels__stage { width: 100%; height: 500px; perspective: 1200px; display: flex; align-items: center; justify-content: center; position: relative; z-index: 2; }
.pf-reels__ring { position: relative; width: 220px; height: 420px; transform-style: preserve-3d; }

/* Phone */
.pf-reels__phone { position: absolute; width: 220px; height: 420px; background: linear-gradient(145deg, #1c1c1e, #111113); border-radius: 36px; border: 2px solid #3a3a3c; overflow: hidden; backface-visibility: hidden; transition: all 0.9s cubic-bezier(0.25, 1, 0.5, 1); cursor: pointer; box-shadow: 0 4px 20px rgba(0,0,0,0.5); }
.pf-reels__phone.active { border-color: rgba(192, 49, 60, 0.6); box-shadow: 0 0 50px rgba(192,49,60,0.2), 0 10px 40px rgba(0,0,0,0.6); }
.pf-reels__phone-inner { padding: 6px; height: 100%; display: flex; flex-direction: column; }
.pf-reels__bezel { position: relative; flex: 1; background: #0a0a0a; border-radius: 30px; overflow: hidden; display: flex; flex-direction: column; }
.pf-reels__notch { width: 100px; height: 26px; background: #0a0a0a; border-radius: 0 0 16px 16px; margin: 0 auto; position: relative; z-index: 3; }
.pf-reels__notch-pill { position: absolute; top: 6px; left: 50%; transform: translateX(-50%); width: 65px; height: 14px; background: #111; border-radius: 7px; display: flex; align-items: center; justify-content: center; }
.pf-reels__notch-cam { width: 8px; height: 8px; border-radius: 50%; background: #1a1a2e; border: 1px solid #2a2a3a; }
.pf-reels__screen { flex: 1; background: #151515; margin: 0 4px 4px; border-radius: 0 0 24px 24px; display: flex; align-items: center; justify-content: center; flex-direction: column; position: relative; overflow: hidden; }
.pf-reels__screen::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 40%; background: linear-gradient(180deg, rgba(255,255,255,0.02), transparent); pointer-events: none; }
.pf-reels__screen-bar { position: absolute; bottom: 6px; left: 50%; transform: translateX(-50%); width: 40%; height: 5px; background: #333; border-radius: 4px; }
.pf-reels__phone-meta { padding: 6px 10px 8px; text-align: center; background: linear-gradient(180deg, #0a0a0a, #111113); }
.pf-reels__phone-views { font-size: 13px; font-weight: 800; color: #c0313c; }
.pf-reels__phone-client { font-size: 11px; font-weight: 700; margin-top: 2px; }

/* Nav */
.pf-reels__nav { display: flex; gap: 14px; justify-content: center; margin-top: 12px; position: relative; z-index: 2; }
.pf-reels__btn { width: 44px; height: 44px; border-radius: 50%; background: #111; border: 1.5px solid #222; display: flex; align-items: center; justify-content: center; cursor: pointer; font-size: 18px; color: #666; transition: all 0.2s; user-select: none; }
.pf-reels__btn:hover { border-color: #c0313c; color: #c0313c; background: #1a1a1a; }
.pf-reels__dots { display: flex; gap: 6px; justify-content: center; margin-top: 10px; position: relative; z-index: 2; }
.pf-reels__dot { width: 6px; height: 6px; border-radius: 50%; background: #333; transition: all 0.3s; cursor: pointer; }
.pf-reels__dot.active { background: #c0313c; width: 20px; border-radius: 3px; }

/* ========== CASE STUDIES ========== */
.pf-case--marzia { background: #111; border-top: 1px solid #1a1a1a; padding: 60px 0; }
.pf-case--certa { background: #0a0a0a; padding: 60px 0; }
.pf-case__layout { display: flex; gap: 24px; align-items: flex-start; }
.pf-case__layout--reverse { flex-direction: row-reverse; }
.pf-case__info { flex: 1; }
.pf-case__gallery { flex: 0.8; display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.pf-case__photo { background: #1a1a1a; border-radius: 8px; height: 110px; display: flex; align-items: center; justify-content: center; }
.pf-case__photo span { font-size: 8px; color: #444; text-transform: uppercase; letter-spacing: 1px; }
.pf-case__tags { display: flex; gap: 6px; margin-bottom: 10px; flex-wrap: wrap; }
.pf-tag { font-size: 8px; font-weight: 800; padding: 3px 8px; border-radius: 4px; letter-spacing: 1px; }
.pf-tag--red { background: rgba(192,49,60,0.15); color: #c0313c; }
.pf-tag--gold { background: rgba(251,191,36,0.15); color: #fbbf24; }
.pf-tag--green { background: rgba(74,222,128,0.15); color: #4ade80; }
.pf-case__title { font-size: 28px; font-weight: 900; color: #fff; margin-bottom: 4px; }
.pf-case__subtitle { font-size: 10px; color: #555; margin-bottom: 10px; }
.pf-case__desc { font-size: 11px; color: #888; line-height: 1.6; margin-bottom: 16px; }

/* Before / After */
.pf-case__ba { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; }
.pf-case__ba-box { background: #1a1a1a; border-radius: 8px; padding: 10px 16px; text-align: center; flex: 1; }
.pf-case__ba-label { display: block; font-size: 7px; color: #555; text-transform: uppercase; letter-spacing: 2px; font-weight: 700; margin-bottom: 4px; }
.pf-case__ba-value { display: block; font-size: 22px; font-weight: 900; }
.pf-case__ba-value--before { color: #555; }
.pf-case__ba-value--after { color: #4ade80; }
.pf-case__ba-sub { display: block; font-size: 8px; color: #555; }
.pf-case__ba-arrow { font-size: 20px; color: #c0313c; font-weight: 900; }

/* Metrics */
.pf-case__metrics { display: flex; gap: 10px; }
.pf-metric { background: #1a1a1a; border-radius: 8px; padding: 10px 14px; text-align: center; flex: 1; }
.pf-metric__value { display: block; font-size: 18px; font-weight: 900; }
.pf-metric__value--white { color: #fff; }
.pf-metric__value--gold { color: #fbbf24; }
.pf-metric__value--red { color: #c0313c; }
.pf-metric__label { display: block; font-size: 8px; color: #555; text-transform: uppercase; letter-spacing: 1px; font-weight: 600; }

/* ========== SQUADRA OPERATIVA ========== */
.pf-squad { background: #0a0a0a; padding: 50px 0; }
.pf-squad__title { font-size: 42px; font-weight: 900; color: #fff; text-align: center; line-height: 1.15; margin-bottom: 8px; letter-spacing: -0.5px; }
.pf-squad__title--gradient { background: linear-gradient(90deg, #c0313c, #fbbf24); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
.pf-squad__subtitle { font-size: 14px; color: #555; text-align: center; margin-bottom: 40px; }
.pf-squad__section-title { font-size: 16px; font-weight: 800; color: #fff; text-align: center; margin: 40px 0 16px; letter-spacing: -0.3px; }

/* Travel animation */
.pf-travel { display: flex; align-items: center; max-width: 900px; margin: 0 auto 30px; gap: 0; }
.pf-travel__card { background: #111; border-radius: 16px; padding: 18px; text-align: center; width: 160px; flex-shrink: 0; position: relative; }
.pf-travel__card--hq { border: 1.5px solid #c0313c; }
.pf-travel__card--client { border: 1.5px solid #4ade80; }
.pf-travel__badge { position: absolute; top: -10px; left: 50%; transform: translateX(-50%); font-size: 7px; font-weight: 800; letter-spacing: 1px; padding: 2px 10px; border-radius: 4px; white-space: nowrap; }
.pf-travel__badge--red { background: linear-gradient(90deg, #8b1a22, #c0313c); color: #fff; }
.pf-travel__badge--green { background: linear-gradient(90deg, #16a34a, #4ade80); color: #fff; }
.pf-travel__emoji { font-size: 28px; margin-bottom: 6px; }
.pf-travel__name { font-size: 9px; font-weight: 800; color: #fff; }
.pf-travel__sub { font-size: 7px; color: #555; margin-top: 2px; }

.pf-travel__road { flex: 1; height: 60px; position: relative; display: flex; align-items: center; }
.pf-travel__line { position: absolute; top: 50%; left: 0; right: 0; height: 2px; background: #1a1a1a; transform: translateY(-50%); }
.pf-travel__dashes { position: absolute; top: 50%; left: 0; right: 0; height: 2px; transform: translateY(-50%); background: repeating-linear-gradient(90deg, #c0313c 0, #c0313c 8px, transparent 8px, transparent 16px); background-size: 16px 2px; animation: roadLine 1s linear infinite; }
.pf-travel__van { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); background: #111; border: 1.5px solid #c0313c; border-radius: 8px; padding: 4px 10px; display: flex; align-items: center; gap: 4px; z-index: 2; animation: vanDrive 2s ease-in-out infinite; white-space: nowrap; }
.pf-travel__van span:first-child { font-size: 16px; }
.pf-travel__van-text { font-size: 7px; font-weight: 800; color: #c0313c; letter-spacing: 1px; }
.pf-travel__dot { position: absolute; top: 50%; width: 6px; height: 6px; border-radius: 50%; background: #c0313c; transform: translateY(-50%); animation: dotPulse 1.5s ease-in-out infinite; }
.pf-travel__dot--1 { left: 20%; animation-delay: 0s; }
.pf-travel__dot--2 { left: 50%; animation-delay: 0.5s; }
.pf-travel__dot--3 { left: 80%; animation-delay: 1s; }

/* Gear cards */
.pf-gear { display: flex; justify-content: center; gap: 10px; flex-wrap: wrap; margin-bottom: 30px; }
.pf-gear__card { background: #111; border-radius: 12px; padding: 16px; text-align: center; border: 1px solid #1a1a1a; width: 130px; transition: border-color 0.3s, transform 0.3s; }
.pf-gear__card:hover { border-color: #c0313c; transform: translateY(-3px); }
.pf-gear__icon { font-size: 24px; margin-bottom: 6px; }
.pf-gear__name { font-size: 10px; font-weight: 800; color: #fff; margin-bottom: 2px; }
.pf-gear__detail { font-size: 7px; color: #555; }

/* Promise box */
.pf-promise { background: #111; border-radius: 16px; padding: 24px; border: 1.5px solid #1a1a1a; display: flex; gap: 20px; align-items: center; margin-bottom: 30px; }
.pf-promise__list { flex: 1; }
.pf-promise__item { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
.pf-promise__item span:last-child { font-size: 12px; font-weight: 700; color: #fff; }
.pf-promise__check { font-size: 14px; }
.pf-promise__card { flex: 0 0 180px; background: linear-gradient(135deg, rgba(192,49,60,0.1), rgba(192,49,60,0.05)); border-radius: 12px; padding: 20px; text-align: center; border: 1px solid rgba(192,49,60,0.15); }
.pf-promise__card-emoji { font-size: 36px; margin-bottom: 8px; }
.pf-promise__card-title { font-size: 22px; font-weight: 900; color: #fff; margin-bottom: 4px; }
.pf-promise__card-desc { font-size: 9px; color: #888; line-height: 1.4; }

/* Formula */
.pf-formula { display: flex; justify-content: center; align-items: center; gap: 14px; flex-wrap: wrap; }
.pf-formula__box { background: #111; border-radius: 10px; padding: 12px 22px; border: 1.5px solid #1a1a1a; }
.pf-formula__box--red { border-color: #c0313c; }
.pf-formula__box--gold { border-color: #fbbf24; }
.pf-formula__box--green { border-color: #4ade80; }
.pf-formula__value { font-size: 14px; font-weight: 900; color: #fff; }
.pf-formula__box--red .pf-formula__value { color: #c0313c; }
.pf-formula__box--gold .pf-formula__value { color: #fbbf24; }
.pf-formula__box--green .pf-formula__value { color: #4ade80; }
.pf-formula__eq { font-size: 20px; font-weight: 900; color: #333; }

/* ========== BACKSTAGE ========== */
.pf-backstage { background: #f2f0ed; padding: 55px 0; }
.pf-backstage__title { font-size: 38px; font-weight: 900; color: #111; text-align: center; margin-bottom: 6px; letter-spacing: -0.5px; }
.pf-backstage__subtitle { font-size: 13px; color: #888; text-align: center; margin-bottom: 30px; }
.pf-backstage__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
.pf-backstage__item { border-radius: 8px; height: 140px; display: flex; align-items: center; justify-content: center; transition: transform 0.3s; }
.pf-backstage__item:hover { transform: scale(1.03); }
.pf-backstage__item--tall { grid-row: span 2; height: auto; }
.pf-backstage__item span { font-size: 8px; color: rgba(0,0,0,0.25); text-transform: uppercase; letter-spacing: 2px; font-weight: 700; }

/* ========== TUTTI I CLIENTI ========== */
.pf-clients { background: #0a0a0a; padding: 60px 0; }
.pf-clients__title { font-size: 38px; font-weight: 900; color: #fff; text-align: center; margin-bottom: 30px; letter-spacing: -0.5px; }
.pf-clients__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.pf-client-card { background: #111; border-radius: 12px; overflow: hidden; border: 1px solid #1a1a1a; transition: border-color 0.3s, transform 0.3s; cursor: pointer; }
.pf-client-card:hover { border-color: #c0313c; transform: translateY(-3px); }
.pf-client-card__cover { background: #1a1a1a; height: 100px; display: flex; align-items: center; justify-content: center; }
.pf-client-card__cover span { font-size: 7px; color: #444; text-transform: uppercase; letter-spacing: 1px; }
.pf-client-card__body { padding: 12px; }
.pf-client-card__name { font-size: 12px; font-weight: 800; color: #fff; margin-bottom: 2px; }
.pf-client-card__sector { font-size: 8px; color: #555; }

/* ========== CTA ========== */
.pf-cta { position: relative; overflow: hidden; padding: 70px 0; background: linear-gradient(135deg, #8b1a22, #c0313c, #a82d38); text-align: center; }
#pf-particles { position: absolute; inset: 0; pointer-events: none; z-index: 1; }
.pf-cta__title { font-size: 40px; font-weight: 900; color: #fff; line-height: 1.15; margin-bottom: 10px; letter-spacing: -0.5px; }
.pf-cta__title--underline { text-decoration: underline; text-decoration-thickness: 3px; text-underline-offset: 4px; }
.pf-cta__subtitle { font-size: 14px; color: rgba(255,255,255,0.7); margin-bottom: 28px; }
.pf-cta__form { max-width: 500px; margin: 0 auto; }
.pf-cta__fields { display: flex; gap: 8px; margin-bottom: 10px; }
.pf-cta__input { flex: 1; background: rgba(255,255,255,0.12); border: 1.5px solid rgba(255,255,255,0.2); border-radius: 8px; padding: 10px 14px; color: #fff; font-size: 12px; font-family: inherit; outline: none; transition: border-color 0.3s; }
.pf-cta__input::placeholder { color: rgba(255,255,255,0.4); }
.pf-cta__input:focus { border-color: rgba(255,255,255,0.5); }
.pf-cta__btn { width: 100%; padding: 12px; background: #fff; color: #8b1a22; border: none; border-radius: 8px; font-size: 13px; font-weight: 800; font-family: inherit; cursor: pointer; transition: transform 0.3s, box-shadow 0.3s; }
.pf-cta__btn:hover { transform: translateY(-2px); box-shadow: 0 8px 25px rgba(0,0,0,0.3); }

/* ========== DISCOVER MORE ========== */
.pf-discover { background: #0a0a0a; padding: 50px 0; border-top: 1px solid #1a1a1a; }
.pf-discover__title { font-size: 16px; font-weight: 800; color: #fff; text-align: center; margin-bottom: 16px; }
.pf-discover__links { display: flex; justify-content: center; gap: 12px; flex-wrap: wrap; }
.pf-discover__link { display: flex; align-items: center; gap: 8px; background: #111; border: 1px solid #1a1a1a; border-radius: 10px; padding: 12px 20px; text-decoration: none; transition: border-color 0.3s, transform 0.3s; }
.pf-discover__link:hover { transform: translateY(-2px); }
.pf-discover__link--red:hover { border-color: #c0313c; }
.pf-discover__link--blue:hover { border-color: #60a5fa; }
.pf-discover__link--gold:hover { border-color: #fbbf24; }
.pf-discover__link-icon { font-size: 18px; }
.pf-discover__link-name { font-size: 12px; font-weight: 800; color: #fff; }
.pf-discover__link-arrow { font-size: 14px; color: #555; }

/* ========== ANIMATIONS ========== */
@keyframes glowPulse {
  0%, 100% { opacity: 0.35; transform: translateX(-50%) scale(1); }
  50% { opacity: 0.5; transform: translateX(-50%) scale(1.05); }
}
@keyframes marquee {
  0% { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}
@keyframes countPulse {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.05); }
}
@keyframes vanDrive {
  0%, 100% { transform: translate(-50%, -50%) translateX(0); }
  50% { transform: translate(-50%, -50%) translateX(8px); }
}
@keyframes roadLine {
  0% { background-position: 0 0; }
  100% { background-position: 16px 0; }
}
@keyframes dotPulse {
  0%, 100% { opacity: 0.3; transform: translateY(-50%) scale(1); }
  50% { opacity: 1; transform: translateY(-50%) scale(1.5); }
}
@keyframes particleFloat {
  0% { transform: translateY(0) translateX(0); opacity: 1; }
  100% { transform: translateY(-120px) translateX(20px); opacity: 0; }
}

/* ========== RESPONSIVE ========== */
@media (max-width: 1024px) {
  .pf-hero__title { font-size: 42px; }
  .pf-reels__title { font-size: 38px; }
  .pf-clients__grid { grid-template-columns: repeat(2, 1fr); }
  .pf-backstage__grid { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 768px) {
  .pf-hero { padding: 80px 0 40px; }
  .pf-hero__title { font-size: 30px; }
  .pf-hero__subtitle { font-size: 13px; }
  .pf-hero__counters { gap: 20px; flex-wrap: wrap; justify-content: center; }
  .pf-counter__number { font-size: 24px; }
  .pf-reels { padding: 30px 16px 20px; }
  .pf-reels__title { font-size: 26px; }
  .pf-reels__stage { height: 280px; perspective: 900px; }
  .pf-reels__ring { width: 170px; height: 330px; }
  .pf-reels__phone { width: 170px; height: 330px; border-radius: 28px; }
  .pf-reels__emoji { display: none; }
  .pf-reels__glow { width: 500px; height: 500px; }
  .pf-case--marzia, .pf-case--certa { padding: 40px 0; }
  .pf-case__layout, .pf-case__layout--reverse { flex-direction: column; gap: 16px; }
  .pf-case__gallery { flex: none; width: 100%; }
  .pf-case__title { font-size: 22px; }
  .pf-case__ba { flex-direction: column; gap: 8px; }
  .pf-case__metrics { flex-wrap: wrap; }
  .pf-metric { min-width: calc(50% - 8px); }
  .pf-squad { padding: 35px 0; }
  .pf-squad__title { font-size: 26px; }
  .pf-travel { flex-direction: column; gap: 12px; align-items: center; }
  .pf-travel__road { width: 100%; height: 60px; flex: none; }
  .pf-travel__dashes { top: 50%; }
  .pf-travel__card { width: 100%; max-width: 200px; }
  .pf-gear { gap: 8px; }
  .pf-gear__card { width: calc(50% - 8px); }
  .pf-promise { flex-direction: column; padding: 18px; }
  .pf-promise__card { flex: none; width: 100%; }
  .pf-formula { gap: 6px; }
  .pf-formula__box { padding: 10px 14px; }
  .pf-formula__value { font-size: 12px; }
  .pf-backstage { padding: 35px 0; }
  .pf-backstage__title { font-size: 26px; }
  .pf-backstage__grid { grid-template-columns: repeat(2, 1fr); gap: 6px; }
  .pf-backstage__item { height: 110px; }
  .pf-clients { padding: 40px 0; }
  .pf-clients__title { font-size: 26px; }
  .pf-clients__grid { grid-template-columns: repeat(2, 1fr); gap: 8px; }
  .pf-cta { padding: 45px 0; }
  .pf-cta__title { font-size: 26px; }
  .pf-cta__fields { flex-direction: column; }
  .pf-discover__links { flex-direction: column; align-items: center; }
}

@media (max-width: 480px) {
  .pf-hero__title { font-size: 24px; }
  .pf-reels__stage { height: 240px; }
  .pf-reels__ring { width: 140px; height: 270px; }
  .pf-reels__phone { width: 140px; height: 270px; border-radius: 22px; }
  .pf-counter__number { font-size: 20px; }
  .pf-case__title { font-size: 20px; }
  .pf-gear__card { width: 100%; }
  .pf-clients__grid { grid-template-columns: 1fr; }
  .pf-backstage__grid { grid-template-columns: 1fr; }
  .pf-cta__title { font-size: 22px; }
}
