/* =========================================
   SEO Content & Text Pages (Buy, Rent, Sell)
   ========================================= */

/* 0. GLOBAL BUTTON COLOR FIX */
body.home-page .site-topbar__cta,
body.home-page .home-hero__cta-link,
body.home-page .site-nav__link.is-active {
  background-color: var(--wb-green) !important;
  color: #ffffff !important;
  box-shadow: 0 3px 0 var(--wb-green-dark) !important;
}

/* 1. BADGES */
body.home-page .home-content .home-content__eyebrow,
.seo-rent-page .home-content__eyebrow,
.seo-sell-page .home-content__eyebrow {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.4rem !important;
  font-family: var(--wb-font-mono) !important;
  font-size: 0.74rem !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.1em !important;
  color: var(--wb-green-dark) !important;
  background: var(--wb-gold) !important; 
  padding: 0.35rem 0.75rem !important;
  border-radius: 999px !important;
  margin-bottom: 1rem !important;
}

/* 2. IMAGES (Fixing the overflow) */
body.home-page .home-content .home-content__figure,
.seo-rent-page .home-content__figure,
.seo-sell-page .home-content__figure {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
  margin: 1.5rem 0 2rem 0 !important;
  padding: 0 !important;
  border-radius: 18px !important;
  border: 6px solid var(--wb-card) !important;
  outline: 1px solid var(--wb-line) !important;
  box-shadow: 0 16px 40px rgba(28, 43, 34, 0.12) !important;
}

body.home-page .home-content .home-content__figure img,
.seo-rent-page .home-content__figure img,
.seo-sell-page .home-content__figure img {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  object-fit: contain !important;
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
}

/* 3. BASE STYLES & TEXT OVERFLOW */
body.home-page .home-section--content {
  padding-top: 1rem !important; 
  padding-bottom: 2rem !important;
}

body.home-page .home-content,
.seo-rent-page,
.seo-sell-page {
  padding: 1.5rem 2.25rem 2.5rem !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  overflow-wrap: break-word !important;
  word-wrap: break-word !important;
  word-break: break-word !important; 
}

body.home-page .home-content__intro {
  margin-bottom: 1.5rem !important;
  min-width: 0 !important;
}

body.home-page .home-content__title {
  font-family: var(--wb-font-display) !important;
  font-size: clamp(1.6rem, 2.6vw, 2.15rem) !important;
  font-weight: 700 !important;
  color: var(--wb-ink) !important;
  letter-spacing: -0.015em !important;
  line-height: 1.18 !important;
  margin: 0 0 1rem !important;
  overflow-wrap: break-word !important;
}

body.home-page .home-content__lead {
  font-size: 1.05rem !important;
  color: var(--wb-muted) !important;
  line-height: 1.65 !important;
  margin-bottom: 1rem !important;
  overflow-wrap: break-word !important;
}

body.home-page .home-content__block {
  padding-top: 0 !important;
  margin-top: 0 !important;
  border-top: none !important;
  min-width: 0 !important; 
  overflow-wrap: break-word !important;
}

body.home-page .home-content__block h2 {
  font-family: var(--wb-font-display) !important;
  font-size: clamp(1.4rem, 2.1vw, 1.85rem) !important;
  font-weight: 700 !important;
  color: var(--wb-ink) !important;
  margin-top: 0 !important;
  margin-bottom: 0.75rem !important;
  overflow-wrap: break-word !important;
}

body.home-page .home-content__block h3 {
  font-family: var(--wb-font-display) !important;
  font-size: 1.15rem !important;
  font-weight: 700 !important;
  color: var(--wb-ink) !important;
  margin-top: 0 !important;
  margin-bottom: 0.5rem !important;
  overflow-wrap: break-word !important;
}

body.home-page .home-content__block-lead {
  color: var(--wb-muted) !important;
  margin-bottom: 1rem !important;
  overflow-wrap: break-word !important;
}

