.key-takeaways{background:linear-gradient(135deg,color-mix(in srgb,var(--primary-color) 10%,transparent),color-mix(in srgb,var(--secondary-color) 10%,transparent));border-left:4px solid var(--accent-color);border-radius:8px;padding:1.5rem 2rem;margin:2rem 0;box-shadow:0 2px 8px rgba(0,0,0,0.2)}.key-takeaways h2{color:var(--accent-color);font-size:1.3rem;margin-top:0;margin-bottom:1rem;display:flex;align-items:center;gap:.5rem}.key-takeaways h2:before{content:"💡";font-size:1.5rem}.key-takeaways ul{margin:0;padding-left:1.5rem}.key-takeaways li{margin-bottom:.75rem;line-height:1.6}.blog-image{margin:2.5rem auto;max-width:800px;text-align:center}.blog-image img{width:100%;max-width:100%;height:auto;border-radius:8px;box-shadow:0 4px 12px rgba(0,0,0,0.3);display:block;margin:0 auto}.blog-image .image-caption{margin-top:.75rem;font-size:.9rem;color:var(--text-muted);font-style:italic;line-height:1.4}.table-of-contents{background:var(--card-background);border:1px solid var(--border-light);border-radius:8px;padding:1.5rem;margin:2rem 0}.table-of-contents h2{font-size:1.2rem;margin-top:0;margin-bottom:1rem;color:var(--accent-color)}.table-of-contents ul{list-style:none;padding-left:0;margin:0}.table-of-contents li{margin-bottom:.5rem}.table-of-contents a{color:var(--text-primary);text-decoration:none;display:block;padding:.25rem 0;transition:color .2s}.table-of-contents a:hover{color:var(--accent-color)}.reading-time{color:var(--text-muted);font-size:.9rem;margin-left:1rem}.author-bio-box{background:var(--card-background);border:1px solid var(--border-light);border-radius:8px;padding:2rem;margin:3rem 0;display:flex;gap:1.5rem;align-items:start}.author-bio-box img{border-radius:50%;border:3px solid var(--accent-color)}.author-bio-content h3{margin-top:0;margin-bottom:.5rem;color:var(--accent-color)}.author-bio-content p{margin:0;color:var(--text-secondary)}.author-bio-link{display:inline-block;margin-top:.75rem;color:var(--accent-color);text-decoration:none;font-weight:500}.faq-section{margin:3rem 0}.faq-section h2{color:var(--accent-color);margin-bottom:1.5rem}.faq-item{background:var(--card-background);border:1px solid var(--border-light);border-radius:8px;margin-bottom:1rem;overflow:hidden;transition:all .3s ease}.faq-item:hover{border-color:var(--accent-color)}.faq-question{width:100%;background:transparent;border:none;padding:1.5rem;display:flex;justify-content:space-between;align-items:center;cursor:pointer;text-align:left;font-weight:600;color:var(--text-primary);font-size:1.1rem;transition:background-color .2s ease;font-family:'Montserrat',sans-serif}.faq-question:hover{background-color:color-mix(in srgb,var(--primary-color) 10%,transparent)}.faq-question-text{flex:1;padding-right:1rem}.faq-toggle{font-size:1.5rem;font-weight:300;color:var(--accent-color);transition:transform .3s ease;flex-shrink:0;width:24px;height:24px;display:flex;align-items:center;justify-content:center}.faq-question[aria-expanded="true"] .faq-toggle{transform:rotate(45deg)}.faq-answer{max-height:0;overflow:hidden;transition:max-height .4s ease-out}.faq-answer-content{padding:0 1.5rem 1.5rem 1.5rem;color:var(--text-secondary);line-height:1.6}.faq-item.active .faq-answer{max-height:1000px;transition:max-height .5s ease-in}.related-articles{margin:3rem 0;padding:2rem;background:var(--card-background);border-radius:8px}.related-articles h2{color:var(--accent-color);margin-top:0;margin-bottom:1.5rem}.related-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:1.5rem}.related-card{background:rgba(255,255,255,0.05);border-radius:8px;overflow:hidden;transition:transform .2s}.related-card:hover{transform:translateY(-4px)}.related-card a{text-decoration:none;color:var(--text-primary)}.related-card img{width:100%;height:150px;object-fit:cover}.related-card-content{padding:1rem}.related-card h3{font-size:1rem;margin:0 0 .5rem 0}.related-card-meta{font-size:.85rem;color:var(--text-muted)}.tags-section{margin:2rem 0}.tags-section h3{font-size:1rem;color:var(--text-muted);margin-bottom:1rem}.tags-list{display:flex;flex-wrap:wrap;gap:.5rem}.tag-item{background:color-mix(in srgb,var(--primary-color) 20%,transparent);color:var(--accent-color);padding:.5rem 1rem;border-radius:20px;font-size:.9rem;text-decoration:none;border:1px solid color-mix(in srgb,var(--primary-color) 30%,transparent);transition:all .2s}.tag-item:hover{background:color-mix(in srgb,var(--primary-color) 30%,transparent);transform:translateY(-2px)}.blog-post-tags{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:.5rem}.blog-post-tags .tag{background:color-mix(in srgb,var(--primary-color) 15%,transparent);color:var(--text-muted);padding:.2rem .7rem;border-radius:20px;font-size:.8rem;border:1px solid color-mix(in srgb,var(--primary-color) 25%,transparent)}@media(max-width:768px){.breadcrumb-nav span:last-child{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:180px;display:inline-block;vertical-align:middle}}.blog-post-header{text-align:center;padding:3rem 0 2rem}.blog-post-meta{color:var(--text-muted);font-family:'Montserrat',sans-serif;font-size:14px;margin-bottom:1rem}.blog-post-tags{display:flex;gap:.5rem;justify-content:center;flex-wrap:wrap;margin-top:1rem}.tag{background-color:color-mix(in srgb,var(--primary-color) 20%,transparent);color:var(--accent-color);padding:.25rem .75rem;border-radius:4px;font-size:12px;font-family:'Montserrat',sans-serif;border:1px solid color-mix(in srgb,var(--primary-color) 30%,transparent)}.key-takeaways{background:linear-gradient(135deg,color-mix(in srgb,var(--primary-color) 10%,transparent),color-mix(in srgb,var(--secondary-color) 10%,transparent));border-left:4px solid var(--accent-color);border-radius:8px;padding:1.5rem 2rem;margin:2rem 0;box-shadow:0 2px 8px rgba(0,0,0,0.2)}.key-takeaways h2{color:var(--accent-color);font-size:1.3rem;margin-top:0;margin-bottom:1rem;display:flex;align-items:center;gap:.5rem}.key-takeaways h2:before{content:"⭐";font-size:1.5rem}.key-takeaways ul{margin:0;padding-left:1.5rem}.key-takeaways li{margin-bottom:.75rem;line-height:1.6}.table-of-contents{background:var(--card-background);border:1px solid var(--border-light);border-radius:8px;padding:1.5rem;margin:2rem 0}.table-of-contents h2{font-size:1.2rem;margin-top:0;margin-bottom:1rem;color:var(--accent-color)}.table-of-contents ul{list-style:none;padding-left:0;margin:0}.table-of-contents li{margin-bottom:.5rem}.table-of-contents a{color:var(--text-primary);text-decoration:none;display:block;padding:.25rem 0;transition:color .2s}.table-of-contents a:hover{color:var(--accent-color)}.faq-section{margin:3rem 0}.faq-section h2{color:var(--accent-color);margin-bottom:1.5rem}.faq-item{background:var(--card-background);border:1px solid var(--border-light);border-radius:8px;padding:1.5rem;margin-bottom:1rem}.faq-question{display:block;width:100%;background:none;border:none;padding:0;text-align:left;cursor:default;font-weight:600;color:var(--text-primary);margin-bottom:.75rem;font-size:1.1rem;font-family:inherit}.faq-answer{color:var(--text-secondary);line-height:1.6}.related-blog-posts{margin:3rem 0;padding:2rem;background:var(--card-background);border-radius:8px;border:1px solid var(--border-light)}.related-blog-posts h2{color:var(--accent-color);margin-top:0;margin-bottom:1.5rem}.blog-post-link{display:block;padding:1rem;background:rgba(255,255,255,0.03);border-radius:8px;margin-bottom:1rem;text-decoration:none;color:var(--text-primary);transition:all .2s;border:1px solid transparent}.blog-post-link:hover{background:color-mix(in srgb,var(--primary-color) 10%,transparent);border-color:var(--accent-color);transform:translateX(4px)}.blog-post-link h3{margin:0 0 .5rem 0;color:var(--accent-color);font-size:1.1rem}.blog-post-link p{margin:0;color:var(--text-muted);font-size:.9rem}.last-updated{text-align:center;color:var(--text-muted);font-size:.9rem;margin:2rem 0;padding:1rem;background:rgba(255,255,255,0.02);border-radius:4px}.category-filter{display:flex;gap:.75rem;flex-wrap:wrap}.filter-btn{padding:.5rem 1.25rem;background:var(--background-card);border:2px solid var(--border-light);color:var(--text-secondary);border-radius:25px;cursor:pointer;font-family:'Montserrat',sans-serif;font-size:.95rem;font-weight:600;transition:all .3s ease;text-align:center;line-height:1.3;display:inline-flex;align-items:center;justify-content:center}.filter-btn:hover{border-color:var(--primary-color);color:var(--text-primary);transform:translateY(-2px)}.filter-btn.active{background:var(--primary-color);border-color:var(--primary-color);color:white}.post-card{transition:opacity .3s ease,transform .3s ease}.post-card.hidden{display:none}@media(max-width:768px){.category-filter{width:100%}.filter-btn{flex:1;min-width:100px;font-size:.82rem;padding:.55rem .6rem}}.card-season-badge{background:rgba(244,208,63,0.12);border:1px solid rgba(244,208,63,0.35);color:#f4d03f;padding:.2rem .6rem;border-radius:4px;font-size:.72rem;font-family:'Courier New',monospace;letter-spacing:.5px}.card-level-badge{padding:.2rem .6rem;border-radius:4px;font-size:.72rem;font-family:'Courier New',monospace;letter-spacing:.5px}.card-level-badge.beginner{background:rgba(125,206,148,0.12);border:1px solid rgba(125,206,148,0.35);color:#7dce94}.card-level-badge.intermediate{background:rgba(137,196,244,0.12);border:1px solid rgba(137,196,244,0.35);color:#89c4f4}.card-read-link{color:#f4d03f;font-size:.88rem;font-weight:600;font-family:'Courier New',monospace;letter-spacing:.5px}.card-best-time{font-size:.80rem;color:rgba(255,255,255,0.40);font-family:'Courier New',monospace}.tweet-container{display:flex;justify-content:center;margin:1.5rem 0}.tweet-container .twitter-tweet{margin:0 auto!important}.section-footer{text-align:center;margin-top:2.5rem}.btn-view-more{display:inline-block;padding:.75rem 2rem;background:transparent;border:1px solid var(--border-light);color:var(--accent-color);font-family:'Courier New',monospace;font-size:.88rem;letter-spacing:1.5px;text-transform:uppercase;text-decoration:none;border-radius:6px;cursor:pointer;transition:background .2s,border-color .2s,color .2s}.btn-view-more:hover{background:transparent;border-color:var(--accent-color);color:var(--text-primary)}.planet-card.hidden-body{display:none}.preview-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.5rem}@media(max-width:900px){.preview-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:500px){.preview-grid{grid-template-columns:1fr}}.preview-card{display:block;text-decoration:none;color:inherit;background:var(--background-card);border:1px solid var(--border-light);border-radius:10px;overflow:hidden;transition:transform .22s,box-shadow .22s,border-color .22s}.preview-card:hover{transform:translateY(-4px);box-shadow:0 10px 28px rgba(0,0,0,0.45);border-color:rgba(244,208,63,0.40)}.preview-card-img{height:150px;background-size:cover;background-position:center;position:relative}.preview-card-img::after{content:'';position:absolute;inset:0;background:linear-gradient(to bottom,transparent 45%,rgba(10,15,35,0.85) 100%)}.preview-badge{position:absolute;top:.7rem;left:.7rem;background:rgba(0,0,0,0.85);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(244,208,63,0.65);color:#f4d03f;text-shadow:0 1px 4px rgba(0,0,0,1);padding:.2rem .6rem;border-radius:20px;font-size:.70rem;font-family:'Courier New',monospace;letter-spacing:1px;z-index:1}.preview-card-body{padding:1rem 1.1rem 1.2rem}.preview-card-title{font-size:1rem;font-weight:700;color:#fff;margin:0 0 .3rem}.preview-card-desc{font-size:.82rem;color:rgba(255,255,255,0.58);line-height:1.60;margin:0}.section-label{font-family:'Courier New',monospace;font-size:.72rem;letter-spacing:3px;color:#f4d03f;text-transform:uppercase;display:block;margin-bottom:.5rem}.btn-submit{align-self:flex-start;padding:.75rem 2.2rem;background:transparent;border:1px solid var(--border-light);border-radius:6px;color:var(--accent-color);font-family:'Courier New',monospace;font-size:.88rem;letter-spacing:1.5px;text-transform:uppercase;cursor:pointer;transition:background .2s,border-color .2s,color .2s}.btn-submit:hover:not(:disabled){background:var(--background-light);border-color:var(--accent-color);color:var(--text-primary)}.btn-submit:disabled{opacity:.55;cursor:default}.section-label{font-family:'Courier New',monospace;color:#f4d03f;font-size:.75rem;letter-spacing:3px;text-transform:uppercase;display:block;margin-bottom:.6rem}.dot-red{background:#e55a2b;box-shadow:0 0 6px #e55a2b}.dot-blue{background:#89c4f4;box-shadow:0 0 6px #89c4f4}@keyframes lb-fadein{from{opacity:0}to{opacity:1}}.rel-link{background:rgba(15,20,45,0.70);border:1px solid rgba(137,196,244,0.22);border-radius:8px;padding:.9rem 1.3rem;color:#89c4f4;text-decoration:none;font-size:.92rem;transition:border-color .2s,background .2s}.rel-link:hover{border-color:rgba(137,196,244,0.55);background:rgba(137,196,244,0.08);color:#fff}.rel-link span{display:block;font-size:.75rem;color:rgba(255,255,255,0.40);margin-top:.2rem;font-family:'Courier New',monospace}.illustration-wrap{margin:2.5rem 0;border-radius:12px;overflow:hidden;border:1px solid rgba(137,196,244,0.15);background:#050810}.illustration-wrap svg{width:100%;height:auto;display:block}.illustration-caption{padding:.65rem 1rem;background:rgba(5,8,16,0.90);font-size:.76rem;color:rgba(255,255,255,0.40);font-family:'Courier New',monospace;text-align:center;letter-spacing:1px;border-top:1px solid rgba(137,196,244,0.10)}.intro-section{background:var(--background-card);padding:2rem;border-radius:8px;margin-bottom:3rem;border-left:4px solid var(--primary-color)}.intro-section p{color:var(--text-secondary);line-height:1.8;margin-bottom:1rem;font-size:1.05rem}.intro-section p:last-child{margin-bottom:0}.subsection-heading{font-size:1.5rem;color:var(--accent-color);margin:2rem 0 1rem}.mod-quote{background:var(--background-card);border-left:4px solid var(--text-muted);padding:1.5rem;margin:2rem 0;font-style:italic;color:var(--text-secondary);line-height:1.7}.bullet-list{list-style:none;padding-left:0;margin:1.5rem 0}.bullet-list li{padding:.5rem 0 .5rem 2rem;position:relative;color:var(--text-secondary);line-height:1.7}.bullet-list li:before{content:"▸";color:var(--primary-color);font-weight:bold;position:absolute;left:.5rem}defs radialGradient{cx:50%;cy:50%;r:50%}.section-label{font-family:'Courier New',monospace;color:#f4d03f;font-size:.75rem;letter-spacing:3px;text-transform:uppercase;display:block;margin-bottom:.6rem}.step-content h4{font-size:1rem;font-weight:700;color:#fff;margin:.1rem 0 .4rem}.step-content p{font-size:.93rem;color:rgba(255,255,255,0.70);line-height:1.68;margin:0}.illustration-wrap{background:rgba(8,2,2,0.75);border:1px solid rgba(229,90,43,0.15);border-radius:12px;overflow:hidden;margin:2.5rem 0}.illustration-caption{padding:.75rem 1.25rem;font-size:.83rem;color:rgba(255,255,255,0.50);font-family:'Courier New',monospace;letter-spacing:.5px;background:rgba(0,0,0,0.30)}.faq-item{border-bottom:1px solid rgba(255,255,255,0.07);padding:1.25rem 0}.faq-item:last-child{border-bottom:none}.faq-question{font-size:1.05rem;color:#fff;font-weight:600;margin-bottom:.6rem;cursor:pointer}.faq-answer{font-size:.95rem;color:rgba(255,255,255,0.65);line-height:1.72}.faq-item{border-bottom:1px solid rgba(255,255,255,0.07);padding:1.25rem 0}.faq-item:last-child{border-bottom:none}.faq-question{font-size:1.05rem;color:#fff;font-weight:600;margin-bottom:.6rem;cursor:pointer}.faq-answer{font-size:.95rem;color:rgba(255,255,255,0.65);line-height:1.72}.faq-item{border-bottom:1px solid rgba(255,255,255,0.07);padding:1.25rem 0}.faq-item:last-child{border-bottom:none}.faq-question{font-size:1.05rem;color:#fff;font-weight:600;margin-bottom:.6rem;cursor:pointer}.faq-answer{font-size:.95rem;color:rgba(255,255,255,0.65);line-height:1.72}.faq-item{border-bottom:1px solid rgba(255,255,255,0.07);padding:1.25rem 0}.faq-item:last-child{border-bottom:none}.faq-question{font-size:1.05rem;color:#fff;font-weight:600;margin-bottom:.6rem;cursor:pointer}.faq-answer{font-size:.95rem;color:rgba(255,255,255,0.65);line-height:1.72}.faq-item{border-bottom:1px solid rgba(255,255,255,0.07);padding:1.25rem 0}.faq-item:last-child{border-bottom:none}.faq-question{font-size:1.05rem;color:#fff;font-weight:600;margin-bottom:.6rem;cursor:pointer}.faq-answer{font-size:.95rem;color:rgba(255,255,255,0.65);line-height:1.72}.two-col{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;margin:2rem 0}.featured-cases-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(350px,1fr));gap:2rem;margin:3rem 0}.features-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:2rem;margin:3rem 0}.feature-box{background:var(--background-card);padding:2rem;border-radius:8px;border-left:4px solid var(--primary-color);text-align:center}.feature-icon{font-size:3rem;margin-bottom:1rem}.feature-title{font-size:1.3rem;color:var(--accent-color);margin-bottom:.75rem}.feature-text{color:var(--text-secondary);line-height:1.6}.section-label{font-family:'Courier New',monospace;color:#f4d03f;font-size:.75rem;letter-spacing:3px;text-transform:uppercase;display:block;margin-bottom:.6rem}.step-content h4{font-size:1rem;font-weight:700;color:#fff;margin:.1rem 0 .4rem}.step-content p{font-size:.93rem;color:rgba(255,255,255,0.70);line-height:1.68;margin:0}.illustration-wrap{background:rgba(5,10,25,0.70);border:1px solid rgba(137,196,244,0.15);border-radius:12px;overflow:hidden;margin:2.5rem 0}.illustration-caption{padding:.75rem 1.25rem;font-size:.83rem;color:rgba(255,255,255,0.50);font-family:'Courier New',monospace;letter-spacing:.5px;background:rgba(0,0,0,0.25)}/* Planet Page Specific Styles */
/* Extends the main styles.css */

/* Ensure border-box everywhere — prevents padding from expanding elements beyond their container */
.planet-hero,
.planet-hero-content,
.planet-content,
.content-grid,
.main-content,
.main-content *,
.facts-sidebar,
.facts-box,
.related-planets,
.faq-section,
.faq-item {
    box-sizing: border-box;
}.planet-hero {
    position: relative;
    min-height: 400px;
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2rem 0;
}.planet-hero::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(135deg, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.4));
}.planet-hero-content {
    position: relative;
    z-index: 1;
    text-align: center;
    color: white;
    max-width: 800px;
    padding: 0 20px;
}.planet-hero-content h1 {
    font-size: clamp(32px, 4vw, 52px);
    font-weight: 700;
    margin-bottom: 0.5rem;
    text-shadow: 0 2px 10px rgba(0, 0, 0, 0.5);
    line-height: 1.15;
}.planet-hero-content .subtitle {
    font-size: 20px;
    opacity: 0.95;
    font-style: italic;
}/* Responsive Design */

