/* =========================================================
   Reasons Section
========================================================= */
.reason-section{
  position:relative;
  padding: clamp(3.6rem, 6vw, 6.4rem) 0;
  background: linear-gradient(140deg, rgba(244,249,255,0.88) 0%, rgba(255,250,245,0.96) 58%, rgba(255,243,231,0.94) 100%);
  overflow:hidden;
}
.reason-section::before,
.reason-section::after{
  content:"";
  position:absolute;
  border-radius:50%;
  filter:blur(0);
  opacity:.35;
  pointer-events:none;
}
.reason-section::before{
  width: clamp(360px, 44vw, 520px);
  height: clamp(360px, 44vw, 520px);
  background: radial-gradient(circle at 22% 26%, rgba(94,139,255,0.32), transparent 68%);
  top:-38%;
  left:-18%;
}
.reason-section::after{
  width: clamp(320px, 38vw, 460px);
  height: clamp(320px, 38vw, 460px);
  background: radial-gradient(circle at 78% 78%, rgba(15,183,156,0.3), transparent 72%);
  bottom:-42%;
  right:-16%;
}

.reason-section__inner{
  position:relative;
  z-index:1;
  max-width:var(--container);
  margin:0 auto;
  padding:0 1.2rem;
  display:flex;
  flex-direction:column;
  gap: clamp(2.6rem, 5vw, 4.4rem);
}

.reason-section__top{
  display:flex;
  flex-direction:column;
  gap: clamp(2rem, 4vw, 3rem);
}
@media (min-width:960px){
  .reason-section__top{
    display:grid;
    grid-template-columns:minmax(0, 1.02fr) minmax(0, 0.98fr);
    align-items:center;
    gap: clamp(2.6rem, 4.5vw, 4rem);
  }
}

.reason-copy{
  position:relative;
  display:flex;
  flex-direction:column;
  gap: clamp(1.2rem, 2.6vw, 2rem);
  padding: clamp(2.4rem, 3.8vw, 3.2rem);
  border-radius:36px;
  background: linear-gradient(140deg, rgba(255,255,255,0.96), rgba(238,248,255,0.84));
  border:1px solid rgba(94,139,255,0.14);
  box-shadow:0 26px 65px rgba(12,36,64,0.14);
  overflow:hidden;
}
.reason-copy::before{
  content:"";
  position:absolute;
  inset:-40%;
  background:radial-gradient(circle at 20% 20%, rgba(94,139,255,0.16), transparent 60%);
  z-index:0;
}
.reason-copy::after{
  content:"";
  position:absolute;
  width: clamp(240px, 36vw, 320px);
  height: clamp(240px, 36vw, 320px);
  top:-45%;
  right:-25%;
  background:radial-gradient(circle, rgba(15,183,156,0.2), transparent 70%);
  z-index:0;
}
.reason-copy > *{ position:relative; z-index:1; }

.reason-section__eyebrow{
  font-family:"Montserrat", sans-serif;
  font-size:.9rem;
  letter-spacing:.38em;
  text-transform:uppercase;
  color:rgba(12,36,64,0.52);
  display:inline-flex;
  align-items:center;
  gap:.6rem;
}
.reason-section__eyebrow::before{
  content:"";
  width:40px;
  height:1px;
  background:linear-gradient(90deg, rgba(94,139,255,0), rgba(94,139,255,0.65));
}
.reason-section__title{
  font-size: clamp(2rem, 2.6vw + 1.1rem, 3.3rem);
  font-weight:800;
  color:#0c2540;
  line-height:1.2;
  position:relative;
  text-shadow:0 12px 32px rgba(12,36,64,0.12);
}
.reason-section__title::after{
  content:"";
  position:absolute;
  left:0;
  bottom:-.85rem;
  width: clamp(170px, 40%, 260px);
  height:6px;
  border-radius:999px;
  background:linear-gradient(100deg, rgba(94,139,255,0.85), rgba(15,183,156,0.6));
}
.reason-section__lead{
  font-weight:700;
  color:#102645;
  line-height:1.72;
  font-size: clamp(1.05rem, 1.3vw + .98rem, 1.48rem);
}
.reason-section__description{
  color:#455265;
  line-height:1.85;
  font-size:1rem;
}

