/*
Theme Name:   Everyday Aquaponics Child
Theme URI:    https://www.everydayaquaponics.com
Description:  Child theme for everydayaquaponics.com — built on Kadence
Author:       Everyday Aquaponics
Version:      1.1.0
Template:     kadence
Text Domain:  everyday-aquaponics-child
*/

/* ================================================================
   Brand color custom properties — vibrant, nature-forward palette
   ================================================================ */
:root {
    /* Primary greens */
    --ea-forest-green:   #166534;   /* Rich anchor green */
    --ea-mid-green:      #15803D;   /* Interactive mid green */
    --ea-bright-green:   #22C55E;   /* Vivid accent / highlights */
    --ea-light-green:    #86EFAC;   /* Very light pop */

    /* Water + depth */
    --ea-teal:           #0E7490;   /* Deep water teal */
    --ea-sky:            #0EA5E9;   /* Clear water blue */

    /* Warm accents */
    --ea-orange:         #EA580C;   /* Vibrant CTA orange */
    --ea-amber:          #F59E0B;   /* Warm amber / ratings */
    --ea-terracotta:     #EA580C;   /* Alias for backward compat */

    /* Dark tones */
    --ea-dark:           #052E16;   /* Near-black green — hero backgrounds */
    --ea-dark-mid:       #0D3B22;   /* Mid-dark gradient stop */
    --ea-charcoal:       #1A2E1E;   /* Body text */
    --ea-stone-gray:     #6B7280;   /* Subdued text / meta */

    /* Light tones */
    --ea-white:          #FFFFFF;
    --ea-bg-light:       #F0FDF4;   /* Fresh light green — section backgrounds */
    --ea-bg-mid:         #DCFCE7;   /* Minty card bg */
    --ea-soft-sage:      #A8C4A2;   /* Kept for compatibility */
    --ea-light-sage:     #B8D4B1;   /* Kept for compatibility */

    /* Gradients */
    --ea-grad-hero:      linear-gradient(135deg, #052E16 0%, #0D3B22 55%, #0E7490 100%);
    --ea-grad-dark:      linear-gradient(160deg, #052E16 0%, #14532D 100%);
    --ea-grad-green:     linear-gradient(135deg, #166534 0%, #15803D 100%);
    --ea-grad-vivid:     linear-gradient(135deg, #15803D 0%, #22C55E 100%);
    --ea-grad-orange:    linear-gradient(135deg, #EA580C 0%, #F97316 100%);
    --ea-grad-teal:      linear-gradient(135deg, #0E7490 0%, #0EA5E9 100%);

    /* Shadows */
    --ea-shadow-sm:      0 2px 8px rgba(5,46,22,0.08);
    --ea-shadow-md:      0 4px 24px rgba(5,46,22,0.13);
    --ea-shadow-lg:      0 8px 40px rgba(5,46,22,0.2);
    --ea-shadow-glow:    0 0 0 3px rgba(34,197,94,0.25);
    --ea-shadow-orange:  0 4px 20px rgba(234,88,12,0.3);

    /* Kadence global palette compatibility */
    --global-palette1:   #166534;
    --global-palette2:   #22C55E;
    --global-palette3:   #EA580C;
    --global-palette4:   #1A2E1E;
    --global-palette5:   #FFFFFF;
    --global-palette6:   #6B7280;
    --global-palette7:   #DCFCE7;
    --global-palette8:   #F0FDF4;
}

/* ================================================================
   Base typography
   ================================================================ */
html { scroll-behavior: smooth; }

body {
    color: var(--ea-charcoal);
    background-color: var(--ea-white);
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    font-size: 16px;
    line-height: 1.7;
}

h1, h2, h3, h4, h5, h6,
.entry-title, .page-title, .site-title {
    font-family: 'Fraunces', Georgia, 'Times New Roman', serif;
    font-weight: 500;
    line-height: 1.2;
    color: var(--ea-forest-green);
}

h1 { font-size: 44px; }
h2 { font-size: 30px; }
h3 { font-size: 22px; }
h4 { font-size: 18px; }

a {
    color: var(--ea-mid-green);
    text-decoration: underline;
    text-underline-offset: 3px;
    transition: color 0.15s;
}
a:hover { color: var(--ea-orange); }

/* ================================================================
   Hub page layout — strip Kadence constraints
   ================================================================ */
.page-home .site-main,
.page-learn .site-main,
.page-plans .site-main,
.page-fish-and-plants .site-main,
.page-troubleshooting .site-main,
.page-about .site-main,
.blog .site-main,
.post-type-archive .site-main,
.single-plans .site-main,
.single-problems .site-main,
.single-fish .site-main,
.single-plants .site-main,
.single-comparisons .site-main {
    padding: 0 !important;
    max-width: none !important;
    margin: 0 !important;
}

.page-home .content-area,
.page-learn .content-area,
.page-plans .content-area,
.page-fish-and-plants .content-area,
.page-troubleshooting .content-area,
.page-about .content-area,
.post-type-archive .content-area,
.single .content-area {
    padding: 0;
    max-width: none;
}

/* ================================================================
   Containers
   ================================================================ */
.ea-container {
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 28px;
    padding-right: 28px;
    box-sizing: border-box;
}
.ea-container--narrow { max-width: 740px; }
.ea-container--wide   { max-width: 1400px; }

/* ================================================================
   Section wrappers
   ================================================================ */
.ea-section {
    padding: 80px 0;
}
.ea-section--light   { background-color: var(--ea-bg-light); }
.ea-section--mid     { background-color: var(--ea-bg-mid); }
.ea-section--sage    { background-color: #DCFCE7; }
.ea-section--forest  { background-color: var(--ea-forest-green); }
.ea-section--dark    { background: var(--ea-grad-dark); }
.ea-section--teal    { background: var(--ea-grad-teal); }

.ea-section__lead {
    font-size: 18px;
    color: var(--ea-stone-gray);
    margin: 0 0 36px;
    max-width: 640px;
    line-height: 1.65;
}

/* ================================================================
   Buttons
   ================================================================ */
.wp-block-button__link,
.button, .btn {
    background: var(--ea-grad-green);
    color: var(--ea-white);
    border-radius: 8px;
    padding: 13px 26px;
    font-family: 'Inter', sans-serif;
    font-weight: 500;
    text-decoration: none;
    transition: transform 0.15s, box-shadow 0.15s, filter 0.15s;
}
.wp-block-button__link:hover,
.button:hover, .btn:hover {
    transform: translateY(-2px);
    box-shadow: var(--ea-shadow-md);
    filter: brightness(1.05);
    color: var(--ea-white);
}

.ea-btn {
    display: inline-block;
    padding: 13px 28px;
    border-radius: 8px;
    font-family: 'Inter', sans-serif;
    font-size: 15px;
    font-weight: 600;
    text-decoration: none;
    border: 2px solid transparent;
    line-height: 1;
    transition: transform 0.15s, box-shadow 0.15s, filter 0.15s, background 0.15s, color 0.15s, border-color 0.15s;
    cursor: pointer;
    letter-spacing: 0.01em;
}

.ea-btn--primary {
    background: var(--ea-grad-green);
    color: #fff !important;
    border-color: transparent;
    box-shadow: 0 4px 14px rgba(22,101,52,0.35);
}
.ea-btn--primary:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(22,101,52,0.45);
    filter: brightness(1.07);
    color: #fff !important;
    text-decoration: none;
}

.ea-btn--orange {
    background: var(--ea-grad-orange);
    color: #fff !important;
    border-color: transparent;
    box-shadow: var(--ea-shadow-orange);
}
.ea-btn--orange:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 28px rgba(234,88,12,0.45);
    filter: brightness(1.07);
    color: #fff !important;
    text-decoration: none;
}

.ea-btn--outline {
    background-color: transparent;
    color: var(--ea-mid-green) !important;
    border-color: var(--ea-mid-green);
}
.ea-btn--outline:hover {
    background: var(--ea-grad-green);
    color: #fff !important;
    border-color: transparent;
    transform: translateY(-2px);
    box-shadow: var(--ea-shadow-md);
    text-decoration: none;
}

.ea-btn--ghost-white {
    background-color: transparent;
    color: #fff !important;
    border-color: rgba(255,255,255,0.55);
}
.ea-btn--ghost-white:hover {
    background-color: rgba(255,255,255,0.15);
    border-color: #fff;
    text-decoration: none;
    transform: translateY(-2px);
}

.ea-btn--sm {
    padding: 8px 18px;
    font-size: 13px;
}

/* ================================================================
   Homepage Hero (dark gradient)
   ================================================================ */
.ea-hero {
    background: var(--ea-grad-hero);
    overflow: hidden;
    position: relative;
    min-height: 560px;
}

.ea-hero::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image: radial-gradient(circle at 20% 50%, rgba(14,116,144,0.15) 0%, transparent 60%),
                      radial-gradient(circle at 80% 20%, rgba(34,197,94,0.08) 0%, transparent 50%);
    pointer-events: none;
}

.ea-hero__inner {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 56px;
    align-items: center;
    padding: 80px 0 80px;
    min-height: 500px;
    position: relative;
    z-index: 1;
}

.ea-hero__text h1 {
    font-size: 48px;
    line-height: 1.1;
    margin-bottom: 20px;
    color: #fff;
}

.ea-hero__text p {
    font-size: 18px;
    color: rgba(255,255,255,0.82);
    margin-bottom: 32px;
    max-width: 480px;
    line-height: 1.7;
}

.ea-hero__actions {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
}

.ea-hero__image {
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 24px 64px rgba(0,0,0,0.4);
}

/* Stats bar inside hero */
.ea-stats-bar {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    background: rgba(255,255,255,0.07);
    border: 1px solid rgba(255,255,255,0.12);
    border-radius: 12px;
    overflow: hidden;
    margin: 48px 0 0;
    position: relative;
    z-index: 1;
    backdrop-filter: blur(8px);
}
.ea-stat-item {
    padding: 20px 16px;
    text-align: center;
    border-right: 1px solid rgba(255,255,255,0.08);
}
.ea-stat-item:last-child { border-right: none; }
.ea-stat-number {
    font-family: 'Fraunces', serif;
    font-size: 32px;
    font-weight: 500;
    color: var(--ea-bright-green);
    display: block;
    line-height: 1;
    margin-bottom: 4px;
}
.ea-stat-label {
    font-size: 11px;
    color: rgba(255,255,255,0.65);
    text-transform: uppercase;
    letter-spacing: 0.07em;
}

/* Page-level hero (inner pages, lighter) */
.ea-hero--page {
    padding: 60px 0 52px;
}
.ea-hero--page h1 {
    font-size: 40px;
    margin-bottom: 14px;
}
.ea-hero--page .ea-hero__intro {
    font-size: 18px;
    color: var(--ea-stone-gray);
    max-width: 640px;
    margin: 0;
    line-height: 1.65;
}

/* ================================================================
   Card grid
   ================================================================ */
.ea-card-grid {
    display: grid;
    gap: 24px;
    margin-top: 32px;
}
.ea-card-grid--2 { grid-template-columns: repeat(2, 1fr); }
.ea-card-grid--3 { grid-template-columns: repeat(3, 1fr); }
.ea-card-grid--4 { grid-template-columns: repeat(4, 1fr); }

/* ================================================================
   Path chooser cards
   ================================================================ */
.ea-path-card {
    display: flex;
    flex-direction: column;
    gap: 14px;
    padding: 36px 32px;
    background: #fff;
    border: 1.5px solid rgba(22,101,52,0.12);
    border-radius: 16px;
    text-decoration: none;
    color: var(--ea-charcoal);
    transition: box-shadow 0.2s, border-color 0.2s, transform 0.2s;
    position: relative;
    overflow: hidden;
}
.ea-path-card::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 4px;
    background: var(--ea-grad-green);
    opacity: 0;
    transition: opacity 0.2s;
}
.ea-path-card:hover {
    border-color: var(--ea-mid-green);
    box-shadow: var(--ea-shadow-md);
    transform: translateY(-4px);
    text-decoration: none;
    color: var(--ea-charcoal);
}
.ea-path-card:hover::before { opacity: 1; }
.ea-path-card__icon { font-size: 40px; line-height: 1; }
.ea-path-card h3 { font-size: 22px; margin: 0; color: var(--ea-forest-green); }
.ea-path-card p  { margin: 0; font-size: 15px; color: var(--ea-stone-gray); line-height: 1.65; flex: 1; }
.ea-path-card__cta { font-size: 14px; font-weight: 700; color: var(--ea-orange); margin-top: auto; letter-spacing: 0.02em; }

/* ================================================================
   Plan cards
   ================================================================ */
.ea-plan-card {
    display: flex;
    flex-direction: column;
    background: #fff;
    border: 1.5px solid rgba(22,101,52,0.1);
    border-radius: 16px;
    overflow: hidden;
    text-decoration: none;
    color: var(--ea-charcoal);
    transition: box-shadow 0.2s, border-color 0.2s, transform 0.2s;
}
.ea-plan-card:hover {
    border-color: var(--ea-mid-green);
    box-shadow: var(--ea-shadow-md);
    transform: translateY(-4px);
    text-decoration: none;
}
.ea-plan-card__img,
.ea-plan-card img { width: 100%; aspect-ratio: 16/9; object-fit: cover; display: block; }
.ea-plan-card__body {
    padding: 22px 26px 26px;
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.ea-plan-card h3  { font-size: 20px; margin: 0; color: var(--ea-forest-green); line-height: 1.25; }
.ea-plan-card p   { font-size: 14px; color: var(--ea-stone-gray); margin: 0; flex: 1; line-height: 1.6; }
.ea-plan-card__stats {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 4px;
}
.ea-plan-card__stats span {
    font-size: 11px;
    font-weight: 600;
    padding: 4px 10px;
    background: var(--ea-bg-light);
    color: var(--ea-forest-green);
    border-radius: 20px;
    letter-spacing: 0.02em;
}
.ea-plan-card__cta {
    font-size: 14px;
    font-weight: 700;
    color: var(--ea-orange);
    margin-top: 4px;
}

/* Legacy stat list */
.ea-plan-stats {
    list-style: none; padding: 0; margin: 8px 0 0;
    display: flex; gap: 16px; flex-wrap: wrap;
    font-size: 13px; color: var(--ea-stone-gray);
}
.ea-plan-stats li strong { color: var(--ea-charcoal); }

/* ================================================================
   Nitrogen cycle steps
   ================================================================ */
.ea-cycle-wrap {
    background: var(--ea-grad-hero);
    border-radius: 16px;
    padding: 40px 32px 32px;
    position: relative;
    overflow: hidden;
}
.ea-cycle-wrap::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image: radial-gradient(circle at 0% 100%, rgba(14,116,144,0.2) 0%, transparent 60%);
    pointer-events: none;
}
.ea-cycle-steps {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 1px;
    background: rgba(255,255,255,0.08);
    border-radius: 12px;
    overflow: hidden;
    margin-bottom: 16px;
    position: relative;
    z-index: 1;
}
.ea-cycle-step {
    background: rgba(255,255,255,0.04);
    padding: 24px 14px;
    text-align: center;
    transition: background 0.2s;
}
.ea-cycle-step:hover { background: rgba(255,255,255,0.09); }
.ea-cycle-step__icon { font-size: 32px; margin-bottom: 10px; display: block; }
.ea-cycle-step__title { font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; margin-bottom: 6px; display: block; }
.ea-cycle-step__desc  { font-size: 11px; color: rgba(255,255,255,0.6); line-height: 1.5; }
.ea-cycle-step--blue  .ea-cycle-step__title { color: #38BDF8; }
.ea-cycle-step--red   .ea-cycle-step__title { color: #F87171; }
.ea-cycle-step--purple .ea-cycle-step__title { color: #C084FC; }
.ea-cycle-step--green .ea-cycle-step__title { color: #4ADE80; }
.ea-cycle-step--teal  .ea-cycle-step__title { color: #22D3EE; }

.ea-cycle-return {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    position: relative;
    z-index: 1;
}
.ea-cycle-return__badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: rgba(34,197,94,0.12);
    border: 1px solid rgba(34,197,94,0.3);
    border-radius: 20px;
    padding: 8px 20px;
    font-size: 12px;
    color: rgba(255,255,255,0.8);
}

/* ================================================================
   Article / post cards
   ================================================================ */
.ea-post-card {
    display: flex;
    flex-direction: column;
    background: #fff;
    border: 1.5px solid rgba(22,101,52,0.08);
    border-radius: 14px;
    overflow: hidden;
    text-decoration: none;
    color: var(--ea-charcoal);
    transition: box-shadow 0.2s, transform 0.2s;
}
.ea-post-card:hover {
    box-shadow: var(--ea-shadow-md);
    transform: translateY(-4px);
    text-decoration: none;
    color: var(--ea-charcoal);
}
.ea-post-card__img,
.ea-post-card img  { width: 100%; aspect-ratio: 3/2; object-fit: cover; display: block; }
.ea-post-card__body { padding: 18px 22px 22px; flex: 1; display: flex; flex-direction: column; gap: 8px; }
.ea-post-card__cat  {
    display: inline-block;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    color: var(--ea-mid-green);
    background: var(--ea-bg-mid);
    padding: 3px 10px;
    border-radius: 20px;
    width: fit-content;
}
.ea-post-card h3    { font-size: 17px; margin: 0; color: var(--ea-forest-green); line-height: 1.35; }
.ea-post-card p     { font-size: 14px; color: var(--ea-stone-gray); margin: 0; line-height: 1.55; flex: 1; }
.ea-post-card__meta { font-size: 12px; color: var(--ea-stone-gray); margin-top: auto; }

/* ================================================================
   Affiliate / product cards
   ================================================================ */
.ea-product-card {
    display: flex;
    flex-direction: column;
    background: #fff;
    border: 1.5px solid rgba(22,101,52,0.1);
    border-radius: 14px;
    overflow: hidden;
    text-decoration: none;
    color: var(--ea-charcoal);
    transition: box-shadow 0.2s, transform 0.2s, border-color 0.2s;
}
.ea-product-card:hover {
    box-shadow: var(--ea-shadow-md);
    transform: translateY(-4px);
    border-color: var(--ea-orange);
    text-decoration: none;
}
.ea-product-card__badge {
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--ea-orange);
    background: #FFF7ED;
    padding: 3px 10px;
    display: inline-block;
    border-radius: 20px;
    width: fit-content;
    margin-bottom: 8px;
}
.ea-product-card__body { padding: 20px 22px 22px; flex: 1; display: flex; flex-direction: column; gap: 8px; }
.ea-product-card h3    { font-size: 16px; margin: 0; color: var(--ea-forest-green); line-height: 1.3; }
.ea-product-card__why  { font-size: 13px; color: var(--ea-stone-gray); line-height: 1.55; flex: 1; margin: 0; }
.ea-product-card__price { font-size: 18px; font-weight: 700; color: var(--ea-charcoal); font-family: 'Fraunces', serif; }
.ea-product-card__buy  {
    display: block;
    margin-top: 12px;
    padding: 10px 16px;
    background: var(--ea-grad-orange);
    color: #fff !important;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
    text-align: center;
    transition: filter 0.15s, transform 0.15s;
    box-shadow: 0 3px 10px rgba(234,88,12,0.25);
}
.ea-product-card__buy:hover {
    filter: brightness(1.08);
    transform: translateY(-1px);
    text-decoration: none;
}

/* ================================================================
   Why Aquaponics / feature stats
   ================================================================ */
.ea-why-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
    margin-top: 32px;
}
.ea-why-item {
    padding: 28px 28px 28px 24px;
    background: #fff;
    border-left: 5px solid var(--ea-bright-green);
    border-radius: 0 12px 12px 0;
    box-shadow: var(--ea-shadow-sm);
}
.ea-why-item__number {
    font-family: 'Fraunces', serif;
    font-size: 40px;
    font-weight: 500;
    color: var(--ea-forest-green);
    line-height: 1;
    margin-bottom: 6px;
    display: block;
}
.ea-why-item h4 { font-size: 17px; margin: 0 0 6px; color: var(--ea-charcoal); }
.ea-why-item p  { font-size: 14px; color: var(--ea-stone-gray); margin: 0; line-height: 1.6; }

/* ================================================================
   Topic pills
   ================================================================ */
.ea-topic-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 24px;
}
.ea-topic-pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 9px 20px;
    background: #fff;
    border: 1.5px solid rgba(22,101,52,0.18);
    border-radius: 100px;
    font-size: 14px;
    font-weight: 600;
    color: var(--ea-forest-green);
    text-decoration: none;
    transition: background 0.15s, color 0.15s, border-color 0.15s, transform 0.15s;
}
.ea-topic-pill:hover {
    background: var(--ea-grad-green);
    border-color: transparent;
    color: #fff !important;
    text-decoration: none;
    transform: translateY(-2px);
}

/* ================================================================
   Component / gear grid
   ================================================================ */
.ea-component-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
    margin-top: 28px;
}
.ea-component-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    padding: 26px 16px;
    background: #fff;
    border: 1.5px solid rgba(22,101,52,0.1);
    border-radius: 12px;
    text-align: center;
    font-size: 14px;
    font-weight: 600;
    color: var(--ea-forest-green);
    text-decoration: none;
    transition: box-shadow 0.15s, transform 0.15s;
}
.ea-component-card:hover {
    box-shadow: var(--ea-shadow-md);
    transform: translateY(-3px);
    text-decoration: none;
}
.ea-component-card__icon { font-size: 32px; }

/* ================================================================
   Symptom selector
   ================================================================ */
.ea-symptom-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
    margin: 32px 0;
}
.ea-symptom-btn {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    padding: 30px 12px;
    background: #fff;
    border: 2px solid rgba(22,101,52,0.12);
    border-radius: 12px;
    text-align: center;
    font-size: 15px;
    font-weight: 600;
    color: var(--ea-charcoal);
    text-decoration: none;
    transition: border-color 0.15s, background 0.15s, transform 0.15s;
}
.ea-symptom-btn:hover {
    border-color: var(--ea-orange);
    background: #FFF7ED;
    text-decoration: none;
    color: var(--ea-charcoal);
    transform: translateY(-3px);
}
.ea-symptom-btn__icon { font-size: 32px; line-height: 1; }

