/* =========================================================================
   BLOG & CONTENT SYSTEM  -  Top Sydney Cleaners  (Stage 15)
   =========================================================================
   Loaded only on native blog views (body.tsc-blogv2, which also carries
   .tsc-servicev2 + .tsc-scope). Tokens, .tsc-container, .tsc-section,
   .tsc-card, .tsc-media, .tsc-btn, .tsc-crumbs, .tsc-cta-band, .tsc-eyebrow
   and the grid primitives are inherited from components.css + service.css -
   this file only adds the blog-specific components.
   ------------------------------------------------------------------------- */

/* ---- grid + card foot fallbacks (defined for the blog scope) ------------ */
body.tsc-blogv2 .tsc-grid--3{
  grid-template-columns:repeat(auto-fit, minmax(min(100%, 300px), 1fr));
}
body.tsc-blogv2 .tsc-card__foot{ margin:auto 0 0; padding-top:.35rem; }

/* Neutralise the Elementor kit's purple link colour on plain content links
   (buttons, .tsc-cta-link and .tsc-chip keep their own styling). */
body.tsc-blogv2 :is(.tsc-blog-hero, .tsc-blog-empty, .tsc-article__body, .tsc-article__pages, .tsc-byline, .tsc-author-box) a:not(.tsc-btn):not(.tsc-cta-link):not(.tsc-chip){
  color:var(--tsc-navy);
}

/* ---- 1. HERO + category filter --------------------------------------------- */
body.tsc-blogv2 .tsc-blog-hero{
  padding-top:clamp(28px,4vw,46px);
  padding-bottom:clamp(16px,2.4vw,26px);
}
/* tighten the gap into the first content section */
body.tsc-blogv2 .tsc-blog-hero + .tsc-section{ padding-top:clamp(10px,2vw,24px); }
body.tsc-blogv2 .tsc-blog-hero .tsc-section__title{ margin:.3rem 0 .6rem; }
body.tsc-blogv2 .tsc-blog-hero .tsc-section__lead{ max-width:44rem; }

body.tsc-blogv2 .tsc-blog-filters{
  display:flex; flex-wrap:wrap; gap:10px; margin-top:1.25rem;
}
body.tsc-blogv2 .tsc-chip{
  display:inline-flex; align-items:center; gap:.4rem;
  min-height:40px; padding:8px 16px; border-radius:999px;
  border:1px solid var(--tsc-color-border);
  background:var(--tsc-color-surface);
  color:var(--tsc-navy); font-size:.88rem; font-weight:700; line-height:1;
  text-decoration:none; transition:border-color .16s ease, background .16s ease, color .16s ease;
}
body.tsc-blogv2 .tsc-chip:hover{ border-color:var(--tsc-gold); }
body.tsc-blogv2 .tsc-chip.is-current{ background:var(--tsc-navy); border-color:var(--tsc-navy); color:#fff; }
body.tsc-blogv2 .tsc-chip--sm{ min-height:0; padding:4px 10px; font-size:.76rem; }

/* ---- 2. FEATURED (latest) article ---------------------------------------- */
body.tsc-blogv2 .tsc-blog-featured{
  display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);
  gap:clamp(20px,3vw,40px); align-items:center;
  padding:clamp(16px,2.4vw,24px); margin-bottom:clamp(28px,4vw,48px);
}
body.tsc-blogv2 .tsc-blog-featured__media{ aspect-ratio:16 / 9; border-radius:16px; }
body.tsc-blogv2 .tsc-blog-featured__media img{ width:100%; height:100%; object-fit:cover; object-position:center 20%; display:block; }
body.tsc-blogv2 .tsc-blog-featured__body{ display:flex; flex-direction:column; gap:.6rem; }
body.tsc-blogv2 .tsc-blog-featured__title{
  margin:.1rem 0; font-size:clamp(1.3rem, 1.05rem + 1vw, 1.8rem);
  font-weight:800; line-height:1.25; color:var(--tsc-navy);
}
body.tsc-blogv2 .tsc-blog-featured__title a{ color:inherit; text-decoration:none; }
body.tsc-blogv2 .tsc-blog-featured__title a:hover{ text-decoration:underline; text-underline-offset:2px; }
body.tsc-blogv2 .tsc-blog-featured__excerpt{ margin:0; color:var(--tsc-color-text-muted); line-height:1.6; }

