/*
Theme Name:   Humble Gold
Theme URI:    https://myupclub.com
Author:       Robin Bhandari
Author URI:   https://myupclub.com
Description:  A minimal, tight-spaced theme for an XAU/USD algo trading site. Archivo and IBM Plex, a hairline sticky header with three links, and a footer built around the risk disclaimer. Pairs with the Robin Algo Terminal plugin.
Version:      1.3.0
Requires at least: 5.8
Tested up to: 6.6
Requires PHP: 7.2
License:      GNU General Public License v2 or later
License URI:  http://www.gnu.org/licenses/gpl-2.0.html
Text Domain:  humble-gold
Tags:         one-column, custom-menu, editor-style, translation-ready
*/

/* ============================================================
   1. TOKENS
   ============================================================ */
:root{
  --paper:#F1F2F4;
  --surface:#FFFFFF;
  --ink:#12161C;
  --ink-soft:#4B5563;
  --ink-mute:#78828F;
  --line:#D8DCE2;
  --line-soft:#E4E7EB;

  --term:#0E1319;
  --term2:#161D26;
  --tline:#232C38;
  --tmute:#76838F;

  --gold:#B4832A;
  --goldlit:#E6B34C;
  --up:#16915F;

  --sans:"IBM Plex Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --display:"Archivo",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,monospace;

  --header-h:58px;
  --read:720px;
  --wide:1180px;
}

/* ============================================================
   2. RESET
   ============================================================ */
*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; scroll-padding-top:calc(var(--header-h) + 12px); }
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--sans);
  font-size:16px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}
img,svg,video{ max-width:100%; height:auto; display:block; }
a{ color:var(--gold); text-decoration:none; }
a:hover{ text-decoration:underline; }
button,input,select,textarea{ font:inherit; color:inherit; }
:focus-visible{ outline:2px solid var(--gold); outline-offset:3px; }

h1,h2,h3,h4{
  font-family:var(--display);
  font-weight:700;
  line-height:1.1;
  letter-spacing:-0.02em;
  text-wrap:balance;
  margin:0 0 .5em;
}
h1{ font-size:clamp(30px,4vw,46px); font-weight:800; }
h2{ font-size:clamp(23px,2.6vw,32px); }
h3{ font-size:20px; }
p,ul,ol,blockquote,pre,table{ margin:0 0 1.1em; }
ul,ol{ padding-left:1.2em; }
code,pre,kbd{ font-family:var(--mono); font-size:.92em; }
pre{ background:var(--term); color:#C9D2DE; padding:16px; overflow-x:auto; border-radius:3px; }
blockquote{ border-left:2px solid var(--gold); padding-left:16px; color:var(--ink-soft); }
hr{ border:0; height:1px; background:var(--line); margin:32px 0; }
table{ width:100%; border-collapse:collapse; }
th,td{ text-align:left; padding:10px 12px; border-bottom:1px solid var(--line-soft); }
th{ font-family:var(--mono); font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-mute); }

.hg-wrap{ width:100%; max-width:var(--wide); margin:0 auto; padding:0 24px; }
.hg-read{ width:100%; max-width:var(--read); margin:0 auto; padding:0 24px; }
.screen-reader-text{
  position:absolute !important; width:1px; height:1px; overflow:hidden;
  clip:rect(1px,1px,1px,1px); white-space:nowrap;
}
.skip-link:focus{
  position:fixed; top:8px; left:8px; z-index:1000; width:auto; height:auto; clip:auto;
  background:var(--ink); color:#fff; padding:10px 16px; border-radius:2px;
}

/* ============================================================
   3. HEADER — hairline, sticky, tight
   ============================================================ */
.hg-header{
  position:sticky; top:0; z-index:100;
  background:rgba(241,242,244,.88);
  backdrop-filter:saturate(160%) blur(10px);
  -webkit-backdrop-filter:saturate(160%) blur(10px);
  border-bottom:1px solid var(--line);
}
.admin-bar .hg-header{ top:32px; }
@media screen and (max-width:782px){ .admin-bar .hg-header{ top:46px; } }

.hg-header-inner{
  height:var(--header-h);
  display:flex; align-items:center; justify-content:space-between; gap:20px;
}

