/* ═══════════════════════════════════════════════════════════
   ГЛАВНАЯ
   ═══════════════════════════════════════════════════════════ */

/* ───── HERO ───── */
.hero{
  min-height:100vh;
  display:flex;align-items:center;justify-content:center;
  padding:120px 24px 80px;
  text-align:center;
  overflow:hidden;
  position:relative;
  background:#000;
}
.hero-inner{position:relative;z-index:2;max-width:1000px}

.eyebrow{
  display:inline-flex;align-items:center;gap:8px;
  padding:6px 14px;border-radius:980px;
  background:var(--accent-soft);
  border:1px solid rgba(212,175,55,.25);
  font-size:12px;letter-spacing:.04em;text-transform:uppercase;
  color:var(--accent-2);
  margin-bottom:28px;
  animation:fadeUp .8s .1s both;
}
.eyebrow::before{
  content:'';width:6px;height:6px;border-radius:50%;
  background:var(--accent);
  box-shadow:0 0 12px var(--accent);
  animation:pulseGold 2s ease-in-out infinite;
}

.hero h1{
  font-family:'Fraunces',serif;
  font-weight:400;
  font-size:clamp(40px,7.5vw,104px);
  line-height:1;letter-spacing:-.035em;
  margin-bottom:28px;
  animation:fadeUp .9s .2s both;
}
.hero h1 .acc{color:var(--accent);font-style:italic;font-weight:300}
.hero h1 .grad{
  background:linear-gradient(180deg,#fff 0%,#fff 40%,var(--accent-2) 70%,var(--accent) 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  font-style:italic;font-weight:300;
}
.hero-sub{
  font-size:clamp(16px,1.55vw,21px);
  color:var(--text-muted);
  max-width:640px;margin:0 auto 44px;
  line-height:1.5;
  animation:fadeUp .9s .35s both;
}
.hero-cta-row{
  display:flex;gap:14px;justify-content:center;flex-wrap:wrap;
  animation:fadeUp .9s .5s both;
}

/* плавающие иконки — Я и VK */
.hero-floats{
  position:absolute;inset:0;pointer-events:none;
}
.float-icon{
  position:absolute;
  width:70px;height:70px;border-radius:20px;
  display:flex;align-items:center;justify-content:center;
  font-family:'Fraunces',serif;font-size:32px;font-weight:600;
  box-shadow:0 20px 60px -15px rgba(0,0,0,.6);
  animation:floaty 6s ease-in-out infinite;
  opacity:0;
  animation:fadeUp 1s .8s both, floaty 6s ease-in-out 1.8s infinite;
}
.float-icon.yandex{
  left:8%;top:30%;
  background:#ffcc00;color:#000;
  transform:rotate(-12deg);
}
.float-icon.vk{
  right:8%;top:35%;
  background:#0077ff;color:#fff;
  transform:rotate(10deg);
  animation-delay:1s, 2.5s;
}
@media(max-width:980px){
  .float-icon{display:none}
}

.hero-meta{
  margin-top:72px;
  display:flex;gap:48px;justify-content:center;flex-wrap:wrap;
  animation:fadeUp .9s .65s both;
}
.hero-meta div{text-align:left}
.hero-meta .num{
  font-family:'Fraunces',serif;font-weight:400;
  font-size:40px;letter-spacing:-.02em;
  background:linear-gradient(180deg,#fff,var(--accent-2));
  -webkit-background-clip:text;background-clip:text;color:transparent;
  line-height:1;
}
.hero-meta .lbl{
  font-size:12px;color:var(--text-dim);letter-spacing:.04em;
  text-transform:uppercase;margin-top:6px;
}

/* подсказка скролла */
.scroll-hint{
  position:absolute;bottom:32px;left:50%;transform:translateX(-50%);
  font-size:10px;letter-spacing:.2em;color:var(--text-dim);
  text-transform:uppercase;
  animation:fadeUp 1s 1.5s both, floaty 3s ease-in-out 2.5s infinite;
}
.scroll-hint::after{
  content:'';display:block;width:1px;height:24px;
  background:linear-gradient(180deg,var(--accent),transparent);
  margin:8px auto 0;
}

/* ───── LOGOS / TRUST BAR ───── */
.trust-bar{
  padding:60px 24px;
  background:linear-gradient(180deg,#000 0%,#070707 100%);
  border-top:1px solid var(--border);
  border-bottom:1px solid var(--border);
}
.trust-inner{
  max-width:var(--container);margin:0 auto;
  display:flex;align-items:center;justify-content:space-between;
  flex-wrap:wrap;gap:24px;
}
.trust-label{
  font-size:11px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--text-dim);font-weight:600;
}
.trust-logos{
  display:flex;gap:48px;align-items:center;flex-wrap:wrap;
  opacity:.6;
}
.trust-logos div{
  font-family:'Fraunces',serif;font-size:18px;color:var(--text-muted);
  letter-spacing:.02em;font-style:italic;
}

/* ───── SERVICES (главная) ───── */
.services-home{background:#000}
.services-cards{
  display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:64px;
}
@media(max-width:900px){.services-cards{grid-template-columns:1fr}}
.svc-card{
  position:relative;
  border-radius:var(--radius);overflow:hidden;
  padding:48px 44px;
  min-height:440px;
  display:flex;flex-direction:column;justify-content:space-between;
  border:1px solid var(--border);
  transition:transform .4s cubic-bezier(.2,.8,.2,1),border-color .3s;
}
.svc-card:hover{transform:translateY(-6px);border-color:var(--border-strong)}
.svc-card.yandex{
  background:
    radial-gradient(ellipse at 100% 0%, rgba(255,204,0,.14) 0%, transparent 50%),
    linear-gradient(135deg,#1a1305 0%,#0d0a02 100%);
}
.svc-card.vk{
  background:
    radial-gradient(ellipse at 0% 100%, rgba(0,119,255,.14) 0%, transparent 50%),
    linear-gradient(135deg,#0a1422 0%,#04080f 100%);
}
.svc-logo{
  width:64px;height:64px;border-radius:18px;
  display:flex;align-items:center;justify-content:center;
  font-family:'Fraunces',serif;font-size:34px;font-weight:600;
  margin-bottom:28px;
  transition:transform .4s;
}
.svc-card:hover .svc-logo{transform:rotate(-6deg) scale(1.05)}
.svc-card.yandex .svc-logo{background:#ffcc00;color:#000}
.svc-card.vk .svc-logo{background:#0077ff;color:#fff}
.svc-card h3{
  font-family:'Fraunces',serif;font-weight:400;
  font-size:clamp(28px,3vw,40px);letter-spacing:-.02em;line-height:1.1;
  margin-bottom:18px;
}
.svc-card .svc-desc{color:var(--text-muted);font-size:16px;line-height:1.6;margin-bottom:28px}
.svc-card ul{list-style:none;display:flex;flex-direction:column;gap:11px;margin-bottom:28px}
.svc-card li{
  font-size:14.5px;color:#d2d2d7;display:flex;align-items:center;gap:12px;
}
.svc-card li::before{
  content:'';width:16px;height:16px;border-radius:50%;flex-shrink:0;
  background:var(--accent);
  -webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path d='M13.5 4.5L6 12L2.5 8.5' stroke='black' stroke-width='2.5' fill='none' stroke-linecap='round' stroke-linejoin='round'/></svg>") center/contain no-repeat;
          mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path d='M13.5 4.5L6 12L2.5 8.5' stroke='black' stroke-width='2.5' fill='none' stroke-linecap='round' stroke-linejoin='round'/></svg>") center/contain no-repeat;
}
.svc-card .svc-link{
  display:inline-flex;align-items:center;gap:8px;
  font-size:14px;color:var(--accent-2);font-weight:500;
  align-self:flex-start;
  transition:gap .2s;
}
.svc-card .svc-link:hover{gap:14px}

@media(max-width:760px){
  .svc-card{padding:36px 28px;min-height:auto}
}

/* ───── FEATURES BENTO ───── */
.features-bento{
  background:
    radial-gradient(ellipse 60% 40% at 50% 0%, rgba(212,175,55,.06) 0%, transparent 60%),
    #050505;
}
.bento{
  display:grid;
  grid-template-columns:repeat(6,1fr);
  grid-auto-rows:minmax(220px,auto);
  gap:18px;margin-top:64px;
}
.bento-item{
  background:linear-gradient(180deg,var(--bg-card) 0%,var(--bg-card-2) 100%);
  border:1px solid var(--border);
  border-radius:var(--radius);
  padding:32px;
  position:relative;overflow:hidden;
  transition:transform .4s cubic-bezier(.2,.8,.2,1),border-color .25s;
}
.bento-item:hover{transform:translateY(-4px);border-color:var(--border-strong)}
.bento-item .icon{
  width:48px;height:48px;border-radius:14px;
  background:var(--accent-soft);
  border:1px solid rgba(212,175,55,.25);
  display:flex;align-items:center;justify-content:center;
  margin-bottom:22px;
  color:var(--accent-2);
  transition:transform .35s;
}
.bento-item:hover .icon{transform:rotate(-8deg) scale(1.1)}
.bento-item h4{
  font-family:'Fraunces',serif;font-weight:500;
  font-size:22px;letter-spacing:-.01em;margin-bottom:10px;line-height:1.2;
}
.bento-item p{font-size:14.5px;color:var(--text-muted);line-height:1.55}

.b1{grid-column:span 3}
.b2{grid-column:span 3}
.b3{grid-column:span 2}
.b4{grid-column:span 2}
.b5{grid-column:span 2}
.b6{grid-column:span 3}
.b7{grid-column:span 3}

@media(max-width:900px){
  .bento{grid-template-columns:1fr}
  .b1,.b2,.b3,.b4,.b5,.b6,.b7,.bento-big{grid-column:span 1}
}

.bento-big{
  grid-column:span 6;min-height:280px;
  background:
    radial-gradient(ellipse at 80% 20%, rgba(212,175,55,.18) 0%, transparent 50%),
    linear-gradient(135deg,#1a1407 0%,#0a0a0a 100%);
  border-color:rgba(212,175,55,.2);
  display:flex;flex-direction:column;justify-content:space-between;
}
.bento-big h4{font-size:clamp(24px,3vw,34px);font-family:'Fraunces',serif;max-width:580px}
.bento-big p{font-size:16px;max-width:520px;margin-top:14px}
.bento-big .badge-row{display:flex;gap:8px;margin-top:24px;flex-wrap:wrap}
.bento-big .badge{
  font-size:11px;padding:5px 12px;border-radius:980px;
  background:rgba(212,175,55,.1);border:1px solid rgba(212,175,55,.3);
  color:var(--accent-2);font-weight:500;
}

/* ───── CASES PREVIEW ───── */
.cases-preview{background:#000}
.cases-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:64px;
}
@media(max-width:900px){.cases-grid{grid-template-columns:1fr;gap:18px}}

.case-card{
  background:var(--bg-card);
  border:1px solid var(--border);
  border-radius:var(--radius);
  padding:36px 32px;
  display:flex;flex-direction:column;
  transition:transform .4s,border-color .3s;
  position:relative;overflow:hidden;
}
.case-card:hover{transform:translateY(-6px);border-color:var(--border-strong)}
.case-card::before{
  content:'';position:absolute;top:0;left:0;right:0;height:3px;
  background:linear-gradient(90deg,var(--accent),var(--accent-2),transparent);
  transform:translateX(-100%);transition:transform .5s;
}
.case-card:hover::before{transform:translateX(0)}
.case-tag{
  font-size:11px;letter-spacing:.08em;text-transform:uppercase;
  color:var(--accent);font-weight:600;margin-bottom:18px;
}
.case-card h4{
  font-family:'Fraunces',serif;font-size:24px;font-weight:500;
  line-height:1.25;margin-bottom:22px;letter-spacing:-.01em;
}
.case-numbers{
  display:grid;grid-template-columns:1fr 1fr;gap:20px;
  padding:24px 0;border-top:1px solid var(--border);
  margin-top:auto;
}
.case-numbers .big{
  font-family:'Fraunces',serif;font-size:32px;
  color:var(--accent-2);line-height:1;letter-spacing:-.02em;
}
.case-numbers .sml{font-size:11px;color:var(--text-dim);margin-top:6px;letter-spacing:.04em;text-transform:uppercase}
.case-card .case-link{
  font-size:13.5px;color:var(--accent-2);
  display:inline-flex;align-items:center;gap:8px;
  margin-top:8px;transition:gap .2s;
}
.case-card:hover .case-link{gap:14px}

/* ───── TESTIMONIALS ───── */
.testimonials{
  background:linear-gradient(180deg,#000 0%,#050505 100%);
}
.testi-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:64px;
}
@media(max-width:900px){.testi-grid{grid-template-columns:1fr}}
.testi{
  padding:36px 32px;
  background:var(--bg-card);
  border:1px solid var(--border);
  border-radius:var(--radius);
  transition:transform .4s,border-color .3s;
}
.testi:hover{transform:translateY(-4px);border-color:rgba(212,175,55,.25)}
.testi-stars{color:var(--accent);font-size:14px;letter-spacing:2px;margin-bottom:18px}
.testi-quote{
  font-family:'Fraunces',serif;font-size:18px;
  line-height:1.5;color:var(--text);
  margin-bottom:24px;
}
.testi-author{
  display:flex;align-items:center;gap:14px;
  padding-top:20px;border-top:1px solid var(--border);
}
.testi-avatar{
  width:44px;height:44px;border-radius:50%;
  background:linear-gradient(135deg,#1a1407,#2a2410);
  border:1px solid rgba(212,175,55,.3);
  display:flex;align-items:center;justify-content:center;
  font-family:'Fraunces',serif;font-size:18px;
  color:var(--accent-2);
}
.testi-author .name{font-size:14px;color:var(--text);font-weight:500}
.testi-author .role{font-size:12px;color:var(--text-dim);margin-top:2px}

/* ───── FINAL CTA ───── */
.final-cta{
  background:#000;padding:160px 24px;text-align:center;
  position:relative;overflow:hidden;
}
.final-cta::before{
  content:'';position:absolute;inset:0;
  background:radial-gradient(ellipse 70% 50% at 50% 60%, rgba(212,175,55,.15) 0%, transparent 60%);
}
.final-inner{position:relative;z-index:2;max-width:820px;margin:0 auto}
.final-cta h2{
  font-family:'Fraunces',serif;font-weight:300;
  font-size:clamp(40px,6.5vw,82px);
  line-height:1;letter-spacing:-.035em;margin-bottom:24px;
}
.final-cta h2 .it{font-style:italic;color:var(--accent-2)}
.final-cta p{font-size:19px;color:var(--text-muted);margin-bottom:44px}

.contact-row{
  display:flex;gap:32px;justify-content:center;flex-wrap:wrap;
  margin-top:48px;font-size:14px;color:var(--text-muted);
}
.contact-row a{
  display:inline-flex;align-items:center;gap:8px;
  color:var(--text);transition:color .2s;
}
.contact-row a:hover{color:var(--accent-2)}