:root {
  --plum:   #4A1E4C;
  --mauve:  #7A4A7C;
  --rose:   #C4889A;
  --blush:  #F2D9DF;
  --cream:  #FDF6F0;
  --coral:  #E8896A;
  --teal:   #4A9B9B;
  --dark:   #1A0F1C;
  --text:   #2A1A2E;
  --muted:  #6B5070;
  --white:  #FFFFFF;
  --ff-display: 'Playfair Display', Georgia, serif;
  --ff-script:  'Caveat', cursive;
  --ff-body:    'Nunito', system-ui, sans-serif;
  --max: 1220px;
  --r: 14px;
  --r-lg: 22px;
}
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body { font-family: var(--ff-body); background: var(--cream); color: var(--text); font-size: 17px; line-height: 1.65; -webkit-font-smoothing: antialiased; }
img { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }

/* Shared page helpers */
main { min-height: 60vh; }

/* =========================================================
   MOBILE WIDTH / HORIZONTAL OVERFLOW SAFETY
   Prevents the page from sliding sideways on phones.
   ========================================================= */
html,
body {
  width: 100%;
  max-width: 100%;
  overflow-x: hidden;
  overflow-x: clip;
}

body,
main,
section,
header,
footer {
  min-width: 0;
}

/* Grid and flex children otherwise keep an intrinsic minimum width. */
main *,
section *,
header *,
footer * {
  min-width: 0;
}

img,
video,
iframe,
svg,
canvas {
  max-width: 100%;
}

input,
textarea,
select,
button {
  max-width: 100%;
}

/* Long URLs and unbroken text must wrap instead of widening the page. */
p,
li,
h1,
h2,
h3,
h4,
a,
span {
  overflow-wrap: anywhere;
}