/*
Theme Name: Festive Friends Forever
Theme URI: https://festivefriendsforever.blogspot.com/
Author: Hayley Young
Description: A cheerful digital-only festive blog theme with a working WordPress menu, wide blog space, sidebar widgets, featured images, and cosy character-brand styling.
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: festive-friends-forever
Tags: blog, custom-menu, featured-images, right-sidebar, holiday, pastel
*/

:root{
  --fff-red:#e94f64;
  --fff-deep-red:#b92f46;
  --fff-mint:#bff4df;
  --fff-cream:#fff8ea;
  --fff-snow:#ffffff;
  --fff-ice:#eaf8ff;
  --fff-gold:#ffd56b;
  --fff-ink:#393245;
  --fff-muted:#74697d;
  --fff-shadow: 0 18px 45px rgba(57,50,69,.12);
  --fff-radius: 24px;
}

*{box-sizing:border-box}
body{
  margin:0;
  font-family: "Trebuchet MS", Arial, sans-serif;
  background:
    radial-gradient(circle at 10% 10%, rgba(255,213,107,.28), transparent 26%),
    radial-gradient(circle at 85% 15%, rgba(191,244,223,.55), transparent 24%),
    linear-gradient(180deg, var(--fff-ice), var(--fff-cream));
  color:var(--fff-ink);
  line-height:1.7;
}
a{color:var(--fff-deep-red);text-decoration:none}
a:hover{text-decoration:underline}
img{max-width:100%;height:auto;border-radius:18px}

.screen-reader-text{position:absolute;left:-9999px}
.skip-link:focus{left:1rem;top:1rem;background:#fff;padding:.75rem;z-index:9999}

.site-header{
  background:linear-gradient(135deg, #fff, #fff8ea 58%, #ffe6ec);
  border-bottom:5px solid rgba(233,79,100,.22);
}
.header-inner{max-width:1180px;margin:0 auto;padding:24px 18px 16px;display:flex;align-items:center;justify-content:space-between;gap:22px;flex-wrap:wrap}
.branding{display:flex;align-items:center;gap:14px}
.logo-badge{width:68px;height:68px;border-radius:50%;background:linear-gradient(135deg,var(--fff-red),var(--fff-gold));display:grid;place-items:center;box-shadow:var(--fff-shadow);font-size:34px}
.site-title{font-size:clamp(2rem,4vw,3.4rem);line-height:1;margin:0;font-weight:900;letter-spacing:-1px;color:var(--fff-deep-red)}
.site-description{margin:.35rem 0 0;color:var(--fff-muted);font-size:1rem}

.main-navigation{background:var(--fff-deep-red)}
.menu-wrap{max-width:1180px;margin:0 auto;padding:0 18px}
.main-navigation ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:4px}
.main-navigation li{position:relative}
.main-navigation a{display:block;color:#fff;padding:15px 17px;font-weight:800;text-decoration:none;border-radius:14px 14px 0 0}
.main-navigation a:hover,.main-navigation .current-menu-item>a{background:rgba(255,255,255,.18)}
.main-navigation .sub-menu{display:none;position:absolute;background:var(--fff-deep-red);min-width:220px;z-index:50;box-shadow:var(--fff-shadow);border-radius:0 0 18px 18px}
.main-navigation li:hover>.sub-menu{display:block}
.main-navigation .sub-menu a{border-radius:0;padding:12px 16px}

.hero{max-width:1180px;margin:26px auto 0;padding:0 18px}
.hero-card{background:#fff;border-radius:var(--fff-radius);padding:34px;box-shadow:var(--fff-shadow);display:grid;grid-template-columns:1.4fr .6fr;gap:22px;align-items:center;border:3px solid rgba(255,213,107,.45)}
.hero h2{font-size:clamp(2rem,4vw,3.5rem);line-height:1.05;margin:0 0 12px;color:var(--fff-deep-red)}
.hero p{margin:0;color:var(--fff-muted);font-size:1.12rem}
.hero-mascots{font-size:4rem;text-align:center;letter-spacing:.35rem}

.site-content{max-width:1180px;margin:28px auto;padding:0 18px;display:grid;grid-template-columns:minmax(0, 1fr) 320px;gap:28px;align-items:start}
.content-area,.widget-area{min-width:0}
.post-card,.page-card,.widget{background:#fff;border-radius:var(--fff-radius);padding:26px;box-shadow:var(--fff-shadow);margin-bottom:24px;border:1px solid rgba(233,79,100,.12)}
.entry-title{font-size:clamp(1.65rem,3vw,2.45rem);line-height:1.15;margin:.2rem 0 .65rem;color:var(--fff-ink)}
.entry-title a{color:var(--fff-ink)}
.entry-meta{font-size:.92rem;color:var(--fff-muted);margin-bottom:16px;font-weight:700}
.entry-content p{margin-top:0}
.more-link,.button,.wp-block-button__link{display:inline-block;background:linear-gradient(135deg,var(--fff-red),var(--fff-deep-red));color:#fff!important;padding:12px 18px;border-radius:999px;font-weight:900;text-decoration:none;box-shadow:0 10px 22px rgba(185,47,70,.2)}
.post-thumbnail{display:block;margin:-8px 0 18px}

.widget-title{margin-top:0;color:var(--fff-deep-red);font-size:1.3rem}
.widget ul{padding-left:1.1rem;margin-bottom:0}
.search-form{display:flex;gap:8px}
.search-field{width:100%;border:2px solid #ffe0e6;border-radius:999px;padding:10px 12px}
.search-submit{border:0;border-radius:999px;background:var(--fff-deep-red);color:white;padding:10px 14px;font-weight:800}

.pagination,.nav-links{display:flex;gap:10px;flex-wrap:wrap;margin:18px 0}
.page-numbers,.nav-links a,.nav-links span{background:#fff;border-radius:999px;padding:10px 14px;box-shadow:0 8px 20px rgba(57,50,69,.08)}

.site-footer{margin-top:40px;background:var(--fff-ink);color:#fff}
.footer-inner{max-width:1180px;margin:0 auto;padding:28px 18px;text-align:center}
.footer-inner a{color:var(--fff-gold)}

@media (max-width: 860px){
  .hero-card,.site-content{grid-template-columns:1fr}
  .hero-mascots{font-size:3rem}
  .main-navigation ul{display:block}
  .main-navigation .sub-menu{position:static;box-shadow:none;border-radius:0;background:rgba(0,0,0,.12)}
}