:root {
            --pr:   #1a5276;
            --pr-l: #d6eaf8;
            --ac:   #e67e22;
            --ac-l: #fdebd0;
            --tx:   #212529;
            --mu:   #6c757d;
            --bd:   #dee2e6;
            --bg:   #f8f9fa;
            --wh:   #ffffff;
            --rd:   10px;
        }

        /* BREADCRUMB */
        .ev-breadcrumb {
            padding: 0.75rem 0; font-size: 0.82rem; color: var(--mu);
            border-bottom: 1px solid var(--bd); margin-bottom: 0;
        }
        .ev-breadcrumb a { color: var(--pr); text-decoration: none; }
        .ev-breadcrumb a:hover { text-decoration: underline; }
        .ev-breadcrumb .sep { margin: 0 0.4rem; color: var(--bd); }

        /* HERO */
                /* HEADER — opt C */
        .ev-header {
            background: var(--wh);
            border-bottom: 1px solid var(--bd);
            margin-bottom: 1.5rem;
        }
        .ev-header-inner {
            display: flex; align-items: stretch;
            min-height: 160px;
        }
        .ev-header-accent {
            width: 5px; flex-shrink: 0;
            background: var(--ac);
        }
        .ev-header-details {
            flex: 1; min-width: 0;
            padding: 1rem 1.75rem;
            display: flex; flex-direction: column; justify-content: center;
        }
        .ev-header-section {
            font-size: 0.72rem; font-weight: 700;
            letter-spacing: 0.1em; text-transform: uppercase;
            color: var(--mu); margin-bottom: 0.5rem;
        }
        .ev-header-section i { color: var(--ac); }
        .ev-header h1 {
            font-size: 1.75rem; font-weight: 700;
            color: var(--pr); line-height: 1.25;
            margin-bottom: 0.85rem;
        }
        .ev-header-badges {
            display: flex; gap: 0.4rem; flex-wrap: wrap;
            margin-bottom: 0.6rem;
        }
        .ev-header-badge {
            display: inline-flex; align-items: center; gap: 5px;
            font-size: 0.72rem; font-weight: 700;
            letter-spacing: 0.03em; padding: 4px 11px;
            border-radius: 999px;
        }
        .ev-header-badge-cat      { background: var(--pr-l); color: var(--pr); }
        .ev-header-badge-featured { background: var(--ac);   color: #fff; }
        .ev-header-badge-free     { background: #d5f0e0;     color: #1a6b3a; }
        .ev-header-meta {
            font-size: 0.87rem; color: var(--mu);
            display: flex; align-items: center;
            gap: 0.45rem; margin-bottom: 0.3rem;
        }
        .ev-header-meta:last-child { margin-bottom: 0; }
        .ev-header-meta i { color: var(--pr); width: 14px; text-align: center; }
.ev-header-img {
    flex-shrink: 0; width: 220px;
    background: var(--pr-l);
    border-left: 1px solid var(--bd);
    display: flex; align-items: center;
    justify-content: center; overflow: hidden;
}
        .ev-header-img img {
            width: 100%; height: 100%;
            object-fit: contain; display: block;
        }
.ev-header-img-placeholder {
    font-size: 3rem; color: var(--pr); opacity: 0.5;
}
        @media (max-width: 767px) {
            .ev-header-inner  { flex-direction: column; }
            .ev-header-accent { width: 100%; height: 4px; }
            .ev-header-img    {
                width: 100%; height: 160px;
                border-left: none; border-top: 1px solid var(--bd);
            }
            .ev-header-details { padding: 1rem; }
            .ev-header h1 { font-size: 1.35rem; }
        }

        /* PRIORITY BORDER */
        .ev-p5-bar { height: 4px; background: var(--ac); }
        .ev-p4-bar { height: 4px; background: #f5d76e; }

        /* CONTENT CARD */
        .ev-card {
            background: var(--wh); border: 1px solid var(--bd);
            border-radius: var(--rd); padding: 1.5rem; margin-bottom: 1.25rem;
        }
        .ev-card h2 {
            font-size: 1rem; font-weight: 700; color: var(--pr);
            text-transform: uppercase; letter-spacing: 0.06em;
            margin-bottom: 1rem; padding-bottom: 0.5rem;
            border-bottom: 2px solid var(--ac); display: inline-block;
        }

        /* DETAIL ROWS */
        .ev-detail-row {
            display: flex; gap: 0.75rem; align-items: flex-start;
            margin-bottom: 0.85rem; font-size: 0.9rem;
        }
        .ev-detail-row:last-child { margin-bottom: 0; }
        .ev-detail-icon {
            width: 20px; text-align: center; color: var(--pr);
            flex-shrink: 0; margin-top: 2px;
        }
        .ev-detail-label { font-weight: 600; color: var(--tx); margin-bottom: 2px; font-size: 0.8rem; }
        .ev-detail-value { color: var(--mu); }
        .ev-cost-free { color: #1a7a4a; font-weight: 700; }

        /* DESCRIPTION */
        .ev-description { font-size: 0.95rem; color: var(--tx); line-height: 1.7; }
        .ev-description p { margin-bottom: 1rem; }
        .ev-description p:last-child { margin-bottom: 0; }

        /* BUTTONS */
        .ev-btn {
            display: inline-flex; align-items: center; gap: 0.5rem;
            padding: 10px 20px; border-radius: 8px; font-size: 0.88rem;
            font-weight: 600; text-decoration: none; transition: all 0.15s;
            border: none; cursor: pointer;
        }
        .ev-btn-primary { background: var(--pr); color: #fff; }
        .ev-btn-primary:hover { background: #154360; color: #fff; }
        .ev-btn-outline {
            background: var(--wh); color: var(--pr);
            border: 1.5px solid var(--pr);
        }
        .ev-btn-outline:hover { background: var(--pr-l); }
        .ev-btn-accent { background: var(--ac); color: #fff; }
        .ev-btn-accent:hover { background: #ca6f1e; color: #fff; }
        .ev-btn-sm { padding: 7px 14px; font-size: 0.8rem; }
        .ev-btn-block { display: flex; width: 100%; justify-content: center; margin-bottom: 0.6rem; }

        /* CALENDAR BUTTONS */
        .ev-cal-btn {
            display: flex; align-items: center; gap: 0.65rem;
            padding: 9px 14px; border-radius: 8px; font-size: 0.83rem;
            font-weight: 500; text-decoration: none; transition: all 0.15s;
            border: 1.5px solid var(--bd); color: var(--tx); background: var(--wh);
            margin-bottom: 0.5rem;
        }
        .ev-cal-btn:hover { border-color: var(--pr); color: var(--pr); background: var(--pr-l); }
        .ev-cal-btn i { font-size: 1rem; flex-shrink: 0; }

        /* SHARE BUTTONS */
        .ev-share { display: flex; gap: 0.5rem; flex-wrap: wrap; margin-top: 0.5rem; }
        .ev-share-btn {
            display: inline-flex; align-items: center; gap: 6px;
            padding: 7px 14px; border-radius: 8px; font-size: 0.8rem;
            font-weight: 600; text-decoration: none; transition: all 0.15s;
        }
        .ev-share-fb { background: #1877f2; color: #fff; }
        .ev-share-fb:hover { background: #1558b0; color: #fff; }
        .ev-share-wa { background: #25d366; color: #fff; }
        .ev-share-wa:hover { background: #1da851; color: #fff; }
        .ev-share-copy { background: var(--bg); color: var(--tx); border: 1px solid var(--bd); }
        .ev-share-copy:hover { background: var(--pr-l); border-color: var(--pr); color: var(--pr); }

        /* MAP */
        .ev-map-link {
            display: flex; align-items: center; gap: 0.5rem;
            padding: 0.85rem 1rem; background: var(--bg);
            border: 1px solid var(--bd); border-radius: 8px;
            text-decoration: none; color: var(--tx);
            font-size: 0.88rem; transition: all 0.15s;
            margin-top: 0.5rem;
        }
        .ev-map-link:hover { border-color: var(--pr); color: var(--pr); background: var(--pr-l); }
        .ev-map-link i { color: var(--pr); font-size: 1rem; }
        #ev-leaflet-map {
            width: 100%; height: 200px; border-radius: 8px;
            border: 1px solid var(--bd); margin-bottom: 0.5rem;
            z-index: 1;
        }
        .ev-map-placeholder {
            background: var(--bg); border: 1px solid var(--bd);
            border-radius: 8px; height: 160px; margin-bottom: 0.5rem;
            display: flex; flex-direction: column; align-items: center;
            justify-content: center; color: var(--mu); font-size: 0.85rem; gap: 0.5rem;
        }
        .ev-map-placeholder i { font-size: 2rem; color: var(--pr); opacity: 0.4; }

        /* RELATED EVENTS */
        .ev-related { margin-top: 2.5rem; }
        .ev-related-title {
            font-size: 0.78rem; font-weight: 700; text-transform: uppercase;
            letter-spacing: 0.08em; color: var(--mu); margin-bottom: 1rem;
            padding-bottom: 0.5rem; border-bottom: 2px solid var(--ac);
            display: inline-block;
        }
        .ev-rel-card {
            background: var(--wh); border: 1px solid var(--bd);
            border-radius: var(--rd); overflow: hidden;
            transition: box-shadow 0.15s; height: 100%;
        }
        .ev-rel-card:hover { box-shadow: 0 4px 16px rgba(0,0,0,0.09); }
        .ev-rel-card a { text-decoration: none; color: inherit; }
        .ev-rel-img { width: 100%; height: 140px; overflow: hidden; background: var(--bg); }
        .ev-rel-img img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.3s; }
        .ev-rel-card:hover .ev-rel-img img { transform: scale(1.04); }
        .ev-rel-placeholder {
            width: 100%; height: 140px; background: linear-gradient(135deg, #1a3a5c, #2471a3);
            display: flex; align-items: center; justify-content: center;
            color: rgba(255,255,255,0.3); font-size: 2.5rem;
        }
        .ev-rel-body { padding: 1rem; }
        .ev-rel-date { font-size: 0.73rem; color: var(--ac); font-weight: 600; margin-bottom: 0.3rem; text-transform: uppercase; }
        .ev-rel-title { font-size: 0.88rem; font-weight: 600; color: var(--tx); margin-bottom: 0.25rem; line-height: 1.3; }
        .ev-rel-venue { font-size: 0.78rem; color: var(--mu); }
        .ev-rel-badge {
            display: inline-block; font-size: 0.68rem; padding: 2px 9px;
            border-radius: 999px; background: var(--pr-l); color: var(--pr);
            font-weight: 500; margin-top: 0.4rem;
        }

        /* BACK BUTTON */
        .ev-back {
            display: inline-flex; align-items: center; gap: 0.5rem;
            color: var(--pr); font-size: 0.85rem; font-weight: 600;
            text-decoration: none; margin-bottom: 1.25rem;
            transition: gap 0.15s;
        }
        .ev-back:hover { gap: 0.75rem; color: var(--pr); }

        /* SUGGEST EDIT */
        .ev-suggest {
            text-align: center; padding: 1rem;
            font-size: 0.8rem; color: var(--mu);
            border-top: 1px solid var(--bd); margin-top: 1rem;
        }
        .ev-suggest a { color: var(--mu); }
        .ev-suggest a:hover { color: var(--pr); }

        /* COPIED TOAST */
        .ev-toast {
            position: fixed; bottom: 1.5rem; left: 50%; transform: translateX(-50%);
            background: #212529; color: #fff; padding: 10px 20px;
            border-radius: 8px; font-size: 0.85rem; font-weight: 500;
            opacity: 0; transition: opacity 0.3s; pointer-events: none; z-index: 9999;
        }
        .ev-toast.show { opacity: 1; }
        
        /* DISCLAIMER */
        .ev-disclaimer {
            font-size: 0.78rem; color: var(--mu); margin-top: 0.85rem;
            padding-top: 0.75rem; border-top: 1px solid var(--bd);
            font-style: italic;
        }
        .ev-disclaimer i { font-size: 0.72rem; }