/* ============================================================
   CASE PAGE — PREMIUM (галерея + полное описание)
   ============================================================ */

/* HERO: орбы + переливающийся заголовок */
.case-hero { position: relative; overflow: hidden; }
.case-hero .gold-shine {
  background: linear-gradient(110deg,#D4AF37 20%,#fff5cc 45%,#D4AF37 70%);
  -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
  background-size: 200% auto; animation: goldShine 4s linear infinite;
}
@keyframes goldShine { to { background-position: 200% center; } }
.case-hero-orbs span { position:absolute; border-radius:50%; filter:blur(60px); opacity:.35; pointer-events:none; }
.case-hero-orbs span:nth-child(1){ width:320px;height:320px;background:#D4AF37;top:-80px;right:-60px;animation:floatOrb 9s ease-in-out infinite; }
.case-hero-orbs span:nth-child(2){ width:240px;height:240px;background:#1B6CA8;bottom:-60px;left:10%;animation:floatOrb 11s ease-in-out infinite reverse; }
.case-hero-orbs span:nth-child(3){ width:180px;height:180px;background:#D4AF37;top:40%;left:45%;opacity:.2;animation:floatOrb 13s ease-in-out infinite; }
@keyframes floatOrb { 0%,100%{transform:translate(0,0)} 50%{transform:translate(30px,-30px)} }

.case-hero-badge {
  display:inline-flex; align-items:center; gap:8px; margin-bottom:16px;
  padding:8px 18px; border-radius:100px; font-size:12px; font-weight:600;
  letter-spacing:1.5px; text-transform:uppercase; color:var(--gold);
  border:1px solid rgba(212,175,55,.3); background:rgba(212,175,55,.05);
}
.case-hero-btns { display:flex; gap:16px; flex-wrap:wrap; margin-top:30px; }

/* ---- ГАЛЕРЕЯ (компактная) ---- */
.case-gallery { position:relative; }
.gallery-main {
  position:relative; border-radius:18px; overflow:hidden;
  border:1px solid rgba(212,175,55,.2); margin-bottom:12px;
  background:linear-gradient(160deg,#14283f,#0a1523);
  aspect-ratio:16/10;
}
.gallery-main img {
  width:100%; height:100%; object-fit:cover; display:block;
  transition:opacity .4s ease; cursor:zoom-in;
}
.gallery-main .gm-placeholder {
  position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  font-size:70px; color:rgba(212,175,55,.4);
}
/* стрелки галереи */
.gallery-arrow {
  position:absolute; top:50%; transform:translateY(-50%); z-index:5;
  width:42px; height:42px; border-radius:50%; cursor:pointer;
  border:1px solid rgba(212,175,55,.4); background:rgba(13,27,42,.6);
  backdrop-filter:blur(8px); color:var(--gold);
  display:flex; align-items:center; justify-content:center; transition:.3s;
}
.gallery-arrow:hover { background:linear-gradient(135deg,#F0D48A,#D4AF37); color:var(--navy); }
.gallery-arrow svg { width:20px; height:20px; }
.ga-prev { left:12px; }
.ga-next { right:12px; }
/* счётчик + зум */
.gallery-count {
  position:absolute; bottom:12px; right:12px; z-index:5;
  padding:5px 12px; border-radius:100px; font-size:12px; font-weight:600;
  color:#fff; background:rgba(13,27,42,.7); backdrop-filter:blur(8px);
  border:1px solid rgba(212,175,55,.25);
}
.gallery-zoom {
  position:absolute; top:12px; right:12px; z-index:5;
  width:38px; height:38px; border-radius:50%; cursor:pointer;
  border:1px solid rgba(212,175,55,.4); background:rgba(13,27,42,.6);
  backdrop-filter:blur(8px); color:var(--gold);
  display:flex; align-items:center; justify-content:center; transition:.3s;
}
.gallery-zoom:hover { background:linear-gradient(135deg,#F0D48A,#D4AF37); color:var(--navy); }
.gallery-zoom svg { width:16px; height:16px; }

/* превьюшки (компактные) */
.gallery-thumbs { display:flex; gap:10px; overflow-x:auto; padding-bottom:4px; scrollbar-width:none; }
.gallery-thumbs::-webkit-scrollbar { display:none; }
.gallery-thumbs button {
  flex:0 0 84px; height:56px; border-radius:10px; overflow:hidden; cursor:pointer;
  border:2px solid transparent; background:#0f1e30; padding:0; transition:.3s;
  position:relative;
}
.gallery-thumbs button img { width:100%; height:100%; object-fit:cover; display:block; }
.gallery-thumbs button .thumb-ph {
  width:100%; height:100%; display:flex; align-items:center; justify-content:center;
  font-size:22px; color:rgba(212,175,55,.4);
}
.gallery-thumbs button.active { border-color:var(--gold); }
.gallery-thumbs button:hover { border-color:rgba(212,175,55,.5); }



/* ---- ИНФО-КАРТА ПРОЕКТА (сайдбар) ---- */
.case-layout { display:grid; grid-template-columns:1fr 380px; gap:40px; align-items:start; }
.case-infocard {
  position:relative; overflow:hidden;
  background:rgba(255,255,255,.03); border:1px solid rgba(212,175,55,.18);
  border-radius:22px; padding:30px; position:sticky; top:120px;
}
.case-infocard::before {
  content:''; position:absolute; inset:0; border-radius:22px; padding:1px; z-index:1;
  background:linear-gradient(135deg,rgba(212,175,55,.6),transparent 40%,transparent 60%,rgba(212,175,55,.4));
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite:xor; mask-composite:exclude; pointer-events:none;
}
.case-infocard > * { position:relative; z-index:2; }
.case-infocard h3 { font-size:18px; font-weight:700; margin-bottom:20px; }
.ci-row {
  display:flex; align-items:flex-start; gap:14px; padding:14px 0;
  border-bottom:1px solid rgba(255,255,255,.06);
}
.ci-row:last-of-type { border-bottom:none; }
.ci-ic {
  width:42px; height:42px; flex-shrink:0; border-radius:11px; font-size:19px;
  display:flex; align-items:center; justify-content:center; color:var(--gold);
  background:linear-gradient(135deg,rgba(212,175,55,.16),rgba(212,175,55,.04));
  border:1px solid rgba(212,175,55,.2);
}
.ci-ic svg { width:19px; height:19px; }
.ci-txt { min-width:0; }
.ci-label { font-size:11px; color:rgba(255,255,255,.5); letter-spacing:.6px; text-transform:uppercase; margin-bottom:3px; }
.ci-val { font-size:15px; font-weight:600; color:#fff; line-height:1.4; word-break:break-word; }
.case-infocard .btn { width:100%; justify-content:center; margin-top:22px; }

/* ---- БЛОК ЦИФР (результаты) ---- */
.case-metrics { display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
.metric-card {
  position:relative; overflow:hidden; text-align:center; padding:34px 20px;
  background:rgba(255,255,255,.03); border:1px solid rgba(212,175,55,.14); border-radius:18px;
  transition:transform .4s var(--ease), border-color .4s, box-shadow .4s;
}
.metric-card:hover { transform:translateY(-8px); border-color:rgba(212,175,55,.4); box-shadow:0 24px 50px -20px rgba(0,0,0,.6); }
.metric-card h3 {
  font-size:42px; font-weight:800; line-height:1; margin-bottom:8px; letter-spacing:-1px;
  background:linear-gradient(100deg,#B8862F,#E8C468 40%,#FFF3D0 55%,#E8C468 70%,#B8862F);
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;
}
.metric-card p { font-size:12.5px; color:var(--gray); letter-spacing:.8px; text-transform:uppercase; margin:0; }

/* ---- ЗАДАЧА / РЕШЕНИЕ ---- */
.case-cols { display:grid; grid-template-columns:1fr 1fr; gap:28px; }
.case-col {
  position:relative; overflow:hidden; padding:34px 30px;
  background:rgba(255,255,255,.03); border:1px solid rgba(212,175,55,.14); border-radius:20px;
  transition:border-color .4s, box-shadow .4s;
}
.case-col:hover { border-color:rgba(212,175,55,.35); box-shadow:0 20px 44px -24px rgba(0,0,0,.7); }
.case-col .cc-ic {
  width:56px; height:56px; margin-bottom:18px; font-size:26px;
  display:flex; align-items:center; justify-content:center; border-radius:15px; color:var(--gold);
  background:linear-gradient(135deg,rgba(212,175,55,.16),rgba(212,175,55,.04));
  border:1px solid rgba(212,175,55,.2);
}
.case-col h3 { font-size:22px; font-weight:600; margin-bottom:14px; }
.case-col p { color:rgba(255,255,255,.68); font-size:15px; line-height:1.75; margin:0; }

/* ---- ПОЛНОЕ ОПИСАНИЕ ---- */
.case-article { max-width:820px; margin:0 auto; }
.case-article h2 {
  font-size:28px; font-weight:700; margin:40px 0 18px; position:relative; padding-left:20px;
}
.case-article h2::before {
  content:''; position:absolute; left:0; top:6px; bottom:6px; width:4px; border-radius:4px;
  background:var(--gold-grad);
}
.case-article h2:first-child { margin-top:0; }
.case-article p { color:rgba(255,255,255,.72); font-size:16px; line-height:1.85; margin-bottom:18px; }
.case-article ul { margin:0 0 20px; padding:0; }
.case-article li {
  color:rgba(255,255,255,.72); font-size:15.5px; line-height:1.6;
  padding:9px 0 9px 30px; position:relative;
}
.case-article li::before { content:'✦'; position:absolute; left:0; top:9px; color:var(--gold); }
.case-article .case-highlight {
  background:rgba(212,175,55,.06); border:1px solid rgba(212,175,55,.18);
  border-left:4px solid var(--gold); border-radius:12px; padding:24px 28px; margin:26px 0;
}
.case-article .case-highlight p { margin:0; font-size:16px; color:#e8ecf2; font-style:italic; }

/* ---- ТЕГИ ТЕХНОЛОГИЙ ---- */
.case-tech { display:flex; flex-wrap:wrap; gap:10px; margin-top:24px; }
.case-tech span {
  font-size:13px; padding:8px 16px; border-radius:100px;
  background:rgba(212,175,55,.08); border:1px solid rgba(212,175,55,.2); color:rgba(212,175,55,.9);
}

/* ---- ОТЗЫВ ВЛАДЕЛЬЦА ---- */
.owner-review {
  position:relative; overflow:hidden; max-width:900px; margin:0 auto;
  background:rgba(255,255,255,.03); border:1px solid rgba(212,175,55,.2);
  border-radius:24px; padding:50px;
}
.owner-review::before {
  content:''; position:absolute; inset:0; border-radius:24px; padding:1px; z-index:1;
  background:linear-gradient(135deg,rgba(212,175,55,.6),transparent 40%,transparent 60%,rgba(212,175,55,.4));
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite:xor; mask-composite:exclude; pointer-events:none;
}
.owner-review > * { position:relative; z-index:2; }
.or-glow {
  position:absolute; top:-30%; right:-10%; width:400px; height:400px; z-index:0;
  background:radial-gradient(circle,rgba(212,175,55,.12),transparent 65%); filter:blur(30px);
}
.or-mark { font-size:64px; color:var(--gold); line-height:.6; margin-bottom:10px; }
.or-text { font-size:22px; line-height:1.6; color:#e8ecf2; font-style:italic; margin-bottom:28px; }
.or-author { display:flex; align-items:center; gap:16px; }
.or-ava {
  width:60px; height:60px; border-radius:50%; flex-shrink:0;
  background:var(--gold-grad); color:var(--navy);
  display:flex; align-items:center; justify-content:center; font-weight:800; font-size:24px;
}
.or-author h4 { font-size:17px; font-weight:600; margin-bottom:3px; }
.or-author span { color:var(--gray); font-size:14px; }
.or-stars { color:var(--gold); font-size:16px; letter-spacing:3px; margin-bottom:16px; }

/* ---- НАВИГАЦИЯ МЕЖДУ КЕЙСАМИ ---- */
.case-nav-wrap { display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; }

/* ---- ЛАЙТБОКС ГАЛЕРЕИ ---- */
.case-lightbox {
  position:fixed; inset:0; z-index:2000;
  display:flex; align-items:center; justify-content:center;
  background:rgba(5,12,22,.94); backdrop-filter:blur(10px);
  opacity:0; visibility:hidden; transition:opacity .4s, visibility .4s; padding:30px;
}
.case-lightbox.open { opacity:1; visibility:visible; }
.clb-img-wrap {
  position:relative; max-width:1100px; max-height:85vh; width:100%;
  transform:scale(.92); transition:transform .45s var(--ease);
}
.case-lightbox.open .clb-img-wrap { transform:scale(1); }
.clb-img-wrap img {
  width:100%; max-height:85vh; object-fit:contain; border-radius:14px;
  border:1px solid rgba(212,175,55,.3);
}
.clb-close {
  position:absolute; top:24px; right:24px; z-index:10;
  width:46px; height:46px; border-radius:50%; cursor:pointer;
  border:1px solid rgba(212,175,55,.4); background:rgba(13,27,42,.7); color:var(--gold);
  display:flex; align-items:center; justify-content:center; font-size:26px; transition:.3s;
}
.clb-close:hover { background:linear-gradient(135deg,#F0D48A,#D4AF37); color:var(--navy); }
.clb-arrow {
  position:absolute; top:50%; transform:translateY(-50%); z-index:10;
  width:52px; height:52px; border-radius:50%; cursor:pointer;
  border:1px solid rgba(212,175,55,.4); background:rgba(13,27,42,.65); color:var(--gold);
  display:flex; align-items:center; justify-content:center; transition:.3s;
}
.clb-arrow:hover { background:linear-gradient(135deg,#F0D48A,#D4AF37); color:var(--navy); }
.clb-arrow svg { width:24px; height:24px; }
.clb-prev { left:20px; }
.clb-next { right:20px; }

/* reveal */
.case-reveal { opacity:0; transform:translateY(40px); transition:opacity .6s ease, transform .6s ease; }
.case-reveal.visible { opacity:1; transform:translateY(0); }

/* ============ АДАПТИВ ============ */
@media (max-width:1024px){
  .case-layout { grid-template-columns:1fr; }
  .case-infocard { position:static; }
  .case-metrics { grid-template-columns:repeat(2,1fr); }
}
@media (max-width:768px){
      .case-hero { padding:120px 0 40px !important; }   /* ← ДОБАВИТЬ */
  .gallery-main { aspect-ratio:16/11; }              /* ← ДОБАВИТЬ */
  .case-cols { grid-template-columns:1fr; }
  .case-metrics { grid-template-columns:repeat(2,1fr); }
  .owner-review { padding:34px 24px; }
  .or-text { font-size:18px; }
  .gallery-arrow { width:40px; height:40px; }
  .case-article h2 { font-size:24px; }
  .case-nav-wrap { flex-direction:column; }
  .case-nav-wrap .btn { width:100%; justify-content:center; }
  .case-hero-btns { flex-direction:column; }
  .case-hero-btns .btn { width:100%; justify-content:center; }
  .gallery-thumbs button { flex-basis:80px; height:54px; }
}
@media (max-width:480px){
  .case-metrics { grid-template-columns:1fr; }
  .metric-card h3 { font-size:36px; }
  .owner-review { padding:28px 20px; }
  .or-text { font-size:16px; }
}
