/* ══════════════════════════════════════════════════════════
   VERDURA GARDENS — INNER PAGES CSS
   ══════════════════════════════════════════════════════════ */

/* ── PAGE HERO (common) ── */
.page-hero {
  padding-top: calc(var(--nav-h) + var(--sp-16));
  padding-bottom: var(--sp-12);
  background: var(--obsidian-mid);
  border-bottom: 1px solid var(--border-gold);
  position: relative; overflow: hidden;
}
.page-hero::before {
  content: '';
  position: absolute; top: 0; left: 50%; transform: translateX(-50%);
  width: 80%; height: 1px;
  background: linear-gradient(90deg, transparent, var(--gold-500), transparent);
}
.page-hero::after {
  content: '';
  position: absolute; inset: 0;
  background: radial-gradient(ellipse 60% 80% at 70% 30%, rgba(201,150,58,0.06) 0%, transparent 60%);
  pointer-events: none;
}

/* ── ARTICLE CARDS ── */
.article-card {
  background: var(--obsidian-card);
  border: 1px solid var(--border-gold);
  border-radius: var(--r-2xl);
  overflow: hidden;
  transition: all var(--dur-slow) var(--ease-gold);
  display: flex; flex-direction: column;
  position: relative;
}
.article-card:hover { transform: translateY(-5px); box-shadow: var(--glow-card-h); border-color: var(--border-gold-h); }
.article-card-img-link { display: block; overflow: hidden; position: relative; flex-shrink: 0; }
.article-card-img {
  width: 100%; height: 220px; object-fit: cover;
  filter: brightness(0.75) saturate(0.7);
  transition: transform var(--dur-slower) var(--ease-out), filter var(--dur-slow);
  display: block;
}
.article-card:hover .article-card-img { transform: scale(1.06); filter: brightness(0.82) saturate(0.82); }
.article-card-featured-badge {
  position: absolute; top: var(--sp-4); right: var(--sp-4);
  width: 28px; height: 28px; border-radius: 50%;
  background: var(--gold-500); color: var(--obsidian-deep);
  display: flex; align-items: center; justify-content: center;
  font-size: .875rem; box-shadow: var(--glow-gold-sm);
}
.article-card-body { padding: var(--sp-5) var(--sp-6) var(--sp-6); flex: 1; display: flex; flex-direction: column; }
.article-card-meta { display: flex; align-items: center; gap: var(--sp-3); margin-bottom: var(--sp-3); flex-wrap: wrap; }
.article-card-title {
  font-family: var(--font-display); font-size: 1.125rem; font-weight: 400;
  color: var(--champagne-bright); line-height: 1.3; letter-spacing: -.01em;
  transition: color var(--dur-base); margin-bottom: var(--sp-3);
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.article-card:hover .article-card-title { color: var(--gold-300); }
.article-card-excerpt {
  font-size: .8125rem; color: var(--champagne-muted); line-height: 1.65;
  font-weight: 300; flex: 1;
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
}
.article-card-footer {
  display: flex; align-items: center; justify-content: space-between;
  padding-top: var(--sp-4); margin-top: var(--sp-4);
  border-top: 1px solid var(--border-subtle);
}
.article-card-read {
  font-family: var(--font-ui); font-size: .5625rem; font-weight: 700;
  letter-spacing: .12em; text-transform: uppercase; color: var(--gold-500);
  transition: gap var(--dur-base), color var(--dur-base);
  display: flex; align-items: center; gap: var(--sp-2);
}
.article-card:hover .article-card-read { color: var(--gold-300); gap: var(--sp-3); }

/* Horizontal article card */
.article-card-h {
  display: flex; gap: var(--sp-4);
  padding: var(--sp-4); border-radius: var(--r-xl);
  border: 1px solid var(--border-subtle);
  background: rgba(255,255,255,.02);
  transition: all var(--dur-base); text-decoration: none;
}
.article-card-h:hover { background: rgba(201,150,58,.05); border-color: var(--border-gold); }
.article-card-h-img {
  width: 80px; height: 80px; border-radius: var(--r-lg);
  object-fit: cover; flex-shrink: 0;
  filter: brightness(0.75) saturate(0.65);
  transition: filter var(--dur-base);
}
.article-card-h:hover .article-card-h-img { filter: brightness(0.85) saturate(0.8); }
.article-card-h-title {
  font-family: var(--font-display); font-size: .9375rem; font-weight: 400;
  color: var(--champagne-warm); line-height: 1.35;
  transition: color var(--dur-base);
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.article-card-h:hover .article-card-h-title { color: var(--gold-300); }

/* ── SEARCH ── */
.search-bar-imperial {
  position: relative;
}
.search-bar-imperial input {
  background: var(--obsidian-lift);
  border: 1px solid var(--border-gold);
  border-radius: var(--r-full);
  padding: var(--sp-4) var(--sp-6) var(--sp-4) var(--sp-10);
  font-family: var(--font-ui); font-size: .8125rem;
  color: var(--champagne-warm); width: 100%;
  outline: none;
  transition: all var(--dur-base) var(--ease-gold);
}
.search-bar-imperial input::placeholder { color: var(--champagne-faint); letter-spacing: .04em; }
.search-bar-imperial input:focus { border-color: var(--gold-500); box-shadow: var(--glow-gold-sm); }
.search-bar-icon { position: absolute; left: var(--sp-4); top: 50%; transform: translateY(-50%); color: var(--gold-600); font-size: .875rem; pointer-events: none; }
.search-results-drop {
  position: absolute; top: calc(100% + 6px); left: 0; right: 0;
  background: var(--obsidian-glass); backdrop-filter: blur(20px);
  border: 1px solid var(--border-gold);
  border-radius: var(--r-xl);
  box-shadow: var(--glow-card);
  z-index: 200; display: none; overflow: hidden;
}
.search-result-item {
  display: flex; align-items: center; gap: var(--sp-3);
  padding: var(--sp-3) var(--sp-4);
  transition: background var(--dur-fast); text-decoration: none;
}
.search-result-item:hover { background: rgba(201,150,58,.08); }
.search-result-img { width: 44px; height: 44px; border-radius: var(--r-md); object-fit: cover; flex-shrink: 0; filter: brightness(0.8) saturate(0.7); }
.search-result-title { font-family: var(--font-display); font-size: .875rem; color: var(--champagne-bright); line-height: 1.3; }
.search-result-meta { font-family: var(--font-ui); font-size: .5rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--champagne-faint); margin-top: 2px; }
.search-no-results { padding: var(--sp-5); text-align: center; font-size: .8125rem; color: var(--champagne-faint); font-family: var(--font-ui); }

/* ── BLOG PAGE ── */
.blog-filters { display: flex; align-items: center; gap: var(--sp-3); flex-wrap: wrap; margin-bottom: var(--sp-8); }
.filter-pill {
  font-family: var(--font-ui); font-size: .5625rem; font-weight: 700;
  letter-spacing: .12em; text-transform: uppercase;
  padding: var(--sp-2) var(--sp-5);
  border-radius: var(--r-full);
  border: 1px solid var(--border-gold);
  color: var(--champagne-faint);
  background: transparent; cursor: pointer;
  transition: all var(--dur-fast) var(--ease-gold);
}
.filter-pill:hover, .filter-pill.active {
  background: rgba(201,150,58,0.12);
  border-color: var(--border-gold-h);
  color: var(--gold-300);
  box-shadow: var(--glow-gold-sm);
}
.blog-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: var(--sp-6); }

