/* ════════════════════════════════════════════════════════════════════
   WASEELA — MINIMAL NOTION OVERLAY
   Keeps everything from the STARTING-POINT design EXCEPT:
   1) Buttons → 8px rounded rectangles (no pills)
   2) Subject + plan cards → white surface with thin hairline + soft shadow
   Loaded AFTER landing-wg.css so its rules take precedence.
   ════════════════════════════════════════════════════════════════════ */

/* ─── 1) Buttons: 8px rectangles, never pills ─── */
.wgl-btn,
.wgl-btn-primary,
.wgl-btn-outline,
.wgl-btn-ghost,
.wgl-btn-lg,
.wgl-btn-full {
  border-radius: 8px !important;
}

/* The big CTA buttons on hero / pricing keep their look but stop being
   rounded into a pill at small widths. */
.wgl-hero-ctas .wgl-btn,
.wgl-plan-cta,
.wgl-final-cta .wgl-btn {
  border-radius: 8px !important;
}

/* ─── 2) Cards: white surface, hairline border, subtle shadow ─── */
.wgl-subject {
  background: #fff !important;
  border: 1px solid rgba(59, 38, 21, 0.10) !important;   /* hairline */
  box-shadow: 0 1px 2px 0 rgba(15, 15, 15, 0.04) !important;
}
.wgl-subject:hover {
  border-color: rgba(59, 38, 21, 0.18) !important;
  box-shadow: 0 4px 12px 0 rgba(15, 15, 15, 0.08) !important;
}

.wgl-plan {
  background: #fff !important;
  border: 1px solid rgba(59, 38, 21, 0.10) !important;
  box-shadow: 0 1px 2px 0 rgba(15, 15, 15, 0.04) !important;
}
.wgl-plan-featured {
  background: #fff !important;
  border: 2px solid #B89674 !important;                  /* keep tan accent */
}