/* QRFC Portal — public site — v0.1 (S3 fallback tokens, Appendix A.9) */

@font-face {
  font-family: 'Playfair Display';
  src: url('/assets/fonts/playfair-display-latin-400-normal.woff2') format('woff2');
  font-weight: 400; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Playfair Display';
  src: url('/assets/fonts/playfair-display-latin-500-normal.woff2') format('woff2');
  font-weight: 500; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Playfair Display';
  src: url('/assets/fonts/playfair-display-latin-600-normal.woff2') format('woff2');
  font-weight: 600; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Playfair Display';
  src: url('/assets/fonts/playfair-display-latin-700-normal.woff2') format('woff2');
  font-weight: 700; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Playfair Display';
  src: url('/assets/fonts/playfair-display-latin-700-italic.woff2') format('woff2');
  font-weight: 700; font-style: italic; font-display: swap;
}
@font-face {
  font-family: 'Inter';
  src: url('/assets/fonts/inter-latin-400-normal.woff2') format('woff2');
  font-weight: 400; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Inter';
  src: url('/assets/fonts/inter-latin-500-normal.woff2') format('woff2');
  font-weight: 500; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Inter';
  src: url('/assets/fonts/inter-latin-600-normal.woff2') format('woff2');
  font-weight: 600; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Inter';
  src: url('/assets/fonts/inter-latin-700-normal.woff2') format('woff2');
  font-weight: 700; font-style: normal; font-display: swap;
}

