/* ============================================================
   faq.css - FAQ page only (/faq, FAQ.aspx)
   Reuses from common.css: .hero, .section-pad, .container,
   .eyebrow, .serif, .h2-blue, .link-arrow and the .hub-faq accordion.
   ============================================================ */

/* ===== LAYOUT: sticky topic list + question groups ===== */
.faq-layout{
  display:grid;
  grid-template-columns:260px minmax(0,1fr);
  gap:80px;
  align-items:start;
}
.faq-nav{position:sticky;top:120px;}
.faq-nav-list{list-style:none;margin:22px 0 0;padding:0;border-top:1px solid var(--line);}
.faq-nav-list li{border-bottom:1px solid var(--line);}
.faq-nav-list a{
  display:flex;
  gap:14px;
  padding:13px 0;
  font-size:14px;
  line-height:1.4;
  color:var(--muted);
  transition:color .2s ease;
}
.faq-nav-list a:hover,
.faq-nav-list a.is-active{color:var(--color-heading);}
.faq-nav-list a.is-active .faq-num{color:var(--gold);}

.faq-num{
  font-size:var(--fs-eyebrow);
  letter-spacing:.18em;
  font-weight:500;
  color:var(--gold);
  flex-shrink:0;
  padding-top:2px;
}
.faq-nav-list .faq-num{color:var(--line);transition:color .2s ease;}

/* ===== GROUPS ===== */
.faq-group{scroll-margin-top:120px;}
.faq-group + .faq-group{margin-top:64px;}
.faq-group-head{
  display:flex;
  align-items:baseline;
  gap:18px;
  padding-bottom:18px;
  border-bottom:1px solid var(--line);
}
.faq-group-head h2{font-size:var(--fs-h2);line-height:var(--lh-h2);font-weight:var(--fw-h2);margin:0;}

/* .hub-faq answers here are rich HTML (several <p>, tables, links) */
.faq-page .hub-faq details{padding:18px 0;scroll-margin-top:120px;}
.faq-page .hub-faq summary{font-size:15.5px;line-height:1.5;}
.faq-page .hub-faq summary::after{color:var(--gold);}
.faq-answer{padding:12px 40px 4px 0;}
.faq-page .hub-faq .faq-answer p{padding:0;margin:0 0 12px;font-size:15px;}
.faq-page .hub-faq .faq-answer p:last-child{margin-bottom:0;}

/* The two comparison tables (membership tiers, partner privileges) */
.faq-table{
  width:100%;
  border-collapse:collapse;
  margin:16px 0 8px;
  font-size:14px;
  line-height:1.55;
}
.faq-table th{
  text-align:left;
  font-size:var(--fs-eyebrow);
  letter-spacing:.14em;
  text-transform:uppercase;
  font-weight:600;
  color:var(--color-heading);
  padding:0 16px 10px 0;
  border-bottom:1px solid var(--color-heading);
}
.faq-table td{
  vertical-align:top;
  padding:12px 16px 12px 0;
  border-bottom:1px solid var(--line);
  color:var(--muted);
}
.faq-table td:first-child{color:var(--ink);font-weight:500;white-space:nowrap;}

/* ===== CONTACT ===== */
.faq-contact{background:#f6f3ee;padding:var(--section-space-md) 0;}
.faq-contact-head{text-align:center;margin-bottom:40px;}
.faq-contact-head .eyebrow{justify-content:center;}
.faq-contact-head h2{font-size:var(--fs-h2);line-height:var(--lh-h2);font-weight:var(--fw-h2);margin:14px 0 0;}
.faq-contact-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:24px;
  max-width:880px;
  margin:0 auto;
}
.faq-contact-card{background:#fff;padding:36px 40px;border:1px solid var(--line);}
.faq-contact-card p{color:var(--muted);font-size:15px;line-height:1.6;margin:0 0 20px;}
.faq-contact-card .faq-contact-label{
  font-family:'Playfair Display',serif;
  font-size:24px;
  color:var(--color-heading);
  margin-bottom:10px;
}
.faq-contact-card .link-arrow{color:var(--color-heading);text-transform:none;letter-spacing:.04em;font-size:14px;}
.faq-contact-card .faq-contact-hours{font-size:13px;margin:14px 0 0;}

/* ===== RESPONSIVE ===== */
@media (max-width:1100px){
  .faq-layout{grid-template-columns:minmax(0,1fr);gap:36px;}
  .faq-nav{position:static;min-width:0;}
  .faq-nav-list{
    display:flex;
    gap:8px;
    overflow-x:auto;
    border-top:0;
    padding-bottom:6px;
    -webkit-overflow-scrolling:touch;
  }
  .faq-nav-list li{border:0;flex-shrink:0;}
  .faq-nav-list a{
    padding:9px 16px;
    border:1px solid var(--line);
    border-radius:999px;
    font-size:13px;
    white-space:nowrap;
    gap:8px;
  }
  .faq-nav-list .faq-num{display:none;}
}
@media (max-width:700px){
  .faq-answer{padding-right:0;}
  .faq-table,.faq-table tbody,.faq-table tr,.faq-table td{display:block;width:100%;}
  .faq-table thead{display:none;}
  .faq-table tr{padding:12px 0;border-bottom:1px solid var(--line);}
  .faq-table td{border:0;padding:2px 0;}
  .faq-table td:first-child{white-space:normal;}
  .faq-contact-grid{grid-template-columns:1fr;}
  .faq-contact-card{padding:28px 24px;}
  .faq-group + .faq-group{margin-top:48px;}
}