/* =========================================================================
   stories — Figma 1053:1505 "Success stories" (case slider 1105:270) · mobile 964:904
   A deck of cases: the active card (top-left corner 220px round) on the blue glow,
   two black "stack edges" peeking out on the right, Owl arrow bottom-left.
   Slide 2 (Carmel Direct) comes from the mobile frame — see HANDOFF.
   ========================================================================= */
.stories{padding:0 0 77px;background:var(--white)}
.stories__title{max-width:877px;margin:0 auto 50px;line-height:1.05}
.stories__deck{position:relative;max-width:1500px;margin:0 auto;padding-right:48px}
.stories__deck::before,.stories__deck::after{content:"";position:absolute;right:0;top:48px;bottom:48px;width:calc(100% - 51px);border:1px solid #3a3a3a;border-radius:220px 24px 24px 24px;background:#000}
.stories__deck::before{right:25px;top:24px;bottom:24px}
.stories__slider{position:relative;z-index:1}
.stories__slider .owl-stage{display:flex}
.stories__slider .owl-item{display:flex}
.stories__slider .case{width:100%}
.case{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,640px);align-items:center;min-height:640px;padding:79px 73px 81px 142px;border:1px solid var(--grey-line);border-radius:220px 24px 24px 24px;overflow:hidden;color:var(--white);background:#000 url("../images/services-bg.webp") center/cover no-repeat}
.case__text{align-self:stretch;display:flex;flex-direction:column;justify-content:space-between;align-items:flex-start;gap:28px;min-width:0}
.owl-carousel .owl-item .case__logo{width:auto;height:37px}
.owl-carousel .owl-item .case__logo--carmel{height:52px}
.case__result{display:flex;flex-direction:column;align-items:flex-start;gap:8px}
.case__nums{font-size:180px;line-height:1;white-space:nowrap}
.case__nums small{font-size:40px}
.case__metric{font-size:40px;line-height:1.2}
.case__points{list-style:disc;padding-inline-start:33px;font-size:22px;line-height:1.4;color:rgba(255,255,255,.7)}
.case__media--screens{position:relative;height:470px}
.case__screen{position:absolute;top:50px;width:172px;height:376px;border:2px solid var(--white);border-radius:14px;box-shadow:0 24px 50px rgba(0,0,0,.5)}
.case__screen:nth-child(1){right:17px}
.case__screen:nth-child(3){left:17px}
.case__screen--main{top:0;left:50%;width:214px;height:466px;transform:translateX(-50%);z-index:1}
.case__media--photo{height:470px;border:2px solid var(--white);border-radius:14px;box-shadow:0 24px 50px rgba(0,0,0,.5)}
/* Owl arrow (one, bottom-left; RTL "next" = the left-pointing circle) */
.stories .owl-nav{position:absolute;left:55px;bottom:57px;z-index:2;display:flex;gap:12px}
.stories .owl-carousel .owl-nav button.owl-prev,.stories .owl-carousel .owl-nav button.owl-next{width:64px;height:64px;color:var(--white)}
.stories .owl-nav button svg{width:64px;height:64px}
.stories .owl-nav button.owl-prev svg{transform:scaleX(-1)}
.stories .owl-nav button.disabled{display:none}
.stories .owl-nav button:hover{opacity:.75}
.stories__more{display:flex;justify-content:center;margin-top:50px}

@media (max-width:1480px){
  .case{padding-left:96px;grid-template-columns:minmax(0,1fr) minmax(0,560px)}
  .case__nums{font-size:150px}
  .case__metric{font-size:34px}
  .case__points{font-size:20px}
}
@media (max-width:1100px){
  .stories__deck{padding-right:0}
  .stories__deck::before,.stories__deck::after{display:none}
  .case{grid-template-columns:1fr;row-gap:36px;min-height:0;padding:40px 32px 104px;border-radius:120px 20px 20px 20px}
  .case__media{order:-1}
  .case__media--screens{height:400px}
  .case__media--photo{height:auto;padding-bottom:62%}
  .case__nums{font-size:120px}
  .stories .owl-nav{left:32px;bottom:28px}
  .stories .owl-nav button,.stories .owl-nav button svg{width:52px;height:52px}
}
@media (max-width:800px){
  .stories{padding-bottom:56px}
  .stories__title{margin-bottom:28px}
  .case{padding:12px 12px 92px;border-radius:14px;row-gap:24px}
  .case__text{padding-inline:12px;gap:18px}
  .case__media--screens{height:300px;margin-top:12px}
  .case__screen{width:118px;height:258px;top:34px;border-radius:10px}
  .case__screen--main{width:146px;height:318px;top:0}
  .case__screen:nth-child(1){right:0}
  .case__screen:nth-child(3){left:0}
  .case__media--photo{padding-bottom:70%;border-radius:10px}
  .case__nums{font-size:72px}
  .case__nums small{font-size:24px}
  .case__metric{font-size:22px}
  .case__points{font-size:16px;padding-inline-start:22px}
  .owl-carousel .owl-item .case__logo{height:30px}
  .owl-carousel .owl-item .case__logo--carmel{height:42px}
  .stories__more{margin-top:28px}
}
