/* ==========================================================================
   THEME 6 — "Friendly Rounded"  (generated base: hero-serv1.css with re-mapped tokens)
   Palette: purple #5A2D82 · mint #6FD6A8 · lavender #F7F5FB. No red, no black.
   The hand-written design layer is appended below the base.
   ⚠ GENERATED FILE — do not edit here. Edit scripts/theme6/<this file name> (design layer)
     then run:  node scripts/build_theme6_base.js   (and bump ASSET_VERSION before deploying)
   ========================================================================== */
:root {
  /* COLORS */
  --ebhro-serv20-bg: linear-gradient(135deg, #F7F5FB 0%, #F7F5FB 50%, #F7F5FB 100%);
  --ebhro-serv20-text-primary: #34184F;
  --ebhro-serv20-text-secondary: #6FD6A8;
  --ebhro-serv20-text-muted: #786C8C;
  --ebhro-serv20-primary: #5A2D82;
  --ebhro-serv20-primary-hover: #5A2D82;
  --ebhro-serv20-primary-light: rgba(90, 45, 130, 0.08);
  --ebhro-serv20-primary-border: rgba(90, 45, 130, 0.2);
  /* Solid, darker-than-primary badge background so white badge text/icon
     has real contrast — #00b4d8 itself is too light for white text on it.
     Reuses the existing --primary-hover token rather than a new hardcoded color. */
  --ebhro-serv20-badge-bg: var(--ebhro-serv20-primary-hover);
  --ebhro-serv20-accent-gradient: linear-gradient(135deg, #5A2D82 0%, #5A2D82 50%, #5A2D82 100%);
  --ebhro-serv20-gold-accent: #6FD6A8;
  --ebhro-serv20-card-bg: rgba(255, 255, 255, 0.85);
  --ebhro-serv20-card-border: rgba(90, 45, 130, 0.8);
  --ebhro-serv20-card-shadow: 0 20px 40px -15px rgba(90, 45, 130, 0.063), 0 0 1px rgba(90, 45, 130, 0.090);
  --ebhro-serv20-orb-1: rgba(90, 45, 130, 0.18);
  --ebhro-serv20-orb-2: rgba(90, 45, 130, 0.15);
  --ebhro-serv20-orb-3: rgba(90, 45, 130, 0.12);
  --ebhro-serv20-grid-overlay-dot: rgba(111, 214, 168, 0.08);
  --ebhro-serv20-btn-primary-shadow: rgba(90, 45, 130, 0.220);
  --ebhro-serv20-btn-primary-hover-shadow: rgba(90, 45, 130, 0.220);
  --ebhro-serv20-media-overlay-gradient: linear-gradient(to top, rgba(52, 24, 79, 0.3) 0%, transparent 60%);
  --ebhro-serv20-float-card-shadow: rgba(90, 45, 130, 0.090);
  --ebhro-serv20-float-pill-shadow: rgba(90, 45, 130, 0.180);
  --ebhro-serv20-feat-card-hover-shadow: rgba(90, 45, 130, 0.135);
  --ebhro-serv20-media-shadow: rgba(90, 45, 130, 0.135);
  --ebhro-serv20-media-card-bg: rgba(255, 255, 255, 0.7);
  --ebhro-serv20-float-card-bg: rgba(255, 255, 255, 0.95);
  --ebhro-serv20-btn-shimmer-gradient: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.3), transparent);
  /* TYPOGRAPHY */
  --ebhro-serv20-font-family: 'Baloo Bhaijaan 2', 'Tajawal', sans-serif;
  --ebhro-serv20-title-font-size: 2.75rem;
  --ebhro-serv20-title-font-weight: 900;
  --ebhro-serv20-title-line-height: 1.25;
  --ebhro-serv20-title-letter-spacing: -0.5px;
  --ebhro-serv20-desc-font-size: 1.08rem;
  --ebhro-serv20-desc-line-height: 1.75;
  --ebhro-serv20-hl-item-font-size: 1rem;
  --ebhro-serv20-hl-item-font-weight: 600;
  --ebhro-serv20-hl-icon-font-size: 1.1rem;
  --ebhro-serv20-btn-font-size: 1.05rem;
  --ebhro-serv20-btn-font-weight: 700;
  --ebhro-serv20-badge-font-size: 0.9rem;
  --ebhro-serv20-badge-font-weight: 700;
  --ebhro-serv20-badge-icon-font-size: 0.95rem;
  --ebhro-serv20-fc-title-font-size: 0.92rem;
  --ebhro-serv20-fc-title-font-weight: 800;
  --ebhro-serv20-fc-subtitle-font-size: 0.78rem;
  --ebhro-serv20-float-pill-font-size: 0.82rem;
  --ebhro-serv20-float-pill-font-weight: 700;
  --ebhro-serv20-sec-sub-font-size: 0.9rem;
  --ebhro-serv20-sec-sub-font-weight: 800;
  --ebhro-serv20-sec-sub-letter-spacing: 1px;
  --ebhro-serv20-sec-title-font-size: 2.1rem;
  --ebhro-serv20-sec-title-font-weight: 900;
  --ebhro-serv20-feat-title-font-size: 1.18rem;
  --ebhro-serv20-feat-title-font-weight: 800;
  --ebhro-serv20-feat-desc-font-size: 0.92rem;
  --ebhro-serv20-feat-desc-line-height: 1.65;
  --ebhro-serv20-feat-icon-font-size: 1.5rem;
  --ebhro-serv20-fc-icon-font-size: 1.1rem;
  /* SPACING */
  --ebhro-serv20-hero-padding-y: 36px;
  --ebhro-serv20-hero-padding-bottom: 44px;
  --ebhro-serv20-container-padding-x: 24px;
  --ebhro-serv20-grid-gap: 36px;
  --ebhro-serv20-grid-margin-bottom: 36px;
  --ebhro-serv20-badge-gap: 10px;
  --ebhro-serv20-badge-padding-y: 6px;
  --ebhro-serv20-badge-padding-x: 18px;
  --ebhro-serv20-badge-margin-bottom: 14px;
  --ebhro-serv20-badge-pulse-size: 8px;
  --ebhro-serv20-title-margin-bottom: 14px;
  --ebhro-serv20-desc-margin-bottom: 20px;
  --ebhro-serv20-highlights-gap: 10px;
  --ebhro-serv20-highlights-margin-bottom: 24px;
  --ebhro-serv20-hl-item-gap: 10px;
  --ebhro-serv20-cta-gap: 16px;
  --ebhro-serv20-btn-gap: 12px;
  --ebhro-serv20-btn-padding-y: 14px;
  --ebhro-serv20-btn-padding-x: 32px;
  --ebhro-serv20-media-card-padding: 12px;
  --ebhro-serv20-media-glow-inset: -15px;
  --ebhro-serv20-media-glow-border-radius-offset: 1.25rem;
  --ebhro-serv20-media-glow-blur: 25px;
  --ebhro-serv20-media-img-wrapper-radius-offset: -0.875rem;
  --ebhro-serv20-float-card-gap: 14px;
  --ebhro-serv20-float-card-padding-y: 12px;
  --ebhro-serv20-float-card-padding-x: 18px;
  --ebhro-serv20-fc-icon-size: 40px;
  --ebhro-serv20-fc-top-right-top: -20px;
  --ebhro-serv20-fc-top-right-right: -20px;
  --ebhro-serv20-fc-bottom-left-bottom: 20px;
  --ebhro-serv20-fc-bottom-left-left: -20px;
  --ebhro-serv20-float-pill-bottom: -18px;
  --ebhro-serv20-float-pill-right: 25px;
  --ebhro-serv20-float-pill-gap: 8px;
  --ebhro-serv20-float-pill-padding-y: 8px;
  --ebhro-serv20-float-pill-padding-x: 18px;
  --ebhro-serv20-features-section-padding-top: 10px;
  --ebhro-serv20-features-section-margin-bottom: 0px;
  --ebhro-serv20-sec-header-margin-bottom: 24px;
  --ebhro-serv20-sec-sub-margin-bottom: 6px;
  --ebhro-serv20-features-grid-gap: 20px;
  --ebhro-serv20-feat-card-padding-y: 28px;
  --ebhro-serv20-feat-card-padding-x: 22px;
  --ebhro-serv20-feat-icon-wrapper-size: 52px;
  --ebhro-serv20-feat-icon-wrapper-margin-bottom: 18px;
  --ebhro-serv20-feat-title-margin-bottom: 10px;
  /* LAYOUT */
  --ebhro-serv20-container-width: 1280px;
  --ebhro-serv20-grid-columns: 1.15fr 0.85fr;
  --ebhro-serv20-media-card-max-width: 500px;
  --ebhro-serv20-media-img-height: 420px;
  --ebhro-serv20-grid-overlay-size: 32px;
  --ebhro-serv20-grid-overlay-opacity: 0.7;
  --ebhro-serv20-features-grid-columns: repeat(4, 1fr);
  /* ORBS */
  --ebhro-serv20-orb-blur: 90px;
  --ebhro-serv20-orb-animation-duration: 12s;
  --ebhro-serv20-orb-1-size: 550px;
  --ebhro-serv20-orb-1-top: -10%;
  --ebhro-serv20-orb-1-right: -5%;
  --ebhro-serv20-orb-2-size: 600px;
  --ebhro-serv20-orb-2-bottom: 10%;
  --ebhro-serv20-orb-2-left: -10%;
  --ebhro-serv20-orb-2-animation-delay: -4s;
  --ebhro-serv20-orb-3-size: 400px;
  --ebhro-serv20-orb-3-top: 40%;
  --ebhro-serv20-orb-3-right: 40%;
  --ebhro-serv20-orb-3-animation-delay: -7s;
  /* PARTICLES */
  --ebhro-serv20-particle-size: 6px;
  --ebhro-serv20-particle-opacity: 0.3;
  --ebhro-serv20-particle-animation-duration: 8s;
  --ebhro-serv20-p1-duration: 6s;
  --ebhro-serv20-p2-duration: 9s;
  --ebhro-serv20-p2-delay: 2s;
  --ebhro-serv20-p3-duration: 7s;
  --ebhro-serv20-p3-delay: 1s;
  --ebhro-serv20-p4-duration: 10s;
  --ebhro-serv20-particle-translate-y: -80px;
  --ebhro-serv20-particle-scale-max: 1.5;
  --ebhro-serv20-particle-opacity-start: 0.2;
  --ebhro-serv20-particle-opacity-mid: 0.6;
  /* ANIMATION */
  --ebhro-serv20-anim-up-translate-y: 30px;
  --ebhro-serv20-anim-up-duration: 0.7s;
  --ebhro-serv20-delay-1: 0.1s;
  --ebhro-serv20-delay-2: 0.2s;
  --ebhro-serv20-delay-3: 0.3s;
  --ebhro-serv20-delay-4: 0.4s;
  --ebhro-serv20-delay-5: 0.5s;
  --ebhro-serv20-orb-0-translate-x: 0;
  --ebhro-serv20-orb-0-translate-y: 0;
  --ebhro-serv20-orb-0-scale: 1;
  --ebhro-serv20-orb-50-translate-x: 30px;
  --ebhro-serv20-orb-50-translate-y: -40px;
  --ebhro-serv20-orb-50-scale: 1.08;
  --ebhro-serv20-orb-100-translate-x: -20px;
  --ebhro-serv20-orb-100-translate-y: 30px;
  --ebhro-serv20-orb-100-scale: 0.95;
  --ebhro-serv20-particle-0-translate-y: 0;
  --ebhro-serv20-particle-0-scale: 1;
  --ebhro-serv20-particle-100-translate-y: -80px;
  --ebhro-serv20-particle-100-scale: 1.5;
  --ebhro-serv20-pulse-0-shadow: 0 0 0 0 rgba(90, 45, 130, 0.220);
  --ebhro-serv20-pulse-70-shadow: 0 0 0 10px rgba(90, 45, 130, 0.060);
  --ebhro-serv20-pulse-100-shadow: 0 0 0 0 rgba(90, 45, 130, 0.060);
  /* Z-INDEX */
  --ebhro-serv20-z-container: 2;
  --ebhro-serv20-z-bg-effects: 1;
  --ebhro-serv20-z-media-glow: -1;
  --ebhro-serv20-z-float-card: 6;
  --ebhro-serv20-z-float-pill: 6;
  /* RESPONSIVE */
  --ebhro-serv20-hero-mobile-padding-top: 24px;
  --ebhro-serv20-hero-mobile-padding-bottom: 32px;
  --ebhro-serv20-title-mobile-font-size: 2rem;
  --ebhro-serv20-tablet-grid-gap: 40px;
  --ebhro-serv20-transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}

