/* Home page specific styles - PolandGamingClub / Strange Horticulture */

/* Layout helpers */
.section { padding: var(--space-12) 0; }
.section-alt { background: linear-gradient(180deg, rgba(37,45,39,0.35) 0%, rgba(31,38,33,0.2) 100%); }

/* Hero */
.hero { position: relative; padding-top: var(--space-16); padding-bottom: var(--space-12); }
.hero::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: radial-gradient(60% 60% at 20% 20%, rgba(74,124,89,0.12), transparent 60%); }
.hero-grid { display: grid; grid-template-columns: 1.15fr 0.85fr; gap: var(--space-8); align-items: center; }
.hero-content { position: relative; z-index: 1; }
.cta-group { display: flex; gap: var(--space-4); flex-wrap: wrap; margin-top: var(--space-6); }
.media-frame { border-radius: var(--radius-2xl); overflow: hidden; border: 1px solid var(--color-border); box-shadow: var(--shadow-xl); background-color: var(--color-background-card); }
.media-frame img { display: block; width: 100%; height: auto; }

/* Cards & content lists */
.feature-list, .steps, .tips { margin-top: var(--space-4); }
.feature-list li, .steps li, .tips li { margin-bottom: var(--space-2); color: var(--color-neutral-800); }
.card .card-footer { display: flex; gap: var(--space-3); align-items: center; }

/* FAQ */
.faq details { background: var(--color-background-card); border: 1px solid var(--color-border); border-radius: var(--radius-md); padding: var(--space-4); margin-bottom: var(--space-3); box-shadow: var(--shadow-sm); }
.faq summary { cursor: pointer; font-weight: var(--font-weight-semibold); color: var(--color-accent); }
.faq details[open] { box-shadow: var(--shadow-md); }
.faq p { margin-top: var(--space-3); }

/* Final CTA */
.section-cta-final { padding-top: var(--space-12); padding-bottom: var(--space-16); }

/* Simple reveal animation */
.reveal { opacity: 0; transform: translateY(10px); transition: opacity var(--duration-slow) var(--ease-out), transform var(--duration-slow) var(--ease-out); }
.reveal.in-view { opacity: 1; transform: translateY(0); }

/* Responsive */
@media (max-width: 1024px) {
  .hero-grid { grid-template-columns: 1fr; }
}