/* ── ARTICLE DETAIL ── */
.article-layout {
  display: grid;
  grid-template-columns: 1fr 300px;
  gap: var(--sp-12); align-items: start;
}
.article-sidebar {
  position: sticky; top: calc(var(--nav-h) + var(--sp-8));
}
.reading-progress-bar {
  position: fixed; top: 0; left: 0; height: 2px; z-index: 9999;
  background: var(--gold-shimmer); background-size: 200%;
  animation: gold-shimmer 4s ease-in-out infinite;
  box-shadow: var(--glow-gold-sm);
}
.article-hero-img {
  width: 100%; height: 480px; object-fit: cover;
  border-radius: var(--r-3xl); margin-bottom: var(--sp-10);
  border: 1px solid var(--border-gold);
  filter: brightness(0.85) saturate(0.8); display: block;
}
.article-header { margin-bottom: var(--sp-8); }
.article-meta { display: flex; align-items: center; gap: var(--sp-4); margin-bottom: var(--sp-5); flex-wrap: wrap; }
.article-title {
  font-family: var(--font-display); font-size: clamp(2rem, 4vw, 3.5rem);
  font-weight: 300; color: var(--champagne-bright);
  letter-spacing: -.02em; line-height: 1.1; margin-bottom: var(--sp-4);
}
.article-subtitle {
  font-family: var(--font-display); font-style: italic;
  font-size: 1.125rem; font-weight: 300;
  color: var(--champagne-muted); line-height: 1.6;
  padding-left: var(--sp-5); border-left: 2px solid var(--gold-600);
}
.article-tags { display: flex; flex-wrap: wrap; gap: var(--sp-2); margin-top: var(--sp-5); }