/* ==========================================================================
   THEME 6 — SERVICE PAGE HERO + FEATURES
   Hero: same family as the home hero (photo in a morphing blob, floating chips).
   Features: "Blob Icon Card" — white card, the icon lives in an irregular mint
   blob that pokes out of the top edge; hover turns the blob purple, icon white.
   ========================================================================== */
body.theme-6 .ebhro-serv20-hero {
  background: var(--t6-lavender);
  position: relative;
  overflow: hidden;
  padding-bottom: 110px;
}
body.theme-6 .ebhro-serv20-hero::after {
  content: "";
  position: absolute; inset-inline: 0; bottom: -1px; height: 70px; z-index: 1; pointer-events: none;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 70' preserveAspectRatio='none'%3E%3Cpath d='M0 36 C 260 4 480 72 720 36 C 960 0 1200 70 1440 34 L1440 70 L0 70 Z' fill='%23ffffff'/%3E%3C/svg%3E") center / 100% 100% no-repeat;
}
body.theme-6 .ebhro-serv20-grid-overlay,
body.theme-6 .ebhro-serv20-glow-spots,
body.theme-6 .ebhro-serv20-particle { display: none; }
body.theme-6 .ebhro-serv20-orb { filter: none; animation: t6-morph 14s ease-in-out infinite, t6-drift 18s ease-in-out infinite; }
body.theme-6 .ebhro-serv20-orb-1 { background: rgba(111, 214, 168, .22); }
body.theme-6 .ebhro-serv20-orb-2 { background: rgba(90, 45, 130, .07); animation-delay: -6s; }
body.theme-6 .ebhro-serv20-orb-3 { background: rgba(228, 216, 242, .75); animation-delay: -10s; }

