﻿/* =============================================================
   CASAGLOW HOMEPAGE STYLES v2.0
   Premium Green Design System
   ============================================================= */

/* --- Global helpers --- */
.bytora-container       { max-width: var(--bytora-container-xl); margin: 0 auto; padding: 0 var(--bytora-space-6); }
.bytora-container--narrow { max-width: 800px; margin: 0 auto; padding: 0 var(--bytora-space-6); }
.bytora-section         { padding: var(--bytora-space-20) 0; }
.bytora-section--gray   { background-color: var(--bytora-gray-100); }

.bytora-section-header  { display: flex; align-items: center; flex-wrap: wrap; gap: var(--bytora-space-3); margin-bottom: var(--bytora-space-10); }
.bytora-section-header--center { flex-direction: column; text-align: center; }
.bytora-section-title   { font-family: var(--bytora-font-heading); font-size: var(--bytora-text-3xl); font-weight: var(--bytora-font-bold); color: var(--bytora-gray-900); margin: 0; }
.bytora-section-subtitle{ font-family: var(--bytora-font-primary); color: var(--bytora-gray-600); font-size: var(--bytora-text-base); margin: var(--bytora-space-2) 0 0; }
.bytora-section-link    { margin-left: auto; display: inline-flex; align-items: center; gap: 6px; font-family: var(--bytora-font-heading); font-size: var(--bytora-text-sm); font-weight: var(--bytora-font-semibold); color: #2E7D32; white-space: nowrap; text-decoration: none; transition: color var(--bytora-transition-fast); }
.bytora-section-link:hover { color: #1B5E20; }

/* --- Buttons --- */
.bytora-btn             { display: inline-flex; align-items: center; gap: var(--bytora-space-2); padding: var(--bytora-space-3) var(--bytora-space-6); font-family: var(--bytora-font-button); font-size: var(--bytora-text-sm); font-weight: var(--bytora-font-semibold); border-radius: var(--bytora-radius-md); border: 2px solid transparent; cursor: pointer; transition: all var(--bytora-transition-base); text-decoration: none; white-space: nowrap; }
.bytora-btn--primary    { background-color: #2E7D32; border-color: #2E7D32; color: #fff; }
.bytora-btn--primary:hover { background-color: #1B5E20; border-color: #1B5E20; color: #fff; transform: translateY(-1px); box-shadow: var(--bytora-shadow-md); }
.bytora-btn--outline    { background-color: transparent; border-color: #2E7D32; color: #2E7D32; }
.bytora-btn--outline:hover { background-color: #2E7D32; color: #fff; transform: translateY(-1px); }
.bytora-btn--white      { background-color: #fff; border-color: #fff; color: #2E7D32; }
.bytora-btn--white:hover{ background-color: #f0f7f0; color: #1B5E20; }
.bytora-btn--sm         { padding: var(--bytora-space-2) var(--bytora-space-4); font-size: var(--bytora-text-xs); }
.bytora-btn--lg         { padding: var(--bytora-space-4) var(--bytora-space-8); font-size: var(--bytora-text-base); }

/* =============================================================
   HERO
   ============================================================= */
.bytora-hero            { background: linear-gradient(135deg, #1B5E20 0%, #2E7D32 60%, #388E3C 100%); min-height: 600px; display: flex; align-items: center; position: relative; overflow: hidden; }
.bytora-hero__inner     { max-width: var(--bytora-container-xl); margin: 0 auto; padding: var(--bytora-space-20) var(--bytora-space-6); display: grid; grid-template-columns: 1fr 1fr; gap: var(--bytora-space-16); align-items: center; width: 100%; }
.bytora-hero__badge     { display: inline-block; background: rgba(255,255,255,0.15); border: 1px solid rgba(255,255,255,0.35); color: #fff; padding: var(--bytora-space-1) var(--bytora-space-4); border-radius: var(--bytora-radius-full); font-family: var(--bytora-font-button); font-size: var(--bytora-text-sm); font-weight: var(--bytora-font-semibold); margin-bottom: var(--bytora-space-4); letter-spacing: 0.05em; text-transform: uppercase; }
.bytora-hero__title     { font-family: var(--bytora-font-heading); font-size: var(--bytora-text-6xl); font-weight: var(--bytora-font-extrabold); color: #fff; line-height: 1.1; margin-bottom: var(--bytora-space-6); }
.bytora-hero__title--accent { color: rgba(255,255,255,0.85); }
.bytora-hero__subtitle  { font-family: var(--bytora-font-primary); font-size: var(--bytora-text-lg); color: rgba(255,255,255,0.85); line-height: var(--bytora-leading-relaxed); margin-bottom: var(--bytora-space-8); max-width: 480px; }
.bytora-hero__actions   { display: flex; gap: var(--bytora-space-4); flex-wrap: wrap; margin-bottom: var(--bytora-space-10); }
.bytora-hero__stats     { display: flex; gap: var(--bytora-space-8); flex-wrap: wrap; }
.bytora-hero__stat      { display: flex; align-items: center; gap: var(--bytora-space-2); }
.bytora-hero__stat svg  { opacity: 0.80; }
.bytora-hero__stat span { font-family: var(--bytora-font-primary); font-size: var(--bytora-text-sm); color: rgba(255,255,255,0.85); }
.bytora-hero__image     { display: flex; align-items: center; justify-content: center; }
.bytora-hero__img       { width: 100%; height: 100%; object-fit: cover; border-radius: var(--bytora-radius-xl); display: block; max-height: 500px; box-shadow: 0 20px 60px rgba(0,0,0,0.25); }
.bytora-hero__image-placeholder { background: rgba(255,255,255,0.08); border: 2px dashed rgba(255,255,255,0.25); border-radius: var(--bytora-radius-xl); width: 100%; aspect-ratio: 1; max-width: 480px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: var(--bytora-space-4); color: rgba(255,255,255,0.45); text-align: center; padding: var(--bytora-space-8); }

/* =============================================================
   FEATURE CARDS — Premium Quality / Fast Shipping / Secure / Returns
   ============================================================= */
.bytora-feature-cards {
    background: #fff;
    border-bottom: 1px solid var(--bytora-gray-200);
    padding: var(--bytora-space-10) 0;
}
.bytora-feature-cards__grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--bytora-space-5);
    list-style: none;
    margin: 0;
    padding: 0;
}
.bytora-feature-card {
    display: flex;
    align-items: flex-start;
    gap: var(--bytora-space-4);
    padding: var(--bytora-space-6);
    background: #fff;
    border: 1px solid var(--bytora-gray-200);
    border-radius: var(--bytora-radius-lg);
    box-shadow: 0 1px 4px rgba(0,0,0,0.05);
    transition: box-shadow var(--bytora-transition-base), transform var(--bytora-transition-base), border-color var(--bytora-transition-base);
}
.bytora-feature-card:hover {
    box-shadow: 0 4px 16px rgba(46,125,50,0.10);
    transform: translateY(-2px);
    border-color: #A5D6A7;
}
.bytora-feature-card__icon-wrap {
    width: 52px;
    height: 52px;
    background: var(--bytora-primary-light);
    border-radius: var(--bytora-radius-md);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #2E7D32;
    flex-shrink: 0;
}
.bytora-feature-card__body {
    display: flex;
    flex-direction: column;
    gap: var(--bytora-space-1);
}
.bytora-feature-card__title {
    font-family: var(--bytora-font-heading);
    font-size: var(--bytora-text-sm);
    font-weight: var(--bytora-font-semibold);
    color: var(--bytora-gray-900);
    margin: 0;
    line-height: 1.3;
}
.bytora-feature-card__desc {
    font-family: var(--bytora-font-primary);
    font-size: var(--bytora-text-xs);
    color: var(--bytora-gray-600);
    line-height: 1.55;
    margin: 0;
}

/* =============================================================
   CATEGORIES — Circular Premium Cards (Shopify-style)
   ============================================================= */

/* Scroll wrapper — enables horizontal scroll on mobile */
.cg-cats-scroll-wrap {
    overflow-x: auto;
    overflow-y: visible;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none; /* Firefox */
    padding-bottom: 8px;
    /* Scroll snap for smooth mobile swipe */
    scroll-snap-type: x mandatory;
}
.cg-cats-scroll-wrap::-webkit-scrollbar { display: none; } /* Chrome/Safari */

/* Horizontal track */
.cg-cats-track {
    display: flex;
    gap: 28px;
    list-style: none;
    margin: 0;
    padding: 12px 4px 16px; /* vertical padding so shadows aren't clipped */
    width: max-content; /* allow track to exceed container on mobile */
}

/* Individual card */
.cg-cat-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    scroll-snap-align: start;
    flex-shrink: 0;
    width: 140px; /* fixed width for consistency */
}

/* Entire card is the link */
.cg-cat-card__link {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 14px;
    text-decoration: none;
    width: 100%;
}

/* ── Circle image ──────────────────────────────────────────── */
.cg-cat-card__circle {
    width: 130px;
    height: 130px;
    border-radius: 50%;
    overflow: hidden;
    background: var(--bytora-gray-100);
    border: 3px solid #E5E7EB;
    box-shadow: 0 4px 14px rgba(0,0,0,0.08);
    position: relative;
    transition:
        border-color  300ms ease,
        box-shadow    300ms ease,
        transform     300ms cubic-bezier(0.34,1.56,0.64,1);
    will-change: transform;
}

/* Hover — scale up + green border + green glow */
.cg-cat-card__link:hover .cg-cat-card__circle,
.cg-cat-card__link:focus-visible .cg-cat-card__circle {
    border-color: #2E7D32;
    box-shadow:
        0 0 0 4px rgba(46,125,50,0.12),
        0 8px 24px rgba(46,125,50,0.18);
    transform: scale(1.08);
}

/* Product image inside circle */
.cg-cat-card__img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 400ms ease;
}
.cg-cat-card__link:hover .cg-cat-card__img,
.cg-cat-card__link:focus-visible .cg-cat-card__img {
    transform: scale(1.10);
}

/* Placeholder when no image */
.cg-cat-card__placeholder {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--bytora-primary-light);
    color: #2E7D32;
}

/* ── Label ──────────────────────────────────────────────────── */
.cg-cat-card__label {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 3px;
    text-align: center;
}

.cg-cat-card__name {
    font-family: var(--bytora-font-heading);
    font-size: 0.875rem;
    font-weight: 600;
    color: #1E1E1E;
    line-height: 1.3;
    transition: color 200ms ease;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 130px;
}
.cg-cat-card__link:hover .cg-cat-card__name,
.cg-cat-card__link:focus-visible .cg-cat-card__name {
    color: #2E7D32;
}

.cg-cat-card__count {
    font-family: var(--bytora-font-primary);
    font-size: 0.75rem;
    color: #9CA3AF;
    font-weight: 400;
}

/* ── Footer view-all button ─────────────────────────────────── */
.cg-cats-footer {
    display: flex;
    justify-content: center;
    margin-top: var(--bytora-space-10);
}

/* ── Desktop: limit to 8 per row, centered ─────────────────── */
@media (min-width: 1025px) {
    .cg-cats-scroll-wrap {
        overflow: visible;
    }
    .cg-cats-track {
        width: auto;
        flex-wrap: wrap;
        justify-content: center;
        gap: 32px;
        padding: 12px 0 20px;
    }
    .cg-cat-card {
        width: 140px;
    }
}

/* ── Tablet ─────────────────────────────────────────────────── */
@media (min-width: 769px) and (max-width: 1024px) {
    .cg-cats-track { gap: 24px; }
    .cg-cat-card { width: 120px; }
    .cg-cat-card__circle { width: 110px; height: 110px; }
}

/* ── Mobile ─────────────────────────────────────────────────── */
@media (max-width: 768px) {
    .cg-cats-track { gap: 20px; padding: 10px 8px 16px; }
    .cg-cat-card { width: 110px; }
    .cg-cat-card__circle { width: 100px; height: 100px; border-width: 2px; }
    .cg-cat-card__name { font-size: 0.8125rem; max-width: 100px; }
}

@media (max-width: 480px) {
    .cg-cats-track { gap: 16px; }
    .cg-cat-card { width: 96px; }
    .cg-cat-card__circle { width: 88px; height: 88px; }
    .cg-cat-card__name { font-size: 0.75rem; max-width: 90px; }
}


/* =============================================================
   PRODUCTS GRID
   ============================================================= */
.bytora-products-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: var(--bytora-space-6); list-style: none; margin: 0; padding: 0; }
.bytora-product-card  { background: #fff; border-radius: var(--bytora-radius-lg); border: 1px solid var(--bytora-gray-200); box-shadow: var(--bytora-shadow-card); overflow: hidden; transition: all var(--bytora-transition-base); }
.bytora-product-card:hover { box-shadow: var(--bytora-shadow-hover); transform: translateY(-3px); border-color: var(--bytora-gray-300); }
.bytora-product-card__inner { display: flex; flex-direction: column; height: 100%; }
.bytora-product-card__image-wrap { position: relative; aspect-ratio: 1; overflow: hidden; background: var(--bytora-gray-100); }
.bytora-product-card__image { width: 100%; height: 100%; object-fit: cover; transition: transform var(--bytora-transition-slow); }
.bytora-product-card:hover .bytora-product-card__image { transform: scale(1.04); }
.bytora-product-card__badge { position: absolute; top: var(--bytora-space-3); left: var(--bytora-space-3); padding: 4px 10px; border-radius: var(--bytora-radius-full); font-size: 11px; font-weight: var(--bytora-font-bold); line-height: 1; }
.bytora-badge--sale { background: #2E7D32; color: #fff; }
.bytora-badge--oos  { background: var(--bytora-gray-700); color: #fff; }
.bytora-product-card__body { padding: var(--bytora-space-4); flex: 1; display: flex; flex-direction: column; gap: var(--bytora-space-2); }
.bytora-product-card__title a { font-family: var(--bytora-font-heading); font-size: var(--bytora-text-sm); font-weight: var(--bytora-font-semibold); color: var(--bytora-gray-900); line-height: var(--bytora-leading-snug); text-decoration: none; }
.bytora-product-card__title a:hover { color: #2E7D32; }
.bytora-product-card__rating { display: flex; align-items: center; gap: 4px; }
.bytora-star { font-size: 14px; color: var(--bytora-gray-300); line-height: 1; }
.bytora-star--filled { color: var(--bytora-warning); }
.bytora-product-card__rating-count { font-family: var(--bytora-font-primary); font-size: var(--bytora-text-xs); color: var(--bytora-gray-500); }
.bytora-product-card__price { margin-top: auto; font-family: var(--bytora-font-heading); font-size: var(--bytora-text-lg); font-weight: var(--bytora-font-bold); color: #2E7D32; }
.bytora-product-card__price del { font-size: var(--bytora-text-sm); color: var(--bytora-gray-400); font-weight: normal; }
.bytora-product-card__footer { padding: 0 var(--bytora-space-4) var(--bytora-space-4); }
.bytora-product-card__footer .button,
.bytora-product-card__footer .add_to_cart_button { width: 100%; background: #2E7D32; color: #fff; border: none; border-radius: var(--bytora-radius-md); padding: var(--bytora-space-3); font-family: var(--bytora-font-button); font-size: var(--bytora-text-sm); font-weight: var(--bytora-font-semibold); cursor: pointer; transition: background var(--bytora-transition-fast); text-align: center; display: block; }
.bytora-product-card__footer .button:hover,
.bytora-product-card__footer .add_to_cart_button:hover { background: #1B5E20; }

/* =============================================================
   WHY CHOOSE US
   ============================================================= */
.bytora-why-us__grid { display: grid; grid-template-columns: repeat(3,1fr); gap: var(--bytora-space-8); list-style: none; margin: 0; padding: 0; }
.bytora-why-us__item { background: #fff; border-radius: var(--bytora-radius-lg); padding: var(--bytora-space-8); box-shadow: var(--bytora-shadow-card); border: 1px solid var(--bytora-gray-200); transition: all var(--bytora-transition-base); }
.bytora-why-us__item:hover { box-shadow: var(--bytora-shadow-hover); transform: translateY(-2px); border-color: var(--bytora-gray-300); }
.bytora-why-us__icon { width: 56px; height: 56px; background: var(--bytora-primary-light); border-radius: var(--bytora-radius-lg); display: flex; align-items: center; justify-content: center; color: #2E7D32; margin-bottom: var(--bytora-space-4); }
.bytora-why-us__title { font-family: var(--bytora-font-heading); font-size: var(--bytora-text-base); font-weight: var(--bytora-font-semibold); color: var(--bytora-gray-900); margin-bottom: var(--bytora-space-2); }
.bytora-why-us__text  { font-family: var(--bytora-font-primary); font-size: var(--bytora-text-sm); color: var(--bytora-gray-600); line-height: var(--bytora-leading-relaxed); margin: 0; }

/* =============================================================
   OFFER BANNER
   ============================================================= */
.bytora-offer-banner    { background: linear-gradient(135deg, #1B5E20 0%, #2E7D32 100%); padding: var(--bytora-space-16) 0; }
.bytora-offer-banner__inner { position: relative; display: flex; align-items: center; overflow: hidden; }
.bytora-offer-banner__content { position: relative; z-index: 1; max-width: 600px; }
.bytora-offer-banner__tag { display: inline-block; background: rgba(255,255,255,0.15); border: 1px solid rgba(255,255,255,0.30); color: #fff; padding: var(--bytora-space-1) var(--bytora-space-4); border-radius: var(--bytora-radius-full); font-family: var(--bytora-font-button); font-size: var(--bytora-text-xs); font-weight: var(--bytora-font-semibold); text-transform: uppercase; letter-spacing: 0.1em; margin-bottom: var(--bytora-space-4); }
.bytora-offer-banner__title { font-family: var(--bytora-font-heading); font-size: var(--bytora-text-4xl); font-weight: var(--bytora-font-extrabold); color: #fff; line-height: 1.15; margin-bottom: var(--bytora-space-4); }
.bytora-offer-banner__highlight { color: #fff; background: rgba(255,255,255,0.20); padding: 0 var(--bytora-space-2); border-radius: var(--bytora-radius-sm); }
.bytora-offer-banner__content p { font-family: var(--bytora-font-primary); color: rgba(255,255,255,0.85); margin-bottom: var(--bytora-space-8); font-size: var(--bytora-text-lg); }
.bytora-offer-banner__decoration { position: absolute; right: 0; top: 50%; transform: translateY(-50%); pointer-events: none; }
.bytora-offer-banner__circle { position: absolute; border-radius: 50%; background: rgba(255,255,255,0.06); }
.bytora-offer-banner__circle--1 { width: 300px; height: 300px; right: -60px; top: -80px; }
.bytora-offer-banner__circle--2 { width: 200px; height: 200px; right: 80px; top: -20px; }
.bytora-offer-banner__circle--3 { width: 120px; height: 120px; right: 200px; top: 40px; }

/* =============================================================
   TESTIMONIALS
   ============================================================= */
.bytora-testimonials__grid { display: grid; grid-template-columns: repeat(2,1fr); gap: var(--bytora-space-6); list-style: none; margin: 0; padding: 0; }
.bytora-testimonial-card { background: #fff; border-radius: var(--bytora-radius-lg); padding: var(--bytora-space-8); box-shadow: var(--bytora-shadow-card); border: 1px solid var(--bytora-gray-200); display: flex; flex-direction: column; gap: var(--bytora-space-4); transition: all var(--bytora-transition-base); }
.bytora-testimonial-card:hover { box-shadow: var(--bytora-shadow-hover); transform: translateY(-2px); }
.bytora-testimonial-card__stars { display: flex; gap: 4px; }
.bytora-testimonial-card__text { font-family: var(--bytora-font-primary); font-size: var(--bytora-text-base); color: var(--bytora-gray-700); line-height: var(--bytora-leading-relaxed); margin: 0; flex: 1; font-style: italic; }
.bytora-testimonial-card__footer { display: flex; align-items: center; gap: var(--bytora-space-3); }
.bytora-testimonial-card__avatar { width: 44px; height: 44px; border-radius: 50%; background: #2E7D32; color: #fff; display: flex; align-items: center; justify-content: center; font-family: var(--bytora-font-heading); font-size: var(--bytora-text-lg); font-weight: var(--bytora-font-bold); flex-shrink: 0; }
.bytora-testimonial-card__meta { flex: 1; }
.bytora-testimonial-card__meta strong { font-family: var(--bytora-font-heading); display: block; font-size: var(--bytora-text-sm); color: var(--bytora-gray-900); }
.bytora-testimonial-card__meta span { font-family: var(--bytora-font-primary); font-size: var(--bytora-text-xs); color: var(--bytora-gray-500); }
.bytora-testimonial-card__verified { display: flex; align-items: center; gap: 4px; font-family: var(--bytora-font-primary); font-size: var(--bytora-text-xs); color: #2E7D32; font-weight: var(--bytora-font-semibold); }

/* =============================================================
   NEWSLETTER
   ============================================================= */
.bytora-newsletter { background: #1B5E20; padding: var(--bytora-space-16) 0; }
.bytora-newsletter__inner { display: flex; align-items: center; gap: var(--bytora-space-12); }
.bytora-newsletter__icon { width: 80px; height: 80px; background: rgba(255,255,255,0.10); border-radius: var(--bytora-radius-xl); display: flex; align-items: center; justify-content: center; color: rgba(255,255,255,0.75); flex-shrink: 0; }
.bytora-newsletter__content h2 { font-family: var(--bytora-font-heading); font-size: var(--bytora-text-2xl); font-weight: var(--bytora-font-bold); color: #fff; margin-bottom: var(--bytora-space-2); }
.bytora-newsletter__content p  { font-family: var(--bytora-font-primary); color: rgba(255,255,255,0.65); margin: 0; font-size: var(--bytora-text-sm); }
.bytora-newsletter__form { flex: 1; min-width: 300px; }
.bytora-newsletter__input-wrap { display: flex; gap: 0; border-radius: var(--bytora-radius-md); overflow: hidden; box-shadow: var(--bytora-shadow-lg); }
.bytora-newsletter__input-wrap input { flex: 1; border: none; border-radius: 0; padding: var(--bytora-space-4) var(--bytora-space-5); font-family: var(--bytora-font-primary); font-size: var(--bytora-text-sm); background: #fff; outline: none; color: var(--bytora-gray-900); }
.bytora-newsletter__input-wrap .bytora-btn { border-radius: 0; border: none; padding: var(--bytora-space-4) var(--bytora-space-6); background: #2E7D32; color: #fff; }
.bytora-newsletter__input-wrap .bytora-btn:hover { background: #388E3C; }
.bytora-newsletter__note { font-family: var(--bytora-font-primary); font-size: var(--bytora-text-xs); color: rgba(255,255,255,0.40); margin: var(--bytora-space-3) 0 0; text-align: center; }

/* =============================================================
   FAQ
   ============================================================= */
.bytora-faq__list { display: flex; flex-direction: column; gap: var(--bytora-space-3); }
.bytora-faq__item { background: #fff; border-radius: var(--bytora-radius-lg); border: 1px solid var(--bytora-gray-200); overflow: hidden; transition: border-color var(--bytora-transition-fast); }
.bytora-faq__item:hover { border-color: var(--bytora-gray-300); }
.bytora-faq__question { width: 100%; display: flex; justify-content: space-between; align-items: center; gap: var(--bytora-space-4); padding: var(--bytora-space-5) var(--bytora-space-6); background: none; border: none; cursor: pointer; font-family: var(--bytora-font-heading); font-size: var(--bytora-text-base); font-weight: var(--bytora-font-semibold); color: var(--bytora-gray-900); text-align: left; transition: background var(--bytora-transition-fast); }
.bytora-faq__question:hover { background: var(--bytora-gray-100); }
.bytora-faq__question[aria-expanded="true"] { color: #2E7D32; }
.bytora-faq__icon { flex-shrink: 0; color: var(--bytora-gray-400); transition: transform var(--bytora-transition-base); }
.bytora-faq__question[aria-expanded="true"] .bytora-faq__icon { transform: rotate(180deg); color: #2E7D32; }
.bytora-faq__answer { padding: 0 var(--bytora-space-6) var(--bytora-space-5); }
.bytora-faq__answer p { font-family: var(--bytora-font-primary); font-size: var(--bytora-text-sm); color: var(--bytora-gray-600); line-height: var(--bytora-leading-relaxed); margin: 0; }

/* =============================================================
   BLOG PREVIEW
   ============================================================= */
.bytora-blog-preview-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--bytora-space-6); }
.bytora-blog-preview-card { background: #fff; border-radius: var(--bytora-radius-lg); border: 1px solid var(--bytora-gray-200); overflow: hidden; box-shadow: var(--bytora-shadow-card); transition: all var(--bytora-transition-base); display: flex; flex-direction: column; }
.bytora-blog-preview-card:hover { box-shadow: var(--bytora-shadow-hover); transform: translateY(-3px); }
.bytora-blog-preview-card__img-link { display: block; overflow: hidden; aspect-ratio: 16/9; }
.bytora-blog-preview-card__img-link img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.4s ease; display: block; }
.bytora-blog-preview-card:hover .bytora-blog-preview-card__img-link img { transform: scale(1.04); }
.bytora-blog-preview-card__no-img { aspect-ratio: 16/9; background: linear-gradient(135deg, #1B5E20, #2E7D32); }
.bytora-blog-preview-card__body { padding: var(--bytora-space-5); flex: 1; display: flex; flex-direction: column; gap: var(--bytora-space-2); }
.bytora-blog-preview-card__cat { font-family: var(--bytora-font-button); font-size: 10px; font-weight: var(--bytora-font-bold); letter-spacing: 0.08em; color: #2E7D32; background: var(--bytora-primary-light); padding: 3px 8px; border-radius: var(--bytora-radius-full); display: inline-block; }
.bytora-blog-preview-card__title { font-family: var(--bytora-font-heading); font-size: var(--bytora-text-base); font-weight: var(--bytora-font-bold); line-height: var(--bytora-leading-snug); margin: 0; }
.bytora-blog-preview-card__title a { color: var(--bytora-gray-900); text-decoration: none; transition: color 0.15s ease; }
.bytora-blog-preview-card__title a:hover { color: #2E7D32; }
.bytora-blog-preview-card__excerpt { font-family: var(--bytora-font-primary); font-size: var(--bytora-text-sm); color: var(--bytora-gray-600); line-height: var(--bytora-leading-relaxed); margin: 0; flex: 1; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.bytora-blog-preview-card__link { font-family: var(--bytora-font-heading); font-size: var(--bytora-text-sm); font-weight: var(--bytora-font-semibold); color: #2E7D32; text-decoration: none; margin-top: auto; transition: color var(--bytora-transition-fast); }
.bytora-blog-preview-card__link:hover { color: #1B5E20; }

/* =============================================================
   RESPONSIVE
   ============================================================= */
@media (max-width: 1200px) {
    .bytora-feature-cards__grid { grid-template-columns: repeat(2, 1fr); }
    .bytora-why-us__grid { grid-template-columns: repeat(2,1fr); }
}
@media (max-width: 1024px) {
    .bytora-hero__inner { grid-template-columns: 1fr; }
    .bytora-hero__image { display: none; }
    .bytora-hero__title { font-size: var(--bytora-text-4xl); }
    .bytora-products-grid { grid-template-columns: repeat(3,1fr); }
    .bytora-newsletter__inner { flex-direction: column; text-align: center; }
    .bytora-blog-preview-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 768px) {
    .bytora-section { padding: var(--bytora-space-12) 0; }
    .bytora-hero__title { font-size: var(--bytora-text-3xl); }
    .bytora-hero__stats { gap: var(--bytora-space-5); }
    .bytora-feature-cards__grid { grid-template-columns: repeat(2, 1fr); }
    .bytora-products-grid { grid-template-columns: repeat(2,1fr); gap: var(--bytora-space-4); }
    .bytora-why-us__grid { grid-template-columns: 1fr; }
    .bytora-testimonials__grid { grid-template-columns: 1fr; }
    .bytora-offer-banner__title { font-size: var(--bytora-text-2xl); }
    .bytora-section-header { flex-direction: column; align-items: flex-start; }
    .bytora-section-link { margin-left: 0; }
    .bytora-blog-preview-grid { grid-template-columns: 1fr; }
}
@media (max-width: 480px) {
    .bytora-container { padding: 0 var(--bytora-space-4); }
    .bytora-feature-cards__grid { grid-template-columns: 1fr; }
    .bytora-products-grid { grid-template-columns: 1fr; }
    .bytora-hero__actions { flex-direction: column; }
    .bytora-newsletter__input-wrap { flex-direction: column; border-radius: var(--bytora-radius-md); overflow: visible; gap: var(--bytora-space-2); }
    .bytora-newsletter__input-wrap input { border-radius: var(--bytora-radius-md); }
    .bytora-newsletter__input-wrap .bytora-btn { border-radius: var(--bytora-radius-md); width: 100%; justify-content: center; }
}
