/*
Theme Name: MaineGuide
Theme URI: https://maineguide.com
Author: MaineGuide.com
Description: Maine's Original Travel Guide since 1995
Version: 1.0
License: GNU General Public License v2 or later
Text Domain: maineguide
*/

/* === RESET & BASE === */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
body { font-family: Georgia, serif; color: #333; background: #fff; line-height: 1.6; }
a { color: #1a5276; text-decoration: none; }
a:hover { color: #c0392b; }
.container { max-width: 1200px; margin: 0 auto; padding: 0 20px; }

/* === HEADER === */
#site-header { background: #1a3a5c; color: #fff; padding: 0; box-shadow: 0 2px 8px rgba(0,0,0,0.2); }
#menu-toggle { display: none; }
.header-inner { max-width: 1200px; margin: 0 auto; padding: 0 20px; display: flex; align-items: center; justify-content: space-between; }
.site-branding a { color: #fff; text-decoration: none; display: block; padding: 15px 0; }
.site-title { display: block; font-size: 1.8rem; font-weight: bold; letter-spacing: 1px; }
.site-tagline { display: block; font-size: 0.75rem; color: #a8c4e0; letter-spacing: 2px; text-transform: uppercase; }

/* === NAVIGATION === */
/* ── Primary Nav + Dropdown ─────────────────────────────────────── */
#primary-nav ul { list-style: none; display: flex; gap: 0; margin: 0; padding: 0; }
#primary-nav ul li { position: relative; }
#primary-nav ul li a { display: block; color: #fff; padding: 20px 14px; font-family: Arial, sans-serif; font-size: 0.85rem; text-transform: uppercase; letter-spacing: 1px; transition: background 0.2s; white-space: nowrap; }
#primary-nav ul li a:hover { background: #c0392b; color: #fff; }
/* Dropdown */
#primary-nav ul li ul { display: none; position: absolute; top: 100%; left: 0; background: #1a3a5c; min-width: 220px; z-index: 9999; border-radius: 0 0 6px 6px; box-shadow: 0 6px 20px rgba(0,0,0,0.3); padding: 0.4rem 0; }
#primary-nav ul li:hover > ul { display: block; }
#primary-nav ul li ul li a { font-size: 0.82rem; padding: 0.5rem 1.2rem; text-transform: none; letter-spacing: 0; }
#primary-nav ul li ul li a:hover { background: rgba(255,255,255,0.12); }
#primary-nav ul li.menu-item-has-children > a::after { content: ' ▾'; font-size: 0.7rem; opacity: 0.8; }

/* === HERO === */
.hero { background: linear-gradient(135deg, #1a3a5c 0%, #2980b9 100%); color: #fff; padding: 80px 20px; text-align: center; }
.hero h1 { font-size: 3rem; margin-bottom: 15px; letter-spacing: 2px; }
.hero p { font-size: 1.2rem; color: #a8c4e0; max-width: 600px; margin: 0 auto; }

/* === GRIDS === */
.destinations-grid, .explore-grid { padding: 60px 20px; }
.destinations-grid { background: #f8f9fa; }
.destinations-grid h2, .explore-grid h2 { text-align: center; font-size: 2rem; color: #1a3a5c; margin-bottom: 40px; }
.grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 15px; max-width: 1200px; margin: 0 auto; }
.grid-item { background: #fff; border: 1px solid #ddd; padding: 20px; text-align: center; font-family: Arial, sans-serif; font-size: 0.95rem; color: #1a3a5c; border-radius: 4px; transition: all 0.2s; }
.grid-item:hover { background: #1a3a5c; color: #fff; border-color: #1a3a5c; transform: translateY(-2px); }
.explore-grid .grid-item { background: #f8f9fa; }
.explore-grid .grid-item:hover { background: #c0392b; color: #fff; border-color: #c0392b; }

/* === INTERIOR PAGES === */
.content-area { max-width: 900px; margin: 40px auto; padding: 0 20px; }
.content-area h1 { font-size: 2.2rem; color: #1a3a5c; margin-bottom: 20px; border-bottom: 3px solid #c0392b; padding-bottom: 10px; }
.entry-content { font-size: 1.05rem; line-height: 1.8; }
.entry-content p { margin-bottom: 1.2em; }

/* === FOOTER === */
#site-footer { background: #1a3a5c; color: #a8c4e0; padding: 40px 20px; margin-top: 60px; }
.footer-inner { max-width: 1200px; margin: 0 auto; display: flex; flex-direction: column; align-items: center; gap: 20px; }
.footer-nav ul { list-style: none; display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; }
.footer-nav ul li a { color: #a8c4e0; font-family: Arial, sans-serif; font-size: 0.85rem; padding: 4px 8px; }
.footer-nav ul li a:hover { color: #fff; }
.footer-credits { font-family: Arial, sans-serif; font-size: 0.8rem; text-align: center; color: #fff; }

/* === RESPONSIVE === */
@media (max-width: 768px) {
    #menu-toggle { display: none; }
.header-inner { flex-direction: column; padding: 15px 20px; }
    #menu-toggle { display: block; background: none; border: 2px solid rgba(255,255,255,0.6); color: #fff; font-size: 1.4rem; padding: 4px 10px; cursor: pointer; border-radius: 4px; }
    #primary-nav { display: none; width: 100%; }
    #primary-nav.nav-open { display: block; }
    #primary-nav ul { flex-direction: column; width: 100%; }
    #primary-nav ul li { width: 100%; }
    #primary-nav ul li a { padding: 12px 20px; border-bottom: 1px solid rgba(255,255,255,0.1); }
    #primary-nav ul li ul { display: none; position: static; box-shadow: none; border-radius: 0; min-width: unset; }
    #primary-nav ul li:hover > ul { display: none; }
    #primary-nav ul li.open > ul { display: block; background: rgba(0,0,0,0.2); }
    #primary-nav ul li.open > ul li a { padding-left: 2.5rem; font-size: 0.82rem; }
    .hero h1 { font-size: 2rem; }
    .site-title { font-size: 1.4rem; }
}

/* === HERO IMAGE === */
.hero {
    position: relative;
    min-height: 500px;
    display: flex;
    align-items: center;
    background-attachment: fixed;
}
.hero-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to bottom, rgba(10,30,60,0.6) 0%, rgba(10,30,60,0.4) 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
}
.hero-inner {
    text-align: center;
    color: #fff;
    padding: 40px 20px;
    position: relative;
    z-index: 2;
}
.hero-inner h1 {
    font-size: 3.5rem;
    margin-bottom: 15px;
    text-shadow: 0 2px 8px rgba(0,0,0,0.5);
}
.hero-inner p {
    font-size: 1.3rem;
    color: #d6eaf8;
    margin-bottom: 30px;
    text-shadow: 0 1px 4px rgba(0,0,0,0.5);
}
.hero-btn {
    display: inline-block;
    background: #c0392b;
    color: #fff;
    padding: 14px 36px;
    border-radius: 4px;
    font-family: Arial, sans-serif;
    font-size: 1rem;
    font-weight: bold;
    text-transform: uppercase;
    letter-spacing: 1px;
    transition: background 0.2s;
}
.hero-btn:hover { background: #e74c3c; color: #fff; }

/* === LOBSTER CTA === */
.lobster-cta {
    background: #1a3a5c;
    color: #fff;
    padding: 60px 20px;
    text-align: center;
}
.lobster-cta h2 {
    font-size: 2rem;
    color: #fff;
    margin-bottom: 15px;
}
.lobster-cta p {
    color: #a8c4e0;
    font-size: 1.1rem;
    margin-bottom: 25px;
}
.cta-btn {
    display: inline-block;
    background: #c0392b;
    color: #fff;
    padding: 14px 36px;
    border-radius: 4px;
    font-family: Arial, sans-serif;
    font-size: 1rem;
    font-weight: bold;
    text-transform: uppercase;
    letter-spacing: 1px;
    transition: background 0.2s;
}
.cta-btn:hover { background: #e74c3c; color: #fff; }

@media (max-width: 768px) {
    .hero { min-height: 350px; background-attachment: scroll; }
    .hero-inner h1 { font-size: 2.2rem; }
    .hero-inner p { font-size: 1rem; }
}

/* === PHOTO CARDS === */
.card-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 15px;
    max-width: 1200px;
    margin: 0 auto;
}
.card {
    position: relative;
    height: 220px;
    background-size: cover;
    background-position: center;
    border-radius: 6px;
    overflow: hidden;
    display: block;
    text-decoration: none;
    transition: transform 0.2s, box-shadow 0.2s;
}
.card:hover {
    transform: translateY(-4px);
    box-shadow: 0 8px 24px rgba(0,0,0,0.3);
}
.card-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0.1) 60%);
    display: flex;
    align-items: flex-end;
    padding: 16px;
    transition: background 0.2s;
}
.card:hover .card-overlay {
    background: linear-gradient(to top, rgba(26,58,92,0.85) 0%, rgba(26,58,92,0.3) 60%);
}
.card-overlay span {
    color: #fff;
    font-family: Arial, sans-serif;
    font-size: 1.05rem;
    font-weight: bold;
    text-shadow: 0 1px 4px rgba(0,0,0,0.5);
    letter-spacing: 0.5px;
}
.see-all {
    text-align: center;
    margin-top: 25px;
}
.see-all a {
    color: #1a3a5c;
    font-family: Arial, sans-serif;
    font-size: 1rem;
    font-weight: bold;
    text-decoration: none;
    border-bottom: 2px solid #c0392b;
    padding-bottom: 2px;
}
.see-all a:hover { color: #c0392b; }

@media (max-width: 900px) {
    .card-grid { grid-template-columns: repeat(2, 1fr); }
    .card { height: 180px; }
}
@media (max-width: 480px) {
    .card-grid { grid-template-columns: repeat(2, 1fr); gap: 10px; }
    .card { height: 140px; }
}
.footer-credits a { color: #fff; } .footer-credits p { color: #fff; }

/* === LISTING STYLES === */
.listing-badge { background:#c0392b; color:#fff; font-size:0.75rem; font-weight:bold; padding:3px 10px; border-radius:3px; text-transform:uppercase; letter-spacing:1px; margin-bottom:10px; display:inline-block; }
.listing-card { border:1px solid #dde4ec; border-radius:6px; padding:20px; margin-bottom:20px; background:#fff; }
.listing-card.featured { border-color:#c0392b; border-width:2px; }
.listing-card h3 { margin:8px 0 5px; font-size:1.1rem; }
.listing-card h3 a { color:#1a3a5c; text-decoration:none; }
.listing-card h3 a:hover { color:#c0392b; }
.listing-card .listing-meta { color:#666; font-size:0.85rem; margin-bottom:8px; }
.listing-card .listing-excerpt { font-size:0.95rem; color:#444; margin-bottom:10px; }
.listing-card .listing-links a { font-size:0.9rem; color:#c0392b; font-weight:bold; text-decoration:none; margin-right:15px; }
.listing-card .listing-links a:hover { text-decoration:underline; }
.listings-grid { margin-top:30px; }

/* ── Region & City Pages ────────────────────────────────────────── */
.region-hero { height: 260px !important; border-radius: 8px; margin-bottom: 1.5rem; background-size: cover; background-position: center; }
.region-intro p { font-size: 1rem; line-height: 1.7; color: #333; max-width: 800px; }

.photo-card-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 1rem; margin: 1.5rem 0; }
.photo-card { display: block; text-decoration: none; border-radius: 8px; overflow: hidden; position: relative; height: 140px; }
.photo-card img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 0.3s ease; }
.photo-card:hover img { transform: scale(1.05); }
.photo-card-label { position: absolute; bottom: 0; left: 0; right: 0; background: linear-gradient(transparent, rgba(0,0,0,0.65)); color: #fff; padding: 8px 10px 6px; font-size: 0.85rem; font-weight: 600; }



/* ══ LISTINGS OPTION C — SIDEBAR FILTER LAYOUT ══ */
.lc-wrap{display:flex;gap:32px;align-items:flex-start;max-width:1100px;margin:0 auto}
.lc-sidebar{flex:0 0 210px;background:#f8fafc;border:1px solid #dde3ea;border-radius:10px;padding:20px;position:sticky;top:80px}
.lc-filter-label{font-size:.7rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#6b7c93;margin-bottom:10px}
.lc-check{display:flex;align-items:center;gap:8px;font-size:.875rem;color:#2c3e50;cursor:pointer;padding:4px 0;user-select:none}
.lc-check input[type=checkbox]{accent-color:#c0392b;width:15px;height:15px;cursor:pointer}
.lc-results-count{margin-top:16px;font-size:.75rem;color:#6b7c93;border-top:1px solid #dde3ea;padding-top:12px}
.lc-main{flex:1;min-width:0}
.lc-section-label{display:flex;align-items:center;gap:10px;font-size:.75rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;margin-bottom:16px}
.lc-section-label::before{content:'';display:block;width:28px;height:2px}
.lc-label-featured{color:#d4a843}.lc-label-featured::before{background:#d4a843}
.lc-label-free{color:#6b7c93}.lc-label-free::before{background:#dde3ea}
.lc-divider{border:none;border-top:2px dashed #dde3ea;margin:28px 0}
.lc-featured-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:20px;margin-bottom:8px}
.lc-featured-card{background:#fff;border:2px solid #d4a843;border-radius:12px;overflow:hidden;box-shadow:0 4px 16px rgba(212,168,67,.12);transition:transform .2s,box-shadow .2s;display:flex;flex-direction:column}
.lc-featured-card:hover{transform:translateY(-3px);box-shadow:0 8px 24px rgba(212,168,67,.22)}
.lc-card-img{width:100%;height:170px;background-size:cover;background-position:center}
.lc-card-img--placeholder{background:linear-gradient(135deg,#c8dff0 0%,#a8c4d8 100%)}
.lc-card-body{padding:15px 17px 17px;display:flex;flex-direction:column;flex:1}
.lc-badge{display:inline-block;background:#d4a843;color:#fff;font-size:.65rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:3px 8px;border-radius:3px;margin-bottom:8px;width:fit-content}
.lc-card-title{font-family:Georgia,serif;font-size:1.05rem;color:#1a3a5c;margin:0 0 4px;line-height:1.3}
.lc-card-title a{color:#1a3a5c;text-decoration:none}.lc-card-title a:hover{color:#c0392b}
.lc-card-cat{font-size:.78rem;color:#6b7c93;margin-bottom:8px}
.lc-card-desc{font-size:.85rem;line-height:1.55;color:#2c3e50;margin:0 0 12px;flex:1}
.lc-card-footer{display:flex;align-items:center;justify-content:space-between;margin-top:auto;gap:10px}
.lc-phone{font-size:.8rem;color:#6b7c93}.lc-phone a{color:#6b7c93;text-decoration:none}
.lc-btn{display:inline-block;background:#c0392b;color:#fff!important;padding:7px 14px;border-radius:6px;font-size:.8rem;font-weight:600;text-decoration:none!important;white-space:nowrap}
.lc-btn:hover{background:#a93226}
.lc-free-rows{display:flex;flex-direction:column;gap:5px}
.lc-free-row{background:#fff;border:1px solid #dde3ea;border-radius:8px;padding:10px 15px;display:grid;grid-template-columns:10px 1fr auto auto auto;align-items:center;gap:12px;transition:background .15s}
.lc-free-row:hover{background:#f8fafc}
.lc-free-dot{width:8px;height:8px;border-radius:50%;background:#dde3ea}
.lc-free-name{font-weight:600;font-size:.88rem;color:#1a3a5c}
.lc-free-name a{color:#1a3a5c;text-decoration:none}.lc-free-name a:hover{color:#c0392b}
.lc-free-cat,.lc-free-phone{font-size:.78rem;color:#6b7c93}
.lc-free-phone a{color:#6b7c93;text-decoration:none}
.lc-free-link a{color:#c0392b;font-weight:600;font-size:.78rem;text-decoration:none}
@media(max-width:768px){.lc-wrap{flex-direction:column}.lc-sidebar{flex:none;width:100%;box-sizing:border-box;position:static}.lc-featured-grid{grid-template-columns:1fr}.lc-free-row{grid-template-columns:10px 1fr auto}.lc-free-cat,.lc-free-phone{display:none}}
/* ── Sponsor Cards ── */
.lc-label-sponsor{color:#1a3a5c}.lc-label-sponsor::before{background:#1a3a5c}
.lc-sponsor-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:20px;margin-bottom:8px}
.lc-sponsor-card{background:#fff;border:2px solid #1a3a5c;border-radius:12px;overflow:hidden;box-shadow:0 4px 16px rgba(26,58,92,.1);transition:transform .2s,box-shadow .2s;display:flex;flex-direction:column}
.lc-sponsor-card:hover{transform:translateY(-3px);box-shadow:0 8px 24px rgba(26,58,92,.18)}
.lc-sponsor-body{padding:16px 18px 18px;display:flex;flex-direction:column;flex:1}
.lc-sponsor-badge{display:inline-block;background:#1a3a5c;color:#fff;font-size:.65rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:3px 8px;border-radius:3px;margin-bottom:8px;width:fit-content}
.lc-btn-sponsor{background:#1a3a5c}.lc-btn-sponsor:hover{background:#122840}
/* ── Single Listing Page ── */
.sl-wrap{max-width:1000px;margin:0 auto;padding:0 20px 60px}
.sl-breadcrumb{font-size:.8rem;color:#6b7c93;padding:16px 0;margin-bottom:0}
.sl-breadcrumb a{color:#6b7c93;text-decoration:none}.sl-breadcrumb a:hover{color:#c0392b}
.sl-hero{width:100%;height:320px;background-size:cover;background-position:center;border-radius:12px;position:relative;overflow:hidden;display:flex;align-items:flex-end;margin-bottom:32px}
.sl-hero-placeholder{position:absolute;inset:0;background:linear-gradient(135deg,#c8dff0,#a8c4d8)}
.sl-hero-overlay{position:relative;z-index:2;width:100%;padding:24px 28px;background:linear-gradient(to top,rgba(0,0,0,.7) 0%,transparent 100%)}
.sl-tier-badge{display:inline-block;background:#d4a843;color:#fff;font-size:.7rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:4px 10px;border-radius:3px;margin-bottom:8px}
.sl-tier-sponsor{background:#1a3a5c}
.sl-title{font-family:Georgia,serif;font-size:2rem;color:#fff;margin:0 0 6px;line-height:1.2}
.sl-subtitle{font-size:.9rem;color:rgba(255,255,255,.85)}
.sl-body{display:grid;grid-template-columns:1fr 280px;gap:32px;align-items:flex-start}
.sl-description{font-size:1rem;line-height:1.7;color:#2c3e50}
.sl-info-card{background:#f8fafc;border:1px solid #dde3ea;border-radius:10px;padding:20px}
.sl-info-title{font-size:.7rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#6b7c93;margin-bottom:12px}
.sl-info-row{display:flex;align-items:flex-start;gap:10px;font-size:.9rem;color:#2c3e50;margin-bottom:10px}
.sl-info-row a{color:#1a3a5c;text-decoration:none}.sl-info-row a:hover{color:#c0392b}
.sl-info-icon{font-size:1rem;flex-shrink:0;margin-top:1px}
.sl-visit-btn{display:block;background:#c0392b;color:#fff!important;text-align:center;padding:10px;border-radius:7px;font-weight:600;font-size:.9rem;text-decoration:none!important;margin-top:14px}
.sl-visit-btn:hover{background:#a93226}
.sl-back-btn{display:block;color:#1a3a5c;font-size:.85rem;text-decoration:none;margin-top:12px;font-weight:600}
.sl-back-btn:hover{color:#c0392b}
.sl-related{margin-top:48px;border-top:2px dashed #dde3ea;padding-top:32px}
.sl-related-title{font-family:Georgia,serif;font-size:1.3rem;color:#1a3a5c;margin:0 0 20px}
.sl-related-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px}
.sl-related-card{display:block;background:#fff;border:1px solid #dde3ea;border-radius:8px;padding:14px 16px;text-decoration:none;transition:border-color .2s,transform .2s;position:relative}
.sl-related-card:hover{border-color:#d4a843;transform:translateY(-2px)}
.sl-related-badge{display:inline-block;background:#d4a843;color:#fff;font-size:.6rem;font-weight:700;padding:2px 6px;border-radius:2px;margin-bottom:6px}
.sl-related-name{font-weight:600;font-size:.9rem;color:#1a3a5c}
.sl-related-link{font-size:.78rem;color:#c0392b;margin-top:6px;font-weight:600}
@media(max-width:700px){.sl-body{grid-template-columns:1fr}.sl-hero{height:220px}.sl-title{font-size:1.4rem}}