/* Article content */
.article-content { color: var(--champagne-muted); font-weight: 300; }
.article-content h2 {
  font-family: var(--font-display); font-size: clamp(1.5rem, 2.5vw, 2.25rem);
  font-weight: 400; color: var(--champagne-bright);
  margin-top: var(--sp-12); margin-bottom: var(--sp-5);
  padding-bottom: var(--sp-4); border-bottom: 1px solid var(--border-subtle);
  letter-spacing: -.01em;
}
.article-content h3 {
  font-family: var(--font-display); font-size: 1.375rem; font-weight: 400;
  color: var(--champagne-warm); margin-top: var(--sp-8); margin-bottom: var(--sp-4);
}
.article-content p { font-size: 1.0625rem; line-height: 1.82; margin-bottom: var(--sp-5); }
.article-content .body-xl { font-size: 1.2rem; color: var(--champagne-warm); font-style: italic; font-family: var(--font-display); margin-bottom: var(--sp-8); }
.article-content ul, .article-content ol { padding-left: var(--sp-6); margin-bottom: var(--sp-5); display: flex; flex-direction: column; gap: var(--sp-2); }
.article-content li { font-size: 1rem; line-height: 1.7; }
.article-content ul li { list-style: disc; }
.article-content ol li { list-style: decimal; }
.article-content strong { color: var(--champagne-bright); font-weight: 600; }
.article-content a { color: var(--gold-400); text-decoration: underline; text-underline-offset: 3px; }
.article-callout {
  background: rgba(201,150,58,0.06);
  border: 1px solid var(--border-gold);
  border-left: 3px solid var(--gold-500);
  border-radius: var(--r-lg);
  padding: var(--sp-5) var(--sp-6);
  margin-block: var(--sp-8);
  display: flex; gap: var(--sp-4);
}
.article-callout.callout-sage {
  background: rgba(74,124,89,0.07);
  border-color: rgba(74,124,89,0.25);
  border-left-color: var(--sage-bright);
}
.callout-icon { font-size: 1.25rem; flex-shrink: 0; }
.article-callout strong { display: block; color: var(--champagne-bright); margin-bottom: var(--sp-2); font-size: .875rem; font-family: var(--font-ui); letter-spacing: .06em; text-transform: uppercase; }
.article-callout p { margin-bottom: 0; font-size: .9rem; }

/* Article disclaimer */
.article-disclaimer {
  background: rgba(255,255,255,.02);
  border: 1px solid var(--border-subtle);
  border-radius: var(--r-lg);
  padding: var(--sp-5) var(--sp-6);
  margin-top: var(--sp-10);
  font-size: .75rem; color: var(--champagne-faint);
  line-height: 1.6; font-family: var(--font-ui);
}

/* Share bar */
.share-bar {
  display: flex; align-items: center; gap: var(--sp-3);
  padding: var(--sp-5) 0; border-top: 1px solid var(--border-subtle);
  margin-top: var(--sp-8); flex-wrap: wrap;
}
.share-btn {
  font-family: var(--font-ui); font-size: .5625rem; font-weight: 700;
  letter-spacing: .1em; text-transform: uppercase;
  padding: var(--sp-2) var(--sp-4); border-radius: var(--r-full);
  border: 1px solid var(--border-gold); color: var(--champagne-muted);
  background: transparent; cursor: pointer;
  transition: all var(--dur-fast);
}
.share-btn:hover { background: rgba(201,150,58,.08); color: var(--gold-300); border-color: var(--border-gold-h); }

/* Sidebar */
.sidebar-widget {
  background: var(--obsidian-card);
  border: 1px solid var(--border-gold);
  border-radius: var(--r-2xl);
  padding: var(--sp-6); margin-bottom: var(--sp-5);
  position: relative;
}
.sidebar-widget-title {
  font-family: var(--font-ui); font-size: .5rem; font-weight: 700;
  letter-spacing: .18em; text-transform: uppercase;
  color: var(--gold-500); padding-bottom: var(--sp-4);
  margin-bottom: var(--sp-4); border-bottom: 1px solid var(--border-subtle);
  display: flex; align-items: center; gap: var(--sp-2);
}

/* ── CATEGORY PAGE ── */
.cat-page-hero-icon {
  width: 72px; height: 72px;
  border-radius: var(--r-2xl); display: flex; align-items: center;
  justify-content: center; font-size: 2rem;
  border: 1px solid var(--border-gold); background: var(--obsidian-surface);
  box-shadow: var(--glow-gold-sm); margin-bottom: var(--sp-5);
}