/* 4. CHECKLISTS */
body.home-page .home-content__checklist {
  list-style: none !important;
  padding: 0 !important;
  margin: 1rem 0 !important;
  display: grid !important;
  gap: 0.65rem !important;
  min-width: 0 !important;
}

body.home-page .home-content__checklist li {
  position: relative !important;
  padding-left: 1.75rem !important;
  color: var(--wb-muted) !important;
  line-height: 1.55 !important;
  overflow-wrap: break-word !important;
}

body.home-page .home-content__checklist li::before {
  content: "✓" !important;
  position: absolute !important;
  left: 0 !important;
  top: 0 !important;
  color: var(--wb-green) !important;
  font-weight: 700 !important;
}

body.home-page .home-content hr {
  border: none !important;
  border-top: 1px dashed var(--wb-line) !important;
  margin: 2rem 0 !important;
}

/* 5. TWO-COLUMN GRID (Rent & Sell) */
.wb-two-col-grid {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 2.5rem !important;
  align-items: start !important;
  min-width: 0 !important;
  width: 100% !important;
  box-sizing: border-box !important;
  position: relative;
}

/* Desktop Column Lines */
@media (min-width: 769px) {
  .wb-two-col-grid::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 1px;
    border-left: 1px dashed var(--wb-line);
    opacity: 0.6;
    pointer-events: none;
  }
}

/* 6. FAQ STYLES (Restored for all pages) */
body.home-page .home-faq,
.seo-rent-page .home-faq,
.seo-sell-page .home-faq {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 1rem !important;
  margin-top: 1rem !important;
  align-items: start !important;
  min-width: 0 !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

body.home-page .home-faq__item,
.seo-rent-page .home-faq__item,
.seo-sell-page .home-faq__item {
  background: var(--wb-paper) !important;
  border: 1px solid var(--wb-line) !important;
  border-radius: 12px !important;
  overflow: hidden !important;
  width: 100% !important;
  box-sizing: border-box !important;
  display: block !important;
  min-width: 0 !important;
}

body.home-page .home-faq__item summary,
.seo-rent-page .home-faq__item summary,
.seo-sell-page .home-faq__item summary {
  padding: 1rem 1.25rem !important;
  font-weight: 700 !important;
  font-family: var(--wb-font-display) !important;
  color: var(--wb-ink) !important;
  cursor: pointer !important;
  list-style: none !important;
  overflow-wrap: break-word !important;
}

body.home-page .home-faq__item summary::-webkit-details-marker,
.seo-rent-page .home-faq__item summary::-webkit-details-marker,
.seo-sell-page .home-faq__item summary::-webkit-details-marker {
  display: none !important;
}

body.home-page .home-faq__item summary::after,
.seo-rent-page .home-faq__item summary::after,
.seo-sell-page .home-faq__item summary::after {
  content: "+" !important;
  float: right !important;
  color: var(--wb-stamp) !important;
  font-weight: 700 !important;
  font-family: var(--wb-font-body) !important;
}

body.home-page .home-faq__item[open] summary::after,
.seo-rent-page .home-faq__item[open] summary::after,
.seo-sell-page .home-faq__item[open] summary::after {
  content: "\2212" !important;
}

body.home-page .home-faq__item p,
.seo-rent-page .home-faq__item p,
.seo-sell-page .home-faq__item p {
  padding: 0 1.25rem 1rem !important;
  margin: 0 !important;
  border-top: 1px dashed var(--wb-line) !important;
  padding-top: 0.85rem !important;
  color: var(--wb-muted) !important;
  overflow-wrap: break-word !important;
}

/* 7. BUY PAGE SPECIFIC (Categories) */
body.home-page .home-content--buy .home-content__categories {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 1rem !important;
}

body.home-page .home-content--buy .home-content__category {
  background: var(--wb-paper) !important;
  border: 1px solid var(--wb-line) !important;
  border-radius: 14px !important;
  padding: 1.25rem 1.35rem !important;
}

body.home-page .home-content--buy .home-content__subjects {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 0.65rem !important;
  list-style: none !important;
  padding: 0 !important;
  margin: 1rem 0 1.25rem !important;
}

body.home-page .home-content--buy .home-content__subjects li {
  background: var(--wb-paper) !important;
  color: var(--wb-green) !important;
  font-weight: 700 !important;
  font-size: 0.88rem !important;
  padding: 0.65rem 0.85rem !important;
  border-radius: 10px !important;
  text-align: center !important;
  border: 1px solid var(--wb-line) !important;
}

/* 8. BUY PAGE INLINE SPLIT (Why WindsorBooks) */
.wb-why-split {
  display: flex !important;
  flex-direction: row !important;
  align-items: flex-start !important; 
  margin: 1.5rem 0 2rem 0 !important;
  width: 100% !important;
  min-width: 0 !important;
  position: relative;
}

@media (min-width: 769px) {
  .wb-why-split::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 1px;
    border-left: 1px dashed var(--wb-line);
    opacity: 0.6;
  }
}

