:root{--primary-gradient:linear-gradient(135deg,#667eea,#764ba2);--ocean-gradient:linear-gradient(135deg,#4facfe,#00f2fe);--sunset-gradient:linear-gradient(135deg,#fa709a,#fee140);--glass-background:hsla(0,0%,100%,.1);--glass-border:hsla(0,0%,100%,.2);--text-primary:#1a1a1a;--text-secondary:#666;--text-light:#fff;--shadow-soft:0 10px 40px rgba(0,0,0,.1);--shadow-hard:0 20px 60px rgba(0,0,0,.15);--border-radius:24px;--border-radius-small:16px;--animation-smooth:cubic-bezier(0.4,0,0.2,1);--font-display:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;--font-body:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}*{box-sizing:border-box;margin:0;padding:0}body{background:linear-gradient(135deg,#f5f9ff,#e8f4f8);color:var(--text-primary);font-family:var(--font-body);line-height:1.6;min-height:100vh;overflow-x:hidden}.beach-dashboard{min-height:100vh;width:100%}.hero-section{align-items:center;background:var(--ocean-gradient);display:flex;justify-content:center;min-height:40vh;overflow:hidden;padding:3rem 2rem;position:relative}.hero-section:before{animation:float 20s ease-in-out infinite;background:url("data:image/svg+xml;charset=utf-8,%3Csvg width='60' height='60' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='30' cy='30' r='2' fill='%23fff' fill-opacity='.1' fill-rule='evenodd'/%3E%3C/svg%3E") repeat;bottom:0;content:"";left:0;position:absolute;right:0;top:0}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}.hero-content{align-items:center;flex-direction:column;gap:2rem;position:relative;z-index:2}.hero-columns,.hero-content{display:flex;max-width:1000px;width:100%}.hero-columns{align-items:flex-start;gap:1.5rem}.hero-text{color:var(--text-light);flex:1 1 50%;max-width:50%;text-align:center}.hero-title{font-family:var(--font-display);font-size:clamp(2.5rem,6vw,4rem);font-weight:800;letter-spacing:-.02em;margin-bottom:.5rem;text-shadow:0 4px 20px rgba(0,0,0,.3)}.hero-subtitle{font-size:clamp(1.1rem,2.5vw,1.4rem);font-weight:300;letter-spacing:.5px;opacity:.9}.hero-additional{display:flex;flex:1 1 50%;flex-direction:column;gap:1rem;max-width:50%}.hero-beach-photo{backdrop-filter:blur(20px);background:var(--glass-background);border:1px solid var(--glass-border);border-radius:var(--border-radius);box-shadow:var(--shadow-soft);overflow:hidden;position:relative;transition:all .3s var(--animation-smooth)}.hero-beach-photo:hover{box-shadow:var(--shadow-hard);transform:translateY(-2px)}.hero-beach-photo img{display:block;height:300px;object-fit:cover;transition:all .3s var(--animation-smooth);width:100%}.hero-beach-photo:hover img{transform:scale(1.05)}.photo-caption{align-items:center;background:linear-gradient(transparent,rgba(0,0,0,.8));bottom:0;color:#fff;display:flex;font-size:.9rem;font-weight:600;gap:.5rem;left:0;padding:1rem;position:absolute;right:0}.photo-icon{height:1rem;opacity:.8;width:1rem}.hero-quick-info{backdrop-filter:blur(20px);background:var(--glass-background);border:1px solid var(--glass-border);border-radius:var(--border-radius);box-shadow:var(--shadow-soft);padding:1.5rem;transition:all .3s var(--animation-smooth)}.hero-quick-info:hover{box-shadow:var(--shadow-hard);transform:translateY(-2px)}.quick-info-item{align-items:center;border-bottom:1px solid hsla(0,0%,100%,.1);display:flex;justify-content:space-between;padding:.75rem 0}.quick-info-item:last-child{border-bottom:none;padding-bottom:0}.quick-info-label{color:hsla(0,0%,100%,.8);font-size:.9rem;font-weight:500}.quick-info-value{color:var(--text-light);font-size:.95rem;font-weight:600;text-align:right}.status-open{color:#10b981;text-shadow:0 0 10px rgba(16,185,129,.3)}.status-closed{color:#ef4444;text-shadow:0 0 10px rgba(239,68,68,.3)}.status-unknown{color:#f59e0b;text-shadow:0 0 10px rgba(245,158,11,.3)}.flag-status{align-items:center;backdrop-filter:blur(20px);background:var(--glass-background);border:1px solid var(--glass-border);border-radius:var(--border-radius);box-shadow:var(--shadow-soft);display:flex;gap:1.5rem;min-width:320px;padding:2rem;transition:all .3s var(--animation-smooth)}.flag-status:hover{box-shadow:var(--shadow-hard);transform:translateY(-5px)}.flag-white{background:linear-gradient(135deg,hsla(0,0%,100%,.2),hsla(0,0%,100%,.1))}.flag-red,.flag-white{color:var(--text-light)}.flag-red{background:linear-gradient(135deg,rgba(239,68,68,.9),rgba(220,38,38,.9))}.flag-icon{height:3rem;opacity:.9;width:3rem}.flag-status h3{font-family:var(--font-display);font-size:1.5rem;font-weight:700;margin-bottom:.5rem}.flag-status p{font-size:.95rem;line-height:1.4;opacity:.9}.dashboard-container{margin:-2rem auto 0;max-width:1400px;padding:2rem;position:relative;z-index:3}.weather-grid{display:grid;gap:1.5rem;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));margin-bottom:3rem;margin-top:3rem}.weather-card{align-items:center;backdrop-filter:blur(20px);background:hsla(0,0%,100%,.95);border:1px solid hsla(0,0%,100%,.2);border-radius:var(--border-radius);box-shadow:var(--shadow-soft);display:flex;gap:1.5rem;overflow:hidden;padding:2rem;position:relative;transition:all .3s var(--animation-smooth)}.weather-card:before{background:var(--primary-gradient);border-radius:var(--border-radius) var(--border-radius) 0 0;content:"";height:4px;left:0;position:absolute;right:0;top:0}.weather-card:hover{box-shadow:var(--shadow-hard);transform:translateY(-8px)}.weather-icon{background:var(--primary-gradient);border-radius:var(--border-radius-small);color:#fff;flex-shrink:0;height:3rem;padding:.75rem;width:3rem}.weather-info h3{color:var(--text-secondary);font-family:var(--font-display);font-size:.9rem;font-weight:600;letter-spacing:.5px;margin-bottom:.5rem;text-transform:uppercase}.weather-value{color:var(--text-primary);display:block;font-family:var(--font-display);font-size:2rem;font-weight:800;line-height:1}.weather-secondary{color:var(--text-secondary);display:block;font-size:.85rem;margin-top:.25rem}.weather-description{color:var(--text-primary);font-size:1rem;font-weight:500;text-transform:capitalize}.temperature-card:before{background:linear-gradient(135deg,#ff6b6b,#ee5a24)}.water-card:before{background:linear-gradient(135deg,#4facfe,#00f2fe)}.feels-like-card:before{background:linear-gradient(135deg,#fa709a,#fee140)}.humidity-card:before{background:linear-gradient(135deg,#a8e6cf,#3eaf7c)}.wind-card:before{background:linear-gradient(135deg,#a8a8a8,#6c6c6c)}.pressure-card:before{background:linear-gradient(135deg,#667eea,#764ba2)}.visibility-card:before{background:linear-gradient(135deg,#f093fb,#f5576c)}.description-card:before{background:linear-gradient(135deg,#4ecdc4,#44a08d)}.beaches-section,.gallery-section,.history-section{margin-bottom:3rem}.section-title{align-items:center;color:var(--text-primary);display:flex;font-family:var(--font-display);font-size:2rem;font-weight:700;gap:1rem;margin-bottom:2rem}.section-icon{color:#4facfe;height:2.5rem;width:2.5rem}.photo-gallery{border-radius:var(--border-radius);box-shadow:var(--shadow-soft);overflow:hidden;position:relative}.swiper-container{height:400px;width:100%}.gallery-image{height:100%;overflow:hidden;position:relative;width:100%}.gallery-image img{height:100%;object-fit:cover;transition:transform .3s var(--animation-smooth);width:100%}.gallery-image:hover img{transform:scale(1.05)}.info-grid{display:grid;gap:2rem;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));margin-bottom:3rem}.info-card{backdrop-filter:blur(20px);background:hsla(0,0%,100%,.95);border:1px solid hsla(0,0%,100%,.2);border-radius:var(--border-radius);box-shadow:var(--shadow-soft);padding:2rem;transition:all .3s var(--animation-smooth)}.info-card:hover{box-shadow:var(--shadow-hard);transform:translateY(-5px)}.info-header{align-items:center;display:flex;gap:1rem;margin-bottom:1.5rem}.info-icon{color:#4facfe;height:2rem;width:2rem}.info-header h3{color:var(--text-primary);font-family:var(--font-display);font-size:1.25rem;font-weight:600}.info-content p{color:var(--text-primary);line-height:1.6}.lifeguards-list{display:flex;flex-direction:column;gap:1rem}.lifeguard-item{align-items:center;background:rgba(79,172,254,.1);border-radius:var(--border-radius-small);display:flex;gap:1rem;padding:1rem;transition:all .3s var(--animation-smooth)}.lifeguard-item:hover{background:rgba(79,172,254,.15);transform:translateX(5px)}.lifeguard-avatar{align-items:center;background:var(--primary-gradient);border-radius:50%;color:#fff;display:flex;font-size:.9rem;font-weight:600;height:3rem;justify-content:center;width:3rem}.lifeguard-item span{color:var(--text-primary);font-weight:500}.update-date{color:var(--text-primary);font-family:var(--font-display);font-size:1.1rem;font-weight:600}.beaches-grid{display:grid;gap:1.5rem;grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}.beach-card{backdrop-filter:blur(20px);background:hsla(0,0%,100%,.95);border:1px solid hsla(0,0%,100%,.2);border-radius:var(--border-radius);box-shadow:var(--shadow-soft);color:var(--text-primary);overflow:hidden;padding:2rem;position:relative;text-decoration:none;transition:all .3s var(--animation-smooth)}.beach-card:before{background:var(--ocean-gradient);border-radius:var(--border-radius) var(--border-radius) 0 0;content:"";height:4px;left:0;position:absolute;right:0;top:0}.history-card:before{background:var(--sunset-gradient)}.beach-card:hover{box-shadow:var(--shadow-hard);color:var(--text-primary);transform:translateY(-8px)}.beach-card-content{align-items:center;display:flex;gap:1rem}.beach-icon{color:#4facfe;height:2.5rem;width:2.5rem}.beach-card span{font-family:var(--font-display);font-size:1.1rem;font-weight:600}@media (max-width:768px){.hero-section{min-height:50vh;padding:2rem 1rem}.hero-content{gap:1.5rem}.hero-columns{align-items:center;flex-direction:column;gap:2rem}.hero-additional{flex:none;max-width:400px;width:100%}.flag-status{flex-direction:column;min-width:auto;text-align:center;width:100%}.dashboard-container{margin-top:-1rem;padding:1rem}.weather-grid{gap:1rem;grid-template-columns:1fr}.weather-card{gap:1rem;padding:1.5rem}.weather-icon{height:2.5rem;width:2.5rem}.weather-value{font-size:1.5rem}.info-grid{gap:1.5rem}.beaches-grid,.info-grid{grid-template-columns:1fr}.beaches-grid{gap:1rem}.section-title{font-size:1.5rem}.section-icon{height:2rem;width:2rem}}@media (max-width:480px){.hero-title{font-size:2rem}.hero-subtitle{font-size:1rem}.weather-card{padding:1rem}.beach-card,.info-card{padding:1.5rem}}@keyframes slideInUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.beach-card,.info-card,.weather-card{animation:slideInUp .6s var(--animation-smooth) forwards}.weather-card:first-child{animation-delay:.1s}.weather-card:nth-child(2){animation-delay:.2s}.weather-card:nth-child(3){animation-delay:.3s}.weather-card:nth-child(4){animation-delay:.4s}.weather-card:nth-child(5){animation-delay:.5s}.weather-card:nth-child(6){animation-delay:.6s}.weather-card:nth-child(7){animation-delay:.7s}.weather-card:nth-child(8){animation-delay:.8s}.info-card,.weather-card{animation:slideInUp .6s var(--animation-smooth) forwards;opacity:0}html{scroll-behavior:smooth}.beach-card:focus,.lifeguard-item:focus{outline:2px solid #4facfe;outline-offset:2px}@media print{.hero-section{background:none;color:#000}.beach-card,.info-card,.weather-card{border:1px solid #ccc;box-shadow:none}}.today-photo{position:relative}.today-badge{align-items:center;animation:pulse 2s ease-in-out infinite;backdrop-filter:blur(10px);background:linear-gradient(135deg,#00b894,#00cec9);border:1px solid hsla(0,0%,100%,.2);border-radius:20px;box-shadow:0 4px 12px rgba(0,184,148,.3);color:#fff;display:flex;font-size:.8rem;font-weight:600;gap:.3rem;padding:.5rem 1rem;position:absolute;right:1rem;top:1rem}.today-badge svg{height:.9rem;width:.9rem}@keyframes pulse{0%,to{box-shadow:0 4px 12px rgba(0,184,148,.3);transform:scale(1)}50%{box-shadow:0 6px 20px rgba(0,184,148,.4);transform:scale(1.05)}}.today-photo .photo-caption{background:linear-gradient(transparent,rgba(0,184,148,.8))}.today-photo:hover .today-badge{animation-play-state:paused;transform:scale(1.1)}body{background-color:#d3d3d3}