:root{
  --bg:#0a0a0a; --panel:#111111; --panel-2:#161616;
  --gold:#d4af37; --gold-2:#c9a227; --gold-hover:#e6c65c;
  --ivory:#f5f1e8; --ivory-dim:#9a9382; --hairline:#2a2a24;
  --up:#3fbf7f; --down:#e05a5a; --amber:#e0a53f;
  --radius:2px; --serif:'Playfair Display',Georgia,serif; --sans:'Inter',-apple-system,BlinkMacSystemFont,sans-serif;
  --maxw:1180px;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0; background:var(--bg); color:var(--ivory); font-family:var(--sans);
  font-size:16px; line-height:1.6; -webkit-font-smoothing:antialiased;
}
a{color:var(--gold); text-decoration:none;}
a:hover{color:var(--gold-hover);}
img{max-width:100%; display:block;}
.wrap{max-width:var(--maxw); margin:0 auto; padding:0 28px;}
.eyebrow{
  font-family:var(--sans); font-size:11px; letter-spacing:.18em; text-transform:uppercase;
  color:var(--gold); font-weight:600;
}
h1,h2,h3{font-family:var(--serif); font-weight:700; margin:0 0 .5em; color:var(--ivory);}
h1{font-size:clamp(2.4rem,5vw,4.2rem); line-height:1.06; letter-spacing:-.01em;}
h2{font-size:clamp(1.7rem,3vw,2.4rem); line-height:1.15;}
h3{font-size:1.15rem;}
em{font-style:italic; color:var(--gold);}
p{color:var(--ivory-dim); margin:0 0 1em;}
hr.rule{border:none; border-top:1px solid var(--hairline); margin:0;}
section{padding:88px 0; border-bottom:1px solid var(--hairline);}
section:last-of-type{border-bottom:none;}
.btn{
  display:inline-block; padding:13px 28px; background:var(--gold); color:#141207;
  font-weight:700; font-size:14px; letter-spacing:.03em; border:none; border-radius:var(--radius);
  cursor:pointer; transition:background .15s ease;
}
.btn:hover{background:var(--gold-hover); color:#141207;}
.btn[disabled]{opacity:.5; cursor:not-allowed;}
.btn.ghost{background:transparent; color:var(--gold); border:1px solid var(--gold);}
.btn.ghost:hover{background:rgba(212,175,55,.08);}

/* header/nav */
header.site{
  position:sticky; top:0; z-index:50; background:rgba(10,10,10,.88); backdrop-filter:blur(10px);
  border-bottom:1px solid var(--hairline);
}
header.site .bar{display:flex; align-items:center; justify-content:space-between; padding:18px 0;}
.brand{font-family:var(--serif); font-weight:700; font-size:19px; display:flex; flex-direction:column; line-height:1.15;}
.brand small{font-family:var(--sans); font-size:10px; letter-spacing:.15em; text-transform:uppercase; color:var(--ivory-dim); font-weight:500;}
nav.primary{display:flex; gap:26px;}
nav.primary a{font-size:12px; letter-spacing:.08em; text-transform:uppercase; color:var(--ivory-dim); font-weight:600;}
nav.primary a:hover{color:var(--gold);}
.nav-toggle{display:none; background:none; border:1px solid var(--hairline); color:var(--ivory); padding:8px 12px; border-radius:var(--radius);}
@media (max-width:860px){
  nav.primary{display:none;}
  nav.primary.open{
    display:flex; flex-direction:column; position:absolute; top:100%; left:0; right:0;
    background:var(--panel); padding:20px 28px; gap:16px; border-bottom:1px solid var(--hairline);
  }
  .nav-toggle{display:block;}
}

/* hero */
.hero{padding:110px 0 90px; text-align:center;}
.hero .eyebrow{display:inline-flex; gap:8px; align-items:center; margin-bottom:22px; border:1px solid var(--hairline); padding:6px 14px; border-radius:20px;}
.hero h1{margin:0 auto 24px; max-width:900px;}
.hero .lede{max-width:680px; margin:0 auto 36px; font-size:1.05rem;}
.hero .positioning{max-width:760px; margin:0 auto 36px; color:var(--ivory-dim);}
.hero .audience{font-size:13px; color:var(--ivory-dim); max-width:680px; margin:0 auto;}
.membership-row{
  display:flex; flex-wrap:wrap; justify-content:center; gap:28px; margin:38px 0 0;
  font-size:12px; letter-spacing:.06em; text-transform:uppercase; color:var(--gold-2); font-weight:600;
}
.membership-row span{border-left:1px solid var(--hairline); padding-left:28px;}
.membership-row span:first-child{border-left:none; padding-left:0;}

/* live feed panel */
.feed-panel{background:var(--panel); border:1px solid var(--hairline); border-radius:6px; padding:32px; margin-top:56px;}
.feed-title{display:flex; align-items:center; justify-content:space-between; margin-bottom:22px; flex-wrap:wrap; gap:12px;}
.feed-title h3{margin:0; font-family:var(--sans); font-weight:700; font-size:13px; letter-spacing:.1em; text-transform:uppercase; color:var(--ivory);}
.live-dot{display:inline-block; width:7px; height:7px; border-radius:50%; background:var(--up); margin-right:8px; box-shadow:0 0 0 3px rgba(63,191,127,.18);}
.chips{display:grid; grid-template-columns:repeat(auto-fit,minmax(130px,1fr)); gap:14px; margin-bottom:26px;}
.chip{background:var(--bg); border:1px solid var(--hairline); border-radius:var(--radius); padding:14px;}
.chip .label{font-size:10px; letter-spacing:.06em; text-transform:uppercase; color:var(--ivory-dim); margin-bottom:6px;}
.chip .val{font-family:var(--serif); font-size:1.3rem; font-weight:700; color:var(--gold);}
.chip .val.delayed{color:var(--amber); font-size:1rem;}
.tickers{display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:12px;}
.ticker{background:var(--bg); border:1px solid var(--hairline); border-radius:var(--radius); padding:12px 14px; display:flex; justify-content:space-between; align-items:center;}
.ticker .sym{font-size:12px; color:var(--ivory-dim); font-weight:600;}
.ticker .px{font-family:var(--serif); font-weight:600;}
.ticker .px.up{color:var(--up);} .ticker .px.down{color:var(--down);}
.ticker .stale-badge{font-size:9px; color:var(--amber); text-transform:uppercase; letter-spacing:.05em;}
.ticker-hidden{display:none;}

/* generic grids */
.section-head{max-width:640px; margin:0 0 48px;}
.section-head .eyebrow{margin-bottom:14px; display:block;}
.grid-4{display:grid; grid-template-columns:repeat(4,1fr); gap:22px;}
.grid-3{display:grid; grid-template-columns:repeat(3,1fr); gap:22px;}
.grid-2{display:grid; grid-template-columns:repeat(2,1fr); gap:22px;}
@media (max-width:920px){.grid-4{grid-template-columns:repeat(2,1fr);} .grid-3{grid-template-columns:1fr 1fr;}}
@media (max-width:640px){.grid-4,.grid-3,.grid-2{grid-template-columns:1fr;}}
.card{background:var(--panel); border:1px solid var(--hairline); border-radius:6px; padding:26px;}
.card .num{font-family:var(--serif); color:var(--gold); font-size:1.6rem; margin-bottom:10px;}
.card h3{margin-bottom:10px;}
.card p{margin:0; font-size:14px;}

/* partner strips */
.strip-group{margin-bottom:30px;}
.strip-group .label{font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--ivory-dim); margin-bottom:12px;}
.strip{display:flex; flex-wrap:wrap; gap:12px 26px;}
.strip span{font-family:var(--serif); font-size:14px; color:var(--ivory-dim); font-weight:600;}