.wb-why-split-col-left {
  flex: 1 1 50% !important;
  padding-right: 2rem !important;
  min-width: 0 !important;
}

.wb-why-split-col-right {
  flex: 1 1 50% !important;
  padding-left: 2rem !important;
  min-width: 0 !important;
}

.wb-why-list {
  display: flex !important;
  flex-direction: column !important;
  gap: 0.75rem !important;
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

.wb-why-list li {
  position: relative !important;
  padding-left: 1.75rem !important;
  line-height: 1.5 !important;
  color: #6b6457 !important; 
  font-size: 0.95rem !important;
}

.wb-why-list li::before {
  content: "✓" !important;
  position: absolute !important;
  left: 0 !important;
  color: #1f4d3b !important; 
  font-weight: 700 !important;
}

.wb-why-title {
  font-family: var(--wb-font-display) !important;
  font-size: 1.4rem !important;
  font-weight: 700 !important;
  color: #1c2b22 !important; 
  margin: 0 0 0.5rem 0 !important; 
}

/* =========================================
   9. RESPONSIVE - MOBILE CRITICAL FIXES
   ========================================= */
@media (max-width: 991px) {
  body.home-page .home-content--buy .home-content__categories {
    grid-template-columns: 1fr !important;
  }
  body.home-page .home-content--buy .home-content__subjects {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 768px) {
  /* Mobile Padding */
  body.home-page .home-content,
  .seo-rent-page,
  .seo-sell-page {
    padding: 1rem 0.5rem 2rem !important; 
  }

  /* Stack Layouts */
  .wb-two-col-grid,
  body.home-page .home-faq,
  .seo-rent-page .home-faq,
  .seo-sell-page .home-faq {
    grid-template-columns: 1fr !important;
    gap: 1.25rem !important;
  }
  
  .wb-why-split { 
    flex-direction: column !important; 
    gap: 1.5rem !important;
  }
  
  .wb-why-split-col-left {
    padding-right: 0 !important;
    padding-bottom: 1.5rem !important;
    margin-bottom: 1.5rem !important;
    border-bottom: 1px dashed #e1d6b9 !important;
  }
  
  .wb-why-split-col-right {
    padding-left: 0 !important;
  }

  /* Make FAQ items full width on mobile */
  body.home-page .home-faq__item,
  .seo-rent-page .home-faq__item,
  .seo-sell-page .home-faq__item {
    width: 100% !important;
    margin: 0 !important;
  }

  /* Adjust font sizes */
  body.home-page .home-content__title {
    font-size: 1.4rem !important;
  }
  body.home-page .home-content__block h2 {
    font-size: 1.25rem !important;
  }
}

@media (max-width: 576px) {
  body.home-page .home-content--buy .home-content__subjects {
    grid-template-columns: 1fr !important;
  }
  
  body.home-page .home-content,
  .seo-rent-page,
  .seo-sell-page {
    padding: 1rem 0.25rem 2rem !important; 
  }
}