body.theme-6 .ebhro-serv20-badge {
  background: #fff; color: var(--t6-purple);
  border: 0; border-radius: 999px; box-shadow: var(--t6-shadow-sm);
  padding: 6px 16px 6px 6px; font-weight: 700;
}
body.theme-6 .ebhro-serv20-badge-icon {
  width: 28px; height: 28px; border-radius: 50%;
  background: var(--t6-mint); color: var(--t6-purple-deep);
}
body.theme-6 .ebhro-serv20-badge-pulse { display: none; }
body.theme-6 .ebhro-serv20-title { color: var(--t6-purple-deep); font-weight: 800; line-height: 1.25; }
body.theme-6 .ebhro-serv20-desc { color: var(--t6-muted); line-height: 1.9; }

/* highlights = check chips */
body.theme-6 .ebhro-serv20-hl-item {
  background: #fff;
  border-radius: 999px;
  padding: 6px 16px 6px 6px;
  box-shadow: var(--t6-shadow-sm);
  color: var(--t6-ink);
  font-weight: 600;
  border: 0;
}
body.theme-6 .ebhro-serv20-hl-icon {
  width: 26px; height: 26px; min-width: 26px; border-radius: 50%;
  background: var(--t6-mint-soft); color: var(--t6-purple);
}

/* visual */
body.theme-6 .ebhro-serv20-media-card { position: relative; background: transparent; border: 0; box-shadow: none; padding: 18px; }
body.theme-6 .ebhro-serv20-media-border { display: none; }
body.theme-6 .ebhro-serv20-media-glow {
  position: absolute; inset: 4% 4% 0 6%;
  background: var(--t6-mint); opacity: .9; filter: none;
  border-radius: 42% 58% 63% 37% / 41% 44% 56% 59%;
  animation: t6-morph 16s ease-in-out infinite reverse;
}
body.theme-6 .ebhro-serv20-media-img-wrapper {
  position: relative; z-index: 1;
  border: 8px solid #fff;
  border-radius: 58% 42% 55% 45% / 50% 58% 42% 50%;
  overflow: hidden;
  box-shadow: var(--t6-shadow-lg);
  animation: t6-morph 14s ease-in-out infinite;
}
body.theme-6 .ebhro-serv20-media-overlay { background: none; }
body.theme-6 .ebhro-serv20-float-card,
body.theme-6 .ebhro-serv20-float-pill {
  z-index: 2;
  background: #fff;
  border: 0;
  border-radius: 1.25rem;
  box-shadow: var(--t6-shadow);
  animation: t6-float 5s ease-in-out infinite;
  backdrop-filter: none;
}
body.theme-6 .ebhro-serv20-float-pill { border-radius: 999px; animation-delay: -1.5s; }
body.theme-6 .ebhro-serv20-fc-bottom-left { animation-delay: -2.5s; }
body.theme-6 .ebhro-serv20-fc-icon {
  width: 38px; height: 38px; border-radius: 50%;
  background: var(--t6-mint); color: var(--t6-purple-deep);
}
body.theme-6 .ebhro-serv20-fc-title { color: var(--t6-purple-deep); font-weight: 800; }
body.theme-6 .ebhro-serv20-fc-subtitle { color: var(--t6-muted); }