/* silos accordion */
.silo{border-bottom:1px solid var(--hairline);}
.silo:first-child{border-top:1px solid var(--hairline);}
.silo-head{
  width:100%; text-align:left; background:none; border:none; color:var(--ivory);
  padding:22px 0; display:flex; justify-content:space-between; align-items:center; cursor:pointer;
  font-family:var(--serif); font-size:1.05rem; font-weight:600;
}
.silo-head .tag{font-family:var(--sans); font-size:11px; color:var(--gold); text-transform:uppercase; letter-spacing:.06em; margin-right:12px;}
.silo-head .chevron{transition:transform .2s ease; color:var(--gold);}
.silo.open .chevron{transform:rotate(45deg);}
.silo-body{max-height:0; overflow:hidden; transition:max-height .25s ease;}
.silo.open .silo-body{max-height:400px;}
.silo-body-inner{padding:0 0 24px; color:var(--ivory-dim); font-size:14px; max-width:760px;}
.silo-body-inner .def{margin-top:10px; padding-top:10px; border-top:1px dashed var(--hairline); font-style:italic;}

/* tables */
table.qrfc{width:100%; border-collapse:collapse; font-size:14px;}
table.qrfc th, table.qrfc td{padding:13px 14px; border-bottom:1px solid var(--hairline); text-align:left;}
table.qrfc th{color:var(--gold); font-size:11px; text-transform:uppercase; letter-spacing:.06em; font-weight:600;}
table.qrfc td{color:var(--ivory-dim);}
table.qrfc tr:hover td{color:var(--ivory);}
.table-wrap{overflow-x:auto; background:var(--panel); border:1px solid var(--hairline); border-radius:6px; padding:6px;}
.footnote{font-size:12px; color:var(--ivory-dim); margin-top:14px; font-style:italic;}

/* contact */
.contact-grid{display:grid; grid-template-columns:1.1fr .9fr; gap:48px;}
@media (max-width:860px){.contact-grid{grid-template-columns:1fr;}}
.directory{display:grid; grid-template-columns:1fr 1fr; gap:14px 24px; margin:18px 0 28px;}
.directory div{font-size:14px;}
.directory .role{color:var(--ivory-dim); font-size:11px; text-transform:uppercase; letter-spacing:.05em;}
.office{border-top:1px solid var(--hairline); padding-top:20px; margin-top:20px; font-size:14px; color:var(--ivory-dim);}
.map-placeholder{
  margin-top:16px; height:160px; border-radius:6px; border:1px solid var(--hairline);
  background:linear-gradient(135deg,#141414,#1b1b16); display:flex; align-items:center; justify-content:center;
  color:var(--ivory-dim); font-size:12px; text-align:center; padding:20px;
}
form.access{background:var(--panel); border:1px solid var(--hairline); border-radius:6px; padding:32px;}
form.access label{display:block; font-size:11px; text-transform:uppercase; letter-spacing:.05em; color:var(--ivory-dim); margin:16px 0 6px;}
form.access label:first-of-type{margin-top:0;}
form.access input, form.access select{
  width:100%; background:var(--bg); border:1px solid var(--hairline); color:var(--ivory);
  padding:11px 12px; border-radius:var(--radius); font-family:var(--sans); font-size:14px;
}
form.access input:focus, form.access select:focus{outline:none; border-color:var(--gold);}
form.access .hp{position:absolute; left:-9999px; opacity:0;}
form.access .btn{width:100%; margin-top:22px;}
.form-note{font-size:11px; color:var(--ivory-dim); margin-top:14px;}
.form-status{margin-top:14px; font-size:13px;}
.form-status.ok{color:var(--up);} .form-status.err{color:var(--down);}

/* footer */
footer.site{padding:50px 0 40px;}
.status-strip{display:flex; flex-wrap:wrap; gap:24px; justify-content:center; padding-bottom:36px; margin-bottom:36px; border-bottom:1px solid var(--hairline);}
.status-strip span{font-size:11px; letter-spacing:.06em; text-transform:uppercase; color:var(--ivory-dim);}
.footer-bottom{display:flex; flex-wrap:wrap; justify-content:space-between; gap:16px; align-items:center; font-size:12px; color:var(--ivory-dim);}
.footer-links{display:flex; gap:22px;}

/* legal pages */
.legal-page{max-width:760px; margin:0 auto; padding:80px 28px 100px;}
.legal-page h1{font-size:2rem; margin-bottom:8px;}
.legal-page .meta{color:var(--ivory-dim); font-size:13px; margin-bottom:40px;}
.legal-page h2{font-size:1.15rem; margin-top:36px;}
.legal-page p{font-size:14.5px; line-height:1.75;}
.back-link{display:inline-block; margin-bottom:30px; font-size:13px;}
