/* Luxury SUV Forum - concierge magazine spread, dark
   near-black #141214 / champagne gold #C9A24B / platinum #E7E4DE / wine #6E2639
   Cormorant Garamond (display serif) + Mulish (body) */

:root{
  --ink:#141214;
  --ink-2:#1b191b;
  --ink-3:#231f22;
  --gold:#C9A24B;
  --gold-soft:#b89552;
  --platinum:#E7E4DE;
  --muted:#a39e99;
  --wine:#6E2639;
  --line:#34302f;
  --line-2:#413b3a;
  --maxw:860px;
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;
  background:var(--ink);
  color:var(--platinum);
  font-family:"Mulish",system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  font-size:17px;
  line-height:1.65;
  font-weight:400;
}
a{color:var(--gold);text-decoration:none}
a:hover{text-decoration:underline;text-underline-offset:3px}
a:focus-visible,button:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
img{max-width:100%;height:auto;display:block}

.wrap{max-width:var(--maxw);margin:0 auto;padding:0 28px}

/* ---- masthead ---- */
.masthead{background:var(--ink);border-bottom:1px solid var(--line)}
.masthead-in{display:flex;align-items:center;gap:22px;padding:26px 28px 22px;flex-wrap:wrap}
.brand{display:inline-flex;align-items:center;background:var(--ink);border-radius:4px}
.brand img{height:44px;width:auto}
.wordmark{display:flex;flex-direction:column;line-height:1}
.wordmark .wm-name{font-family:"Cormorant Garamond",Georgia,serif;font-size:1.9rem;font-weight:600;letter-spacing:.01em;color:var(--platinum)}
.wordmark .wm-sub{font-size:.66rem;letter-spacing:.34em;text-transform:uppercase;color:var(--gold);margin-top:6px}
.masthead-note{margin-left:auto;text-align:right;font-size:.74rem;letter-spacing:.06em;color:var(--muted);max-width:230px}
.masthead-note b{display:block;color:var(--gold);font-weight:600;letter-spacing:.18em;text-transform:uppercase;font-size:.64rem;margin-bottom:3px}

/* thin gold rule, the quiet signature detail */
.rule-gold{height:1px;background:linear-gradient(90deg,transparent,var(--gold) 12%,var(--gold) 88%,transparent);opacity:.55}

/* ---- boards nav ---- */
.depts{background:var(--ink-2);border-bottom:1px solid var(--line)}
.depts-in{display:flex;justify-content:space-between;align-items:center;gap:18px;padding:0 28px;flex-wrap:wrap}
.dept-list{list-style:none;display:flex;gap:30px;margin:0;padding:14px 0;flex-wrap:wrap}
.dept-list a{display:flex;flex-direction:column;color:var(--platinum)}
.dept-list a:hover{text-decoration:none}
.dept-list .d-k{font-family:"Cormorant Garamond",serif;font-size:1.12rem;font-weight:600;color:var(--gold)}
.dept-list .d-v{font-size:.72rem;letter-spacing:.04em;color:var(--muted)}
.dept-list a[aria-current="page"] .d-k{color:var(--platinum)}
.dept-list a[aria-current="page"] .d-v{color:var(--gold)}
.site-list{list-style:none;display:flex;gap:18px;margin:0;padding:12px 0;flex-wrap:wrap;font-size:.76rem;letter-spacing:.03em}
.site-list a{color:var(--muted)}
.site-list a[aria-current="page"]{color:var(--gold)}

/* ---- main ---- */
main{padding:38px 0 60px}
.crumbs{font-size:.74rem;letter-spacing:.05em;color:var(--muted);margin-bottom:26px}
.crumbs a{color:var(--gold-soft)}
.crumbs span{margin:0 9px;color:var(--line-2)}

.page-title{font-family:"Cormorant Garamond",serif;font-weight:600;font-size:2.7rem;line-height:1.08;margin:0 0 14px;color:var(--platinum);letter-spacing:.005em}
.page-note{font-size:1.02rem;color:var(--muted);max-width:60ch;margin:0 0 30px}
.page-note b,.page-note span{color:var(--gold-soft)}

/* registry strip (stats) */
.registry{display:flex;gap:42px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:18px 2px;margin:0 0 40px}
.registry > div{display:flex;flex-direction:column}
.registry b{font-family:"Cormorant Garamond",serif;font-size:1.9rem;font-weight:600;color:var(--gold);line-height:1}
.registry span{font-size:.66rem;letter-spacing:.22em;text-transform:uppercase;color:var(--muted);margin-top:7px}

/* section heading */
.spread-h{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin:0 0 20px}
.spread-h h2{font-family:"Cormorant Garamond",serif;font-weight:600;font-size:1.72rem;margin:0;color:var(--platinum)}
.spread-h em{font-style:italic;font-family:"Cormorant Garamond",serif;font-size:1.02rem;color:var(--muted)}

