:root{--primary-color:#4f46e5;--primary-hover:#4338ca;--bg-color:#f9fafb;--text-main:#111827;--text-muted:#6b7280;--card-bg:#ffffff}body{background-color:var(--bg-color);font-family:'Inter',system-ui,-apple-system,sans-serif;color:var(--text-main)}.city-hero{position:relative;background:linear-gradient(135deg,#4f46e5 0%,#06b6d4 100%);color:white;padding:80px 20px 100px;text-align:center;overflow:hidden;margin-bottom:-50px}.city-hero-content{max-width:900px;margin:0 auto;position:relative;z-index:2}.city-image-section{margin:30px 0;border-radius:16px;overflow:hidden;box-shadow:0 8px 30px rgba(0,0,0,0.12)}.city-image-section img{width:100%;height:300px;object-fit:cover;display:block}.city-image-caption{background:linear-gradient(135deg,var(--primary-color) 0%,#06b6d4 100%);color:white;padding:12px 20px;font-size:0.9rem;text-align:center}.city-image-caption a{color:white;text-decoration:underline}.city-image-caption .caption-hint{display:block;margin-top:2px;font-size:0.82em;opacity:0.85;font-style:italic}.city-hero-content{max-width:900px;margin:0 auto;position:relative;z-index:2}.city-main-title{font-size:3.5rem;font-weight:800;margin-bottom:10px;line-height:1.1;text-shadow:0 4px 15px rgba(0,0,0,0.2)}.city-hero-subtitle-text{font-size:1.3rem;font-weight:300;opacity:0.9;margin-bottom:30px}.city-hero-stats{display:flex;justify-content:center;flex-wrap:wrap;gap:20px;margin-top:30px}.stat-badge{background:rgba(255,255,255,0.2);padding:10px 20px;border-radius:50px;font-weight:600;font-size:1rem;display:flex;align-items:center;gap:8px;border:1px solid rgba(255,255,255,0.3)}.main-content-area{max-width:1000px;margin:0 auto;padding:0 20px 60px;position:relative;z-index:1}.content-block{background:var(--card-bg);border-radius:16px;padding:40px;margin-bottom:30px;box-shadow:0 8px 30px rgba(0,0,0,0.08);border:1px solid #e2e8f0}.content-block:first-of-type{margin-top:80px}.section-header-styled{display:flex;align-items:center;gap:15px;margin-bottom:30px;border-bottom:2px solid #eef2f6;padding-bottom:15px}.section-icon-styled{font-size:2.5rem;color:var(--primary-color);line-height:1}.section-title-styled{font-size:2rem;font-weight:700;margin:0;color:var(--text-main)}.dynamic-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:25px}.styled-card{background:#fdfdff;border-radius:12px;padding:25px;box-shadow:0 3px 12px rgba(0,0,0,0.04);border:1px solid #eef2ff;transition:transform 0.2s ease,box-shadow 0.2s ease}.styled-card:hover{transform:translateY(-5px);box-shadow:0 8px 20px rgba(0,0,0,0.08)}.card-heading{font-size:1.3rem;font-weight:700;margin-top:0;margin-bottom:10px;color:var(--primary-color)}.card-text-content{font-size:0.95rem;line-height:1.6;color:#4a5568}.card-tag-small{display:inline-block;background:#e0e7ff;color:#3b82f6;padding:5px 12px;border-radius:20px;font-size:0.8rem;font-weight:600;margin-top:10px;margin-right:8px}.routine-timeline-styled{position:relative;border-left:3px solid #d1d5db;margin-left:20px;padding-left:30px}.routine-item-styled{margin-bottom:30px;position:relative}.routine-item-styled::before{content:'';position:absolute;left:-39px;top:8px;width:16px;height:16px;background:var(--primary-color);border-radius:50%;border:3px solid white;box-shadow:0 0 0 1px #d1d5db}.time-label-styled{font-weight:700;color:var(--primary-color);text-transform:uppercase;font-size:0.9rem;margin-bottom:8px;display:block}.vibe-quote-box{background:#f0f9ff;border-left:5px solid #3b82f6;padding:30px;margin:40px 0;border-radius:0 12px 12px 0;font-style:italic;font-size:1.2rem;color:#1e40af;box-shadow:0 4px 15px rgba(0,0,0,0.05)}.vibe-quote-box cite{display:block;margin-top:15px;font-size:0.9rem;text-align:right;color:#2563eb}.city-map-container{position:relative;width:100%;height:400px;border-radius:12px;overflow:hidden;box-shadow:0 4px 15px rgba(0,0,0,0.1);margin-top:20px}#city-map{width:100%;height:100%}.leaflet-popup-content-wrapper{border-radius:8px}.map-loading{display:flex;align-items:center;justify-content:center;height:100%;background:#f0f4f8;color:var(--text-muted);font-size:1rem}.city-suggestions{background:#f8fafc;padding:80px 0;border-top:1px solid #eef2f6}.suggestions-header{text-align:center;margin-bottom:40px}.suggestions-badge{background:#eef2ff;color:var(--primary-color);padding:8px 16px;border-radius:50px;font-weight:700;font-size:0.9rem;display:inline-block;margin-bottom:15px}.suggestions-title{font-size:2.2rem;font-weight:800;color:var(--text-main);margin:0}.compass-container{position:relative;max-width:700px;margin:40px auto 0;padding:20px}.compass-grid{display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);gap:20px;aspect-ratio:1 / 1}.compass-card{display:flex;flex-direction:column;align-items:center;justify-content:center;background:white;border-radius:20px;padding:15px;box-shadow:0 4px 12px rgba(0,0,0,0.03);border:1px solid #f1f5f9;transition:all 0.4s cubic-bezier(0.175,0.885,0.32,1.275);text-decoration:none;color:inherit;position:relative;z-index:5}.compass-card:hover{transform:translateY(-5px) scale(1.05);box-shadow:0 15px 30px rgba(79,70,229,0.15);border-color:var(--primary-color);z-index:15}.compass-center-star{grid-area:2 / 2;display:flex;flex-direction:column;align-items:center;justify-content:center;background:none;color:white;position:relative;z-index:1;cursor:default;text-align:center}.compass-center-star::before{content:'';position:absolute;top:-50%;left:-50%;right:-50%;bottom:-50%;background:linear-gradient(135deg,rgba(129,140,248,0.5) 0%,rgba(34,211,238,0.5) 100%);z-index:-1;clip-path:polygon( 50% 0%,53% 40%,85% 15%,60% 47%,100% 50%,60% 53%,85% 85%,53% 60%,50% 100%,47% 60%,15% 85%,40% 53%,0% 50%,40% 47%,15% 15%,47% 40% );filter:drop-shadow(0 0 15px rgba(129,140,248,0.3))}.compass-center-star .compass-direction-label{color:rgba(255,255,255,0.8);font-size:0.7rem;font-weight:800;text-transform:uppercase;margin-bottom:4px}.compass-center-star .compass-city-name{font-weight:800;font-size:1.2rem;text-shadow:0 2px 4px rgba(0,0,0,0.2)}.compass-center-star .compass-arrow{color:white;font-size:1.6rem;margin-top:5px}.compass-card--empty{background:rgba(255,255,255,0.4);border:1px dashed #cbd5e1;opacity:0.5;box-shadow:none}.compass-direction-label{font-size:0.7rem;font-weight:800;text-transform:uppercase;letter-spacing:0.1em;color:var(--text-muted);margin-bottom:4px}.compass-city-name{font-weight:700;font-size:1.1rem;text-align:center;line-height:1.2}.compass-distance-val{font-size:0.8rem;margin-top:5px;font-weight:600;color:var(--primary-color);background:#eef2ff;padding:2px 8px;border-radius:10px}.pos-n{grid-area:1 / 2}.pos-ne{grid-area:1 / 3}.pos-e{grid-area:2 / 3}.pos-se{grid-area:3 / 3}.pos-s{grid-area:3 / 2}.pos-so{grid-area:3 / 1}.pos-o{grid-area:2 / 1}.pos-no{grid-area:1 / 1}.compass-axis{position:absolute;background:#e2e8f0;z-index:1;opacity:0.5}.axis-h{top:50%;left:5%;right:5%;height:1px;transform:translateY(-50%)}.axis-v{left:50%;top:5%;bottom:5%;width:1px;transform:translateX(-50%)}@media (max-width:640px){.compass-grid{grid-template-columns:repeat(2,1fr);grid-template-rows:auto;aspect-ratio:auto;gap:15px}.compass-center-star{grid-area:auto;grid-column:1 / span 2;padding:40px 25px;order:-1;background:linear-gradient(135deg,#818cf8 0%,#22d3ee 100%);border-radius:20px}.compass-center-star::before{display:none}.pos-n,.pos-ne,.pos-e,.pos-se,.pos-s,.pos-so,.pos-o,.pos-no{grid-area:auto}.compass-axis{display:none}}@media (max-width:768px){.city-main-title{font-size:2.5rem}.city-hero-subtitle-text{font-size:1rem}.content-block{padding:25px}.section-title-styled{font-size:1.5rem}.section-icon-styled{font-size:2rem}.dynamic-grid{grid-template-columns:1fr}.routine-timeline-styled{margin-left:0;padding-left:20px}.routine-item-styled::before{left:-20px}.city-map-container{height:300px}}.fav-toggle.fav-active{background:rgba(239,68,68,0.9) !important;border-color:rgba(239,68,68,0.9) !important}.city-cta-newsletter{max-width:720px;margin:40px auto;padding:28px 26px;border-radius:16px;background:linear-gradient(135deg,#eef2ff 0%,#f5f3ff 100%);border:1px solid #e0e7ff;text-align:center}.city-cta-newsletter h2{margin:0 0 6px;font-size:1.35rem;color:#312e81}.city-cta-newsletter .city-cta-newsletter-sub{margin:0 0 18px;color:#4b5563;font-size:.95rem}.city-cta-newsletter .newsletter-form{display:flex;gap:10px;max-width:480px;margin:0 auto;flex-wrap:wrap;justify-content:center}.city-cta-newsletter input[type=email]{flex:1 1 220px;padding:12px 16px;border:1px solid #c7d2fe;border-radius:10px;font-size:.95rem;background:#fff}.city-cta-newsletter button[type=submit]{padding:12px 22px;border:none;border-radius:10px;background:var(--primary-color,#4f46e5);color:#fff;font-weight:600;cursor:pointer}.city-cta-newsletter .newsletter-consent{display:flex;gap:6px;align-items:flex-start;font-size:12px;line-height:1.4;color:#4b5563;text-align:left;margin:12px auto 0;max-width:480px}.city-cta-newsletter .newsletter-consent a{color:#4f46e5}@media (prefers-reduced-motion:no-preference){.city-cta-newsletter{transition:box-shadow .2s ease}.city-cta-newsletter:hover{box-shadow:0 6px 24px rgba(79,70,229,.12)}}
