/*
Theme Name:  Mugsy PR — Divi Child
Description: Mugsy PR & Studios child theme for Divi 5
Author:      Ryan Cohen
Template:    Divi
Version:     1.0.0
*/

/* ─────────────────────────────────────────────────────────────
   TOKENS
───────────────────────────────────────────────────────────── */
:root {
  --mugsy-pink:       #ee008b;
  --mugsy-pink-dark:  #c4006e;
  --mugsy-black:      #0a0a0a;
  --mugsy-white:      #ffffff;
  --mugsy-gray-light: #f5f5f5;
  --mugsy-gray:       #888888;

  --font-heading: 'Outfit', sans-serif;
  --font-body:    'DM Sans', sans-serif;
}

/* ─────────────────────────────────────────────────────────────
   BASE TYPOGRAPHY
───────────────────────────────────────────────────────────── */
body,
.et_pb_text,
.et_pb_blurb_description,
p {
  font-family: var(--font-body) !important;
}

h1, h2, h3, h4, h5, h6,
.et_pb_slide_title,
.et_pb_module_header,
.et_pb_title_container h1,
.et_pb_blurb_title {
  font-family: var(--font-heading) !important;
  line-height: 1 !important;
}

/* ─────────────────────────────────────────────────────────────
   FLUID TYPE SCALE
───────────────────────────────────────────────────────────── */
h1 { font-size: clamp(40px, 6vw, 72px);   line-height: 1 !important; }
h2 { font-size: clamp(32px, 5vw, 56px);   line-height: 1 !important; }
h3 { font-size: clamp(26px, 4vw, 44px);   line-height: 1 !important; }
h4 { font-size: clamp(22px, 3vw, 34px);   line-height: 1 !important; }
h5 { font-size: clamp(20px, 2.5vw, 28px); line-height: 1 !important; }
h6 { font-size: clamp(18px, 2vw, 22px);   line-height: 1 !important; }

/* ─────────────────────────────────────────────────────────────
   BRAND COLOR UTILITIES
───────────────────────────────────────────────────────────── */
.mugsy-pink        { color: var(--mugsy-pink) !important; }
.mugsy-bg-pink     { background-color: var(--mugsy-pink) !important; }
.mugsy-bg-black    { background-color: var(--mugsy-black) !important; }

/* ─────────────────────────────────────────────────────────────
   DIVI BUTTON OVERRIDES
───────────────────────────────────────────────────────────── */
.et_pb_button,
.et_pb_promo_button,
a.et_pb_button {
  font-family:      var(--font-body) !important;
  background-color: var(--mugsy-pink) !important;
  border-color:     var(--mugsy-pink) !important;
  color:            var(--mugsy-white) !important;
  border-radius:    4px !important;
  text-transform:   none !important;
  letter-spacing:   0 !important;
  transition:       background-color 0.2s ease, border-color 0.2s ease;
}

.et_pb_button:hover,
a.et_pb_button:hover {
  background-color: var(--mugsy-pink-dark) !important;
  border-color:     var(--mugsy-pink-dark) !important;
}

/* remove default Divi button arrow */
.et_pb_button::after { display: none !important; }

/* ─────────────────────────────────────────────────────────────
   DIVI LINK COLOR
───────────────────────────────────────────────────────────── */
a { color: var(--mugsy-pink); }
a:hover { color: var(--mugsy-pink-dark); }

/* ─────────────────────────────────────────────────────────────
   DIVI HEADER / NAV
───────────────────────────────────────────────────────────── */
#et-top-navigation .nav li a,
#et_mobile_nav_menu .mobile_menu_bar,
.et_pb_menu .nav li a {
  font-family: var(--font-body) !important;
}

/* ─────────────────────────────────────────────────────────────
   SELECTION COLOR
───────────────────────────────────────────────────────────── */
::selection {
  background: var(--mugsy-pink);
  color:      var(--mugsy-white);
}