/* Buyer guide. Uses the project-page section vocabulary (header grid, .project-facts
   stat strip, card grids, the shared .faq-list accordion) in the warm content-page
   palette from pages.css. Loaded after menu.css so its .faq-list rules win. */

.guide-page {
  --gd-dark: #171510;
  --gd-dark-alt: #201c14;
  --gd-cream: #eee7dc;
  --gd-accent: #c9985b;
  --gd-accent-soft: #c9985b44;
  --gd-gold: #d7b878;
  --gd-ink: #211d17;
  --gd-muted-dark: #b7ac9a;   /* muted body on dark  */
  --gd-muted-cream: #5f574c;  /* muted body on cream */

  --gutter: clamp(24px, 7vw, 132px);
  --band-y: clamp(80px, 9vw, 138px);

  margin: 0;
  background: var(--gd-dark);
  color: #f7f3ec;
}
.guide-content { display: block; }
.guide-page article { display: block; }

.guide-page h1, .guide-page h2, .guide-page h3 { font-family: Georgia, "Times New Roman", serif; font-weight: 400; }
.guide-page .label {
  display: block;
  font-size: .63rem;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--gd-accent);
}

/* ---- hero ------------------------------------------------------------- */
.guide-hero {
  position: relative;
  display: flex;
  min-height: min(760px, 88svh);
  box-sizing: border-box;
  align-items: flex-end;
  overflow: hidden;
  padding: clamp(96px, 13vw, 168px) var(--gutter) clamp(56px, 8vw, 104px);
  background: var(--gd-dark);
  border-bottom: 1px solid var(--gd-accent-soft);
}
.guide-hero::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, #171510f5 0%, #171510df 38%, #17151055 66%, transparent), linear-gradient(0deg, #17151099, transparent 45%); }
.guide-hero-image { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.guide-hero-copy { position: relative; z-index: 1; width: min(760px, 100%); }
.guide-hero h1 {
  margin: 22px 0 32px;
  font-size: clamp(3.6rem, 8.5vw, 7.4rem);
  line-height: .84;
  letter-spacing: -.06em;
}
.guide-hero h1 em { color: var(--gd-gold); font-style: normal; }
.guide-hook {
  max-width: 44ch;
  margin: 0;
  color: #c7bcaa;
  font: italic 400 clamp(1.08rem, 1.7vw, 1.4rem)/1.55 Georgia, serif;
  text-wrap: balance;
}
.guide-byline {
  margin: 34px 0 0;
  color: #8d8272;
  font-size: .62rem;
  letter-spacing: .1em;
  text-transform: uppercase;
}

/* ---- direct answer + contents -------------------------------------- */
.guide-answer { padding: clamp(64px, 7vw, 96px) var(--gutter); background: var(--gd-cream); color: var(--gd-ink); }
.guide-answer h2 { max-width: 18ch; margin: 14px 0 22px; font-size: clamp(2rem, 4vw, 3.6rem); line-height: .98; letter-spacing: -.04em; }
.guide-answer > p:not(.label) { max-width: 76ch; margin: 0; color: var(--gd-muted-cream); font-size: 1.02rem; line-height: 1.75; }
.guide-answer nav { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 30px; }
.guide-answer nav a { padding: 10px 14px; border: 1px solid #bcae9a; color: var(--gd-ink); font-size: .72rem; text-decoration: none; }
.guide-answer nav a:hover { border-color: #8f673e; background: #e3d7c6; }

/* ---- essentials strip (like .project-facts) -------------------------- */
.guide-facts {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  padding: 52px var(--gutter);
  background: var(--gd-cream);
  color: var(--gd-ink);
}
.guide-facts article { padding: 8px 3vw; border-left: 1px solid #c8bca8; }
.guide-facts article:first-child { border-left: 0; }
.guide-facts strong {
  display: block;
  font: 400 clamp(1.7rem, 3vw, 3rem) Georgia, serif;
  letter-spacing: -.03em;
}
.guide-facts p { margin: 12px 0 0; color: #6d6257; font-size: .74rem; line-height: 1.55; }

/* ---- section bands + header grid (like .project-section) ------------ */
.guide-section { padding: var(--band-y) var(--gutter); background: var(--gd-dark); }
.guide-costs-section, .guide-faq-alt { background: var(--gd-dark-alt); }
.guide-faq:not(.guide-faq-alt) { background: var(--gd-cream); color: var(--gd-ink); }

.guide-section > header {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(280px, .85fr);
  gap: 8vw;
  align-items: end;
  margin-bottom: 56px;
}
.guide-section > header h2 {
  margin: 16px 0 0;
  font-size: clamp(2.6rem, 5vw, 4.6rem);
  line-height: .92;
  letter-spacing: -.05em;
}
.guide-section > header h2 em { color: var(--gd-gold); font-style: normal; }
.guide-faq:not(.guide-faq-alt) > header .label { color: #8f673e; }
.guide-faq:not(.guide-faq-alt) > header h2 em { color: #8f673e; }
.guide-section > header > p {
  margin: 0;
  line-height: 1.75;
  color: var(--gd-muted-dark);
}
.guide-faq:not(.guide-faq-alt) > header > p { color: var(--gd-muted-cream); }

.guide-note {
  max-width: 62ch;
  margin: 40px 0 0;
  padding-top: 22px;
  border-top: 1px solid var(--gd-accent-soft);
  font-size: .82rem;
  line-height: 1.7;
  color: #a99d8b;
}

/* ---- explanatory diagrams ----------------------------------------- */
.guide-journey { display: grid; grid-template-columns:1fr auto 1fr auto 1fr auto 1fr auto 1fr; align-items:center; gap:14px; margin-bottom:54px; padding:28px; border:1px solid var(--gd-accent-soft); background:#120f0b; }
.guide-journey span { display:flex; min-width:0; flex-direction:column; gap:5px; }
.guide-journey b { color:var(--gd-accent); font:400 .7rem/1 sans-serif; letter-spacing:.14em; }
.guide-journey small { color:var(--gd-muted-dark); line-height:1.35; }
.guide-journey i { width:26px; height:1px; background:var(--gd-accent); }
.guide-money-map { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1px; margin-bottom:46px; background:var(--gd-accent-soft); border:1px solid var(--gd-accent-soft); }
.guide-money-map div { padding:24px; background:#17130d; }
.guide-money-map span,.guide-money-map small { display:block; color:var(--gd-muted-dark); font-size:.68rem; line-height:1.5; }
.guide-money-map strong { display:block; margin:12px 0 16px; font:400 clamp(1.35rem,2.4vw,2.2rem) Georgia,serif; color:#fff; }
.guide-role-map { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin-bottom:48px; }
.guide-role-map article { padding:26px; border:1px solid var(--gd-accent-soft); }
.guide-role-map span { color:var(--gd-accent); font-size:.63rem; letter-spacing:.14em; text-transform:uppercase; }
.guide-role-map strong { display:block; margin:12px 0; font:400 1.35rem Georgia,serif; }
.guide-role-map p { margin:0; color:var(--gd-muted-cream); font-size:.82rem; line-height:1.65; }
.guide-protection-map { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; margin-bottom:48px; counter-reset:protect; }
.guide-protection-map span { position:relative; padding:52px 22px 24px; border-top:2px solid var(--gd-accent); background:#17130d; color:var(--gd-muted-dark); font-size:.8rem; line-height:1.55; counter-increment:protect; }
.guide-protection-map span::before { content:"0" counter(protect); position:absolute; top:18px; left:22px; color:var(--gd-accent); font-size:.65rem; }
.guide-protection-map b { display:block; margin-bottom:8px; color:#fff; font:400 1.05rem Georgia,serif; }
.guide-document-flow { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:1px; margin-bottom:48px; background:var(--gd-accent-soft); border:1px solid var(--gd-accent-soft); }
.guide-document-flow span { padding:22px; background:#17130d; font:400 1rem Georgia,serif; }
.guide-document-flow small { display:block; margin-top:8px; color:var(--gd-muted-dark); font:400 .68rem/1.5 sans-serif; }
.guide-sources { padding:clamp(68px,8vw,110px) var(--gutter); background:var(--gd-cream); color:var(--gd-ink); }
.guide-sources h2 { margin:14px 0 30px; font-size:clamp(2rem,4vw,3.8rem); letter-spacing:-.04em; }
.guide-sources ul { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1px; margin:0; padding:1px; list-style:none; background:#c8bca8; }
.guide-sources a { display:block; height:100%; box-sizing:border-box; padding:18px 20px; background:var(--gd-cream); color:var(--gd-ink); font-size:.8rem; line-height:1.5; text-decoration:none; }
.guide-sources a:hover { background:#e3d7c6; }

/* ---- step-by-step list --------------------------------------------- */
.guide-steps { counter-reset: step; list-style: none; margin: 0; padding: 0; }
.guide-steps > li {
  position: relative;
  padding: 30px 0 30px clamp(58px, 7vw, 88px);
  border-top: 1px solid var(--gd-accent-soft);
  counter-increment: step;
}
.guide-steps > li:last-child { border-bottom: 1px solid var(--gd-accent-soft); }
.guide-steps > li::before {
  content: counter(step, decimal-leading-zero);
  position: absolute;
  left: 0;
  top: 32px;
  font: 400 1.55rem Georgia, serif;
  color: var(--gd-accent);
  letter-spacing: .04em;
}
.guide-steps h3 {
  margin: 0 0 12px;
  font-size: clamp(1.3rem, 2.3vw, 1.75rem);
  line-height: 1.2;
  letter-spacing: -.02em;
  color: #f7f3ec;
}
.guide-steps > li > ul { list-style: none; margin: 0; padding: 0; max-width: 62ch; }
.guide-steps > li > ul > li {
  position: relative;
  padding: 5px 0 5px 20px;
  color: var(--gd-muted-dark);
  font-size: .92rem;
  line-height: 1.65;
}
.guide-steps > li > ul > li::before { content: "—"; position: absolute; left: 0; color: var(--gd-accent); }

/* ---- cost cards (like .project-cards) ------------------------------ */
.guide-cards {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.guide-cards article {
  display: flex;
  box-sizing: border-box;
  flex-direction: column;
  min-height: 200px;
  padding: 28px;
  border: 1px solid var(--gd-accent-soft);
  border-top: 2px solid var(--gd-accent);
  background: #171510;
}
.guide-costs-section .guide-cards article { background: #17130d; }
.guide-cards span {
  color: var(--gd-accent);
  font-size: .62rem;
  letter-spacing: .16em;
  text-transform: uppercase;
}
.guide-cards strong {
  display: block;
  margin: 18px 0 8px;
  font: 400 clamp(1.9rem, 3.4vw, 3rem) Georgia, serif;
  letter-spacing: -.03em;
}
.guide-cards p { margin: auto 0 0; color: var(--gd-muted-dark); font-size: .8rem; line-height: 1.6; }

/* ---- FAQ answers: reuse shared .faq-list, allow rich content ------- */
.guide-faq .faq-list {
  --faq-line: #d7b87833;
  --faq-marker: var(--gd-gold);
  --faq-answer-color: var(--gd-muted-dark);
  --faq-summary-size: clamp(1.05rem, 1.7vw, 1.32rem);
  --faq-answer-size: .92rem;
  --faq-answer-width: 68ch;
}
.guide-faq:not(.guide-faq-alt) .faq-list {
  --faq-line: #bdb3a7;
  --faq-marker: #8f673e;
  --faq-answer-color: var(--gd-muted-cream);
}
.guide-faq .faq-list details > * { max-width: var(--faq-answer-width); }
.guide-faq .faq-list details > p {
  margin: 0;
  padding: 0 40px 10px 0;
  color: var(--faq-answer-color);
  font-size: var(--faq-answer-size);
  line-height: 1.72;
}
.guide-faq .faq-list details > p:last-child { padding-bottom: 26px; }
.guide-faq .faq-list details > ul {
  margin: 0;
  padding: 2px 40px 26px 20px;
  list-style: none;
  color: var(--faq-answer-color);
  font-size: var(--faq-answer-size);
  line-height: 1.6;
}
.guide-faq .faq-list details > ul > li { position: relative; padding: 5px 0 5px 18px; }
.guide-faq .faq-list details > ul > li::before { content: "—"; position: absolute; left: 0; color: var(--faq-marker); }
.guide-faq .faq-list details strong { color: inherit; font-weight: 700; }
.guide-faq:not(.guide-faq-alt) .faq-list details strong { color: var(--gd-ink); }
.guide-faq-alt .faq-list details strong { color: #f7f3ec; }

/* ---- glossary ----------------------------------------------------- */
.guide-glossary { margin: 0; border-top: 1px solid var(--gd-accent-soft); }
.guide-glossary > div {
  display: grid;
  grid-template-columns: minmax(160px, .32fr) 1fr;
  gap: 6px 36px;
  padding: 17px 0;
  border-bottom: 1px solid var(--gd-accent-soft);
}
.guide-glossary dt { margin: 0; font: 400 1rem Georgia, serif; color: #f7f3ec; }
.guide-glossary dd { margin: 0; color: var(--gd-muted-dark); font-size: .87rem; line-height: 1.65; }

/* ---- closing CTA (like .concierge / .page-cta) ------------------- */
.guide-cta {
  text-align: center;
  padding: clamp(96px, 13vw, 156px) 8vw;
  background: radial-gradient(circle at 50% 66%, #4b1a22, #150f0e 64%);
}
.guide-cta h2 {
  margin: 20px 0 26px;
  font-size: clamp(2.8rem, 6vw, 5.6rem);
  line-height: .92;
  letter-spacing: -.055em;
}
.guide-cta h2 em { color: var(--gd-gold); font-style: normal; }
.guide-cta > p:not(.label) { max-width: 46ch; margin: 0 auto 40px; color: #c7bcaa; line-height: 1.75; }
.guide-cta .cta { display: inline-flex; justify-content: center; }
.guide-projects {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  max-width: 720px;
  margin: 60px auto 0;
  background: var(--gd-accent-soft);
  border: 1px solid var(--gd-accent-soft);
}
.guide-projects a {
  padding: 22px 24px;
  background: #150f0e;
  color: inherit;
  text-decoration: none;
  transition: background .3s;
}
.guide-projects a:hover { background: #221812; }
.guide-projects strong { display: block; font: 400 1.15rem Georgia, serif; }
.guide-projects small { color: #8d8272; font-size: .58rem; letter-spacing: .12em; text-transform: uppercase; }
.guide-disclaimer { max-width: 62ch; margin: 54px auto 0; color: #7c7266; font-size: .72rem; line-height: 1.65; }

/* ---- expandable guides library ------------------------------------ */
.guides-index-hero { padding:clamp(110px,14vw,190px) var(--gutter) clamp(80px,10vw,140px); background:radial-gradient(circle at 72% 25%,#4a3b2444,transparent 34%),var(--gd-dark); }
.guides-index-hero h1 { max-width:900px; margin:22px 0 34px; font:400 clamp(3.8rem,8vw,7.8rem)/.86 Georgia,serif; letter-spacing:-.065em; }
.guides-index-hero h1 em { color:var(--gd-gold); font-style:normal; }
.guides-index-hero>p:not(.label) { max-width:64ch; color:var(--gd-muted-dark); font-size:1.04rem; line-height:1.8; }
.guides-library { padding:var(--band-y) var(--gutter); background:var(--gd-cream); color:var(--gd-ink); }
.guides-library>header { display:grid; grid-template-columns:1.15fr .85fr; gap:8vw; align-items:end; margin-bottom:58px; }
.guides-library h2 { margin:16px 0 0; font:400 clamp(2.6rem,5vw,4.6rem)/.94 Georgia,serif; letter-spacing:-.05em; }
.guides-library h2 em { color:#8f673e; font-style:normal; }
.guides-library>header>p { margin:0; color:var(--gd-muted-cream); line-height:1.75; }
.guide-index-grid { display:grid; gap:18px; }
.guide-index-grid>article { display:grid; grid-template-columns:minmax(300px,.85fr) minmax(320px,1.15fr); border:1px solid #c8bca8; background:#f5eee3; }
.guide-index-image { min-height:390px; overflow:hidden; }
.guide-index-image img { display:block; width:100%; height:100%; object-fit:cover; object-position:62% center; transition:transform .6s ease; }
.guide-index-image:hover img { transform:scale(1.025); }
.guide-index-grid>article>div { display:flex; flex-direction:column; justify-content:center; padding:clamp(32px,5vw,72px); }
.guide-index-grid h3 { margin:15px 0 22px; font:400 clamp(2rem,4vw,3.7rem)/.95 Georgia,serif; letter-spacing:-.045em; }
.guide-index-grid h3 a { color:inherit; text-decoration:none; }
.guide-index-grid>article>div>p:not(.label) { max-width:54ch; margin:0; color:var(--gd-muted-cream); line-height:1.7; }
.guide-read { margin-top:34px; color:#8f673e; font-size:.7rem; letter-spacing:.13em; text-transform:uppercase; text-decoration:none; }

/* ---- responsive ------------------------------------------------- */
@media (max-width: 1024px) {
  .guide-section > header { grid-template-columns: 1fr; gap: 0; }
  .guide-section > header > p { margin-top: 26px; }
}
@media (max-width: 800px) {
  .guide-hero { min-height: 760px; padding-top: 150px; }
  .guide-hero::after { background: linear-gradient(0deg,#171510fa 0%,#171510d8 46%,#17151033 78%,transparent); }
  .guide-hero-image { object-position: 66% center; }
  .guide-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px 0; padding: 34px var(--gutter); }
  .guide-facts article { padding: 20px 0; border-left: 0; border-top: 1px solid #c8bca8; }
  .guide-facts article:nth-child(-n+2) { border-top: 0; }
  .guide-cards { grid-template-columns: 1fr; }
  .guide-glossary > div { grid-template-columns: 1fr; gap: 4px; }
  .guide-projects { grid-template-columns: 1fr; }
  .guide-journey { grid-template-columns:1fr; gap:0; }
  .guide-journey i { width:1px; height:18px; margin-left:8px; }
  .guide-money-map,.guide-role-map,.guide-protection-map,.guide-document-flow,.guide-sources ul { grid-template-columns:1fr; }
  .guides-library>header,.guide-index-grid>article { grid-template-columns:1fr; }
  .guides-library>header>p { margin-top:24px; }
  .guide-index-image { min-height:260px; }
}