/* ── ABOUT PAGE ── */
.about-hero-grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--sp-16); align-items: center; }
.about-hero-img { border-radius: var(--r-3xl); overflow: hidden; border: 1px solid var(--border-gold); box-shadow: var(--glow-card); }
.about-hero-img img { width: 100%; height: 480px; object-fit: cover; filter: brightness(0.82) saturate(0.75); }
.about-values-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: var(--sp-5); }
.value-card { background: var(--obsidian-card); border: 1px solid var(--border-gold); border-radius: var(--r-2xl); padding: var(--sp-8); }
.value-icon { font-size: 2rem; margin-bottom: var(--sp-4); }
.value-title { font-family: var(--font-display); font-size: 1.25rem; font-weight: 400; color: var(--champagne-bright); margin-bottom: var(--sp-3); }
.value-desc { font-size: .875rem; color: var(--champagne-muted); line-height: 1.7; font-weight: 300; }
.team-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: var(--sp-6); }
.team-card { background: var(--obsidian-card); border: 1px solid var(--border-gold); border-radius: var(--r-2xl); overflow: hidden; }
.team-img { width: 100%; aspect-ratio:1; object-fit: cover; filter: brightness(0.78) saturate(0.65) sepia(0.1); }
.team-body { padding: var(--sp-6); }
.team-name { font-family: var(--font-display); font-size: 1.25rem; font-weight: 400; color: var(--champagne-bright); }
.team-role { font-family: var(--font-ui); font-size: .5625rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--gold-500); margin-top: 4px; }
.team-bio { font-size: .8125rem; color: var(--champagne-muted); line-height: 1.65; margin-top: var(--sp-3); font-weight: 300; }

/* ── CONTACT PAGE ── */
.contact-layout { display: grid; grid-template-columns: 1fr 1.5fr; gap: var(--sp-12); align-items: start; }
.contact-info-card { background: var(--obsidian-card); border: 1px solid var(--border-gold); border-radius: var(--r-2xl); padding: var(--sp-8); }
.contact-info-item { display: flex; align-items: flex-start; gap: var(--sp-4); padding-block: var(--sp-5); border-bottom: 1px solid var(--border-subtle); }
.contact-info-item:last-child { border-bottom: none; }
.contact-info-icon { width: 44px; height: 44px; border-radius: var(--r-xl); background: rgba(201,150,58,.08); border: 1px solid var(--border-gold); display: flex; align-items: center; justify-content: center; font-size: 1rem; flex-shrink: 0; }
.contact-info-label { font-family: var(--font-ui); font-size: .5rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--gold-500); margin-bottom: 4px; }
.contact-info-val { font-size: .9375rem; color: var(--champagne-warm); line-height: 1.5; font-weight: 300; }
.contact-info-val a { color: var(--gold-400); }
.contact-form-card { background: var(--obsidian-card); border: 1px solid var(--border-gold); border-radius: var(--r-2xl); padding: var(--sp-8); }
.contact-form { display: flex; flex-direction: column; gap: var(--sp-4); }

/* FAQ */
.faq-list { display: flex; flex-direction: column; gap: var(--sp-3); }
.faq-item { background: var(--obsidian-card); border: 1px solid var(--border-gold); border-radius: var(--r-xl); overflow: hidden; transition: border-color var(--dur-fast); }
.faq-item.open,.faq-item:hover { border-color: var(--border-gold-h); }
.faq-btn {
  display: flex; align-items: center; justify-content: space-between; gap: var(--sp-4);
  padding: var(--sp-5) var(--sp-6); cursor: pointer;
  font-family: var(--font-display); font-size: 1rem; font-weight: 400;
  color: var(--champagne-warm); width: 100%; background: none; border: none; text-align: left;
  transition: color var(--dur-fast);
}
.faq-btn:hover,.faq-item.open .faq-btn { color: var(--gold-300); }
.faq-chevron { color: var(--gold-500); flex-shrink: 0; transition: transform var(--dur-base) var(--ease-gold); font-size: 1rem; }
.faq-item.open .faq-chevron { transform: rotate(180deg); }
.faq-answer {
  max-height: 0; overflow: hidden; padding-inline: var(--sp-6);
  font-size: .9rem; color: var(--champagne-muted); line-height: 1.75;
  font-weight: 300; transition: max-height var(--dur-slow) var(--ease-out), padding var(--dur-slow);
}
.faq-item.open .faq-answer { max-height: 400px; padding-bottom: var(--sp-5); }