/* board directory */
.directory{list-style:none;margin:0 0 46px;padding:0}
.directory > li{display:grid;grid-template-columns:1fr auto;gap:8px 24px;padding:22px 0;border-top:1px solid var(--line)}
.directory > li:last-child{border-bottom:1px solid var(--line)}
.dir-label{font-family:"Cormorant Garamond",serif;font-size:1.5rem;font-weight:600;color:var(--gold)}
.dir-label:hover{text-decoration:none;color:var(--platinum)}
.dir-desc{grid-column:1/2;margin:6px 0 0;font-size:.95rem;color:var(--muted);max-width:62ch}
.dir-nums{grid-column:2;grid-row:1/3;align-self:center;text-align:right;font-size:.74rem;color:var(--muted);letter-spacing:.04em}
.dir-nums b{display:block;font-family:"Cormorant Garamond",serif;font-size:1.3rem;color:var(--platinum);font-weight:600}

/* thread list (understated rows) */
.threads{list-style:none;margin:0;padding:0}
.threads > li{padding:20px 0;border-top:1px solid var(--line);display:grid;grid-template-columns:1fr 150px;gap:6px 24px;align-items:start}
.threads > li:last-child{border-bottom:1px solid var(--line)}
.t-tag{display:inline-block;font-size:.6rem;letter-spacing:.2em;text-transform:uppercase;color:var(--ink);background:var(--gold);padding:2px 8px;border-radius:2px;margin-bottom:9px;font-weight:700}
.t-tag.pin{background:var(--wine);color:var(--platinum)}
.t-title{font-family:"Cormorant Garamond",serif;font-size:1.3rem;font-weight:600;color:var(--platinum);line-height:1.2;display:block}
.t-title:hover{color:var(--gold);text-decoration:none}
.t-by{font-size:.76rem;color:var(--muted);margin-top:7px;letter-spacing:.02em}
.t-by b{color:var(--gold-soft);font-weight:600}
.t-meta{grid-column:2;text-align:right;font-size:.72rem;color:var(--muted);line-height:1.5}
.t-meta .m-row{display:block}
.t-meta i{font-style:normal;color:var(--line-2)}
.t-meta b{color:var(--platinum);font-weight:600}
.t-meta .m-last b{color:var(--gold-soft);font-weight:600}

/* linklist / other departments */
.linklist{list-style:none;margin:0;padding:0}
.linklist li{padding:14px 0;border-top:1px solid var(--line)}
.linklist li:last-child{border-bottom:1px solid var(--line)}
.linklist a{font-family:"Cormorant Garamond",serif;font-size:1.15rem;font-weight:600}
.linklist span{display:block;font-size:.82rem;color:var(--muted);margin-top:3px}

.invite{margin:40px 0 0;padding:22px 24px;background:var(--ink-2);border-left:2px solid var(--gold);font-size:.92rem;color:var(--muted)}
.invite a{color:var(--gold)}

/* ---- thread page ---- */
.thread-head{margin:0 0 34px}
.thread-head h1{font-family:"Cormorant Garamond",serif;font-weight:600;font-size:2.4rem;line-height:1.1;margin:0 0 14px;color:var(--platinum)}
.thread-head .pin-flag{display:inline-block;font-size:.6rem;letter-spacing:.2em;text-transform:uppercase;color:var(--platinum);background:var(--wine);padding:3px 9px;border-radius:2px;margin-right:12px;vertical-align:middle;font-weight:700}
.thread-meta{font-size:.76rem;color:var(--muted);letter-spacing:.03em;display:flex;flex-wrap:wrap;gap:16px;border-top:1px solid var(--line);padding-top:14px}
.thread-meta b{color:var(--gold-soft);font-weight:600}
.thread-meta .tm-no{color:var(--gold);letter-spacing:.14em;font-weight:600}

