.beach-card{position:relative;display:flex;flex-direction:column;background-color:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-xl);overflow:hidden;box-shadow:var(--shadow-sm);transition:transform var(--transition-luxury),box-shadow var(--transition-luxury),border-color var(--transition-normal);height:100%;text-decoration:none;color:inherit}.beach-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-elevated);border-color:#d4b48366}.beach-card:before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--color-gold-shimmer);opacity:0;transition:opacity var(--transition-normal);z-index:10}.beach-card:hover:before{opacity:1}.beach-card-image-wrapper{position:relative;aspect-ratio:4 / 3;overflow:hidden;background:linear-gradient(135deg,var(--color-surface-hover) 0%,var(--color-background) 100%);flex-shrink:0}.beach-card-image-wrapper:after{content:"";position:absolute;top:0;left:0;right:0;height:80px;background:linear-gradient(to bottom,rgba(0,0,0,.12) 0%,transparent 100%);pointer-events:none;opacity:0;transition:opacity var(--transition-normal)}.beach-card:hover .beach-card-image-wrapper:after{opacity:1}.beach-card-image{width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.16,1,.3,1)}.beach-card:hover .beach-card-image{transform:scale(1.08)}.beach-coast-badge{position:absolute;top:var(--space-4);left:var(--space-4);font-size:var(--text-xs);text-transform:uppercase;letter-spacing:var(--tracking-luxury);font-weight:500;color:var(--color-text-inverse);background:linear-gradient(135deg,#2c4a52eb,#3d5f69eb);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);padding:6px var(--space-3);border-radius:var(--radius-sm);border:1px solid rgba(255,255,255,.2);box-shadow:0 4px 15px #2c4a524d;z-index:5;transition:transform var(--transition-normal)}.beach-card:hover .beach-coast-badge{transform:translateY(-2px)}.beach-sun-badge{position:absolute;top:var(--space-4);right:var(--space-4);display:flex;align-items:center;gap:var(--space-1);padding:6px 10px;background:#ffc857e6;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-radius:var(--radius-sm);border:1px solid rgba(255,255,255,.2);z-index:5;transition:transform var(--transition-normal)}.beach-card:hover .beach-sun-badge{transform:translateY(-2px)}.beach-sun-badge svg{color:#7c5c00}.beach-card-content{padding:var(--space-6);flex:1;display:flex;flex-direction:column}.beach-card-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:var(--space-3);gap:var(--space-3)}.beach-name{font-size:var(--text-xl);font-family:var(--font-serif);font-weight:500;color:var(--color-text-primary);letter-spacing:var(--tracking-tight);line-height:var(--leading-tight);transition:color var(--transition-fast)}.beach-card:hover .beach-name{color:var(--color-primary)}.beach-length{font-size:var(--text-sm);color:var(--color-text-tertiary);font-family:var(--font-sans);margin-top:2px;display:block;letter-spacing:var(--tracking-wide)}.beach-description{font-size:var(--text-sm);color:var(--color-text-secondary);line-height:var(--leading-relaxed);margin-bottom:var(--space-5);opacity:.85;display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.beach-tags{display:flex;flex-wrap:wrap;gap:var(--space-2);margin-bottom:var(--space-5)}.beach-tag{font-size:var(--text-xs);font-weight:500;letter-spacing:var(--tracking-wide);border:1px solid var(--color-border);padding:6px 12px;border-radius:var(--radius-full);color:var(--color-text-secondary);background-color:transparent;transition:all var(--transition-normal);text-transform:capitalize}.beach-card:hover .beach-tag{border-color:var(--color-secondary);background:#d4b48314;color:var(--color-primary)}.beach-card:hover .beach-tag:nth-child(1){transition-delay:0ms}.beach-card:hover .beach-tag:nth-child(2){transition-delay:50ms}.beach-card:hover .beach-tag:nth-child(3){transition-delay:.1s}.beach-card-footer{display:flex;justify-content:space-between;align-items:center;margin-top:auto;padding-top:var(--space-5);border-top:1px solid var(--color-border)}.beach-sand-rating{display:flex;align-items:center;gap:6px;font-size:var(--text-sm);font-weight:500}.beach-sand-rating .text-accent{color:var(--color-accent)}.sand-rating-value{font-weight:600;color:var(--color-text-primary)}.sand-rating-label{color:var(--color-text-tertiary);font-weight:400;font-size:var(--text-xs)}.beach-card-cta{font-family:var(--font-sans);font-size:var(--text-xs);font-weight:500;color:var(--color-primary);text-transform:uppercase;letter-spacing:var(--tracking-luxury);transition:all var(--transition-normal);padding:6px 12px;border:1px solid var(--color-border);border-radius:var(--radius-full);background-color:transparent}.beach-card:hover .beach-card-cta{border-color:var(--color-primary);background-color:var(--color-primary);color:var(--color-text-inverse)}.beach-card.horizontal{flex-direction:row;min-height:280px}.beach-card.horizontal .beach-card-image-wrapper{width:380px;min-width:380px;aspect-ratio:auto;height:auto}.beach-card.horizontal .beach-card-content{padding:var(--space-8)}.beach-card.horizontal .beach-description{flex:1}@media(max-width:900px){.beach-card.horizontal{flex-direction:column;min-height:auto}.beach-card.horizontal .beach-card-image-wrapper{width:100%;min-width:auto;aspect-ratio:4 / 3}.beach-card.horizontal .beach-card-content{padding:var(--space-6)}}@media(max-width:640px){.beach-card-content{padding:var(--space-5)}.beach-name{font-size:var(--text-lg)}.beach-description{-webkit-line-clamp:3;line-clamp:3}.beach-card-footer{padding-top:var(--space-4)}}.beach-card:focus-within{outline:2px solid var(--color-primary);outline-offset:4px}