/* ── Tablet (≤968px) ── */
@media (max-width: 968px) {
    .planet-hero {
        min-height: 320px;
        height: auto;
        background-attachment: scroll; /* fixed breaks on iOS */
    }

    .planet-hero-content h1 {
        font-size: 36px;
        line-height: 1.15;
    }

    .content-grid {
        grid-template-columns: 1fr;
        gap: 2rem;
    }

    .facts-sidebar {
        position: static;
    }

    /* Fact items in a 2-column grid on tablet so they don't take up so much vertical space */
    .facts-box {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 0.75rem;
    }
    .facts-box h2 {
        grid-column: 1 / -1;
    }
    .fact-item {
        margin-bottom: 0;
    }

    .main-content {
        padding: 2rem;
    }

    .image-gallery {
        grid-template-columns: 1fr;
    }

    .related-planets {
        padding: 1.5rem;
    }
}/* ── Mobile (≤640px) ── */
@media (max-width: 640px) {
    /* Hero: taller, no parallax, gradient adjusted for readability */
    .planet-hero {
        min-height: 250px;
        height: auto;
        background-attachment: scroll;
    }

    .planet-hero::before {
        background: linear-gradient(180deg, rgba(0, 0, 0, 0.35) 0%, rgba(0, 0, 0, 0.7) 100%);
    }

    .planet-hero-content {
        padding: 0 1.25rem;
    }

    .planet-hero-content h1 {
        font-size: 24px;
        margin-bottom: 0.3rem;
        line-height: 1.2;
    }

    .planet-hero-content .subtitle {
        font-size: 14px;
        line-height: 1.4;
    }

    /* Content wrapper — prevent any horizontal overflow */
    .planet-content {
        padding: 1.5rem 10px;
        overflow-x: hidden;
        max-width: 100vw;
    }

    /* Main card — constrain width, prevent overflow */
    .main-content {
        padding: 1.25rem 1rem;
        border-radius: 6px;
        overflow: hidden;
        max-width: 100%;
        word-wrap: break-word;
        overflow-wrap: break-word;
    }

    .main-content h2 {
        font-size: 21px;
        margin-top: 1.5rem;
        margin-bottom: 0.75rem;
        padding-bottom: 0.4rem;
        border-bottom-width: 2px;
    }

    .main-content h3 {
        font-size: 18px;
        margin-top: 1.25rem;
        margin-bottom: 0.5rem;
    }

    .main-content p {
        font-size: 15px;
        line-height: 1.75;
        margin-bottom: 1rem;
    }

    .main-content li {
        font-size: 15px;
        line-height: 1.7;
    }

    /* Key Takeaways & ToC — constrained and tighter on mobile */
    .key-takeaways {
        padding: 0.85rem 0.85rem !important;
        margin: 1rem 0 !important;
        max-width: 100% !important;
        overflow: hidden !important;
    }
    .key-takeaways h2 {
        font-size: 17px !important;
        margin-bottom: 0.5rem !important;
        margin-top: 0 !important;
    }
    .key-takeaways ul {
        padding-left: 1.1rem !important;
        margin: 0 !important;
    }
    .key-takeaways li {
        font-size: 14px !important;
        line-height: 1.55 !important;
        margin-bottom: 0.5rem !important;
    }

    .table-of-contents {
        padding: 0.85rem 0.85rem !important;
        margin: 1rem 0 !important;
        max-width: 100% !important;
        overflow: hidden !important;
    }
    .table-of-contents h2 {
        font-size: 17px !important;
        margin-bottom: 0.5rem !important;
        margin-top: 0 !important;
    }
    .table-of-contents li {
        font-size: 14px !important;
        margin-bottom: 0.35rem !important;
    }

    /* Facts sidebar — single column on phone, compact */
    .facts-box {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 0.5rem;
        padding: 1rem;
    }
    .facts-box h2 {
        grid-column: 1 / -1;
        font-size: 20px;
        margin-bottom: 0.75rem;
    }
    .fact-item {
        margin-bottom: 0;
        padding: 0.65rem 0.75rem;
    }
    .fact-label {
        font-size: 10px;
    }
    .fact-value {
        font-size: 13px;
    }

    /* Info / warning callouts */
    .info-callout,
    .warning-callout {
        padding: 1rem;
        margin: 1.25rem 0;
    }
    .info-callout strong,
    .warning-callout strong {
        font-size: 15px;
    }
    .info-callout p,
    .warning-callout p {
        font-size: 14px;
        line-height: 1.65;
    }

    /* Tables scroll horizontally rather than overflow */
    .main-content table,
    .data-table {
        display: block;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        max-width: 100%;
        font-size: 13px;
    }

    /* Inline tables — smaller cells on mobile */
    .main-content table th,
    .main-content table td {
        padding: 0.5rem 0.6rem;
    }

    /* FAQ section */
    .faq-section {
        padding: 0;
    }
    .faq-section h2 {
        font-size: 20px;
    }
    .faq-item {
        margin-bottom: 0.75rem;
        padding: 0.85rem !important;
        max-width: 100%;
        overflow: hidden;
    }
    .faq-question {
        font-size: 15px;
        padding: 0 !important;
        margin-bottom: 0.5rem;
    }
    .faq-answer {
        font-size: 14px;
        line-height: 1.65;
        padding: 0 !important;
    }

    /* Related sections */
    .related-planets {
        padding: 1rem 0.85rem;
        margin-top: 1.5rem;
        max-width: 100%;
        overflow: hidden;
    }
    .related-planets h2 {
        font-size: 20px;
        margin-bottom: 1rem;
    }

    .related-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 0.75rem;
    }

    /* Related articles single column on mobile */
    .related-articles .related-grid {
        grid-template-columns: 1fr;
    }

    /* Explore More Stars grid — 2 columns on mobile */
    .related-planets div[style*="grid-template-columns"] {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 0.5rem !important;
    }

    /* Inline figure images */
    .main-content figure {
        margin: 1.25rem 0 !important;
    }
    .main-content figcaption {
        font-size: 0.8rem !important;
    }

    /* Breadcrumb compact */
    .breadcrumb {
        font-size: 13px;
        padding: 0.6rem 0;
    }
}
/* ============================================================
   Planet / Star page styles (formerly planet-styles.css)
   ============================================================ */
