/* === CareLifePro: Cards v2 (consolidated) === */
:root{
  --card-bg:#ffffff;
  --card-border:rgba(0,0,0,.10);
  --card-radius:16px;
  --card-shadow:0 10px 30px rgba(0,0,0,.10);
  --title-size:1.05rem;
  --text-size:.94rem;
  --muted:#666;
  --card-text:#222;
  --gold-accent:#d9bf75;
}

/* Sections */
.clp-section{padding-block:28px;margin:0;position:relative;border-top:0}
/* removed spacing between sections per request */

/* Kill pseudo lines from any legacy styles */
.clp-section::before,.clp-section::after{content:none;border:0;height:0}

/* Head */
.clp-section__head{display:flex;flex-direction:column;gap:8px;align-items:center;text-align:center;margin-bottom:16px}
.clp-section .clp-section__title{margin:0;font-size:1.6rem;color:var(--gold-accent)}
.clp-section__subtitle{margin:0;color:var(--muted)}

/* Grid */
.clp-grid{display:grid;gap:16px;grid-template-columns:repeat(12,1fr)}
.clp-grid--3 > *{grid-column:span 4}
.clp-grid--2 > *{grid-column:span 6}
@media(max-width:992px){.clp-grid--3 > *{grid-column:span 6}}
@media(max-width:640px){.clp-grid--3 > *, .clp-grid--2 > *{grid-column:1/-1}}

/* Card */
.clp-card{background:var(--card-bg);border:1px solid var(--card-border);border-radius:var(--card-radius);
  overflow:hidden;box-shadow:var(--card-shadow);display:flex;flex-direction:column;transition:transform .18s ease, box-shadow .18s ease;color:var(--card-text);}
.clp-card:hover,.clp-card:focus-within{transform:translateY(-2px)}
.clp-card__media{position:relative;display:block;aspect-ratio:3/2;overflow:hidden}
.clp-card__media img{width:100%;height:100%;object-fit:cover;display:block}
.clp-card__body{padding:14px 16px;display:flex;flex-direction:column;flex:1}
.clp-card__title{font-size:var(--title-size);line-height:1.35;margin:0 0 6px}
.clp-card__title a{text-decoration:none}
.clp-card__title a:focus{outline:2px solid currentColor;outline-offset:2px}
.clp-card__meta{display:flex;gap:12px;align-items:center;color:var(--muted);font-size:.88rem;margin:0 0 8px;padding:0;list-style:none}
.clp-card__excerpt{font-size:var(--text-size);color:var(--card-text);margin:0 0 12px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.clp-card__cta{display:inline-flex;gap:8px;align-items:center;border:1px solid var(--card-border);padding:8px 12px;border-radius:10px;text-decoration:none;margin-top:auto}

/* Recipe modifiers */
.clp-card--recipe .clp-card__media{aspect-ratio:4/3}
.clp-badge{position:absolute;inset-inline-start:10px;inset-block-start:10px;background:var(--gold-accent);color:#000;padding:4px 8px;border-radius:999px;font-size:.72rem}

/* Section CTA */
.clp-section__cta{display:flex;justify-content:center;margin-top:16px}
.clp-btn{border:1px solid var(--card-border);background:#fff;padding:10px 14px;border-radius:999px;text-decoration:none}


/* === Equal-height cards & hero mobile stability (final) === */

/* Grid/items fill height */
.clp-grid { align-items: stretch; }
.clp-grid > * { height: 100%; }

/* Card fills its grid cell */
.clp-card { height: 100%; display:flex; flex-direction:column; }
.clp-card__body { display:flex; flex-direction:column; flex:1; }

/* Fixed blocks for title/meta/excerpt to normalize heights */
.clp-card__title{
  display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2;
  overflow:hidden; line-height:1.35;
  min-height: calc(2 * 1.35em);
}
.clp-card__meta{ min-height: 1.8em; }
.clp-card__excerpt{
  display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:3;
  overflow:hidden; line-height:1.25;
  min-height: calc(3 * 1.25em);
}
.clp-card__cta{ margin-top:auto; }

/* HERO stability on mobile (avoid 100vh jumps & parallax jitters) */
.hero, .clp-hero{
  position: relative;
  background-attachment: scroll !important;
  min-height: 60svh;
}
@supports (height: 100dvh){
  .hero, .clp-hero{ min-height: 100dvh; }
}
.hero__media, .clp-hero__media{ width:100%; height:100%; aspect-ratio:16/9; overflow:hidden; }
.hero__media img, .clp-hero__media img{ width:100%; height:100%; object-fit:cover; object-position:center; display:block; }
.hero, .clp-hero, .hero__media, .clp-hero__media, .hero__media img, .clp-hero__media img{ transform:none !important; }

@media (max-width: 992px){
  .hero, .clp-hero{ background-attachment: scroll !important; }
}


/* === Equalize card heights strictly (titles/meta/excerpts) === */
:root{ --clp-title-lines:2; --clp-excerpt-lines:3; }

.clp-card__title{
  display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:var(--clp-title-lines);
  overflow:hidden; line-height:1.35;
  min-height: calc(var(--clp-title-lines) * 1.35em);
  max-height: calc(var(--clp-title-lines) * 1.35em);
}

.clp-card__meta{
  display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:1;
  overflow:hidden; line-height:1.2;
  height: 1.8em; /* ثابت */
}

.clp-card__excerpt{
  display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:var(--clp-excerpt-lines);
  overflow:hidden; line-height:1.25;
  min-height: calc(var(--clp-excerpt-lines) * 1.25em);
  max-height: calc(var(--clp-excerpt-lines) * 1.25em);
}


/* === CLP Cards: refined typography & spacing (comfortable) === */

/* Ensure grid items stretch uniformly */
.clp-grid{ align-items: stretch; }
.clp-grid > *{ height: 100%; }

/* Card body comfortable padding */
.clp-card__body{ padding: 20px; display:flex; flex-direction:column; flex:1; }

/* Title: 2 lines max, clearer rhythm */
.clp-card__title{
  font-size: 1.05rem;
  line-height: 1.3;
  display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2;
  overflow:hidden;
  margin: 0 0 10px;
  min-height: calc(2 * 1.3em);
  max-height: calc(2 * 1.3em);
}

/* Meta: lighter, single line */
.clp-card__meta{
  font-size: .85rem;
  color: var(--card-muted);
  display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:1;
  overflow:hidden;
  line-height: 1.3;
  margin: 0 0 10px;
  height: 1.8em;
}

/* Excerpt: 2 lines, readable leading */
.clp-card__excerpt{
  font-size: .95rem;
  line-height: 1.5;
  display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2;
  overflow:hidden;
  margin: 0 0 12px;
  min-height: calc(2 * 1.5em);
  max-height: calc(2 * 1.5em);
}

/* CTA stays at bottom */
.clp-card__cta{ margin-top: auto; font-size: .9rem; }