.posts{margin:0}
.post{padding:30px 0 28px;border-top:1px solid var(--line)}
.post:first-child{border-top:none}
.post.is-op{background:linear-gradient(180deg,rgba(201,162,75,.05),transparent 60%)}
.post-stamp{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;margin-bottom:4px}
.author-name{font-size:.82rem;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:var(--gold)}
.op-pill{display:inline-block;font-size:.58rem;letter-spacing:.12em;background:var(--wine);color:var(--platinum);padding:1px 6px;border-radius:2px;margin-left:8px;vertical-align:middle;font-weight:700}
.rank{font-size:.66rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.rank-mod{color:var(--wine);background:none;font-weight:800}
.post-when{margin-left:auto;font-size:.72rem;color:var(--muted);display:flex;gap:12px;align-items:baseline}
.post-when .post-no{color:var(--line-2)}
.post-fields{display:flex;flex-wrap:wrap;gap:6px 18px;font-size:.72rem;color:var(--muted);letter-spacing:.03em;margin:0 0 16px;padding-bottom:14px;border-bottom:1px dotted var(--line)}
.author-loc{color:var(--platinum)}
.author-loc::before{content:"\00B7 \00A0";color:var(--gold);margin-right:-4px}
.post-drive{color:var(--gold-soft)}
.post-drive::before{content:"drive  ";text-transform:uppercase;letter-spacing:.14em;font-size:.6rem;color:var(--line-2)}

.post-content{font-size:1.02rem;color:var(--platinum)}
.post-content p{margin:0 0 15px}
.post-content ul{margin:0 0 15px;padding-left:22px}
.post-content li{margin:0 0 8px}
.post-content strong{color:var(--gold);font-weight:700}
.post-content blockquote{margin:0 0 16px;padding:12px 18px;border-left:2px solid var(--wine);background:var(--ink-3);color:var(--muted);font-size:.95rem}
.post-content blockquote cite{display:block;font-style:normal;font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;color:var(--gold-soft);margin-bottom:6px}
.post-footer{display:flex;gap:16px;margin-top:18px;align-items:center}
.post-action{background:none;border:1px solid var(--line-2);color:var(--muted);font:inherit;font-size:.72rem;letter-spacing:.06em;padding:4px 14px;border-radius:2px;cursor:pointer}
.post-action:hover{border-color:var(--gold);color:var(--gold)}
.post-link{font-size:.72rem;letter-spacing:.06em;color:var(--muted);margin-left:auto}

.reply-box{margin:30px 0 0;padding:20px 24px;background:var(--ink-2);border:1px solid var(--line);font-size:.9rem;color:var(--muted);border-radius:3px}
.reply-box a{color:var(--gold)}

.after{margin-top:46px;display:grid;gap:34px}
.after .spread-h{margin-bottom:14px}
.tags{list-style:none;display:flex;flex-wrap:wrap;gap:9px;margin:4px 0 0;padding:0}
.tags li{font-size:.68rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);border:1px solid var(--line-2);padding:4px 11px;border-radius:2px}
.after p{color:var(--muted);font-size:.92rem;margin:0 0 12px}

/* ---- prose (about/privacy/contact) ---- */
.prose{max-width:66ch}
.prose h1{font-family:"Cormorant Garamond",serif;font-weight:600;font-size:2.5rem;margin:0 0 18px;color:var(--platinum)}
.prose h2{font-family:"Cormorant Garamond",serif;font-weight:600;font-size:1.5rem;margin:34px 0 10px;color:var(--gold)}
.prose .lede{font-size:1.14rem;color:var(--platinum)}
.prose p{color:var(--muted);margin:0 0 15px}
.prose strong{color:var(--gold-soft)}
.prose ul{color:var(--muted);padding-left:22px}
.prose li{margin:0 0 9px}
.prose a{color:var(--gold)}

/* ---- footer ---- */
.signoff{background:var(--ink-2);border-top:1px solid var(--line);margin-top:40px}
.signoff-in{padding:40px 28px}
.signoff-brand{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.signoff-brand img{height:30px;width:auto}
.signoff-brand p{margin:0;font-size:.82rem;color:var(--muted);max-width:46ch}
.signoff-nav{display:flex;flex-wrap:wrap;gap:18px;margin:24px 0;font-size:.78rem;letter-spacing:.03em}
.signoff-nav a{color:var(--gold-soft)}
.ranks{list-style:none;display:flex;flex-wrap:wrap;gap:20px;margin:0 0 20px;padding:20px 0 0;border-top:1px solid var(--line);font-size:.7rem;letter-spacing:.04em;color:var(--muted)}
.ranks li b{display:block;font-family:"Cormorant Garamond",serif;font-size:.98rem;letter-spacing:.02em;color:var(--gold-soft);font-weight:600;text-transform:none}
.signoff-note{font-size:.74rem;color:var(--line-2);margin:0;letter-spacing:.03em}

@media (max-width:680px){
  body{font-size:16px}
  .wrap{padding:0 18px}
  .masthead-in{padding:22px 18px 18px;gap:16px}
  .masthead-note{margin-left:0;text-align:left;max-width:none;width:100%}
  .depts-in{padding:0 18px}
  .dept-list{gap:20px}
  .page-title{font-size:2.1rem}
  .thread-head h1{font-size:1.85rem}
  .registry{gap:28px}
  .threads > li{grid-template-columns:1fr}
  .t-meta{grid-column:1;text-align:left;margin-top:8px}
  .t-meta .m-row{display:inline;margin-right:14px}
  .directory > li{grid-template-columns:1fr}
  .dir-nums{grid-column:1;grid-row:auto;text-align:left;margin-top:6px}
  .post-when{margin-left:0;width:100%}
  .signoff-in{padding:32px 18px}
}

@media (prefers-reduced-motion:reduce){
  *{animation:none !important;transition:none !important;scroll-behavior:auto !important}
}