/* ── PAGE UTILITIES ── */
.privacy-card, .terms-card {
  background: var(--obsidian-card);
  border: 1px solid var(--border-gold);
  border-radius: var(--r-2xl);
  padding: var(--sp-8);
}
.privacy-detail-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: var(--sp-8); }
.privacy-detail, .terms-detail { background: var(--obsidian-card); border: 1px solid var(--border-subtle); border-radius: var(--r-xl); padding: var(--sp-6); margin-top: var(--sp-6); }
.terms-list { display: grid; grid-template-columns: repeat(2,1fr); gap: var(--sp-8); }
.terms-card h3, .privacy-card h3 { font-family: var(--font-display); font-size: 1.25rem; font-weight: 400; color: var(--champagne-bright); margin-bottom: var(--sp-4); }
.terms-card p, .privacy-card p, .privacy-detail p { color: var(--champagne-muted); line-height: 1.75; }
.terms-card ul, .privacy-card ul { padding-left: var(--sp-5); margin-top: var(--sp-4); display: flex; flex-direction: column; gap: var(--sp-2); }
.terms-card li, .privacy-card li { font-size: .9375rem; color: var(--champagne-faint); line-height: 1.7; }

/* ── LEGAL PAGES ── */
.legal-layout { display: grid; grid-template-columns: 200px 1fr; gap: var(--sp-10); align-items: start; }
.legal-toc {
  position: sticky; top: calc(var(--nav-h)+var(--sp-6));
  background: var(--obsidian-card); border: 1px solid var(--border-gold);
  border-radius: var(--r-2xl); padding: var(--sp-5);
}
.legal-toc-label { font-family: var(--font-ui); font-size: .5rem; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: var(--gold-600); margin-bottom: var(--sp-4); }
.legal-toc-link { display: block; padding: var(--sp-2) var(--sp-3); border-radius: var(--r-md); font-family: var(--font-ui); font-size: .6875rem; font-weight: 600; letter-spacing: .04em; color: var(--champagne-faint); transition: all var(--dur-fast); }
.legal-toc-link:hover { background: rgba(201,150,58,.08); color: var(--gold-400); }
.legal-content h2 {
  font-family: var(--font-display); font-size: clamp(1.2rem,2vw,1.75rem);
  font-weight: 400; color: var(--champagne-bright);
  margin-top: var(--sp-10); margin-bottom: var(--sp-4);
  padding-bottom: var(--sp-3); border-bottom: 1px solid var(--border-subtle);
  scroll-margin-top: calc(var(--nav-h)+var(--sp-6));
}
.legal-content h2:first-child { margin-top: 0; }
.legal-content h3 { font-family: var(--font-display); font-size: 1.125rem; font-weight: 400; color: var(--champagne-warm); margin-top: var(--sp-6); margin-bottom: var(--sp-3); }
.legal-content p { font-size: .875rem; color: var(--champagne-muted); line-height: 1.8; margin-bottom: var(--sp-4); font-weight: 300; }
.legal-content ul { padding-left: var(--sp-5); margin-bottom: var(--sp-4); display: flex; flex-direction: column; gap: var(--sp-2); }
.legal-content li { font-size: .875rem; color: var(--champagne-muted); line-height: 1.65; list-style: disc; font-weight: 300; }
.legal-content a { color: var(--gold-400); text-decoration: underline; }
.legal-meta { background: rgba(201,150,58,.05); border: 1px solid var(--border-gold); border-radius: var(--r-xl); padding: var(--sp-5) var(--sp-6); margin-bottom: var(--sp-8); font-size: .8125rem; color: var(--champagne-muted); line-height: 1.65; font-weight: 300; }

/* ── RESPONSIVE ── */
@media(max-width:1024px){
  .article-layout { grid-template-columns:1fr; }
  .article-sidebar { position:static; }
  .legal-layout { grid-template-columns:1fr; }
  .legal-toc { position:static; display:flex; flex-wrap:wrap; gap:var(--sp-2); }
  .about-hero-grid { grid-template-columns:1fr; }
  .about-values-grid { grid-template-columns:repeat(2,1fr); }
  .team-grid { grid-template-columns:1fr 1fr; }
  .contact-layout { grid-template-columns:1fr; }
}
@media(max-width:768px){
  .blog-grid { grid-template-columns:1fr; }
  .about-values-grid { grid-template-columns:1fr; }
  .team-grid { grid-template-columns:1fr; }
  .article-hero-img { height:280px; }
}