/* ---------------- features: Blob Icon Cards ---------------- */
body.theme-6 .ebhro-serv20-features-standalone-sec { background: #fff; }
body.theme-6 .ebhro-serv20-sec-sub {
  display: inline-block;
  background: var(--t6-mint-soft); color: var(--t6-purple);
  border-radius: 999px; padding: 6px 16px; font-weight: 700;
}
body.theme-6 .ebhro-serv20-sec-title { color: var(--t6-purple-deep); font-weight: 800; }
body.theme-6 .ebhro-serv20-title-highlight { color: var(--t6-purple); }

body.theme-6 .ebhro-serv20-features-grid { row-gap: 64px; column-gap: 24px; padding-top: 44px; }
body.theme-6 .ebhro-serv20-feat-card {
  position: relative;
  background: #fff;
  border: 1px solid var(--t6-lavender-mid);
  border-radius: 2rem;
  box-shadow: var(--t6-shadow);
  padding: 58px 24px 26px;
  text-align: center;
  overflow: visible;
  transition: transform .45s var(--t6-ease), box-shadow .35s ease;
}
body.theme-6 .ebhro-serv20-feat-card::before, body.theme-6 .ebhro-serv20-feat-card::after { display: none; }
body.theme-6 .ebhro-serv20-feat-card:hover { transform: translateY(-0.4rem); box-shadow: var(--t6-shadow-lg); }
body.theme-6 .ebhro-serv20-feat-icon-wrapper {
  position: absolute;
  top: -40px; left: 50%;
  transform: translateX(-50%);
  width: 84px; height: 80px;
  display: grid; place-items: center;
  background: var(--t6-mint);
  color: var(--t6-purple-deep);
  font-size: 30px;
  border: 6px solid #fff;
  border-radius: 58% 42% 55% 45% / 50% 58% 42% 50%;
  box-shadow: 0 12px 24px -10px rgba(90, 45, 130, .35);
  animation: t6-morph 12s ease-in-out infinite;
  transition: background .35s ease, color .35s ease;
  margin: 0;
}
body.theme-6 .ebhro-serv20-feat-card:hover .ebhro-serv20-feat-icon-wrapper { background: var(--t6-purple); color: #fff; }
body.theme-6 .ebhro-serv20-feat-card:hover .ebhro-serv20-feat-icon-wrapper i { transform: scale(1.12); }
body.theme-6 .ebhro-serv20-feat-icon-wrapper i { transition: transform .4s var(--t6-ease); }
body.theme-6 .ebhro-serv20-feat-glow { display: none; }
body.theme-6 .ebhro-serv20-feat-title { color: var(--t6-purple-deep); font-weight: 800; }
body.theme-6 .ebhro-serv20-feat-desc { color: var(--t6-muted); line-height: 1.8; }

/* two columns on desktop (text + blob photo); the highlights are loose chips, not a boxed list */
@media (min-width: 1025px) {
  body.theme-6 .ebhro-serv20-grid { align-items: center; }
}
body.theme-6 .ebhro-serv20-highlights-list { background: transparent; border: 0; box-shadow: none; padding: 0; gap: 10px; flex-wrap: wrap; }
body.theme-6 .ebhro-serv20-media-card::before,
body.theme-6 .ebhro-serv20-media-card::after { content: none; display: none; }
body.theme-6 .ebhro-serv20-float-pill,
body.theme-6 .ebhro-serv20-float-pill span { color: var(--t6-purple-deep); font-weight: 700; }
body.theme-6 .ebhro-serv20-float-pill i { color: var(--t6-purple); }
