/*
Theme Name:    My Coop Nest Child Theme
Theme URI:      https://mycoopnest.ca
Description:    A Divi 5 child theme built by Mary Newell Creative — strategy-first, design that blooms next.
Author:         Mary Newell Creative
Author URI:     https://marynewell.ca
Template:       Divi
Version:        1.0.0
Text Domain:    mycoopnest
Tags:           divi, responsive, local-business
*/

/*-------------------------------------------
  Add any custom CSS below this line
-------------------------------------------*/

/* playfair-display-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/playfair-display-v40-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* playfair-display-600 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 600;
  src: url('../fonts/playfair-display-v40-latin-600.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* playfair-display-700 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/playfair-display-v40-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* dm-sans-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/dm-sans-v17-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
h1 {
  margin-bottom: clamp(1rem, 0.8rem + 0.89vw, 1.5rem);
}

h2 {
  margin-bottom: clamp(0.875rem, 0.75rem + 0.56vw, 1.25rem);
}

h3 {
  margin-bottom: clamp(0.75rem, 0.65rem + 0.44vw, 1rem);
}

.paragraph-text	 {
  margin-bottom: clamp(1rem, 0.9rem + 0.44vw, 1.25rem);
}

.mcn-eyebrow {
  font-size: 0.6875rem;
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase!important;
  color: #8c4e22;
  display: block;
  margin-bottom: 12px;
}
 
/* Eyebrow on dark backgrounds */
.mcn-eyebrow-light {
font-size: 0.6875rem;
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase!important;
  color: #f5d98a!important;
  display: block;
  margin-bottom: 12px;
} 
/* Eyebrow with left border accent */
.mcn-eyebrow--accented {
  border-left: 3px solid var(--mcn-saffron);
  padding-left: 10px;
  border-radius: 0;
}
 
/* ------------------------------------------------------------
   BUTTONS
   ------------------------------------------------------------ */
 
/* Base button reset */
.mcn-btn {
  display: inline-block;
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: clamp(0.75rem, 0.72rem + 0.13vw, 0.8125rem);
  font-weight: 500;
  line-height: 1;
  text-decoration: none;
  cursor: pointer;
  border: none;
  transition: opacity 0.2s ease, background 0.2s ease, color 0.2s ease;
}
 
/* --- Primary button — Saffron fill --- */
/* Use for: main CTAs, hero, demo request */
.mcn-btn-primary {
  background: #d4a847;
  color: #2e2118;
  padding: 14px 28px;
  border-radius: 28px;
}
 
.mcn-btn-primary:hover {
  background: #b88a28;
  color: #fdfaf5;
  opacity: 1;
}
 
/* --- Secondary button — Dark fill --- */
/* Use for: form submit on saffron backgrounds */
.mcn-btn-secondary {
  background: #2e2118;
  color: #fdfaf5;
  padding: 14px 28px;
  border-radius: 28px;
}
 
.mcn-btn-secondary:hover {
  background: #1a1208;
  opacity: 1;
}
 
/* --- Outline button — Clay border --- */
/* Use for: secondary actions, template selectors */
.mcn-btn-outline {
  background: transparent;
  color: #8c4e22;
  border: 1.5px solid #8c4e22;
  padding: 12px 26px;
  border-radius: 28px;
}
 
.mcn-btn-outline:hover {
  background: #8c4e22;
  color: #fdfaf5;
}
 
/* --- Ghost button — Light border, for dark backgrounds --- */
/* Use for: buttons on espresso/dark sections */
.mcn-btn-ghost {
  background: transparent;
  color: #fdfaf5;
  border: 1.5px solid #d9ccaf;
  padding: 12px 26px;
  border-radius: 28px;
}
 
.mcn-btn-ghost:hover {
  background: #fdfaf5;
  color: #2e2118;
  border-color: #fdfaf5;
}
 
/* --- Nav button — compact --- */
/* Use for: navigation bar CTA */
.mcn-btn-nav {
  background: #d4a847;
  color: #2e2118;
  padding: 8px 18px;
  border-radius: 20px;
  font-size: 0.8125rem;
}
 
.mcn-btn-nav:hover {
  background: #b88a28;
  color: #fdfaf5;
}

/* ------------------------------------------------------------
   STEP TAGS
   Small label badges used in the membership application steps
   ------------------------------------------------------------ */

.mcn-step-tag {
  display: inline-block;
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: 0.625rem; /* 10px */
  font-weight: 500;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  border-radius: 10px;
  margin-top: 0;
  margin-bottom: 0;
}

/* Saffron — committee controlled, instant confirmation */
/* Use on dark backgrounds */
.mcn-step-tag--saffron {
  background: rgba(212, 168, 71, 0.15);
  color: #D4A847;
}

/* Linen
/* Use on dark backgrounds */
.mcn-step-tag--linen {
  background: #e8dcc8;
  color: #D4A847;
}

/* Clay — manual review, board review */
/* Use on dark backgrounds */
.mcn-step-tag--clay {
  background: rgba(140, 78, 34, 0.25);
  color: #E8C4A0;
}

/* Muted — fully electronic */
/* Use on dark backgrounds */
.mcn-step-tag--muted {
  background: rgba(255, 255, 255, 0.06);
  color: #D9CCAF;
}

/* Light variants — for use on light/parchment backgrounds */
.mcn-step-tag-saffron-light {
  display: inline-block;
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: 0.625rem; /* 10px */
  font-weight: 500;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  border-radius: 10px;
  margin-bottom: 0!important;
	margin-top: 0;
  background: #F5D98A;
  color: #8C6610;
display: inline-block;
padding: 2px 10px;
	width: content;
}
.mcn-step-tag-dark {
  display: inline-block;
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: 0.625rem; /* 10px */
  font-weight: 500;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  border-radius: 10px;
  margin-bottom: 0!important;
	margin-top: 0;
  background: #8c6610;
  color: #ffffff;
display: inline-block;
padding: 2px 10px;
	width: content;
}

.mcn-step-tag-highlight {
  display: inline-block;
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: clamp(0.9375rem, 0.875rem + 0.28vw, 1rem);
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  border-radius: 10px;
  margin-bottom: 0!important;
	margin-top: 0;
  background: #f5d98a;
  color: #8c4e22;
display: inline-block;
padding: 2px 10px;
	width: content;
}
.mcn-step-tag-highlight2 {
  display: inline-block;
  font-family: 'Playfair Display', system-ui, sans-serif;
  font-size: clamp(0.9375rem, 0.875rem + 0.28vw, 1rem);
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  border-radius: 10px;
  
	margin-top: 0;
  background: #6b5840;
  color: #f5d98a;
display: inline-block;
padding: 2px 10px;
	width: content;
}

.mcn-step-tag-saffron-light p {
  margin-bottom: 0;
}
.mcn-step-tag--clay-light {
  background: #E8C4A0;
  color: #5C2E0A;
}

.mcn-step-tag--muted-light {
  background: #E8DCC8;
  color: #6B5840;
}
.blurb-text {
  margin-bottom: 0;
}
.pillar-note {
  margin-top: 1.5rem;
  padding: 1rem 1.25rem;
  background: #F2EDE2;
  border-left: 2px solid #D4A847;
  border-radius: 0 8px 8px 0;
}

.pillar-note p {
  font-size: 13px;
  color: #6B5840;
  margin: 0;
  line-height: 1.6;
  font-style: italic;
}