.hg-brand{ display:flex; align-items:center; gap:10px; color:var(--ink); text-decoration:none; flex:none; }
.hg-brand:hover{ text-decoration:none; }
.hg-mark{
  width:28px; height:28px; border-radius:50%; flex:none;
  background:linear-gradient(145deg,#E6B34C,#A9741C);
  display:grid; place-items:center;
  font-family:var(--display); font-weight:800; font-size:11px; color:#1A1206;
  letter-spacing:.02em;
}
.hg-brand-text{ font-family:var(--display); font-weight:700; font-size:15px; letter-spacing:-0.01em; line-height:1; }
.hg-brand-text small{
  display:block; font-family:var(--mono); font-weight:400; font-size:9px;
  letter-spacing:.16em; text-transform:uppercase; color:var(--ink-mute); margin-top:3px;
}

.hg-nav{ display:flex; align-items:center; gap:4px; margin-left:auto; }
.hg-nav ul{ display:flex; align-items:center; gap:4px; list-style:none; margin:0; padding:0; }
.hg-nav a{
  display:block; padding:8px 10px; white-space:nowrap; color:var(--ink-soft); text-decoration:none;
  font-family:var(--mono); font-size:12px; letter-spacing:.1em; text-transform:uppercase;
  border-radius:2px; transition:color .15s ease, background .15s ease;
}
.hg-nav a:hover,.hg-nav .current-menu-item > a{ color:var(--ink); background:rgba(18,22,28,.05); text-decoration:none; }
.hg-cta{
  display:inline-flex; align-items:center; gap:7px; flex:none;
  padding:9px 16px; margin-left:8px; border-radius:2px;
  background:var(--ink); color:#fff !important;
  font-family:var(--mono); font-size:12px; font-weight:600; letter-spacing:.1em; text-transform:uppercase;
  transition:background .15s ease, transform .15s ease;
}
.hg-cta:hover{ background:var(--gold); transform:translateY(-1px); text-decoration:none; }
.hg-cta svg{ width:15px; height:15px; fill:currentColor; flex:none; margin-right:-1px; }

.hg-burger{
  display:none; width:38px; height:38px; border:1px solid var(--line); background:transparent;
  border-radius:2px; cursor:pointer; padding:0; align-items:center; justify-content:center;
}
.hg-burger span{ display:block; width:16px; height:1.5px; background:var(--ink); position:relative; transition:background .2s; }
.hg-burger span::before,.hg-burger span::after{
  content:""; position:absolute; left:0; width:16px; height:1.5px; background:var(--ink); transition:transform .2s;
}
.hg-burger span::before{ top:-5px; } .hg-burger span::after{ top:5px; }
.hg-burger[aria-expanded="true"] span{ background:transparent; }
.hg-burger[aria-expanded="true"] span::before{ transform:translateY(5px) rotate(45deg); }
.hg-burger[aria-expanded="true"] span::after{ transform:translateY(-5px) rotate(-45deg); }

@media (max-width:980px){
  .hg-burger{ display:inline-flex; }
  .hg-nav{
    position:absolute; top:var(--header-h); left:0; right:0;
    flex-direction:column; align-items:stretch; gap:0;
    background:var(--paper); border-bottom:1px solid var(--line);
    padding:8px 24px 16px; display:none;
  }
  .hg-nav.open{ display:flex; }
  .hg-nav ul{ flex-direction:column; align-items:stretch; gap:0; }
  .hg-nav a{ padding:12px 0; border-bottom:1px solid var(--line-soft); }
  .hg-cta{ margin:12px 0 0; justify-content:center; padding:13px 16px; }
}

/* ============================================================
   4. CONTENT
   ============================================================ */
.hg-main{ min-height:50vh; }
.hg-main > .hg-read{ padding-top:52px; padding-bottom:64px; }
.hg-page-head{ margin-bottom:28px; padding-bottom:20px; border-bottom:1px solid var(--line); }
.hg-page-head .hg-eyebrow{
  font-family:var(--mono); font-size:11px; letter-spacing:.18em; text-transform:uppercase;
  color:var(--ink-mute); margin:0 0 10px;
}
.hg-page-head h1{ margin:0; }
.hg-meta{ font-family:var(--mono); font-size:12px; color:var(--ink-mute); margin-top:10px; }
.entry-content > *:last-child{ margin-bottom:0; }
.hg-full{ padding:0; max-width:none; }

.hg-posts{ list-style:none; margin:0; padding:0; display:grid; gap:0; }
.hg-post{ padding:22px 0; border-bottom:1px solid var(--line-soft); }
.hg-post:first-child{ padding-top:0; }
.hg-post h2{ font-size:22px; margin:0 0 6px; }
.hg-post h2 a{ color:var(--ink); }
.hg-post h2 a:hover{ color:var(--gold); text-decoration:none; }
.hg-post .hg-meta{ margin:0 0 8px; }
.hg-post p{ color:var(--ink-soft); margin:0; }

.hg-pager{ display:flex; justify-content:space-between; gap:12px; margin-top:36px; font-family:var(--mono); font-size:12px; letter-spacing:.08em; text-transform:uppercase; }

.hg-404{ text-align:center; padding:90px 0; }
.hg-404 .hg-code{ font-family:var(--mono); font-size:64px; color:var(--goldlit); line-height:1; }

/* ============================================================
   5. FOOTER
   ============================================================ */
.hg-footer{ background:var(--term); color:var(--tmute); font-size:13.5px; line-height:1.65; }
.hg-footer a{ color:#99A4B2; text-decoration:none; }
.hg-footer a:hover{ color:var(--goldlit); text-decoration:none; }

.hg-footer-top{
  display:grid; grid-template-columns:minmax(0,1.4fr) repeat(2,minmax(0,1fr));
  gap:36px; padding:44px 0 32px;
}
.hg-footer .hg-mark{ width:32px; height:32px; font-size:12px; }
.hg-footer-brand{ display:flex; align-items:center; gap:11px; margin-bottom:14px; }
.hg-footer-brand .n{ font-family:var(--display); font-weight:700; font-size:16px; color:#E9EDF2; line-height:1.1; }
.hg-footer-brand .n small{ display:block; font-family:var(--mono); font-weight:400; font-size:9px; letter-spacing:.16em; text-transform:uppercase; color:var(--tmute); margin-top:4px; }
.hg-footer-blurb{ max-width:38ch; margin:0; }

.hg-fcol h4{
  font-family:var(--mono); font-size:10.5px; font-weight:500; letter-spacing:.16em;
  text-transform:uppercase; color:var(--tmute); margin:0 0 14px;
}
.hg-fcol ul{ list-style:none; margin:0; padding:0; display:grid; gap:9px; }

.hg-disclaimer{
  border-top:1px solid var(--tline); padding:24px 0;
  font-size:12.5px; line-height:1.7; max-width:96ch;
}
.hg-disclaimer strong{ color:#99A4B2; font-weight:600; }

.hg-footer-bottom{
  border-top:1px solid var(--tline); padding:18px 0 28px;
  display:flex; justify-content:space-between; align-items:center; gap:16px; flex-wrap:wrap;
  font-family:var(--mono); font-size:11px; letter-spacing:.08em; color:#5C6673;
}
.hg-socials{ display:flex; gap:16px; text-transform:uppercase; }

@media (max-width:760px){
  .hg-footer-top{ grid-template-columns:minmax(0,1fr); gap:28px; padding:36px 0 26px; }
  .hg-main > .hg-read{ padding-top:38px; padding-bottom:48px; }
}
@media (prefers-reduced-motion:reduce){
  html{ scroll-behavior:auto; }
  *{ animation-duration:.001ms !important; transition-duration:.001ms !important; }
}

/* ============================================================
   6. FULL-BLEED SHORTCODE PAGES
   A page built from [xau_terminal] or [robin_algo] renders its own
   layout, so the theme must not add a column, padding or margins
   around it — and must not let a stray wrapper clip it.
   ============================================================ */
.hg-full{ width:100%; max-width:none; margin:0; padding:0; }
.hg-full > .entry-content,
.hg-full > .entry-content > *{ margin-left:0; margin-right:0; }
.hg-full > .entry-content > p:empty{ display:none; }

body.hg-edge .hg-main{ padding:0; }
body.hg-edge .hg-main > *{ max-width:none; }
body.hg-edge .entry-content > .alignfull,
body.hg-edge .entry-content > .alignwide{ margin-left:0; margin-right:0; width:auto; max-width:none; }

/* the plugin containers own their own width */
.rb-page,
.xt-wrap, .xt-terminal, .xt-dashboard{ max-width:none !important; }

/* reading column pages: keep block alignments sane */
.entry-content .alignwide{ margin-left:calc((var(--read) - min(96vw, 1180px)) / 2); width:min(96vw,1180px); max-width:none; }
.entry-content .alignfull{ margin-left:calc(50% - 50vw); width:100vw; max-width:100vw; }
.entry-content .alignleft{ float:left; margin:.3em 1.2em 1em 0; }
.entry-content .alignright{ float:right; margin:.3em 0 1em 1.2em; }
.entry-content .aligncenter{ margin-left:auto; margin-right:auto; }
.entry-content::after{ content:""; display:table; clear:both; }
