.ds-v2-custom-section{background:#fff url('../images/home-v2/section-ornaments.svg') center/cover no-repeat}
.ds-v2-custom-photo span{display:none}

/* Three-image hero carousel. Slide 1 is a full photo (copy baked in); slides 2–3 use HTML copy. */
.ds-v2-hero .ds-v2-screen::before{content:none}
.ds-hero-carousel{position:relative;width:100%;height:100%;min-height:100vh;overflow:hidden;background:#eef3fa;isolation:isolate;--hero-content-x:clamp(72px,5.2vw,104px)}
.ds-hero-panel{position:absolute;z-index:0;inset:0;opacity:0;visibility:hidden;transform:scale(1.018);transition:opacity 1s ease,transform 7s ease,visibility 1s linear;pointer-events:none}
.ds-hero-panel.is-active{z-index:1;opacity:1;visibility:visible;transform:scale(1);pointer-events:auto}
.ds-hero-image{display:block;width:100%;height:100%;object-fit:fill;object-position:center center}
.ds-hero-panel:first-child{--hero-header-space:clamp(74px,5.2vw,100px);background:#f4f7fc}
.ds-hero-panel--photo{background:#f4f7fc}
.ds-hero-panel--photo .ds-hero-image{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:fill;
  object-position:center center;
}
.ds-hero-panel--built{background:linear-gradient(135deg,#f7f9fd 0%,#edf2fa 100%)}
.ds-hero-built-stage{position:absolute;inset:0;display:grid;grid-template-columns:minmax(320px,.78fr) minmax(480px,1.22fr);gap:clamp(40px,5vw,70px);align-items:center;padding:clamp(104px,14vh,148px) clamp(58px,7.5vw,112px) clamp(96px,11vh,124px);padding-left:var(--hero-content-x)}
.ds-hero-panel--built .ds-hero-code-copy{position:relative;left:auto;top:auto;width:auto;max-width:640px;transform:none;align-self:center}
.ds-hero-built-metric{margin:clamp(22px,3vh,32px) 0 0;color:#071a38;font-size:clamp(22px,1.8vw,32px);font-weight:700;line-height:1.35}
.ds-hero-built-metric strong{color:#1768df;font-size:1.35em;font-weight:800}
.ds-hero-built-tagline{margin:13px 0 0;color:#071a38;font-size:clamp(20px,1.55vw,29px);font-weight:700;line-height:1.35}
.ds-hero-products{position:relative;z-index:2;display:grid;grid-template-columns:1fr 1fr;gap:clamp(10px,1.2vw,14px);width:100%;max-width:920px;justify-self:end;align-self:center;margin-top:clamp(36px,5.5vh,72px)}
.ds-hero-products:before{content:"";position:absolute;z-index:3;left:-8%;right:-8%;top:50%;height:2px;transform:translateY(-50%);background:linear-gradient(90deg,transparent,#b25fff 18%,#5c80ff 82%,transparent);box-shadow:0 0 17px rgba(138,99,255,.85)}
.ds-hero-products figure{height:clamp(220px,30vh,315px);margin:0;display:grid;place-items:center;border:1px solid #dce4ef;border-radius:7px;background:rgba(255,255,255,.72);box-shadow:0 12px 30px rgba(31,59,111,.08)}
.ds-hero-products img{width:91%;height:91%;object-fit:contain;filter:drop-shadow(0 16px 15px rgba(12,27,55,.18))}
.ds-hero-first-stage{position:absolute;inset:0;overflow:hidden}
.ds-hero-first-canvas{position:relative;width:100%;height:100%;container-type:inline-size}
.ds-hero-first-canvas .ds-hero-image{position:absolute;inset:0;width:100%;height:100%;object-position:center center}
.ds-hero-first-copy{position:absolute;z-index:2;left:4.86%;top:15.75%;width:38%;color:#071a38;text-shadow:0 1px 0 rgba(255,255,255,.55)}
.ds-hero-first-kicker{margin:0;padding-left:1.45cqw;border-left:.42cqw solid #1768df;color:#1768df;font-size:1.5cqw;font-weight:700;line-height:1.5;white-space:nowrap}
.ds-hero-first-copy h1{margin:2.35cqw 0 0;color:#06172f;font-size:5.25cqw;font-weight:800;line-height:1.43;letter-spacing:-.055em}
.ds-hero-first-metric{margin:1.65cqw 0 0;color:#071a38;font-size:2.18cqw;font-weight:700;line-height:1.35}
.ds-hero-first-metric strong{color:#1768df;font-size:1.2em;font-weight:800}
.ds-hero-first-tagline{margin:1.18cqw 0 0;color:#071a38;font-size:2.18cqw;font-weight:700;line-height:1.35}
.ds-hero-code-copy{position:absolute;z-index:2;left:var(--hero-content-x);top:51%;width:min(43vw,720px);transform:translateY(-44%);color:#071a38;text-shadow:0 1px 0 rgba(255,255,255,.35)}
.ds-hero-code-kicker{margin:0 0 clamp(24px,3.2vh,36px);padding-left:18px;border-left:5px solid #1768df;color:#1768df;font-size:clamp(14px,1.15vw,21px);font-weight:700;line-height:1.5;white-space:nowrap}
.ds-hero-code-copy h1{margin:0;color:#071a38;font-size:clamp(52px,4.3vw,78px);font-weight:800;line-height:1.27;letter-spacing:-.055em}
.ds-hero-code-desc{margin:clamp(22px,3vh,34px) 0 0;color:#233d63;font-size:clamp(17px,1.35vw,25px);font-weight:500;line-height:1.9}
.ds-hero-dots{position:absolute;z-index:5;left:var(--hero-content-x);right:auto;bottom:clamp(28px,4.5vh,48px);display:flex;align-items:center;gap:8px;transform:none}
.ds-hero-dots button{width:auto;height:auto;padding:8px 0;border:0;background:transparent;box-shadow:none;cursor:pointer}
.ds-hero-dot-track{display:block;width:52px;height:2px;border-radius:999px;background:rgba(21,69,139,.16);overflow:hidden}
.ds-hero-dot-fill{display:block;width:0;height:100%;border-radius:inherit;background:linear-gradient(90deg,#1768df 0%,#5c80ff 100%);box-shadow:0 0 10px rgba(92,128,255,.35)}
.ds-hero-dots button.is-active .ds-hero-dot-fill{animation:dsHeroDotFill var(--hero-autoplay-ms,6s) linear forwards}
.ds-hero-dots button.is-complete .ds-hero-dot-fill{width:100%;animation:none}
@keyframes dsHeroDotFill{from{width:0}to{width:100%}}

@media (max-height:820px) and (min-width:768px){
  .ds-hero-code-copy{top:54%;transform:translateY(-45%)}
  .ds-hero-built-stage{padding-top:118px;padding-bottom:88px}
  .ds-hero-products{margin-top:28px}
  .ds-hero-code-kicker{margin-bottom:20px;font-size:15px}
  .ds-hero-code-copy h1{font-size:54px}
  .ds-hero-code-desc{margin-top:18px;font-size:17px}
  .ds-hero-dots{bottom:20px}
}

@media (max-width:767px){
  .ds-hero-carousel{--hero-content-x:16px;background:#f4f7fc}
  /* Mobile hero: only the active slide is in flow — avoids absolute layers covering copy */
  .ds-v2-hero .ds-v2-screen,
  .ds-hero-carousel{
    height:auto!important;
    min-height:0!important;
    max-height:none;
    overflow:visible;
  }
  .ds-hero-panel{
    position:relative!important;
    inset:auto!important;
    display:none;
    opacity:1!important;
    visibility:visible!important;
    transform:none!important;
    pointer-events:none;
    overflow:visible;
    height:auto!important;
    background:transparent;
  }
  .ds-hero-panel.is-active{
    display:flex;
    flex-direction:column;
    pointer-events:auto;
    z-index:1;
  }
  .ds-hero-panel--photo.is-active{
    display:block;
  }
  .ds-hero-image,
  .ds-hero-panel--photo .ds-hero-image{
    position:relative!important;
    inset:auto!important;
    display:block;
    width:100%;
    height:auto!important;
    object-fit:unset!important;
    object-position:center center;
  }
  .ds-hero-panel:first-child{--hero-header-space:0;background:#f4f7fc}

  /* Slides 2–3: photo on top, copy card below (always visible) */
  .ds-hero-panel:not(.ds-hero-panel--photo) .ds-hero-image{
    flex:0 0 auto;
    max-height:46vh;
    object-fit:cover!important;
  }
  .ds-hero-panel:not(.ds-hero-panel--photo) .ds-hero-code-copy{
    position:relative!important;
    left:auto!important;
    right:auto!important;
    top:auto!important;
    bottom:auto!important;
    width:auto!important;
    max-width:none!important;
    transform:none!important;
    z-index:3;
    margin:12px 16px 52px;
    padding:16px 16px 14px!important;
    border-radius:14px;
    background:#fff!important;
    color:#071a38!important;
    box-shadow:0 10px 28px rgba(21,54,108,.08);
    backdrop-filter:none;
    text-shadow:none;
    opacity:1!important;
    visibility:visible!important;
  }
  .ds-hero-panel:not(.ds-hero-panel--photo) .ds-hero-code-kicker{
    display:block;
    margin-bottom:12px;
    padding-left:12px;
    border-left-width:3px;
    color:#1768df!important;
    font-size:11px;
    line-height:1.55;
    white-space:normal;
  }
  .ds-hero-panel:not(.ds-hero-panel--photo) .ds-hero-code-copy h1{
    color:#071a38!important;
    font-size:clamp(24px,7vw,30px);
    line-height:1.28;
  }
  .ds-hero-panel:not(.ds-hero-panel--photo) .ds-hero-code-desc{
    margin-top:10px;
    color:#233d63!important;
    font-size:13px;
    line-height:1.7;
  }

  .ds-hero-dots{
    left:0;
    right:0;
    bottom:12px;
    justify-content:center;
    gap:6px;
    z-index:5;
  }
  .ds-hero-dot-track{width:34px}
  .ds-v2-custom-section{background-size:cover;background-position:center top}
  .ds-v2-why-section .ds-v2-heading p{max-width:340px}

  /* Mobile news: image on top, text below — single column card */
  .ds-v2-news-section .ds-v2-section{padding-top:68px;padding-bottom:36px}
  .ds-v2-heading-row{
    flex-direction:column;
    align-items:center;
    text-align:center;
    gap:10px;
  }
  .ds-v2-heading-row>div{width:100%}
  .ds-v2-heading-row>div>i{margin:0 auto 12px}
  .ds-v2-heading-row h2{font-size:26px}
  .ds-v2-heading-row p{
    margin:8px auto 0;
    max-width:300px;
    font-size:13px;
    line-height:1.7;
  }
  .ds-v2-heading-row>a{
    padding:0;
    font-size:13px;
    font-weight:600;
  }
  .ds-v2-news-card{
    display:flex!important;
    flex-direction:column;
    grid-template-columns:1fr!important;
    height:auto!important;
    min-height:0!important;
    margin-top:20px;
    border-radius:14px;
    background:#fff;
    border:1px solid #e3ebf6;
    box-shadow:0 10px 28px rgba(21,54,108,.06);
    overflow:hidden;
    align-items:stretch;
  }
  .ds-v2-news-photo{
    width:100%;
    height:auto;
    line-height:0;
  }
  .ds-v2-news-photo img{
    display:block;
    width:100%;
    height:auto!important;
    object-fit:unset!important;
  }
  .ds-v2-news-copy{
    padding:18px 18px 20px;
  }
  .ds-v2-news-copy small{font-size:12px}
  .ds-v2-news-copy h3{
    margin:10px 0 10px;
    font-size:20px;
    line-height:1.4;
  }
  .ds-v2-news-copy p{
    font-size:13px;
    line-height:1.75;
  }
  .ds-v2-news-copy a{
    margin-top:14px;
    font-size:13px;
    font-weight:600;
  }
  .ds-v2-news-lab{display:none!important}
}


/* Why section: soft bottom ornament + small light-ray flush to screen bottom (no white gap) */
.ds-v2-why .ds-v2-screen{
  background:#f8faff;
}
.ds-v2-why-section.ds-v2-pattern{
  position:relative;
  background-color:#f8faff;
  background-image:url('../images/home-v2/section-ornaments.svg');
  background-repeat:no-repeat;
  background-position:right bottom;
  background-size:min(1200px,92vw) auto;
}
.ds-v2-why-section::after{content:none}

.ds-v2-why .ds-v2-screen::after{
  content:"";
  position:absolute;
  z-index:0;
  left:50%;
  bottom:0;
  width:100%;
  height:110px;
  transform:translateX(-50%);
  pointer-events:none;
  background:
    radial-gradient(ellipse at 50% 100%,rgba(65,132,244,.22) 0,rgba(164,203,255,.12) 34%,transparent 70%),
    repeating-conic-gradient(from 258deg at 50% 100%,rgba(74,139,244,.10) 0deg,transparent 1.1deg,transparent 6deg);
}
.ds-v2-why-section,
.ds-v2-why-section > *{position:relative;z-index:1}

@media (min-width:768px){
  .ds-v2-why .ds-v2-screen,
  .ds-v2-why-section{
    display:flex;
    flex-direction:column;
    justify-content:center;
  }
  .ds-v2-why-section{
    height:100%;
    padding-top:clamp(108px,12vh,132px);
    padding-bottom:clamp(28px,4vh,48px);
    box-sizing:border-box;
  }
}

.ds-v2-actions{position:relative;isolation:isolate}
.ds-v2-actions::before{content:none}

/* News follows the supplied two-column composition; no decorative third image. */
.ds-v2-news-card{grid-template-columns:1.08fr 1.42fr}

/* Keep desktop section headings comfortably below the fixed 88px navigation. */
@media (min-width:768px){
  .ds-v2-section{padding-top:clamp(128px,13vh,146px)}
}

/* Compact desktop windows: keep every heading, rule and card clear of the fixed nav. */
@media (min-width:768px) and (max-height:900px){
  .ds-v2-section{padding-top:134px;padding-bottom:18px}
  .ds-v2-heading h2{font-size:34px}
  .ds-v2-heading p{margin-top:6px}
  .ds-v2-product-grid,.ds-v2-app-grid,.ds-v2-custom-layout,.ds-v2-why-grid,.ds-v2-news-card{margin-top:18px}
  .ds-v2-product-card{height:500px}
  .ds-v2-app-grid article{height:auto;min-height:0}
  .ds-v2-custom-list article{height:100px}
  .ds-v2-custom-photo{height:430px}
  .ds-v2-why-section{padding-top:118px;padding-bottom:22px}
  .ds-v2-why-grid article{min-height:150px;padding:18px 18px 16px}
  .ds-v2-actions{margin-top:18px}
  .ds-v2-news-card{height:500px}
  .ds-v2-news-copy{padding-top:38px;padding-bottom:30px}
}

@media (min-width:768px) and (max-height:780px){
  .ds-v2-section{padding-top:126px}
  .ds-v2-product-card{height:470px}
  .ds-v2-app-grid article{height:auto;min-height:0}
  .ds-v2-custom-list article{height:92px}
  .ds-v2-custom-photo{height:395px}
  .ds-v2-why-section{padding-top:108px;padding-bottom:18px}
  .ds-v2-why-grid{gap:12px}
  .ds-v2-why-grid article{min-height:132px;padding:14px 16px}
  .ds-v2-why-grid img{width:36px;height:36px;margin-bottom:10px}
  .ds-v2-news-card{height:470px}
}


/* MOBILE HERO COPY FIX — keep slide 2/3 text in document flow (PC unchanged) */
@media (max-width:767px){
  .ds-v2-hero .h_b_box.ds-v2-screen,
  .swiper-slide.ds-v2-hero .ds-v2-screen{
    height:auto!important;
    max-height:none!important;
    min-height:0!important;
    overflow:visible!important;
  }
  .ds-v2-hero .ds-hero-carousel{
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    overflow:visible!important;
  }
  .ds-v2-hero .ds-hero-panel{
    position:relative!important;
    inset:auto!important;
    display:none!important;
    opacity:1!important;
    visibility:visible!important;
    transform:none!important;
    height:auto!important;
    overflow:visible!important;
    background:#f4f7fc!important;
  }
  .ds-v2-hero .ds-hero-panel.is-active{
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
  }
  .ds-v2-hero .ds-hero-panel--photo.is-active{
    display:block!important;
  }
  .ds-v2-hero .ds-hero-image{
    position:static!important;
    inset:auto!important;
    width:100%!important;
    height:auto!important;
    max-height:none!important;
    object-fit:unset!important;
  }
  .ds-v2-hero .ds-hero-panel--with-copy.is-active .ds-hero-image{
    max-height:42vh!important;
    object-fit:cover!important;
  }
  .ds-v2-hero .ds-hero-panel--with-copy .ds-hero-code-copy,
  .ds-v2-hero .ds-hero-panel.is-active .ds-hero-code-copy{
    display:block!important;
    position:static!important;
    left:auto!important;
    right:auto!important;
    top:auto!important;
    bottom:auto!important;
    width:auto!important;
    max-width:none!important;
    transform:none!important;
    opacity:1!important;
    visibility:visible!important;
    z-index:3!important;
    margin:12px 16px 56px!important;
    padding:16px!important;
    border-radius:14px!important;
    background:#fff!important;
    color:#071a38!important;
    box-shadow:0 10px 28px rgba(21,54,108,.1)!important;
    text-shadow:none!important;
  }
  .ds-v2-hero .ds-hero-panel--photo .ds-hero-code-copy{display:none!important}
  .ds-v2-hero .ds-hero-code-copy h1{color:#071a38!important;font-size:clamp(22px,6.5vw,28px)!important;line-height:1.3!important}
  .ds-v2-hero .ds-hero-code-kicker{color:#1768df!important;font-size:11px!important;white-space:normal!important}
  .ds-v2-hero .ds-hero-code-desc{color:#233d63!important;font-size:13px!important;line-height:1.7!important;margin-top:10px!important}
  .ds-v2-hero .ds-hero-dots{position:absolute!important;left:0!important;right:0!important;bottom:10px!important;justify-content:center!important;z-index:6!important}
}