.reason-section__visual{
  position:relative;
  width:100%;
}
@media (min-width:960px){
  .reason-section__visual{ justify-self:end; }
}
.reason-visual{
  position:relative;
  display:grid;
  place-items:center;
}
.reason-visual::after{
  content:"";
  position:absolute;
  inset:10% 18%;
  background:radial-gradient(circle, rgba(255,255,255,0.35), transparent 70%);
  z-index:-1;
}
.reason-visual__frame{
  width: clamp(320px, 46vw, 660px);
  aspect-ratio: 4 / 3;
  border-radius: clamp(1.8rem, 3vw, 3.4rem);
  overflow:hidden;
  box-shadow:0 30px 74px rgba(15,23,42,0.24);
  transform: rotate(-1.8deg);
  will-change: transform;
}
.reason-visual__frame picture,
.reason-visual__frame img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
}
.reason-visual__floating{
  position:absolute;
  width: clamp(150px, 18vw, 240px);
  aspect-ratio: 4 / 3;
  border-radius: clamp(1.2rem, 2vw, 2rem);
  overflow:hidden;
  box-shadow:0 22px 48px rgba(15,23,42,0.16);
  --float-rotate: 6deg;
  animation: float-soft 14s ease-in-out infinite;
  will-change: transform;
}
.reason-visual__floating picture,
.reason-visual__floating img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.reason-visual__floating--one{
  top:-12%;
  right:12%;
  --float-rotate: 5deg;
  animation: float-soft 15s ease-in-out infinite;
  animation-delay:-2.4s;
}
.reason-visual__floating--two{
  bottom:-20%;
  left:-6%;
  --float-rotate: -4deg;
  animation: float-soft-alt 16s ease-in-out infinite;
  animation-delay:-3.2s;
}
.reason-visual__floating--three{
  bottom:18%;
  right:-12%;
  --float-rotate: 9deg;
  animation: float-soft-scale 17s ease-in-out infinite;
  animation-delay:-4.6s;
}

.reason-stack{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap: clamp(1.4rem, 3vw, 2.2rem);
}
@media (min-width:960px){
  .reason-stack{
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

.reason-stack__item{
  position:relative;
  display:flex;
  flex-direction:column;
  gap: clamp(1.4rem, 2.2vw, 1.8rem);
  padding: clamp(2.2rem, 3vw, 2.8rem) clamp(1.8rem, 3vw, 2.4rem) clamp(2.4rem, 3.2vw, 2.9rem);
  background:linear-gradient(150deg, rgba(255,255,255,0.95), rgba(240,248,255,0.9));
  border:1px solid rgba(94,139,255,0.16);
  border-radius:28px;
  box-shadow:0 24px 50px rgba(12,36,64,0.12);
  overflow:hidden;
  transition:transform .35s ease, box-shadow .35s ease;
}
.reason-stack__item::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(135deg, rgba(94,139,255,0.18), rgba(15,183,156,0.16));
  opacity:0;
  pointer-events:none;
  transition:opacity .35s ease;
}
.reason-stack__item::after{
  content:"";
  position:absolute;
  inset:1.2px;
  border-radius:26px;
  border:1px solid rgba(255,255,255,0.55);
  opacity:.6;
  pointer-events:none;
}
.reason-stack__item:hover{
  transform:translateY(-8px);
  box-shadow:0 30px 60px rgba(12,36,64,0.16);
}
.reason-stack__item:hover::before{ opacity:.22; }

.reason-stack__number{
  position:absolute;
  top: clamp(1.4rem, 2.4vw, 1.8rem);
  left: clamp(1.4rem, 2.4vw, 1.8rem);
  width: clamp(3.6rem, 6vw, 4.2rem);
  height: clamp(3.6rem, 6vw, 4.2rem);
  border-radius:18px;
  background:linear-gradient(135deg, #5e8bff 0%, #35c6bf 100%);
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  font-family:"Montserrat", sans-serif;
  font-weight:700;
  font-size: clamp(1.4rem, 2.4vw, 1.9rem);
  box-shadow:0 18px 34px rgba(94,139,255,0.26);
}

.reason-stack__thumb{
  margin-top: clamp(2.6rem, 4.4vw, 3.2rem);
  width: clamp(96px, 12vw, 120px);
  aspect-ratio:1;
  border-radius:28px;
  overflow:hidden;
  box-shadow:0 18px 34px rgba(12,36,64,0.18);
  border:1px solid rgba(94,139,255,0.16);
  position:relative;
}
.reason-stack__thumb::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(140deg, rgba(255,255,255,0.15), rgba(255,255,255,0));
}
.reason-stack__thumb picture,
.reason-stack__thumb img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.reason-stack__body{
  display:flex;
  flex-direction:column;
  gap:.6rem;
}
.reason-stack__label{
  font-size:.8rem;
  letter-spacing:.3em;
  text-transform:uppercase;
  color:rgba(12,36,64,0.55);
}
.reason-stack__title{
  font-size: clamp(1.3rem, 1.1vw + 1.1rem, 1.7rem);
  font-weight:800;
  color:#0b2344;
  line-height:1.35;
}
.reason-stack__text{
  color:#4c5b70;
  line-height:1.85;
  font-size:1rem;
}

@keyframes float-soft{
  0%, 100%{ transform: translate3d(0,0,0) rotate(var(--float-rotate, 0deg)); }
  50%{ transform: translate3d(0, -14px, 0) rotate(var(--float-rotate, 0deg)); }
}
@keyframes float-soft-alt{
  0%, 100%{ transform: translate3d(0,0,0) rotate(var(--float-rotate, 0deg)); }
  50%{ transform: translate3d(0, 12px, 0) rotate(calc(var(--float-rotate, 0deg) * -1)); }
}
@keyframes float-soft-scale{
  0%, 100%{ transform: translate3d(0,0,0) rotate(var(--float-rotate, 0deg)) scale(1); }
  50%{ transform: translate3d(0, -16px, 0) rotate(var(--float-rotate, 0deg)) scale(1.04); }
}