/* ================================================================
   Urgency banner
   ================================================================ */
.ea-urgency-banner {
    background: #FFF7ED;
    border: 2px solid var(--ea-orange);
    border-radius: 12px;
    padding: 24px 28px;
    margin-bottom: 32px;
}
.ea-urgency-banner h3 { color: var(--ea-orange); margin: 0 0 12px; font-size: 18px; }
.ea-urgency-links { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: 10px; }
.ea-urgency-links a {
    display: inline-block;
    padding: 7px 16px;
    background: var(--ea-grad-orange);
    color: #fff !important;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
    transition: filter 0.15s, transform 0.15s;
    box-shadow: 0 3px 10px rgba(234,88,12,0.25);
}
.ea-urgency-links a:hover { filter: brightness(1.08); transform: translateY(-1px); }

/* ================================================================
   Problem cards
   ================================================================ */
.ea-problem-card {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
    padding: 20px 22px;
    background: #fff;
    border: 1.5px solid rgba(22,101,52,0.08);
    border-radius: 12px;
    text-decoration: none;
    color: var(--ea-charcoal);
    transition: border-color 0.15s, box-shadow 0.15s, transform 0.15s;
}
.ea-problem-card:hover {
    border-color: var(--ea-mid-green);
    box-shadow: var(--ea-shadow-sm);
    transform: translateY(-2px);
    text-decoration: none;
    color: var(--ea-charcoal);
}
.ea-problem-card__text h3 { font-size: 16px; margin: 0 0 4px; color: var(--ea-forest-green); }
.ea-problem-card__text p  { font-size: 13px; color: var(--ea-stone-gray); margin: 0; }
.ea-badge-urgency {
    flex-shrink: 0;
    align-self: flex-start;
    padding: 4px 10px;
    border-radius: 20px;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    white-space: nowrap;
}
.ea-badge-urgency--urgent { background: #FEE2E2; color: #991B1B; }
.ea-badge-urgency--medium { background: #FEF3C7; color: #92400E; }
.ea-badge-urgency--low    { background: var(--ea-bg-mid); color: var(--ea-forest-green); }

/* ================================================================
   Species cards
   ================================================================ */
.ea-species-card {
    display: flex;
    flex-direction: column;
    background: #fff;
    border: 1.5px solid rgba(22,101,52,0.1);
    border-radius: 14px;
    overflow: hidden;
    text-decoration: none;
    color: var(--ea-charcoal);
    transition: box-shadow 0.2s, transform 0.2s;
}
.ea-species-card:hover {
    box-shadow: var(--ea-shadow-md);
    transform: translateY(-4px);
    text-decoration: none;
}
.ea-species-card__img,
.ea-species-card img { width: 100%; aspect-ratio: 3/2; object-fit: cover; display: block; }
.ea-species-card__body { padding: 16px 18px 18px; }
.ea-species-card h3    { font-size: 17px; margin: 0 0 5px; color: var(--ea-forest-green); }
.ea-species-card p     { font-size: 13px; color: var(--ea-stone-gray); margin: 0; line-height: 1.5; }

/* ================================================================
   About teaser
   ================================================================ */
.ea-about-teaser {
    display: grid;
    grid-template-columns: 1fr 1.8fr;
    gap: 60px;
    align-items: center;
}
.ea-about-teaser__photo { border-radius: 16px; overflow: hidden; box-shadow: var(--ea-shadow-md); }
.ea-about-teaser__text h2 { margin-bottom: 16px; }
.ea-about-teaser__text p  { color: var(--ea-stone-gray); margin-bottom: 18px; }

/* ================================================================
   Values grid
   ================================================================ */
.ea-values-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
    margin-top: 28px;
}
.ea-value-item {
    padding: 24px 26px;
    background: #fff;
    border-left: 5px solid var(--ea-bright-green);
    border-radius: 0 12px 12px 0;
    box-shadow: var(--ea-shadow-sm);
}
.ea-value-item h3 { font-size: 17px; margin: 0 0 8px; color: var(--ea-forest-green); }
.ea-value-item p  { font-size: 14px; color: var(--ea-stone-gray); margin: 0; line-height: 1.65; }

/* ================================================================
   Newsletter
   ================================================================ */
.ea-newsletter {
    padding: 80px 0;
    background: var(--ea-grad-dark);
    text-align: center;
    position: relative;
    overflow: hidden;
}
.ea-newsletter::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image: radial-gradient(circle at 50% 0%, rgba(34,197,94,0.1) 0%, transparent 60%);
    pointer-events: none;
}
.ea-newsletter h2 { color: #fff; position: relative; z-index: 1; }
.ea-newsletter p  { color: rgba(255,255,255,0.75); font-size: 17px; max-width: 500px; margin: 14px auto 32px; position: relative; z-index: 1; }

/* ================================================================
   Prose (article body)
   ================================================================ */
.ea-prose {
    font-size: 17px;
    line-height: 1.8;
    color: var(--ea-charcoal);
}
.ea-prose h2 { font-size: 26px; margin: 40px 0 16px; }
.ea-prose h3 { font-size: 21px; margin: 32px 0 12px; }
.ea-prose p  { margin: 0 0 20px; }
.ea-prose ul, .ea-prose ol { margin: 0 0 20px; padding-left: 24px; }
.ea-prose li { margin-bottom: 8px; }
.ea-prose a  { color: var(--ea-mid-green); font-weight: 500; }
.ea-prose blockquote {
    border-left: 4px solid var(--ea-bright-green);
    padding: 12px 20px;
    margin: 24px 0;
    background: var(--ea-bg-light);
    border-radius: 0 8px 8px 0;
    font-style: italic;
    color: var(--ea-stone-gray);
}

/* ================================================================
   Callout box
   ================================================================ */
.ea-callout {
    border-left: 4px solid var(--ea-bright-green);
    background: var(--ea-bg-light);
    border-radius: 0 10px 10px 0;
    padding: 18px 22px;
    margin: 24px 0;
}
.ea-callout--orange { border-left-color: var(--ea-orange); background: #FFF7ED; }
.ea-callout--red    { border-left-color: #EF4444; background: #FEF2F2; }

/* ================================================================
   Section divider
   ================================================================ */
.ea-divider {
    width: 56px;
    height: 4px;
    background: var(--ea-grad-green);
    border-radius: 2px;
    margin: 0 0 24px;
}

/* ================================================================
   Responsive — tablet (≤900px)
   ================================================================ */
@media (max-width: 900px) {
    .ea-card-grid--3,
    .ea-card-grid--4    { grid-template-columns: repeat(2, 1fr); }
    .ea-component-grid  { grid-template-columns: repeat(2, 1fr); }
    .ea-symptom-grid    { grid-template-columns: repeat(2, 1fr); }
    .ea-about-teaser    { grid-template-columns: 1fr; gap: 32px; }
    .ea-hero__inner     { grid-template-columns: 1fr; padding: 48px 0 48px; min-height: unset; }
    .ea-hero__text h1   { font-size: 38px; }
    .ea-stats-bar       { grid-template-columns: repeat(2, 1fr); }
    .ea-cycle-steps     { grid-template-columns: repeat(3, 1fr); }
    .ea-why-grid        { grid-template-columns: 1fr; }
    h1                  { font-size: 36px; }
    h2                  { font-size: 26px; }
}

/* ================================================================
   Responsive — mobile (≤600px)
   ================================================================ */
@media (max-width: 600px) {
    .ea-card-grid--2,
    .ea-card-grid--3,
    .ea-card-grid--4  { grid-template-columns: 1fr; }
    .ea-component-grid { grid-template-columns: repeat(2, 1fr); }
    .ea-values-grid   { grid-template-columns: 1fr; }
    .ea-section       { padding: 52px 0; }
    .ea-container     { padding-left: 16px; padding-right: 16px; }
    .ea-hero__text h1 { font-size: 30px; }
    .ea-cycle-steps   { grid-template-columns: repeat(2, 1fr); }
    .ea-stats-bar     { grid-template-columns: repeat(2, 1fr); }
    h1 { font-size: 30px; }
    h2 { font-size: 22px; }
    .ea-btn { padding: 11px 20px; font-size: 14px; }
}
