/* AIVA Group — CSS страницы «smm» (вынесено из инлайн-<style> при рефакторинге).
   Грузится после main.css + site-fixes.css (см. inc/enqueue.php, блок 4b). */
/* ===================================================================
   SERVICE PAGE: «SMM-продвижение» — секции только этой страницы (.svc-*)
   Наследует токены/типографику дизайн-системы; новые компоненты — ниже
   =================================================================== */
/* hero layout: текст слева + соц-дашборд справа */

/* hero-demo: реалистичный телефон с Instagram (фирменные цвета инсты) */
.smm-demo{position:relative;width:296px;max-width:100%;margin:0 auto;border-radius:46px;background:#0c0d12;border:1px solid #d4dde4;padding:11px}
.smm-demo::before{content:'';position:absolute;top:20px;left:50%;transform:translateX(-50%);width:86px;height:7px;border-radius:99px;background:#23252c;z-index:5}
.ig-screen{position:relative;border-radius:36px;overflow:hidden;background:#fff;color:#262626;display:flex;flex-direction:column;height:582px}
.ig-status{display:flex;align-items:center;justify-content:space-between;padding:13px 22px 5px;font-size:12px;font-weight:700;color:#111}
.ig-status .igs-r{display:flex;align-items:center;gap:6px;font-size:10px}
.ig-top{display:flex;align-items:center;padding:7px 14px 9px;border-bottom:1px solid #efefef}
.igt-name{font-family:var(--font-h);font-weight:800;font-size:17px;letter-spacing:-.02em;display:flex;align-items:center;gap:5px}
.igt-name i{font-size:11px;color:#3897f0}
.igt-ico{margin-left:auto;display:flex;gap:16px;font-size:16px}
.ig-stories{display:flex;gap:12px;padding:11px 13px;border-bottom:1px solid #efefef}
.ig-story{display:flex;flex-direction:column;align-items:center;gap:5px;flex-shrink:0}
.igst-ring{width:50px;height:50px;border-radius:50%;padding:2.5px;background:conic-gradient(from 0deg,#feda75,#fa7e1e,#d62976,#962fbf,#4f5bd5,#feda75)}
.ig-story.live .igst-ring{animation:igSpin 7s linear infinite}
@keyframes igSpin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.ig-story.live .igst-ring{animation:none}}
.igst-in{width:100%;height:100%;border-radius:50%;border:2.5px solid #fff;background-size:cover;background-position:center}
.ig-story small{font-size:9.5px;color:#262626;max-width:52px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ig-post{display:flex;flex-direction:column;flex:1;min-height:0}
.ig-phead{display:flex;align-items:center;gap:8px;padding:9px 13px}
.igp-ava{width:28px;height:28px;border-radius:50%;background-size:cover;background-position:center;flex-shrink:0}
.ig-phead b{font-size:12.5px;font-weight:700}
.ig-phead small{font-size:10px;color:#8e8e8e;display:block;margin-top:-1px}
.igp-more{margin-left:auto}
.ig-img{position:relative;flex:1;min-height:0;background-size:cover;background-position:center}
.ig-heart{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:#fff;font-size:84px;opacity:0;pointer-events:none}
.ig-acts{display:flex;align-items:center;gap:15px;padding:11px 14px 3px;font-size:21px}
.iga-like.liked{color:#ed4956}
.iga-save{margin-left:auto}
.ig-likes{padding:1px 14px;font-size:12.5px;font-weight:700}
.ig-likes b{font-variant-numeric:tabular-nums}
.ig-cap{padding:4px 14px 11px;font-size:12px;line-height:1.4}
.ig-cap b{font-weight:700}
.ig-cap span{color:#8e8e8e}
.ig-tab{display:flex;justify-content:space-around;align-items:center;padding:10px 0 12px;border-top:1px solid #efefef;font-size:18px}
.igt-ava{width:23px;height:23px;border-radius:50%;background-size:cover;background-position:center;border:1.5px solid #262626}
/* hero motion: 3D float/tilt телефона + всплывающие пузыри вовлечённости */
.svc-demo-wrap{perspective:1100px}
.smm-demo{transform-style:preserve-3d}
.ig-bubbles{position:absolute;inset:0;pointer-events:none;z-index:6}
.ig-bubble{position:absolute;display:inline-flex;align-items:center;gap:8px;background:#fff;border:1px solid #d7dee4;border-radius:999px;padding:8px 14px;font-size:12px;font-weight:700;color:var(--ink);white-space:nowrap}
.ig-bubble i{font-size:13px}
.ig-bubble .fa-heart{color:#ed4956}
.ig-bubble .fa-comment{color:#3897f0}
.ig-bubble .fa-user-plus{color:#c13584}
.ig-bubble .fa-bookmark{color:#262626}
/* мини-приложение: переключение лента <-> профиль + анимированная подсказка */
.ig-pages{position:relative;flex:1;min-height:0;overflow:hidden}
.ig-page{position:absolute;inset:0;display:flex;flex-direction:column;background:#fff;transition:transform .45s cubic-bezier(.4,0,.2,1),opacity .4s}
.ig-feed{z-index:1}
.ig-profile{transform:translateX(100%);opacity:0;pointer-events:none;z-index:2}
.ig-screen.show-profile .ig-feed{transform:translateX(-26%);opacity:0;pointer-events:none}
.ig-screen.show-profile .ig-profile{transform:translateX(0);opacity:1;pointer-events:auto}
.igt-back{cursor:pointer}.igt-menu{margin-left:auto}
.pf-scroll{flex:1;overflow-y:auto;overflow-x:hidden}
.pf-scroll::-webkit-scrollbar{width:0}
.pf-head{display:flex;align-items:center;gap:18px;padding:16px 16px 12px}
.pf-ava{width:66px;height:66px;border-radius:50%;flex-shrink:0;background-size:cover;background-position:center;outline:2px solid #efefef;outline-offset:2px}
.pf-stats{display:flex;flex:1;justify-content:space-around;text-align:center}
.pf-stats b{display:block;font-family:var(--font-h);font-weight:800;font-size:16px}
.pf-stats small{font-size:10px;color:#262626}
.pf-bio{padding:0 16px 10px;font-size:11.5px;line-height:1.4}
.pf-bio b{display:block;font-weight:700}
.pf-bio span{color:#3a3a3a}
.pf-btns{display:flex;gap:6px;padding:0 16px 14px}
.pf-btn{flex:1;text-align:center;padding:7px;border-radius:8px;font-size:12px;font-weight:700;background:#efefef;color:#262626}
.pf-btn.primary{background:#3897f0;color:#fff}
.pf-btn.ic{flex:0 0 auto;width:34px}
.pf-hl{display:flex;gap:14px;padding:2px 16px 14px;border-bottom:1px solid #efefef}
.pf-hlc{width:48px;height:48px;border-radius:50%;background-size:cover;background-position:center;border:1px solid #e2e2e2}
.pf-tabs{display:flex;justify-content:space-around;padding:9px 0;border-bottom:1px solid #efefef;font-size:15px;color:#c4c4c4}
.pf-tabs .active{color:#262626}
.pf-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2px}
.pf-cell{aspect-ratio:1;background-size:cover;background-position:center}
.ig-tab .igt-ava{cursor:pointer;position:relative}
.ig-tab .igt-ava::before{content:'';position:absolute;inset:-5px;border-radius:50%;border:2px solid var(--coral);animation:tabPulse 1.6s ease-out infinite}
.ig-screen.show-profile .ig-tab .igt-ava::before{display:none}
@keyframes tabPulse{0%{transform:scale(.65);opacity:.85}100%{transform:scale(1.5);opacity:0}}
.igt-home{cursor:pointer}
.ig-hint{position:absolute;right:9px;bottom:58px;display:inline-flex;align-items:center;gap:6px;background:var(--ink);color:#fff;font-size:11px;font-weight:700;padding:7px 11px;border-radius:999px;white-space:nowrap;z-index:9;pointer-events:none;animation:hintBob 1.5s ease-in-out infinite}
.ig-hint i{color:var(--coral)}
.ig-hint::after{content:'';position:absolute;bottom:-4px;right:22px;width:9px;height:9px;background:var(--ink);transform:rotate(45deg)}
.ig-screen.show-profile .ig-hint{opacity:0;visibility:hidden;transition:opacity .3s,visibility .3s}
@keyframes hintBob{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}
@media(prefers-reduced-motion:reduce){.ig-hint{animation:none}.ig-tab .igt-ava::before{animation:none}}
@media(max-width:980px){.svc-hero-grid{grid-template-columns:1fr;gap:40px}.svc-demo-badge{right:5%}}
@media(max-width:560px){.sm-body{padding:16px;gap:13px}.sm-post{height:84px}.sm-react{gap:14px}}

/* «что входит» — карточки услуг (стиль .pcard / карточек) */
@media(max-width:980px){.svc-incl-grid{grid-template-columns:1fr 1fr}}
@media(max-width:680px){.svc-incl-grid{grid-template-columns:1fr}.svc-incl{padding:72px 0}}

/* «кому подойдёт» — компактные плитки на тёмном фоне */
.svc-fit{position:relative;overflow:hidden;background:var(--ink);color:#fff;padding:110px 0}
.svc-fit::before{content:'';position:absolute;inset:0;opacity:.4;background-image:linear-gradient(#1e3140 1px,transparent 1px),linear-gradient(90deg,#1e3140 1px,transparent 1px);background-size:80px 80px;pointer-events:none}
.svc-fit .wrap{position:relative;z-index:2}
.svc-fit .svc-head h2{color:#fff}
.svc-fit .svc-head h2 em{color:#7fb0d4}
.svc-fit .svc-head .sec-note{color:#8da0ae}
.svc-fit-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.svc-fit-card{display:flex;align-items:center;gap:18px;border:1px solid #24394a;border-radius:var(--r-lg);background:rgba(20,34,45,.55);padding:24px 26px;transition:border-color .3s,transform .3s}
.svc-fit-card:hover{border-color:var(--blue);transform:translateY(-4px)}
.svc-fit-card .sf-ic{width:50px;height:50px;flex-shrink:0;border:1px solid #2c4456;border-radius:var(--r-md);display:flex;align-items:center;justify-content:center;font-size:19px;color:#7fb0d4;transition:all .3s}
.svc-fit-card:hover .sf-ic{background:#fff;color:var(--blue);border-color:#fff}
.svc-fit-card b{font-family:var(--font-h);font-weight:800;font-size:17px;text-transform:uppercase;letter-spacing:-.01em;line-height:1.15;display:block}
.svc-fit-card span{font-size:13.5px;color:#8da0ae;display:block;margin-top:6px;line-height:1.4}
@media(max-width:980px){.svc-fit-grid{grid-template-columns:1fr 1fr}}
@media(max-width:600px){.svc-fit-grid{grid-template-columns:1fr}.svc-fit{padding:72px 0}}

/* цены — тарифные карточки */
.svc-plan.tier-silver{--accent:#5f7d93;--accent-tint:#eaf0f4}
.svc-plan.tier-gold{--accent:#bd8b2c;--accent-tint:#f6eedb}
.svc-plan.tier-platinum{--accent:#36424e;--accent-tint:#eceef1}
.svc-plan .sp-feat-line{display:inline-flex;align-self:flex-start;align-items:center;gap:8px;margin-top:18px;padding:9px 14px;border-radius:999px;background:var(--accent-tint);color:var(--accent);font-size:12.5px;font-weight:700;line-height:1}
.svc-plan .sp-feat-line i{font-size:13px;color:var(--accent)}
.svc-plan .sp-price{font-family:var(--font-h);font-weight:800;font-size:clamp(31px,3vw,39px);letter-spacing:-.02em;margin:22px 0 2px;white-space:nowrap;display:flex;flex-direction:column;color:var(--ink)}
.svc-plan .sp-price .sp-from,.svc-plan .sp-price .sp-per{font-family:var(--font-body);font-size:12px;font-weight:600;color:var(--gray);text-transform:uppercase;letter-spacing:.05em}
.svc-plan .sp-price .sp-from{margin-bottom:3px}
.svc-plan .sp-price .sp-per{margin-top:5px}
.svc-price-note{margin:80px auto 0;max-width:720px;display:flex;align-items:center;justify-content:center;gap:11px;font-size:13.5px;color:var(--gray);text-align:center;background:var(--gray-bg);border:1px solid var(--line);border-radius:var(--r-md);padding:16px 24px}
@media(max-width:980px){.svc-price-grid{grid-template-columns:1fr;gap:18px}.svc-plan-flag{right:18px}.svc-price{padding:80px 0}.svc-price-note{margin-top:58px}}

/* скролл-сцена: профиль Instagram наполняется (фирменные цвета инсты) */
.ig-fill{padding:120px 0;background:var(--gray-bg);border-top:1px solid var(--line);border-bottom:1px solid var(--line);overflow:hidden}
.ig-fill-grid{display:grid;grid-template-columns:1fr 1.05fr;gap:64px;align-items:center}
.ig-fill-copy .tag{margin-bottom:18px}
.ig-fill-copy h2{font-family:var(--font-h);font-weight:800;font-size:clamp(30px,4vw,52px);line-height:1.08;letter-spacing:-.02em;text-transform:uppercase}
.ig-fill-copy h2 em{font-style:normal;background:linear-gradient(90deg,#fa7e1e,#d62976,#962fbf);-webkit-background-clip:text;background-clip:text;color:transparent}
.ig-fill-copy p{color:var(--gray);font-size:16px;margin:18px 0 30px;max-width:440px;line-height:1.6}
.igf-stats{display:flex;gap:34px;flex-wrap:wrap}
.igf-stat b{display:block;font-family:var(--font-h);font-weight:800;font-size:clamp(26px,3vw,38px);line-height:1;letter-spacing:-.02em;background:linear-gradient(90deg,#fa7e1e,#d62976);-webkit-background-clip:text;background-clip:text;color:transparent;font-variant-numeric:tabular-nums}
.igf-stat small{display:block;margin-top:7px;font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--gray)}
.igf-cta{margin-top:32px}
.ig-fill-stage{display:flex;justify-content:center}
.igc{width:100%;max-width:418px;background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;color:#262626}
.igc-top{display:flex;align-items:center;padding:14px 16px;border-bottom:1px solid #efefef}
.igc-top .igc-uname{font-family:var(--font-h);font-weight:800;font-size:16px;display:flex;align-items:center;gap:5px;margin:0 auto 0 14px}
.igc-uname i{font-size:11px;color:#3897f0}
.igc-back,.igc-menu{font-size:15px;color:#262626}
.igc-head{display:flex;align-items:center;gap:22px;padding:20px 18px 14px}
.igc-ava{width:74px;height:74px;border-radius:50%;flex-shrink:0;background-size:cover;background-position:center;outline:2px solid #efefef;outline-offset:2px}
.igc-stats{display:flex;flex:1;justify-content:space-around;text-align:center}
.igc-stats b{display:block;font-family:var(--font-h);font-weight:800;font-size:18px;font-variant-numeric:tabular-nums}
.igc-stats small{font-size:11px;color:#262626}
.igc-bio{padding:0 18px 12px;font-size:12.5px;line-height:1.45}
.igc-bio b{display:block;font-weight:700}
.igc-bio span{color:#3a3a3a}
.igc-actions{display:flex;gap:8px;padding:0 18px 16px}
.igc-btn{flex:1;text-align:center;padding:8px;border-radius:9px;font-size:13px;font-weight:700;background:#efefef;color:#262626}
.igc-btn.primary{background:#3897f0;color:#fff}
.igc-hl{display:flex;gap:18px;padding:2px 18px 18px;border-bottom:1px solid #efefef}
.igc-hlc{width:54px;height:54px;border-radius:50%;background-size:cover;background-position:center;border:1px solid #e2e2e2}
.igc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:3px}
.igc-cell{aspect-ratio:1;background-size:cover;background-position:center}
@media(max-width:980px){.ig-fill-grid{grid-template-columns:1fr;gap:44px}.ig-fill{padding:80px 0}.igc{max-width:380px;margin:0 auto}}

/* FAQ (та же разметка/JS, что и на главной) */
.faq{padding:84px 0 68px;background:var(--gray-bg);border-top:1px solid var(--line)}

@media(max-width:768px){.faq-q{font-size:16px;padding:20px 0;gap:14px}.faq-q .fq-ic{width:34px;height:34px;font-size:11px}.faq-a p{padding:0 12px 22px 0;font-size:15px}}
