.hero{position:relative;overflow:hidden;padding-top:var(--space-8);padding-bottom:var(--space-12)}.hero__bg-decoration{position:absolute;top:0;left:0;width:100%;height:90%;background-color:var(--color-warm-100);transform:skewY(-3deg);transform-origin:top left;z-index:-1}.hero__container{max-width:var(--container-max);margin:0 auto;padding-left:var(--container-padding);padding-right:var(--container-padding)}.hero__link{display:block;text-decoration:none}.hero__image-wrapper{position:relative;border-radius:var(--radius-xl);border:4px solid rgba(255,255,255,.5);box-shadow:var(--shadow-lg);overflow:hidden;aspect-ratio:16 / 7;min-height:280px;background-color:var(--color-warm-200);transition:transform var(--transition-base),box-shadow var(--transition-base)}.hero__image{width:100%;height:100%;object-fit:cover;transition:transform var(--transition-slow)}.hero__image-wrapper:hover{transform:translateY(-4px) scale(1.01);box-shadow:var(--shadow-xl)}.hero__image-wrapper:hover .hero__image{transform:scale(1.04)}.hero__image--placeholder{fill:var(--color-warm-300);background-color:var(--color-warm-200)}.hero__badge{position:absolute;bottom:var(--space-6);right:var(--space-6);background-color:var(--color-white);padding:var(--space-4) var(--space-6);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);display:flex;flex-direction:column;gap:var(--space-1);z-index:10;max-width:260px;border:1px solid rgba(203,174,154,.2);transition:transform var(--transition-base),box-shadow var(--transition-base)}.hero__image-wrapper:hover .hero__badge{transform:translateY(-2px);box-shadow:var(--shadow-lg)}.hero__badge-rating{display:flex;align-items:center;gap:var(--space-2);font-family:var(--font-heading);font-size:var(--font-size-md);font-weight:700;color:var(--color-secondary)}.hero__badge-rating svg{width:20px;height:20px;stroke:#d97706;fill:#d97706}.hero__badge-subtitle{font-size:var(--font-size-xs);color:var(--color-text);font-weight:600;opacity:.8;white-space:nowrap}@media(max-width:768px){.hero{padding-bottom:var(--space-8)}.hero__image-wrapper{aspect-ratio:4 / 3}.hero__badge{bottom:var(--space-4);right:var(--space-4);padding:var(--space-3) var(--space-4)}}
/*# sourceMappingURL=/cdn/shop/t/7/assets/component-hero.css.map */