/*
Theme Name: Retirement Menu Final Fix
Author: OpenAI
Version: 12.0
Description: Restores homepage and working desktop/mobile cascading menus without changing the rest of the site.
*/

*,*::before,*::after{box-sizing:border-box}
html,body{margin:0;padding:0;width:100%;max-width:100%;overflow-x:hidden}
body{font-family:Arial,sans-serif;background:#f4f7fb;color:#222;line-height:1.5}
img{max-width:100%;height:auto;display:block}
iframe,embed,object,video,canvas,svg{max-width:100%!important;height:auto!important}
table{width:100%;max-width:100%;display:block;overflow-x:auto}
pre,code{white-space:pre-wrap;word-break:break-word}
.site-content,.site-content *,.entry-content,.page-content,.post-content{max-width:100%}
.container{width:100%;max-width:1200px;margin:0 auto;padding:20px}

.site-header{width:100%;max-width:100%;background:#0f2f4f;color:#fff;position:relative;z-index:1000}
.site-header-inner{width:100%;max-width:1200px;margin:0 auto;padding:15px 20px;display:flex;align-items:center;justify-content:space-between;gap:16px}
.site-branding a{color:#fff;text-decoration:none;font-size:1.25rem;font-weight:700}
.menu-toggle{display:none;background:none;border:0;color:#fff;font-size:28px;line-height:1;cursor:pointer;padding:4px 8px}

.main-navigation{position:relative}
.main-navigation ul{list-style:none;margin:0;padding:0}
.main-navigation > ul.primary-nav{display:flex;align-items:center;gap:8px}
.main-navigation > ul.primary-nav > li{position:relative}
.main-navigation > ul.primary-nav > li > a{display:block;color:#fff;text-decoration:none;padding:10px 14px;white-space:nowrap}

.main-navigation ul.sub-menu{display:none;position:absolute;top:100%;left:0;min-width:220px;background:#fff;box-shadow:0 10px 25px rgba(0,0,0,.12);z-index:1001}
.main-navigation ul.sub-menu li{position:relative}
.main-navigation ul.sub-menu a{display:block;color:#333;text-decoration:none;padding:12px 16px;white-space:normal}
.main-navigation > ul.primary-nav > li:hover > ul.sub-menu,
.main-navigation > ul.primary-nav > li:focus-within > ul.sub-menu{display:block}
.main-navigation ul.sub-menu li:hover > ul.sub-menu,
.main-navigation ul.sub-menu li:focus-within > ul.sub-menu{display:block}
.main-navigation ul.sub-menu ul.sub-menu{top:0;left:100%}
.main-navigation ul.sub-menu a:hover,
.main-navigation ul.sub-menu a:focus{background:#f1f4f8}

.hero{background:linear-gradient(rgba(15,47,79,.5),rgba(15,47,79,.5)),url('https://images.unsplash.com/photo-1506744038136-46273834b3fb?auto=format&fit=crop&w=1600&q=80') center/cover no-repeat;color:#fff;text-align:center;padding:72px 20px}
.hero h1{margin:0 0 12px;font-size:2.5rem}
.hero p{margin:0 auto 20px;max-width:720px;font-size:1.125rem}
.hero-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.btn{display:inline-block;text-decoration:none;padding:12px 20px;border-radius:999px;font-weight:700}
.btn-primary{background:#ffd166;color:#1b1b1b}
.btn-secondary{border:2px solid #fff;color:#fff}

.cards-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;margin-top:-36px;align-items:stretch}
.card{background:#fff;border-radius:14px;overflow:hidden;box-shadow:0 10px 28px rgba(0,0,0,.10);display:flex;flex-direction:column;height:100%}
.card-image{width:100%;height:180px;object-fit:cover;flex:0 0 180px}
.card-content{padding:20px;display:flex;flex-direction:column;flex:1 1 auto}
.card-content h3{margin:0 0 10px;font-size:1.2rem;min-height:2.8em}
.card-content p{margin:0 0 14px;color:#4b5563;flex:1 1 auto}

.posts-section{margin-top:48px}
.post-item{background:#fff;border-radius:12px;box-shadow:0 8px 22px rgba(0,0,0,.06);padding:16px 18px;margin-bottom:16px}
.post-item h3{margin:0 0 8px;font-size:1.05rem}
.post-item p{margin:0;color:#4b5563}
.load-more-wrap{margin-top:18px}
.load-more-button{background:#0f2f4f;color:#fff;border:0;border-radius:999px;padding:12px 18px;font-weight:700;cursor:pointer}

.content-wrap{width:100%;max-width:100%;overflow-x:hidden}
.page-shell,.post-shell{background:#fff;border-radius:14px;box-shadow:0 10px 28px rgba(0,0,0,.06);padding:24px}
.page-shell h1,.post-shell h1{margin-top:0}
.post-meta{font-size:14px;color:#6b7280;margin:0 0 16px}
.post-meta a{color:#6b7280;text-decoration:none}
.post-author{margin-top:32px;padding-top:18px;border-top:1px solid #e5e7eb;font-weight:700;color:#0f2f4f}

@media (min-width:769px){
  body:not(.home) .content-wrap{width:80%;max-width:80%;margin-left:auto;margin-right:auto}
  body.topten-page .content-wrap,
  body.topten-page .page-content,
  body.topten-page .entry-content,
  body.topten-page .post-content{width:80%;max-width:80%;margin-left:auto;margin-right:auto}
  body.topten-page .entry-content > img:first-of-type,
  body.topten-page .page-content > img:first-of-type,
  body.topten-page .post-content > img:first-of-type{display:block;margin-left:auto;margin-right:auto}
  body.topten-page .entry-content > p:first-of-type,
  body.topten-page .page-content > p:first-of-type,
  body.topten-page .post-content > p:first-of-type{text-align:center;max-width:800px;margin-left:auto;margin-right:auto}
  body.page-about .cards-grid{align-items:stretch}
  body.page-about .card{display:flex;flex-direction:column;height:100%}
  body.page-about .card-image{height:180px;flex:0 0 180px}
  body.page-about .card-content h3{min-height:2.8em}
  body.page-about .card-content a{margin-top:auto;align-self:center}
}

@media (max-width:991px){
  .cards-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media (max-width:768px){
  body{font-size:18px}
  .site-header-inner{width:100%;max-width:100%;padding:15px}
  .menu-toggle{display:inline-block}
  .main-navigation{width:100%;position:absolute;top:100%;left:0}
  .main-navigation > ul.primary-nav{display:none!important;flex-direction:column;align-items:stretch;gap:0;width:100%;background:#0f2f4f;padding:8px 0 12px}
  .main-navigation.active > ul.primary-nav{display:flex!important}
  .main-navigation > ul.primary-nav > li > a{color:#ffd166;font-weight:700;padding:14px 16px;border-top:1px solid rgba(255,255,255,.08);white-space:normal}
  .main-navigation ul.sub-menu{display:none!important;position:static;min-width:100%;box-shadow:none;background:#163d63}
  .main-navigation li.open > ul.sub-menu{display:block!important}
  .main-navigation ul.sub-menu a{color:#fff;padding:12px 20px 12px 28px}
  .main-navigation ul.sub-menu ul.sub-menu a{padding-left:40px}
  .main-navigation a.mobile-selected{color:#000!important}
  .hero{padding:56px 16px}
  .hero h1{font-size:2rem}
  .hero p{font-size:1rem}
  .container{width:100%;max-width:100%;padding:15px}
  .cards-grid{grid-template-columns:1fr;gap:16px;margin-top:-20px}
  .card-image{height:120px}
  .content-wrap,.entry-content,.page-content,article,section{width:100%;max-width:100%!important;overflow-x:hidden;min-width:0}
  .page-shell,.post-shell{padding:18px}
}


/* Home page cards: align photos, text, and Explore links on desktop */
@media (min-width:769px){
  body.home .cards-grid{align-items:stretch}
  body.home .card{display:flex;flex-direction:column;height:100%}
  body.home .card-image{height:180px;flex:0 0 180px;object-fit:cover}
  body.home .card-content{display:flex;flex-direction:column;flex:1 1 auto}
  body.home .card-content h3{min-height:2.8em}
  body.home .card-content p{flex:1 1 auto}
  body.home .card-content a{margin-top:auto;align-self:flex-start}
}

/* Mobile: show full card photos */
@media (max-width:768px){
  body.home .card-image{
    height:auto !important;
    max-height:none !important;
    object-fit:contain !important;
    flex:0 0 auto !important;
    background:#fff;
  }
}