/* Planet Content Layout */
.planet-content {
    max-width: 1200px;
    margin: 0 auto;
    padding: 3rem 20px;
}.content-grid {
    display: grid;
    grid-template-columns: 1fr 350px;
    gap: 3rem;
}
@media (max-width: 968px) {
    .content-grid {
        grid-template-columns: 1fr;
        gap: 2rem;
    }
    .facts-sidebar {
        position: static;
    }
    .main-content {
        padding: 1.5rem;
    }
}
@media (max-width: 640px) {
    .content-grid {
        gap: 1.5rem;
    }
    .main-content {
        padding: 1.25rem;
    }
    .blog-post-header {
        padding: 1.5rem 0 1rem;
    }
    .blog-post-meta {
        font-size: 13px;
    }
}
.main-content {
    background-color: var(--background-card);
    padding: 2.5rem;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
    border: 1px solid var(--border-light);
}.main-content h2 {
    font-size: 28px;
    color: var(--primary-color);
    margin-top: 2rem;
    margin-bottom: 1rem;
    padding-bottom: 0.5rem;
    border-bottom: 3px solid var(--primary-color);
}.main-content h2:first-child {
    margin-top: 0;
}.main-content h3 {
    font-size: 22px;
    color: var(--text-primary);
    margin-top: 1.5rem;
    margin-bottom: 0.75rem;
}.main-content p {
    font-size: 16px;
    line-height: 1.8;
    margin-bottom: 1.25rem;
    color: var(--text-secondary);
}.main-content ul, .main-content ol {
    margin-bottom: 1.25rem;
    padding-left: 1.5rem;
}.main-content li {
    font-size: 16px;
    line-height: 1.8;
    color: var(--text-secondary);
    margin-bottom: 0.75rem;
}/* Facts Sidebar */
.facts-sidebar {
    position: sticky;
    top: 80px;
    align-self: start;
}.facts-box {
    background: var(--background-card);
    color: var(--text-primary);
    padding: 2rem;
    border-radius: 12px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.4);
    border: 1px solid var(--border-light);
    backdrop-filter: blur(10px);
}.facts-box h2 {
    font-size: 24px;
    margin-bottom: 1.5rem;
    text-align: center;
    font-weight: 700;
}.fact-item {
    background-color: var(--background-light);
    padding: 1rem;
    margin-bottom: 1rem;
    border-radius: 8px;
    border-left: 4px solid var(--primary-color);
    transition: var(--transition);
    border: 1px solid var(--border-light);
}.fact-item:hover {
    background-color: var(--background-card);
    border-left-color: var(--primary-color);
    transform: translateX(4px);
}.fact-item:last-child {
    margin-bottom: 0;
}.fact-label {
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--accent-color);
    margin-bottom: 0.25rem;
    font-family: 'Montserrat', sans-serif;
}.fact-value {
    font-size: 15px;
    line-height: 1.5;
}/* Image Gallery */
.image-gallery {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 1.5rem;
    margin: 2rem 0;
}.gallery-item {
    position: relative;
    overflow: hidden;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    transition: var(--transition);
}.gallery-item:hover {
    transform: translateY(-4px);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
}.gallery-item img {
    width: 100%;
    height: auto;
    display: block;
}.gallery-caption {
    padding: 1rem;
    background-color: var(--background-card);
    font-size: 13px;
    color: var(--text-secondary);
    text-align: center;
    line-height: 1.5;
}.image-credit {
    font-size: 11px;
    color: var(--text-muted);
    font-style: italic;
    margin-top: 0.5rem;
    display: block;
}/* Data Tables */
.data-table {
    width: 100%;
    border-collapse: collapse;
    margin: 2rem 0;
    background-color: var(--background-card);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    border-radius: 8px;
    overflow: hidden;
}.data-table thead {
    background: linear-gradient(135deg, var(--primary-color), var(--secondary-color));
    color: white;
}.data-table th {
    padding: 1rem;
    font-family: 'Montserrat', sans-serif;
    font-size: 14px;
    font-weight: 600;
    text-align: left;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}.data-table td {
    padding: 1rem;
    border-bottom: 1px solid var(--border-light);
    font-size: 15px;
    color: var(--text-secondary);
}.data-table tbody tr:hover {
    background-color: var(--background-light);
}.data-table tbody tr:last-child td {
    border-bottom: none;
}/* Comparison Image */
.comparison-box {
    background-color: #000;
    padding: 2rem;
    border-radius: 8px;
    text-align: center;
    margin: 2rem 0;
}.comparison-box img {
    max-width: 100%;
    height: auto;
    margin-bottom: 1rem;
}.comparison-box p {
    color: white;
    font-size: 15px;
    margin: 0;
}/* Info Callouts */
.info-callout {
    background-color: var(--background-card);
    border-left: 4px solid var(--primary-color);
    padding: 1.5rem;
    margin: 2rem 0;
    border-radius: 4px;
}.warning-callout {
    background-color: var(--background-card);
    border-left: 4px solid #ff9800;
    padding: 1.5rem;
    margin: 2rem 0;
    border-radius: 4px;
}.info-callout p, .warning-callout p {
    margin-bottom: 0;
    color: var(--text-primary);
}.info-callout strong, .warning-callout strong {
    display: block;
    margin-bottom: 0.5rem;
    font-family: 'Montserrat', sans-serif;
    font-size: 16px;
}/* Breadcrumb Navigation */
.breadcrumb {
    background-color: var(--dark-blue-light);
    padding: 1rem 0;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
    border-bottom: 1px solid var(--border-light);
}.breadcrumb-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}.breadcrumb-nav {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 14px;
    color: var(--text-muted);
    font-family: 'Montserrat', sans-serif;
}.breadcrumb-nav a {
    color: var(--primary-color);
    transition: var(--transition);
}.breadcrumb-nav a:hover {
    color: var(--primary-dark);
}.breadcrumb-separator {
    color: var(--text-muted);
}/* Related Planets */
.related-planets {
    background-color: var(--background-card);
    padding: 2rem;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
    border: 1px solid var(--border-light);
    margin-top: 3rem;
}.related-planets h2 {
    font-size: 24px;
    margin-bottom: 1.5rem;
    text-align: center;
}.related-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 1.5rem;
}.related-planet-card {
    text-align: center;
    padding: 1rem;
    border-radius: 8px;
    transition: var(--transition);
}.related-planet-card:hover {
    background-color: var(--background-light);
    transform: translateY(-4px);
}.related-planet-card img {
    width: 100px;
    height: 100px;
    border-radius: 50%;
    margin: 0 auto 0.75rem;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
    object-fit: cover;
    object-position: center;
}.related-planet-card h3 {
    font-size: 16px;
    margin: 0;
}/* Dark Theme Enhancements for Premium Look */
.main-content a {
    color: var(--accent-color);
    text-decoration: underline;
    text-decoration-color: rgba(96, 165, 250, 0.3);
    transition: var(--transition);
}.main-content a:hover {
    color: var(--primary-color);
    text-decoration-color: rgba(147, 197, 253, 0.6);
}/* Enhance readability */
.planet-content {
    background-color: var(--dark-blue);
}/* Better contrast for info callouts */
.info-callout {
    background-color: var(--background-card);
    border-left: 4px solid var(--primary-color);
}.warning-callout {
    background-color: rgba(251, 146, 60, 0.15);
    border-left: 4px solid #fb923c;
}.info-callout p, .warning-callout p {
    color: var(--text-primary);
}/* Data table dark theme */
.data-table {
    background-color: var(--background-card);
    border: 1px solid var(--border-light);
}.data-table td {
    color: var(--text-secondary);
}/* Gallery captions */
.gallery-caption {
    border-top: 1px solid var(--border-light);
}/* ── Related Articles (blog post section) ────────────────────────────────── */
.related-articles {
    margin-top: 3rem;
    padding-top: 2rem;
    border-top: 1px solid var(--border-light);
}.related-articles h2 {
    font-size: 22px;
    margin-bottom: 1.5rem;
    color: var(--text-primary);
    border-bottom: 3px solid var(--primary-color);
    padding-bottom: 0.5rem;
}.related-articles .related-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
    gap: 1.5rem;
}.related-card {
    background-color: var(--background-light);
    border-radius: 8px;
    overflow: hidden;
    border: 1px solid var(--border-light);
    transition: var(--transition);
}.related-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--shadow-md);
    border-color: var(--primary-color);
}.related-card a {
    display: block;
    text-decoration: none;
    color: inherit;
}.related-card img {
    width: 100%;
    height: 160px;
    object-fit: cover;
    display: block;
}.related-card-content {
    padding: 1rem;
}.related-card-content h3 {
    font-size: 15px;
    line-height: 1.4;
    margin-bottom: 0.5rem;
    color: var(--text-primary);
    white-space: normal;
    overflow: visible;
}/* =====================================================================
   FAQ ACCORDION — planet, star, and solar system region pages
   Covers .faq-section (planet/star pages) and .region-faq (region pages)
   JS in script.js handles toggling .active on .faq-item on click
   ===================================================================== */