/* ---- 3. ARTICLE CARDS --------------------------------------------------- */
body.tsc-blogv2 .tsc-blog-grid{ align-items:stretch; }
body.tsc-blogv2 .tsc-blog__item{
  display:flex; flex-direction:column; gap:.55rem;
  padding:clamp(14px,2vw,18px); height:100%;
}
body.tsc-blogv2 .tsc-blog__media{ aspect-ratio:16 / 9; border-radius:12px; margin-bottom:.35rem; }
body.tsc-blogv2 .tsc-blog__media img{ width:100%; height:100%; object-fit:cover; object-position:center 20%; display:block; }
body.tsc-blogv2 .tsc-blog-card__meta{
  display:flex; flex-wrap:wrap; align-items:center; gap:.55rem;
  margin:0; font-size:.82rem; color:var(--tsc-color-text-subtle);
}
body.tsc-blogv2 .tsc-blog-card__meta time{ font-variant-numeric:tabular-nums; }
body.tsc-blogv2 .tsc-blog__title{
  margin:.1rem 0 0; font-size:1.06rem; font-weight:800; line-height:1.35; color:var(--tsc-navy);
}
body.tsc-blogv2 .tsc-blog__title a{ color:inherit; text-decoration:none; }
body.tsc-blogv2 .tsc-blog__title a:hover{ text-decoration:underline; text-underline-offset:2px; }
body.tsc-blogv2 .tsc-blog__excerpt{ margin:0; font-size:.92rem; line-height:1.55; color:var(--tsc-color-text-muted); }
/* whole card clickable via the title link, but keep a real focus target */
body.tsc-blogv2 .tsc-blog__link::after{ content:""; position:absolute; inset:0; }
body.tsc-blogv2 .tsc-blog__item{ position:relative; }
body.tsc-blogv2 .tsc-blog__item .tsc-chip,
body.tsc-blogv2 .tsc-blog__item .tsc-card__foot a{ position:relative; z-index:1; }

