/* Cosynookdecor front page — custom magazine styles.
   Design tokens: Poppins headings / Roboto body, #F2EFEC cream, #ACA298 taupe. */

.cosy-frontpage { font-family: "Roboto", Sans-serif; color: #111; }
.cosy-frontpage h1, .cosy-frontpage h2, .cosy-frontpage h3 { font-family: "Poppins", Sans-serif; }

.cosy-eyebrow {
  text-transform: uppercase; letter-spacing: .22em; font-size: 12px;
  font-weight: 600; color: #ACA298; margin: 0 0 12px;
}
.cosy-btn {
  display: inline-block; background: #111; color: #fff !important;
  padding: 14px 30px; border-radius: 999px; font-weight: 600; font-size: 15px;
  text-decoration: none; transition: background .25s;
}
.cosy-btn:hover { background: #ACA298; }
.cosy-btn-ghost {
  background: transparent; color: #fff !important; border: 2px solid #fff;
}
.cosy-btn-ghost:hover { background: #fff; color: #111 !important; }
.cosy-tag {
  display: inline-block; background: #F2EFEC; color: #111; font-size: 12px;
  font-weight: 600; letter-spacing: .08em; text-transform: uppercase;
  padding: 6px 14px; border-radius: 999px; margin-bottom: 12px;
}

/* Hero */
.cosy-hero { position: relative; min-height: 78vh; display: flex; align-items: flex-end; overflow: hidden; }
.cosy-hero img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.cosy-hero-overlay {
  position: relative; width: 100%; padding: 80px 6% 64px;
  background: linear-gradient(to top, rgba(0,0,0,.72), rgba(0,0,0,.15) 60%, transparent);
  color: #fff;
}
.cosy-hero-overlay h1 { color: #fff; font-size: clamp(32px, 5vw, 60px); line-height: 1.12; margin: 0 0 16px; max-width: 16em; }
.cosy-hero-sub { font-size: 18px; max-width: 34em; margin: 0 0 28px; color: #f3f3f3; }
.cosy-hero-cta { display: flex; gap: 14px; flex-wrap: wrap; }

/* Featured */
.cosy-featured { max-width: 1180px; margin: 0 auto; padding: 72px 5% 8px; }
.cosy-featured-card {
  display: grid; grid-template-columns: 1.1fr 1fr; gap: 0; text-decoration: none;
  background: #F2EFEC; border-radius: 22px; overflow: hidden; color: #111;
}
.cosy-featured-card img { width: 100%; height: 100%; min-height: 340px; object-fit: cover; }
.cosy-featured-text { padding: 48px 44px; display: flex; flex-direction: column; justify-content: center; }
.cosy-featured-text h2 { font-size: clamp(24px, 3vw, 36px); line-height: 1.2; margin: 0 0 14px; }
.cosy-featured-text p { color: #444; margin: 0 0 20px; }
.cosy-readmore { font-weight: 700; color: #111; }

/* Categories */
.cosy-categories { max-width: 1180px; margin: 0 auto; padding: 72px 5% 8px; }
.cosy-categories h2, .cosy-latest h2 { font-size: clamp(26px, 3.4vw, 40px); margin: 0 0 28px; }
.cosy-cat-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 22px; }
.cosy-cat-card { position: relative; border-radius: 18px; overflow: hidden; text-decoration: none; aspect-ratio: 3/4; display: block; }
.cosy-cat-card img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s; }
.cosy-cat-card:hover img { transform: scale(1.05); }
.cosy-cat-card span {
  position: absolute; left: 0; right: 0; bottom: 0; padding: 44px 18px 18px;
  background: linear-gradient(to top, rgba(0,0,0,.65), transparent);
  color: #fff; font-family: "Poppins", Sans-serif; font-weight: 600; font-size: 18px;
}

/* Latest */
.cosy-latest { max-width: 1180px; margin: 0 auto; padding: 72px 5%; }
.cosy-post-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 26px; }
.cosy-post-card {
  text-decoration: none; color: #111; background: #fff; border-radius: 18px; overflow: hidden;
  box-shadow: 0 10px 34px rgba(0,0,0,.07); display: block;
}
.cosy-post-card img { width: 100%; aspect-ratio: 16/10; object-fit: cover; }
.cosy-post-text { padding: 24px 26px 28px; }
.cosy-post-text h3 { font-size: 21px; line-height: 1.35; margin: 0 0 10px; }
.cosy-post-meta { color: #777; font-size: 13px; margin: 0; }

/* Newsletter */
.cosy-newsletter { background: #111; color: #fff; text-align: center; padding: 72px 6%; }
.cosy-newsletter h2 { color: #fff; font-size: clamp(26px, 3.4vw, 38px); margin: 0 0 12px; }
.cosy-newsletter p { color: #c9c9c9; max-width: 36em; margin: 0 auto 26px; }
.cosy-newsletter-form { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; }
.cosy-newsletter-form input {
  padding: 14px 20px; border-radius: 999px; border: none; min-width: min(320px, 80vw); font-size: 15px;
}
.cosy-newsletter .cosy-btn { border: none; cursor: pointer; }
.cosy-newsletter-thanks { color: #F2EFEC; font-weight: 600; }

/* Article page bits */
.cosy-article-cat a {
  display: inline-block; background: #F2EFEC; color: #111; font-size: 12px; font-weight: 600;
  letter-spacing: .08em; text-transform: uppercase; padding: 6px 14px; border-radius: 999px;
  text-decoration: none; margin-bottom: 14px;
}
.cosy-article-hero img { width: 100%; border-radius: 18px; }
.cosy-lead { font-size: 19px; line-height: 1.65; color: #333; }
.entry-content figure img { border-radius: 14px; }
.reading-time { color: #777; }

@media (max-width: 900px) {
  .cosy-featured-card { grid-template-columns: 1fr; }
  .cosy-featured-card img { min-height: 240px; }
  .cosy-cat-grid { grid-template-columns: repeat(2, 1fr); }
  .cosy-post-grid { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
  .cosy-hero { min-height: 68vh; }
  .cosy-featured-text { padding: 30px 24px; }
}

/* Full-bleed hero: break out of the theme content container */
.cosy-hero {
  width: 100vw; max-width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
}

/* Kill the theme's article padding on the front page so sections sit flush */
#post-70.ast-article-single { padding: 0; }
/* Full-bleed newsletter band */
.cosy-newsletter {
  width: 100vw; max-width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
}

/* Remove any remaining top gap between header and hero on the front page */
#post-70 .ast-container { padding-top: 0; padding-bottom: 0; }
#post-70 .entry-content { margin-top: 0; padding-top: 0; }
.cosy-frontpage { margin-top: 0; padding-top: 0; }

/* Remove the theme's default content-area vertical margins on the front page */
body.page-id-70 #primary { margin-top: 0; margin-bottom: 0; }