/* Card wrapper */
.faq-section .faq-item,
.region-faq .faq-item {
    background: var(--card-background);
    border: 1px solid var(--border-light);
    border-radius: 10px;
    margin-bottom: 0.75rem;
    overflow: hidden;
    transition: border-color 0.25s ease;
}.faq-section .faq-item:hover,
.region-faq .faq-item:hover,
.faq-section .faq-item.active,
.region-faq .faq-item.active {
    border-color: var(--accent-color);
}/* Question row */
.faq-section .faq-question,
.region-faq .faq-question {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.1rem 1.4rem;
    cursor: pointer;
    font-weight: 600;
    font-size: 1.05rem;
    color: var(--text-primary);
    user-select: none;
    line-height: 1.4;
    gap: 1rem;
    background: none;
    border: none;
    width: 100%;
    text-align: left;
    font-family: inherit;
}/* Chevron indicator */
.faq-section .faq-question::after,
.region-faq .faq-question::after {
    content: '';
    display: block;
    flex-shrink: 0;
    width: 9px;
    height: 9px;
    border-right: 2px solid var(--accent-color);
    border-bottom: 2px solid var(--accent-color);
    transform: rotate(45deg);
    transition: transform 0.25s ease;
    margin-top: -3px;
}.faq-section .faq-item.active .faq-question::after,
.region-faq .faq-item.active .faq-question::after {
    transform: rotate(-135deg);
    margin-top: 3px;
}/* Answer panel — max-height/overflow controlled by script.js inline styles */
.faq-section .faq-answer,
.region-faq .faq-answer {
    padding: 0 1.4rem;
    font-size: 0.95rem;
    color: rgba(255, 255, 255, 0.7);
    line-height: 1.78;
}.related-card-meta {
    font-size: 12px;
    color: var(--text-muted);
    font-family: 'Montserrat', sans-serif;
}