/* ============================================================
   الاستبيانات — أنماط خاصة بهذه الصفحة وحدها.
   المُحدِّدات مسبوقة بـsv- تجنّباً لأي تعارض مع site.css.
   ============================================================ */

.sv-open, .sv-list, .sv-why{ --sv-pad: clamp(46px, 4.8vw, 74px); }
.sv-inner, .sv-open-inner{max-width:1180px; margin:0 auto;}

/* ---------- الافتتاحية ---------- */
.sv-open{
  position:relative; overflow:hidden; isolation:isolate; text-align:center;
  background:linear-gradient(152deg, #04203A 0%, var(--navy) 52%, #0B3A5E 100%);
  color:#fff; padding:clamp(84px,8.6vw,126px) 28px clamp(50px,5.2vw,72px);
}
.sv-open-bg{
  position:absolute; inset:0; z-index:-1; pointer-events:none;
  background:
    radial-gradient(58% 76% at 86% 8%, rgba(44,148,142,.28), transparent 60%),
    radial-gradient(46% 62% at 8% 96%, rgba(65,127,193,.18), transparent 62%);
}
.sv-kicker{
  display:inline-block; font-family:var(--font-head); font-size:12.5px; font-weight:700;
  color:var(--mint); background:rgba(179,222,202,.10);
  border:1px solid rgba(179,222,202,.22); padding:7px 16px; border-radius:999px; margin-bottom:18px;
}
.sv-open h1{
  font-family:var(--font-head); font-weight:800; color:#fff;
  font-size:clamp(27px,3.8vw,46px); line-height:1.24; letter-spacing:-.5px;
  max-width:18ch; margin-inline:auto; text-wrap:balance;
}
.sv-lede{
  margin:16px auto 0; max-width:66ch;
  font-size:clamp(14.5px,1.3vw,16.5px); line-height:1.85; color:rgba(255,255,255,.78);
}
.sv-lede p{margin:0;}

.sv-totals{
  list-style:none; margin:30px auto 0; padding:0;
  display:flex; flex-wrap:wrap; justify-content:center; gap:12px;
}
.sv-totals li{
  min-width:150px;
  background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.13); padding:16px 24px;
}
.sv-totals b{
  display:block; font-family:'Roboto',sans-serif; font-size:clamp(24px,2.6vw,32px);
  font-weight:800; color:var(--mint); line-height:1;
}
.sv-totals span{display:block; margin-top:6px; font-size:12.5px; color:rgba(255,255,255,.64);}

/* ---------- بطاقات الاستبيانات ---------- */
.sv-list{padding:var(--sv-pad) 28px;}
.sv-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(min(330px,100%),1fr)); gap:18px;}
.sv-card{
  position:relative; display:flex; flex-direction:column; overflow:hidden;
  background:#fff; border:1px solid var(--line); box-shadow:var(--shadow-sm);
  padding:26px 24px 24px;
  transition:transform .45s cubic-bezier(.16,1,.3,1), box-shadow .45s ease, border-color .35s ease;
}
/* شريط علوي ينمو من حافة البطاقة */
.sv-card::before{
  content:''; position:absolute; top:0; inset-inline:0; height:3px;
  background:linear-gradient(90deg, var(--teal), var(--teal-soft));
  transform:scaleX(0); transform-origin:right;
  transition:transform .5s cubic-bezier(.16,1,.3,1);
}
.sv-card:hover{transform:translateY(-6px); box-shadow:var(--shadow-md); border-color:rgba(31,120,116,.3);}
.sv-card:hover::before{transform:scaleX(1);}

