@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&display=swap');

/* ═══════════════ BASE ═══════════════ */
.srw-wrapper { font-family:'DM Sans',sans-serif; }

.srw-section-title {
  text-align:center; font-size:28px; font-weight:700;
  color:#2d1b6b; margin:0 0 32px; letter-spacing:-0.4px; line-height:1.3;
}
.srw-section-title::before,
.srw-section-title::after {
  content:''; display:inline-block;
  width:70px; height:1.5px; background:#d0d0d8;
  vertical-align:middle; margin:0 14px;
}

/* ═══════════════ REVIEWS ═══════════════ */
.srw-reviews-section { background:#fff; padding:50px 40px; border-radius:20px; margin-bottom:50px; }
.srw-reviews-inner   { display:flex; align-items:flex-start; gap:28px; }

/* Rating box */
.srw-rating-box { flex-shrink:0; background:#f7f7fb; border-radius:16px; padding:22px 24px; text-align:center; min-width:120px; }
.srw-big-score  { font-size:46px; font-weight:700; color:#2d1b6b; line-height:1; }
.srw-stars      { display:flex; justify-content:center; gap:2px; margin-top:8px; }
.srw-star       { color:#f5c518; font-size:20px; }
.srw-star.empty { color:#e0e0e0; }
.srw-total-count{ font-size:12px; color:#888; margin-top:6px; }

/* Slider */
.srw-slider-wrap  { flex:1; overflow:hidden; }
.srw-slider-nav   { display:flex; justify-content:flex-end; gap:10px; margin-bottom:16px; }
.srw-nav-btn {
  width:34px; height:34px; border-radius:50%;
  border:1.5px solid #d0d0d8; background:#fff;
  cursor:pointer; font-size:18px; color:#555; line-height:1;
  display:flex; align-items:center; justify-content:center;
  transition:all 0.2s;
}
.srw-nav-btn:hover { border-color:#7c3aed; color:#7c3aed; }
.srw-rev-overflow { overflow:hidden; }
.srw-rev-track    { display:flex; gap:20px; transition:transform 0.4s ease; }

/* Review card – image + text side by side */
.srw-review-card {
  flex-shrink:0; width:300px;
  border:1px solid #e8e8f0; border-radius:16px;
  overflow:hidden; background:#fff; display:flex; flex-direction:column;
}
.srw-rev-card-photo {
  height:140px; overflow:hidden;
  background:linear-gradient(135deg,#7c3aed,#c4b5fd);
  display:flex; align-items:center; justify-content:center;
  flex-shrink:0;
}
.srw-rev-card-photo img { width:100%; height:100%; object-fit:cover; object-position:top; }
.srw-rev-avatar {
  width:60px; height:60px; border-radius:50%;
  background:rgba(255,255,255,0.3); color:#fff;
  font-size:26px; font-weight:700;
  display:flex; align-items:center; justify-content:center;
}
.srw-rev-card-body { padding:16px 16px 18px; flex:1; display:flex; flex-direction:column; }
.srw-card-head     { display:flex; justify-content:space-between; align-items:flex-start; margin-bottom:4px; }
.srw-rev-name      { font-size:14.5px; font-weight:700; color:#1a1a2e; }
.srw-stars.srw-sm .srw-star { font-size:13px; }
.srw-rev-meta      { font-size:12px; color:#888; margin-bottom:10px; }
.srw-rev-text      { font-size:13px; color:#444; line-height:1.6; flex:1; }

/* Progress bar */
.srw-progress-wrap  { margin-top:18px; display:flex; flex-direction:column; gap:10px; align-items:center; }
.srw-progress-bar   { width:100%; height:4px; background:#ede9fe; border-radius:4px; overflow:hidden; }
.srw-progress-fill  { height:100%; background:linear-gradient(90deg,#7c3aed,#c4b5fd); border-radius:4px; transition:width 0.4s ease; width:0%; }
.srw-progress-dots  { display:flex; gap:6px; }
.srw-dot { width:8px; height:8px; border-radius:50%; background:#ede9fe; transition:background 0.3s; cursor:pointer; }
.srw-dot.active { background:#7c3aed; }

/* View all */
.srw-view-all {
  display:block; margin:28px auto 0; padding:12px 36px;
  border:1.5px solid #7c3aed; background:#fff; color:#7c3aed;
  font-size:15px; font-weight:600; border-radius:30px;
  cursor:pointer; width:fit-content; font-family:'DM Sans',sans-serif;
  text-decoration:none; transition:all 0.2s;
}
.srw-view-all:hover { background:#7c3aed; color:#fff; text-decoration:none; }

/* ═══════════════ LOVE STORIES ═══════════════ */
.srw-stories-section { padding:10px 0 40px; }
.srw-love-wrap   { position:relative; padding:0 20px; }
.srw-love-overflow { overflow:hidden; }
.srw-love-track  { display:flex; gap:18px; transition:transform 0.4s ease; }

/* Love card */
.srw-love-card {
  flex-shrink:0; width:290px; height:380px;
  border-radius:18px; overflow:hidden; position:relative;
  background:linear-gradient(135deg,#667eea,#764ba2);
  background-size:cover; background-position:center top;
}
.srw-card-demo   { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; font-size:80px; opacity:0.2; }
.srw-love-overlay{ position:absolute; inset:0; background:linear-gradient(to top,rgba(0,0,0,0.84) 40%,rgba(0,0,0,0.06) 100%); }

/* myspinny badge */
.srw-love-badge {
  position:absolute; top:14px; left:14px; z-index:2;
  display:flex; align-items:center; gap:7px;
  background:rgba(255,255,255,0.18); backdrop-filter:blur(8px);
  padding:5px 11px 5px 7px; border-radius:20px;
}
.srw-badge-icon { width:26px; height:26px; background:#c0392b; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:11px; font-weight:800; color:#fff; }
.srw-love-badge span { font-size:12px; font-weight:600; color:#fff; }

/* Progress dots on card (mobile) */
.srw-love-dots { position:absolute; top:14px; right:14px; z-index:2; display:flex; gap:5px; }
.srw-love-dot  { width:22px; height:3px; border-radius:3px; background:rgba(255,255,255,0.35); transition:background 0.3s,width 0.3s; }
.srw-love-dot.active { background:#fff; width:34px; }

.srw-love-bottom { position:absolute; bottom:0; left:0; right:0; padding:18px 16px 20px; z-index:2; }
.srw-story-name  { font-size:14.5px; font-weight:700; color:#fff; line-height:1.3; }
.srw-story-city  { font-size:12px; color:rgba(255,255,255,0.72); margin:3px 0 9px; }
.srw-story-quote { font-size:12.5px; color:rgba(255,255,255,0.88); line-height:1.55; }

/* Love nav */
.srw-love-nav {
  position:absolute; top:48%; transform:translateY(-50%);
  width:38px; height:38px; border-radius:50%;
  background:#fff; border:none;
  box-shadow:0 2px 14px rgba(0,0,0,0.18);
  font-size:18px; color:#333; line-height:1;
  display:flex; align-items:center; justify-content:center;
  cursor:pointer; z-index:10; transition:all 0.2s;
}
.srw-love-nav:hover { background:#7c3aed; color:#fff; }
.srw-love-nav.prev  { left:-8px; }
.srw-love-nav.next  { right:-8px; }

/* Love progress bar (mobile) */
.srw-love-progress-wrap { margin-top:18px; }

/* ═══════════════ REVIEW FORM ═══════════════ */
.srw-form-wrapper {
  background:#fff; border-radius:20px; padding:36px 36px;
  max-width:600px; margin:0 auto;
  box-shadow:0 4px 24px rgba(0,0,0,0.08);
}
.srw-form-title { font-size:22px; font-weight:700; color:#2d1b6b; margin:0 0 24px; }
.srw-cf-grid    { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.srw-cf-field   { display:flex; flex-direction:column; gap:6px; }
.srw-cf-field.srw-cf-full { grid-column:1/-1; }
.srw-cf-field label { font-size:13px; font-weight:600; color:#444; }
.srw-cf-field input,
.srw-cf-field textarea {
  border:1.5px solid #e0e0ec; border-radius:10px;
  padding:10px 13px; font-size:14px; font-family:'DM Sans',sans-serif;
  outline:none; transition:border 0.2s;
}
.srw-cf-field input:focus,
.srw-cf-field textarea:focus { border-color:#7c3aed; box-shadow:0 0 0 3px rgba(124,58,237,0.08); }

/* Star rating in form */
.srw-cf-stars { display:flex; gap:6px; }
.srw-cf-star  { font-size:32px; color:#e0e0e0; cursor:pointer; transition:color 0.15s,transform 0.1s; user-select:none; }
.srw-cf-star.active { color:#f5c518; }
.srw-cf-star:hover  { transform:scale(1.15); }

.srw-cf-submit {
  margin-top:20px; width:100%; padding:14px;
  background:linear-gradient(135deg,#7c3aed,#5b21b6);
  color:#fff; border:none; border-radius:12px;
  font-size:16px; font-weight:600; font-family:'DM Sans',sans-serif;
  cursor:pointer; transition:opacity 0.2s;
}
.srw-cf-submit:hover   { opacity:0.88; }
.srw-cf-submit:disabled{ opacity:0.55; cursor:not-allowed; }

.srw-cf-msg { margin-top:14px; font-size:14px; font-weight:600; text-align:center; min-height:20px; }
.srw-cf-msg.success { color:#065f46; }
.srw-cf-msg.error   { color:#dc2626; }

/* ═══════════════ RESPONSIVE ═══════════════ */
@media (max-width:768px) {
  .srw-reviews-section  { padding:28px 16px; }
  .srw-reviews-inner    { flex-direction:column; }
  .srw-rating-box       { width:100%; display:flex; align-items:center; gap:16px; padding:16px 18px; }
  .srw-big-score        { font-size:38px; }
  .srw-review-card      { width:calc(100vw - 64px); max-width:320px; }
  .srw-love-card        { width:calc(100vw - 64px); max-width:320px; height:420px; }
  .srw-section-title    { font-size:21px; }
  .srw-section-title::before,
  .srw-section-title::after { width:28px; margin:0 8px; }
  .srw-slider-nav       { display:none; }   /* hide desktop arrows on mobile */
  .srw-love-nav         { display:none; }   /* hide desktop arrows on mobile – use swipe */
  .srw-form-wrapper     { padding:24px 18px; border-radius:16px; }
  .srw-cf-grid          { grid-template-columns:1fr; }
  .srw-cf-field.srw-cf-full { grid-column:1; }
}