/* ---- 4. PAGINATION --------------------------------------------------- */
body.tsc-blogv2 .tsc-blog-pagination{ margin-top:clamp(28px,4vw,44px); }
body.tsc-blogv2 .tsc-blog-pagination .nav-links{
  display:flex; flex-wrap:wrap; justify-content:center; gap:8px;
}
body.tsc-blogv2 .tsc-blog-pagination .page-numbers{
  display:inline-flex; align-items:center; justify-content:center;
  min-width:42px; min-height:42px; padding:0 12px; border-radius:10px;
  border:1px solid var(--tsc-color-border); background:var(--tsc-color-surface);
  color:var(--tsc-navy); font-weight:700; text-decoration:none;
}
body.tsc-blogv2 .tsc-blog-pagination .page-numbers:hover{ border-color:var(--tsc-gold); }
body.tsc-blogv2 .tsc-blog-pagination .page-numbers.current{ background:var(--tsc-navy); border-color:var(--tsc-navy); color:#fff; }
body.tsc-blogv2 .tsc-blog-pagination .page-numbers.dots{ border-color:transparent; background:transparent; }

/* ---- 5. EMPTY STATE ------------------------------------------------- */
body.tsc-blogv2 .tsc-blog-empty{
  text-align:center; max-width:38rem; margin-inline:auto;
  padding:clamp(28px,5vw,52px) 0;
}
body.tsc-blogv2 .tsc-blog-empty h2{ margin:0 0 .6rem; color:var(--tsc-navy); }
body.tsc-blogv2 .tsc-blog-empty p{ margin:0 0 1.4rem; color:var(--tsc-color-text-muted); }
body.tsc-blogv2 .tsc-blog-empty .tsc-cta-group{ justify-content:center; }

/* ---- 6. SINGLE ARTICLE: header + figure + prose ---------------------- */
body.tsc-blogv2 .tsc-article__header{
  padding-top:clamp(20px,3vw,32px);
  padding-bottom:clamp(12px,2vw,20px);
}
/* the article body sits close under the featured image, not a full section gap */
body.tsc-blogv2 .tsc-article__figure + .tsc-section{ padding-top:clamp(6px,1.5vw,16px); }
body.tsc-blogv2 .tsc-article__header + .tsc-section{ padding-top:clamp(6px,1.5vw,16px); }
body.tsc-blogv2 .tsc-article__title{
  margin:.7rem 0 .5rem;
  font-size:clamp(1.7rem, 1.25rem + 2.2vw, 2.6rem);
  font-weight:800; line-height:1.18; color:var(--tsc-navy); text-wrap:balance;
}
body.tsc-blogv2 .tsc-byline{
  display:flex; flex-wrap:wrap; align-items:center; gap:.5rem;
  margin:0; font-size:.92rem; color:var(--tsc-color-text-subtle);
}
body.tsc-blogv2 .tsc-byline time{ font-variant-numeric:tabular-nums; }

body.tsc-blogv2 .tsc-article__figure{ margin:0 auto clamp(20px,3vw,32px); }
body.tsc-blogv2 .tsc-article__figure .tsc-media{ border-radius:18px; }
body.tsc-blogv2 .tsc-article__figure figcaption{
  margin-top:.6rem; font-size:.85rem; color:var(--tsc-color-text-subtle); text-align:center;
}

/* prose --------------------------------------------------------------- */
body.tsc-blogv2 .tsc-article__body{
  color:var(--tsc-color-text);
  font-size:clamp(16px, 15px + 0.35vw, 17.5px);   /* comfortable reading size, root-independent */
}
body.tsc-blogv2 .tsc-article__body > *{ margin:0 0 1.15rem; }
body.tsc-blogv2 .tsc-article__body > *:last-child{ margin-bottom:0; }
/* .tsc-scope :where(p) in components.css forces a small base size on every <p>;
   re-inherit the reading size set on .tsc-article__body above. */
body.tsc-blogv2 .tsc-article__body p{ font-size:inherit; line-height:1.75; }
body.tsc-blogv2 .tsc-article__body blockquote p,
body.tsc-blogv2 .tsc-article__body li{ font-size:inherit; }
body.tsc-blogv2 .tsc-article__body h2{
  margin:2.2rem 0 .8rem; font-size:clamp(1.35rem, 1.1rem + 1vw, 1.7rem);
  font-weight:800; line-height:1.25; color:var(--tsc-navy); scroll-margin-top:90px;
}
body.tsc-blogv2 .tsc-article__body h3{
  margin:1.8rem 0 .6rem; font-size:clamp(1.12rem, 1rem + .5vw, 1.3rem);
  font-weight:800; line-height:1.3; color:var(--tsc-navy); scroll-margin-top:90px;
}
body.tsc-blogv2 .tsc-article__body h4{ margin:1.5rem 0 .5rem; font-size:1.05rem; font-weight:800; color:var(--tsc-navy); }
body.tsc-blogv2 .tsc-article__body a{
  color:var(--tsc-navy); font-weight:600;
  text-decoration:underline; text-underline-offset:2px; text-decoration-thickness:1px;
}
body.tsc-blogv2 .tsc-article__body a:hover{ text-decoration-color:var(--tsc-gold); }
body.tsc-blogv2 .tsc-article__body ul,
body.tsc-blogv2 .tsc-article__body ol{ padding-left:1.35rem; }
body.tsc-blogv2 .tsc-article__body li{ margin:.4rem 0; line-height:1.7; }
body.tsc-blogv2 .tsc-article__body li::marker{ color:var(--tsc-gold); }
body.tsc-blogv2 .tsc-article__body blockquote{
  margin:1.6rem 0; padding:.4rem 0 .4rem 1.1rem;
  border-left:3px solid var(--tsc-gold);
  color:var(--tsc-color-text-muted); font-style:italic;
}
body.tsc-blogv2 .tsc-article__body blockquote p{ margin:0; }
body.tsc-blogv2 .tsc-article__body img,
body.tsc-blogv2 .tsc-article__body figure img{ border-radius:14px; height:auto; }
body.tsc-blogv2 .tsc-article__body figure{ margin:1.6rem 0; }
body.tsc-blogv2 .tsc-article__body figcaption{ margin-top:.5rem; font-size:.85rem; color:var(--tsc-color-text-subtle); text-align:center; }
body.tsc-blogv2 .tsc-article__body hr{ border:0; border-top:1px solid var(--tsc-color-border); margin:2rem 0; }
body.tsc-blogv2 .tsc-article__body :is(code,kbd,samp){
  font-family:ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size:.9em; background:var(--tsc-color-surface-2); padding:.1em .35em; border-radius:5px;
}
body.tsc-blogv2 .tsc-article__body pre{
  overflow-x:auto; background:var(--tsc-navy); color:#eef3f9;
  padding:1rem 1.15rem; border-radius:12px; font-size:.88rem; line-height:1.6;
}
body.tsc-blogv2 .tsc-article__body pre code{ background:none; padding:0; color:inherit; }
body.tsc-blogv2 .tsc-article__body .tsc-table-wrap,
body.tsc-blogv2 .tsc-article__body figure.wp-block-table{ overflow-x:auto; }
body.tsc-blogv2 .tsc-article__body table{
  width:100%; border-collapse:collapse; font-size:.94rem;
}
body.tsc-blogv2 .tsc-article__body :is(th,td){
  border:1px solid var(--tsc-color-border); padding:.6rem .75rem; text-align:left; vertical-align:top;
}
body.tsc-blogv2 .tsc-article__body th{ background:var(--tsc-color-surface-2); font-weight:800; color:var(--tsc-navy); }
body.tsc-blogv2 .tsc-article__pages{ margin-top:1.5rem; font-size:.9rem; display:flex; gap:.4rem; flex-wrap:wrap; }
body.tsc-blogv2 .tsc-article__pages a{ text-decoration:underline; }

/* ---- 7. INLINE SERVICE CTA ---------------------------------------------- */
body.tsc-blogv2 .tsc-inline-cta{
  margin:clamp(28px,4vw,40px) 0 0;
  display:flex; flex-wrap:wrap; align-items:center; gap:14px 18px;
  padding:clamp(18px,2.6vw,24px);
  border:1px solid var(--tsc-color-border);
  border-radius:14px; background:var(--tsc-color-surface-2);
}
body.tsc-blogv2 .tsc-inline-cta__text{ margin:0; flex:1 1 15rem; font-weight:700; color:var(--tsc-navy); line-height:1.5; }
body.tsc-blogv2 .tsc-inline-cta__text span{ display:block; font-weight:500; font-size:.92rem; color:var(--tsc-color-text-muted); margin-top:.15rem; }
body.tsc-blogv2 .tsc-inline-cta .tsc-btn{ flex:0 0 auto; }

/* ---- 8. FAQ (from the [tsc_faq] shortcode) ---------------------------- */
body.tsc-blogv2 .tsc-article-faq{ margin:clamp(28px,4vw,40px) 0 0; }
body.tsc-blogv2 .tsc-article-faq h2{
  margin:0 0 1rem; font-size:clamp(1.35rem, 1.1rem + 1vw, 1.7rem); font-weight:800; color:var(--tsc-navy);
}
body.tsc-blogv2 .tsc-article-faq details{
  border:1px solid var(--tsc-color-border); border-radius:12px;
  padding:0 1rem; margin:0 0 .6rem; background:var(--tsc-color-surface);
}
body.tsc-blogv2 .tsc-article-faq summary{
  list-style:none; cursor:pointer; padding:.95rem 0; font-weight:800; color:var(--tsc-navy);
  display:flex; justify-content:space-between; align-items:center; gap:1rem;
}
body.tsc-blogv2 .tsc-article-faq summary::-webkit-details-marker{ display:none; }
body.tsc-blogv2 .tsc-article-faq summary::after{
  content:"+"; font-size:1.3rem; line-height:1; color:var(--tsc-gold); flex:none;
}
body.tsc-blogv2 .tsc-article-faq details[open] summary::after{ content:"\2013"; }
body.tsc-blogv2 .tsc-article-faq .tsc-article-faq__a{ padding:0 0 1rem; color:var(--tsc-color-text-muted); line-height:1.7; font-size:clamp(15px, 14.5px + 0.25vw, 16.5px); }
body.tsc-blogv2 .tsc-article-faq .tsc-article-faq__a p{ margin:0 0 .6rem; font-size:inherit; }

/* ---- 9. AUTHOR BOX ------------------------------------------------- */
body.tsc-blogv2 .tsc-author-box{
  margin:clamp(28px,4vw,40px) 0 0;
  display:flex; gap:16px; align-items:flex-start;
  padding:clamp(18px,2.6vw,24px);
  border:1px solid var(--tsc-color-border); border-radius:14px; background:var(--tsc-color-surface-2);
}
body.tsc-blogv2 .tsc-author-box__avatar{
  flex:none; width:48px; height:48px; border-radius:50%;
  display:inline-flex; align-items:center; justify-content:center;
  background:var(--tsc-navy); color:var(--tsc-gold); font-weight:800; letter-spacing:.02em;
}
body.tsc-blogv2 .tsc-author-box__name{ margin:.1rem 0 .25rem; font-weight:800; color:var(--tsc-navy); }
body.tsc-blogv2 .tsc-author-box__bio{ margin:0 0 .5rem; font-size:.92rem; line-height:1.6; color:var(--tsc-color-text-muted); }

/* ---- 10. RELATED ------------------------------------------------- */
body.tsc-blogv2 .tsc-article-related .tsc-blog__item{ background:var(--tsc-color-bg); }

/* ---- responsive ------------------------------------------------- */
@media (max-width:860px){
  body.tsc-blogv2 .tsc-blog-featured{ grid-template-columns:1fr; }
  body.tsc-blogv2 .tsc-blog-featured__media{ order:-1; }
  body.tsc-blogv2 .tsc-inline-cta .tsc-btn{ width:100%; text-align:center; }
}
@media (max-width:520px){
  body.tsc-blogv2 .tsc-blog-filters{ gap:8px; }
  body.tsc-blogv2 .tsc-author-box{ flex-direction:column; }
}
@media (prefers-reduced-motion:reduce){
  body.tsc-blogv2 .tsc-chip,
  body.tsc-blogv2 .tsc-card--interactive{ transition:none; }
}