.sv-card-top{display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:16px;}
.sv-card-num{
  font-family:'Roboto',sans-serif; font-size:20px; font-weight:800; color:#e3e9ee; letter-spacing:.5px;
  transition:color .35s ease;
}
.sv-card:hover .sv-card-num{color:var(--teal);}
.sv-card-ic{
  width:46px; height:46px; border-radius:50%; flex-shrink:0;
  background:var(--mint-pale); color:var(--teal);
  display:flex; align-items:center; justify-content:center;
  transition:background .35s ease, color .35s ease, transform .45s cubic-bezier(.16,1,.3,1);
}
.sv-card-ic svg{width:21px; height:21px;}
.sv-card:hover .sv-card-ic{background:var(--teal); color:#fff; transform:scale(1.06);}

.sv-card h2{
  font-family:var(--font-head); font-size:clamp(16.5px,1.8vw,19px); font-weight:800;
  color:var(--navy); line-height:1.5;
}
.sv-goal{margin-top:10px; font-size:13.8px; line-height:1.85; color:#5d7285;}
.sv-aud{
  margin-top:14px; padding:12px 14px; background:var(--paper-tint);
  border-inline-start:3px solid var(--mint);
  display:flex; flex-direction:column; gap:3px;
}
.sv-aud b{font-size:11.5px; font-weight:700; color:#8394a3;}
.sv-aud span{font-size:13px; line-height:1.65; color:var(--navy); font-weight:600;}

.sv-facts{
  list-style:none; margin:16px 0 0; padding:14px 0 0; border-top:1px solid var(--line);
  display:flex; flex-wrap:wrap; gap:8px 16px;
}
.sv-facts li{display:inline-flex; align-items:center; gap:7px; font-size:12.5px; color:#6d8194;}
.sv-facts svg{width:15px; height:15px; color:var(--teal-soft); flex-shrink:0;}

.sv-actions{display:flex; flex-wrap:wrap; gap:10px; margin-top:auto; padding-top:18px;}
.sv-btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  padding:12px 22px; border-radius:999px; font-weight:700; font-size:14px;
  transition:background .3s ease, color .3s ease, transform .35s cubic-bezier(.16,1,.3,1), box-shadow .35s ease, border-color .3s ease;
}
.sv-btn svg{width:16px; height:16px; transition:transform .35s cubic-bezier(.16,1,.3,1);}
.sv-btn.is-primary{flex:1 1 auto; background:var(--navy); color:#fff;}
.sv-btn.is-primary:hover{
  background:linear-gradient(120deg, var(--teal), var(--teal-soft));
  transform:translateY(-2px); box-shadow:0 16px 30px -14px rgba(31,120,116,.6);
}
.sv-btn.is-primary:hover svg{transform:translateX(-4px);}
.sv-btn.is-ghost{border:1px solid var(--line); color:var(--navy); background:#fff;}
.sv-btn.is-ghost:hover{border-color:var(--teal); color:var(--teal); background:var(--mint-pale);}
.sv-btn.is-light{background:#fff; color:var(--teal);}
.sv-btn.is-light:hover{transform:translateY(-2px); box-shadow:0 16px 30px -14px rgba(0,0,0,.4);}

/* حالة فارغة */
.sv-empty{
  text-align:center; padding:clamp(36px,4.5vw,58px) 28px;
  background:var(--paper-tint); border:1px dashed var(--line);
}
.sv-empty-ic{
  width:56px; height:56px; border-radius:50%; margin:0 auto 16px;
  background:#fff; border:1px solid var(--line); color:var(--teal);
  display:flex; align-items:center; justify-content:center;
}
.sv-empty-ic svg{width:26px; height:26px;}
.sv-empty h2{font-family:var(--font-head); font-size:19px; font-weight:800; color:var(--navy);}
.sv-empty p{margin:10px auto 20px; max-width:50ch; font-size:14px; line-height:1.85; color:#5d7285;}

/* ---------- لماذا نسأل ---------- */
.sv-why{padding:var(--sv-pad) 28px; background:linear-gradient(120deg, #0F5F5A, var(--teal) 60%, #24837D);}
.sv-why-inner{display:flex; align-items:center; justify-content:space-between; gap:26px; flex-wrap:wrap;}
.sv-why h2{font-family:var(--font-head); color:#fff; font-size:clamp(20px,2.3vw,28px); font-weight:800; line-height:1.4;}
.sv-why p{margin-top:10px; font-size:14.5px; line-height:1.85; color:rgba(255,255,255,.86); max-width:62ch;}

/* ---------- الحركة ---------- */
@media (prefers-reduced-motion: no-preference){
  .sv-totals li{animation:sv-rise .66s cubic-bezier(.16,1,.3,1) both; animation-delay:calc(var(--i,0) * 80ms);}
  [data-reveal] .sv-card{
    animation:sv-rise .68s cubic-bezier(.16,1,.3,1) both;
    animation-delay:calc(var(--i, 0) * 75ms);
    animation-play-state:paused;
  }
  [data-reveal].in-view .sv-card{animation-play-state:running;}
  @keyframes sv-rise{from{opacity:0; translate:0 16px;} to{opacity:1; translate:0 0;}}
}

/* ---------- الاستجابة ---------- */
@media (max-width:620px){
  .sv-totals li{flex:1 1 100%; min-width:0;}
  .sv-why-inner{flex-direction:column; align-items:flex-start;}
  .sv-actions{flex-direction:column;}
  .sv-btn{width:100%;}
}
