/* Hero — mobile-first, matched to design refs */

.dl-hero{position:relative;isolation:isolate}

.dl-hero__stage{
  position:relative;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  overflow:hidden;
  min-height:auto;
  color:#fff;
  background:
    linear-gradient(180deg, rgba(46,16,101,.35) 0%, rgba(46,16,101,.55) 38%, rgba(46,16,101,.88) 100%),
    var(--dl-hero-bg, none) center/cover no-repeat,
    linear-gradient(145deg,#6A1B9A,#2E1065);
}

.dl-hero__stage::before{
  content:"";
  position:absolute;inset:0;z-index:0;pointer-events:none;
  background:
    radial-gradient(480px 280px at 80% 12%, rgba(196,181,253,.22), transparent 58%),
    radial-gradient(380px 240px at 12% 78%, rgba(124,58,237,.16), transparent 55%);
}

.dl-hero__grid{
  position:relative;z-index:1;
  display:flex;
  flex-direction:column;
  align-items:stretch;
  gap:0;
  width:min(100% - 1.25rem, var(--dl-container));
  margin-inline:auto;
  padding:calc(var(--dl-header-h) + .35rem) 0 1.1rem;
}

/* Mobile: photo on top (ref), copy below */
.dl-hero__photo{
  order:1;
  display:flex;
  align-items:flex-end;
  justify-content:center;
  min-height:0;
  margin:0;
}
.dl-hero__photo img{
  width:min(100%, 300px);
  max-height:min(38svh, 340px);
  object-fit:contain;
  object-position:center bottom;
  filter:drop-shadow(0 24px 36px rgba(0,0,0,.35));
  animation:dlHeroIn .85s var(--dl-ease) both;
}

.dl-hero__copy{
  order:2;
  text-align:center;
  padding:0 .15rem .15rem;
  max-width:36rem;
  margin-inline:auto;
  animation:dlCopyIn .8s var(--dl-ease) .06s both;
}

.dl-hero__brand{
  margin:0 0 .55rem;
  font-size:clamp(1.7rem, 7vw, 2.15rem);
  font-weight:800;
  line-height:1.15;
  letter-spacing:-.01em;
  color:#fff;
  text-shadow:0 10px 36px rgba(0,0,0,.28);
}
.dl-hero__title{
  margin:0 0 .55rem;
  font-size:clamp(1.05rem, 4.2vw, 1.35rem);
  font-weight:800;
  line-height:1.45;
  color:rgba(255,255,255,.96);
}
.dl-hero__sub{
  margin:0 0 1.1rem;
  font-size:.92rem;
  font-weight:600;
  line-height:1.7;
  color:rgba(243,232,255,.9);
}

.dl-hero__ctas{
  display:flex;
  flex-direction:column;
  gap:.65rem;
}
.dl-hero__ctas .dl-btn{
  width:100%;
  min-height:54px;
  font-size:.95rem;
  border-radius:999px;
  box-shadow:0 14px 30px rgba(30,10,60,.18);
}
.dl-hero__ctas .dl-btn--ghost{
  background:#fff;
  color:#5B1B8F;
  border:1.5px solid rgba(255,255,255,.95);
  box-shadow:0 10px 24px rgba(30,10,60,.12);
}

.dl-wave{
  position:relative;z-index:2;margin-top:-1px;color:#FBF8FE;line-height:0;
}
.dl-wave svg{width:100%;height:48px;display:block}
body.is-dark .dl-wave{color:#140B24}

@keyframes dlHeroIn{
  from{opacity:0;transform:translateY(22px) scale(.98)}
  to{opacity:1;transform:none}
}
@keyframes dlCopyIn{
  from{opacity:0;transform:translateY(16px)}
  to{opacity:1;transform:none}
}

/* Tablet / desktop: text + photo side by side (RTL: text start/right, photo end/left visually per refs) */
@media (min-width:768px){
  .dl-hero__stage{
    min-height:min(88svh, 720px);
    justify-content:center;
  }
  .dl-hero__grid{
    display:grid;
    grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);
    align-items:center;
    gap:1.5rem;
    padding:calc(var(--dl-header-h) + 1.25rem) 0 2.25rem;
    width:min(100% - 3rem, var(--dl-container));
  }
  .dl-hero__copy{
    order:1;
    text-align:start;
    margin-inline:0;
    padding-bottom:.5rem;
  }
  .dl-hero__photo{
    order:2;
    min-height:auto;
    justify-content:flex-end;
    align-self:end;
  }
  .dl-hero__photo img{
    width:100%;
    max-height:min(70svh, 620px);
  }
  .dl-hero__brand{font-size:clamp(2.1rem, 3.4vw, 2.7rem);margin-bottom:.85rem}
  .dl-hero__title{font-size:clamp(1.2rem, 2vw, 1.5rem)}
  .dl-hero__sub{font-size:1.02rem;max-width:34rem}
  .dl-hero__ctas{
    flex-direction:row;
    flex-wrap:wrap;
    justify-content:flex-start;
  }
  .dl-hero__ctas .dl-btn{width:auto;min-width:0}
  .dl-wave svg{height:72px}
}

@media (min-width:1100px){
  .dl-hero__grid{gap:2rem}
  .dl-hero__photo{
    margin-inline-end:calc(-1 * max(0px, (100vw - var(--dl-container)) / 2 - 1.25rem));
  }
  .dl-hero__photo img{max-height:min(76svh, 680px)}
}

[dir="ltr"] .dl-hero__copy{order:1;text-align:start}
[dir="ltr"] .dl-hero__photo{order:2}

@media (prefers-reduced-motion:reduce){
  .dl-hero__photo img,.dl-hero__copy{animation:none}
}