/* Plants Home Variant */

/* ── Shared ── */
.plt-section { padding: 60px 0; }
.plt-section--bg { background: #f4faf4; }
.plt-section-head { text-align: center; margin-bottom: 40px; }
.plt-eyebrow { font-size: 13px; color: var(--molla-accent, #4a8f3f); font-style: italic; font-weight: 500; margin-bottom: 6px; display: block; }
.plt-section-title { font-size: 26px; font-weight: 800; color: #2d2d2d; text-transform: uppercase; letter-spacing: 1px; margin: 0; }
.plt-section-title--underline { border-bottom: 3px solid var(--molla-accent, #4a8f3f); display: inline-block; padding-bottom: 6px; }
.plt-dots { display: flex; justify-content: center; gap: 5px; margin-top: 10px; }
.plt-dots span { width: 8px; height: 8px; border-radius: 50%; background: var(--molla-accent, #4a8f3f); }
.plt-dots span:nth-child(2) { background: #a8d5a0; }
.plt-dots span:nth-child(3) { background: #a8d5a0; }
.plt-dots span:nth-child(4) { background: var(--molla-accent, #4a8f3f); }

.plt-btn-primary {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 13px 32px; background: var(--molla-accent, #4a8f3f); color: #fff;
  font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: 1px;
  text-decoration: none; border-radius: 4px; transition: background .2s, transform .15s;
}
.plt-btn-primary:hover { background: #3a7030; color: #fff; transform: translateY(-1px); }

/* ── Hero ── */
.plt-hero { padding: 40px 0 0; background: #f9fdf9; overflow: hidden; }
.plt-hero-inner { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 40px; min-height: 420px; }
.plt-hero-img-wrap { position: relative; display: flex; align-items: center; justify-content: center; }
.plt-hero-img-bg { position: absolute; inset: 20px; background: #e8f5e9; border-radius: 50%; z-index: 0; }
.plt-hero-main-img { position: relative; z-index: 1; max-height: 400px; object-fit: contain; }
.plt-hero-img-placeholder { width: 300px; height: 360px; background: #e8f5e9; border-radius: 12px; display: flex; align-items: center; justify-content: center; font-size: 80px; color: #a8d5a0; position: relative; z-index: 1; }
.plt-hero-leaf { position: absolute; font-size: 48px; color: var(--molla-accent, #4a8f3f); opacity: .25; z-index: 0; }
.plt-hero-leaf--tl { top: 0; left: 0; transform: rotate(-30deg); }
.plt-hero-leaf--tr { top: 10px; right: 0; font-size: 36px; opacity: .15; }
.plt-hero-leaf--br { bottom: 10px; right: 20px; font-size: 28px; opacity: .2; }
.plt-hero-content { padding: 20px 0; }
.plt-hero-title { font-size: 2.4rem; font-weight: 800; color: #2d2d2d; line-height: 1.25; margin: 10px 0 18px; }
.plt-hero-sub { font-size: 14px; color: #666; line-height: 1.7; margin-bottom: 28px; }

/* ── Product Card (trending) ── */
.plt-trending-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 20px; }
.plt-product-card { background: #fff; border: 1px solid #eee; border-radius: 8px; overflow: hidden; transition: box-shadow .2s, transform .2s; }
.plt-product-card:hover { box-shadow: 0 6px 24px rgba(74,143,63,.12); transform: translateY(-3px); }
.plt-product-img-wrap { display: block; position: relative; aspect-ratio: 1; overflow: hidden; background: #f9fdf9; }
.plt-product-img-wrap img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.plt-product-card:hover .plt-product-img-wrap img { transform: scale(1.05); }
.plt-product-placeholder { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; font-size: 48px; color: #c8e6c9; background: #f1f8f1; }
.plt-product-badge-wrap { position: absolute; top: 8px; left: 8px; }
.plt-badge-sale { background: var(--molla-accent, #4a8f3f); color: #fff; font-size: 10px; font-weight: 700; padding: 3px 8px; border-radius: 3px; text-transform: uppercase; }
.plt-product-info { padding: 12px; }
.plt-stars { margin-bottom: 5px; }
.plt-product-name { display: block; font-size: 13px; font-weight: 600; color: #333; text-decoration: none; margin-bottom: 6px; line-height: 1.4; transition: color .15s; }
.plt-product-name:hover { color: var(--molla-accent, #4a8f3f); }
.plt-product-price { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; }
.plt-price-new { font-size: 15px; font-weight: 800; color: var(--molla-accent, #4a8f3f); }
.plt-price-old { font-size: 12px; color: #aaa; text-decoration: line-through; }
.plt-product-offer { font-size: 11px; color: #666; margin: 0; display: flex; align-items: center; gap: 5px; }
.plt-offer-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--molla-accent, #4a8f3f); display: inline-block; flex-shrink: 0; }

/* ── Special (tabs) ── */
.plt-tabs { display: flex; justify-content: center; gap: 0; margin-bottom: 32px; border-bottom: 2px solid #e0ede0; }
.plt-tab-btn { background: none; border: none; padding: 10px 28px; font-size: 13px; font-weight: 600; color: #888; cursor: pointer; border-bottom: 3px solid transparent; margin-bottom: -2px; transition: color .15s, border-color .15s; text-transform: uppercase; letter-spacing: .5px; }
.plt-tab-btn.active { color: var(--molla-accent, #4a8f3f); border-bottom-color: var(--molla-accent, #4a8f3f); }
.plt-tab-pane { display: none; }
.plt-tab-pane.active { display: block; }
.plt-special-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.plt-special-card { background: #fff; border-radius: 8px; overflow: hidden; border: 1px solid #eee; transition: box-shadow .2s; }
.plt-special-card:hover { box-shadow: 0 4px 16px rgba(74,143,63,.1); }
.plt-special-img { display: block; aspect-ratio: 4/3; overflow: hidden; position: relative; }
.plt-special-img img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.plt-special-card:hover .plt-special-img img { transform: scale(1.05); }
.plt-special-info { padding: 14px; }

/* ── Category grid ── */
.plt-cat-grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 16px; }
.plt-cat-card { display: block; text-decoration: none; text-align: center; }
.plt-cat-card img { width: 100%; aspect-ratio: 1; object-fit: cover; border-radius: 50%; border: 3px solid #e8f5e9; transition: border-color .2s; }
.plt-cat-card:hover img { border-color: var(--molla-accent, #4a8f3f); }
.plt-cat-placeholder { width: 100%; aspect-ratio: 1; border-radius: 50%; background: #e8f5e9; display: flex; align-items: center; justify-content: center; font-size: 36px; color: #a8d5a0; border: 3px solid #c8e6c9; }
.plt-cat-name { display: block; margin-top: 10px; font-size: 13px; font-weight: 600; color: #333; transition: color .15s; }
.plt-cat-card:hover .plt-cat-name { color: var(--molla-accent, #4a8f3f); }

/* ── Blog ── */
.plt-blog-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; }
.plt-blog-card { display: block; text-decoration: none; color: inherit; }
.plt-blog-img { aspect-ratio: 4/3; overflow: hidden; border-radius: 8px; margin-bottom: 16px; }
.plt-blog-img img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.plt-blog-card:hover .plt-blog-img img { transform: scale(1.04); }
.plt-blog-date { font-size: 12px; color: var(--molla-accent, #4a8f3f); margin-bottom: 8px; display: block; }
.plt-blog-title { font-size: 15px; font-weight: 700; color: #2d2d2d; line-height: 1.5; margin: 0; transition: color .15s; }
.plt-blog-card:hover .plt-blog-title { color: var(--molla-accent, #4a8f3f); }

/* ── Instagram ── */
.plt-insta-section { padding: 40px 0 0; }
.plt-insta-title { text-align: center; font-size: 24px; font-weight: 800; text-transform: uppercase; color: #2d2d2d; margin-bottom: 24px; }
.plt-insta-grid { display: grid; grid-template-columns: repeat(6, 1fr); }
.plt-insta-item { position: relative; aspect-ratio: 1; overflow: hidden; cursor: pointer; }
.plt-insta-item .plt-product-placeholder { border-radius: 0; }
.plt-insta-overlay { position: absolute; inset: 0; background: rgba(74,143,63,.5); display: flex; align-items: center; justify-content: center; font-size: 28px; color: #fff; opacity: 0; transition: opacity .25s; }
.plt-insta-item:hover .plt-insta-overlay { opacity: 1; }

/* ── Newsletter ── */
.plt-nl-section { padding: 48px 0; background: var(--molla-accent, #4a8f3f); }
.plt-nl-inner { display: flex; align-items: center; justify-content: space-between; gap: 32px; }
.plt-nl-title { font-size: 22px; font-weight: 800; color: #fff; text-transform: uppercase; margin: 0 0 6px; }
.plt-nl-sub { font-size: 13px; color: rgba(255,255,255,.8); margin: 0; }
.plt-nl-form { display: flex; min-width: 400px; }
.plt-nl-input { flex: 1; border: none; padding: 13px 18px; font-size: 13px; outline: none; border-radius: 4px 0 0 4px; }
.plt-nl-btn { padding: 13px 24px; background: #2d2d2d; color: #fff; border: none; font-size: 13px; font-weight: 700; text-transform: uppercase; cursor: pointer; border-radius: 0 4px 4px 0; transition: background .2s; }
.plt-nl-btn:hover { background: #111; }

/* ── Responsive ── */
@media (max-width: 1200px) {
  .plt-trending-grid { grid-template-columns: repeat(4, 1fr); }
  .plt-cat-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 992px) {
  .plt-hero-inner { grid-template-columns: 1fr; text-align: center; }
  .plt-hero-img-wrap { order: -1; }
  .plt-trending-grid { grid-template-columns: repeat(3, 1fr); }
  .plt-special-grid { grid-template-columns: repeat(2, 1fr); }
  .plt-insta-grid { grid-template-columns: repeat(3, 1fr); }
  .plt-nl-inner { flex-direction: column; text-align: center; }
  .plt-nl-form { min-width: unset; width: 100%; max-width: 440px; }
}
@media (max-width: 768px) {
  .plt-trending-grid { grid-template-columns: repeat(2, 1fr); }
  .plt-blog-grid { grid-template-columns: 1fr 1fr; }
  .plt-cat-grid { grid-template-columns: repeat(3, 1fr); }
  .plt-hero-title { font-size: 1.8rem; }
}
@media (max-width: 480px) {
  .plt-trending-grid { grid-template-columns: repeat(2, 1fr); gap: 12px; }
  .plt-special-grid { grid-template-columns: repeat(2, 1fr); gap: 12px; }
  .plt-blog-grid { grid-template-columns: 1fr; }
  .plt-insta-grid { grid-template-columns: repeat(3, 1fr); }
  .plt-cat-grid { grid-template-columns: repeat(3, 1fr); gap: 10px; }
  .plt-nl-form { flex-direction: column; }
  .plt-nl-input { border-radius: 4px; margin-bottom: 8px; }
  .plt-nl-btn { border-radius: 4px; }
}