@import url('https://fonts.googleapis.com/css2?family=Lora:ital,wght@0,700;1,400&display=swap');

:root {
  --cream:      #faf7f4;
  --cream-dark: #f2ece5;
  --rose:       #c97b7b;
  --rose-light: #e8b8b8;
  --rose-pale:  #f5e6e6;
  --blue-soft:  #b8d4e0;
  --blue-pale:  #e8f3f8;
  --text:       #3d3530;
  --text-mid:   #6b5a54;
  --text-light: #9e8880;
  --white:      #ffffff;
  --radius:     14px;
  --radius-lg:  24px;
  --shadow:     0 4px 24px rgba(100,60,50,.08);
  --shadow-md:  0 8px 40px rgba(100,60,50,.12);
}
.img-fluid-cms.img-top { border-radius: 20px 20px 0 0; }
.about-landing h1,
.about-landing h2,
.about-landing h3,
.about-landing h4 { line-height: 1.25; }
.about-landing h1 { font-size: clamp(2rem, 5vw, 2.2rem); font-weight: 700; }
.about-landing p  { color: var(--text-mid); }
.about-landing { font-family: 'Poppins', sans-serif; color: var(--text); line-height: 1.7; font-size: 16px; }
.about-section { padding: 0 0 64px; }
.about-container { max-width: 880px; margin: 0 auto; padding: 0 20px; }
.about-hero { background: linear-gradient(135deg,#fdf0ed 0%,#faf7f4 50%,#e8f3f8 100%); margin: 40px auto 40px; border-radius: 20px; max-width: 960px; }
.about-hero-body { padding: 56px 20px 64px; text-align: center; }
.about-hero-badge {
  display: inline-block;
  background: var(--rose-pale); color: var(--rose);
  font-weight: 700; font-size: .78rem;
  letter-spacing: .12em; text-transform: uppercase;
  padding: 6px 18px; border-radius: 99px; margin-bottom: 18px;
}
.last-h5 {margin: 30px auto 30px !important; max-width: 500px; line-height: 30px;}
.about-hero-body h1    {font-family: 'Lora', serif; line-height: 1.25; margin-bottom: 25px; margin-top: 10px;}
.about-hero-body h1 em { font-style: italic; color: var(--rose); }
.about-hero-sub        { font-size: 1rem; color: var(--text-mid); max-width: 750px; margin: 0 auto 16px; }
.about-hero-highlight {
  display: inline-block;
  background: var(--white); border: 2px solid var(--rose-light);
  border-radius: var(--radius-lg);
  padding: 24px 36px; margin: 20px 0 32px;
  font-family: 'Lora', serif;
  font-size: 1.1rem; font-style: italic; color: var(--text);
  max-width: 560px; box-shadow: var(--shadow);
}
@media (max-width: 640px) {
  .about-hero-body      { padding: 36px 20px 0; }
  .about-hero-highlight { padding: 16px 18px; font-size: .96rem; }
}