/* Shared design tokens for the website, checkout, and account portals. */
:root {
    --color-ink: #20383e;
    --color-muted: #60736a;
    --color-primary: #22705a;
    --color-primary-hover: #195740;
    --color-primary-soft: #eaf4ee;
    --color-sage: #cce2bd;
    --color-accent: #cce2bd;
    --color-accent-soft: #ffdda0;
    --color-icon: #789786;
    --color-green-soft: #edf3ed;
    --color-green: #617c52;
    --color-surface: #ffffff;
    --color-background: #f5f7f6;
    --color-border: #e3e9e6;
    --color-sidebar: #142b31;
    --font-body: "Segoe UI", Arial, sans-serif;
    --radius-card: 16px;
    --radius-control: 9px;
    --shadow-card: 0 8px 28px rgba(115, 96, 38, .045);
    --focus-ring: #76b99a;
}


/* Shared motion for public pages and account portals. */
@view-transition { navigation: auto; }
@keyframes tijarah-page-enter {
    from { opacity: 0; }
    to { opacity: 1; }
}
@keyframes tijarah-page-leave {
    from { opacity: 1; }
    to { opacity: 0; }
}
.tj-page-content, .ca-content {
    animation: tijarah-page-enter 420ms ease-out;
}
::view-transition-old(root) {
    animation: tijarah-page-leave 360ms ease-out both;
}
::view-transition-new(root) {
    animation: tijarah-page-enter 360ms ease-out both;
}
:where(.tj-site, .ca-app) :is(a, button, input, select, textarea) {
    transition: background-color 180ms ease, color 180ms ease,
        border-color 180ms ease, box-shadow 180ms ease, opacity 180ms ease;
}
:where(.tj-site, .ca-app) :is(.ca-card, .tj-info-card) {
    transition: box-shadow 220ms ease, border-color 220ms ease;
}
@media (prefers-reduced-motion: reduce) {
    .tj-page-content, .ca-content { animation: none; }
    ::view-transition-old(root), ::view-transition-new(root) { animation: none; }
    :where(.tj-site, .ca-app) *, :where(.tj-site, .ca-app) *::before,
    :where(.tj-site, .ca-app) *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}
@media print {
    .tj-page-content, .ca-content { animation: none; }
}

/* Content enters gently; cards lift on hover and hero artwork floats. */
@keyframes tijarah-content-reveal {
    from { opacity: 0; translate: var(--reveal-x, -7px) 5px; }
    to { opacity: 1; translate: 0 0; }
}
@keyframes tijarah-float {
    0%, 100% { translate: 0 0; }
    50% { translate: 0 -3px; }
}
@media (prefers-reduced-motion: no-preference) {
    :is(.tj-page-content, .ca-content) > :is(section, article, div, header),
    :is(.feature-card, .pricing-card, .testimonial-card, .client-store-card, .market-product, .ca-card) {
        animation: tijarah-content-reveal 720ms cubic-bezier(.22,.61,.36,1) both;
    }
    :is(.tj-page-content, .ca-content) > :nth-child(2),
    :is(.feature-card, .pricing-card, .testimonial-card, .client-store-card, .market-product, .ca-card):nth-child(2) { animation-delay: 90ms; }
    :is(.tj-page-content, .ca-content) > :nth-child(3),
    :is(.feature-card, .pricing-card, .testimonial-card, .client-store-card, .market-product, .ca-card):nth-child(3) { animation-delay: 180ms; }
    :is(.tj-page-content, .ca-content) > :nth-child(n+4),
    :is(.feature-card, .pricing-card, .testimonial-card, .client-store-card, .market-product, .ca-card):nth-child(n+4) { animation-delay: 190ms; }
    .hero-visual, .ca-hero-art { animation: tijarah-float 8s ease-in-out infinite; }
    :is(.feature-card, .pricing-card, .testimonial-card, .client-store-card, .market-product) {
        transition: transform 220ms ease, box-shadow 220ms ease, border-color 220ms ease;
    }
}
@media (hover: hover) and (prefers-reduced-motion: no-preference) {
    :is(.feature-card, .pricing-card, .testimonial-card, .client-store-card, .market-product):hover {
        transform: translateY(-2px);
        box-shadow: 0 12px 28px rgba(20,43,49,.09);
    }
}
@media print {
    .tj-page-content *, .ca-content * { animation: none !important; translate: none !important; transform: none !important; }
}


@media (prefers-reduced-motion: no-preference) {
    :is(.tj-page-content, .ca-content) > :nth-child(even),
    :is(.feature-card, .pricing-card, .testimonial-card, .client-store-card, .market-product, .ca-card):nth-child(even) {
        --reveal-x: 7px;
        animation-duration: 800ms;
    }
    :is(.tj-page-content, .ca-content) > :nth-child(odd),
    :is(.feature-card, .pricing-card, .testimonial-card, .client-store-card, .market-product, .ca-card):nth-child(odd) {
        --reveal-x: -7px;
        animation-duration: 720ms;
    }
    :is(.feature-card, .pricing-card, .testimonial-card, .client-store-card, .market-product, .ca-card):nth-child(4n+1) { animation-delay: 0ms; }
    :is(.feature-card, .pricing-card, .testimonial-card, .client-store-card, .market-product, .ca-card):nth-child(4n+2) { animation-delay: 90ms; }
    :is(.feature-card, .pricing-card, .testimonial-card, .client-store-card, .market-product, .ca-card):nth-child(4n+3) { animation-delay: 180ms; }
    :is(.feature-card, .pricing-card, .testimonial-card, .client-store-card, .market-product, .ca-card):nth-child(4n+4) { animation-delay: 270ms; }
}

@media (prefers-reduced-motion: no-preference) {
    :is(.tj-site, .ca-app) .tj-scroll-reveal {
        animation: none;
        opacity: 0;
        translate: var(--scroll-x, 0) 12px;
        transition: opacity 750ms cubic-bezier(.22,.61,.36,1), translate 750ms cubic-bezier(.22,.61,.36,1), transform 220ms ease, box-shadow 220ms ease;
        transition-delay: var(--scroll-delay, 0ms), var(--scroll-delay, 0ms), 0ms, 0ms;
    }
    :is(.tj-site, .ca-app) .tj-scroll-reveal.is-scroll-visible { opacity: 1; translate: 0 0; }
}
@media print {
    :is(.tj-site, .ca-app) .tj-scroll-reveal { opacity: 1 !important; translate: none !important; }
}
/* Keep the catalog's space stable while its independent request is loading. */
.home-skeleton-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin:24px 0}
.home-skeleton-card{padding:24px;border:1px solid #e3e9e4;border-radius:18px;background:#fff;display:grid;gap:16px}
.home-skeleton{background:linear-gradient(100deg,#eef2ec 25%,#f9fbf7 40%,#eef2ec 60%);background-size:220% 100%;animation:home-skeleton-shimmer 1.8s ease-in-out infinite;border-radius:8px}
.home-skeleton-picture{height:180px}.home-skeleton-title{height:22px;width:65%}.home-skeleton-line{height:14px;width:90%}.home-skeleton-line.short{width:45%}.home-skeleton-logo{width:64px;height:64px;border-radius:50%}
@keyframes home-skeleton-shimmer{from{background-position:100% 0}to{background-position:-100% 0}}
@media(max-width:700px){.home-skeleton-grid{grid-template-columns:1fr}.home-skeleton-card{padding:20px}}
@media(prefers-reduced-motion:reduce){.home-skeleton{animation:none}}