/* ==========================================================================
   Short Investing — core stylesheet
   Design tokens, base elements, header, footer, article/listing cards, editor
   content, forms and comments. Loaded on every page.
   Page-specific styling lives in assets/pages/<page>.css and is enqueued only
   where it is needed, so editing one page cannot affect the others.
   ========================================================================== */

/* ==========================================================================
   Short Investing — WordPress theme stylesheet
   Fraunces (display) + Inter (body) + IBM Plex Mono (data/labels)
   ========================================================================== */

:root{--ink:#1e1b16; --ink-hover:#33302a; --ink-soft:#4a4436;
  --gold:#9c6b12; --gold-hover:#7a5410; --gold-fill:#b8863c; --rust:#9c6b12;
  --paper:#faf7f2; --paper-2:#fdfbf7; --card:#f1eee4; --card-hover:#e9e4d5;
  --border:#e4dfd5; --border-strong:#d9d2c2; --line:#e6ded1; --line-2:#efe8dc;
  --muted:#6b6459; --muted-2:#9c9486; --faint:#8a8175;
  --up:#1f6f43; --up-dark:#245231; --down:#b0503a;
  --near-text:#9c6b12; --near-bg:#fbf3e7; --ban-text:#b0503a; --ban-bg:#f7e0d6;
  --whatsapp:#25b562; --whatsapp-hover:#1e9a52;
  --font-display:'Fraunces',Georgia,serif;
  --font-head:var(--font-display); /* alias used by template-parts/report-* markup */
  --font-body:'Inter',-apple-system,BlinkMacSystemFont,sans-serif;
  --font-mono:'IBM Plex Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
  --wrap:1180px; --radius:3px;
  --shadow:0 1px 2px rgba(30,27,22,.05),0 10px 26px -16px rgba(30,27,22,.28);}
*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--font-body);font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased;}
a{text-decoration:none;color:var(--gold);}
a:hover{color:var(--gold-hover);}
img{max-width:100%;height:auto;display:block;}
button,input,textarea,select{font:inherit;}
*{-webkit-tap-highlight-color:transparent;}
h1,h2,h3,h4{font-family:var(--font-display);font-weight:600;margin:0;letter-spacing:-0.01em;}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 24px;}
.container{max-width:1060px;margin:0 auto;padding:0 clamp(16px,4vw,28px);}
.eyebrow{font-family:var(--font-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--faint);}
/* Header / Nav */
.site-header{position:sticky;top:0;z-index:50;background:rgba(250,247,242,.95);backdrop-filter:blur(6px);border-bottom:1px solid var(--border);}
.site-header-row{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;padding:14px 24px;max-width:var(--wrap);margin:0 auto;}
.logo{font-family:var(--font-display);font-weight:600;font-size:19px;letter-spacing:-0.01em;color:var(--ink);}
.logo span{color:var(--gold);}
.site-nav{display:flex;align-items:center;gap:24px;flex-wrap:wrap;}
.site-nav .nav-link{font-size:13.5px;font-weight:500;color:var(--ink);padding-bottom:4px;border-bottom:2px solid transparent;white-space:nowrap;}
.site-nav .nav-link:hover,.site-nav .nav-link.active{border-bottom:2px solid var(--gold);color:var(--ink);}
.nav-cta{background:var(--ink);color:var(--paper);padding:9px 18px;border-radius:2px;font-size:12.5px;font-family:var(--font-mono);letter-spacing:.03em;font-weight:500;white-space:nowrap;}
.nav-cta:hover{background:var(--ink-hover);color:var(--paper);}
.nav-dd{position:relative;}
.nav-dd-menu{display:none;position:absolute;top:100%;left:0;margin-top:8px;background:var(--paper);border:1px solid var(--border);border-radius:3px;min-width:220px;box-shadow:0 8px 24px rgba(30,27,22,.12);padding:6px;z-index:60;}
.nav-dd:hover .nav-dd-menu{display:block;}
.nav-dd-menu a{display:block;padding:9px 12px;font-size:13px;color:var(--ink);border-radius:2px;}
.nav-dd-menu a:hover{background:var(--card);color:var(--gold);}
.menu-toggle{display:none;background:none;border:none;cursor:pointer;padding:10px;margin:-10px;
  min-width:44px;min-height:44px;align-items:center;justify-content:center;}
.menu-toggle svg{width:24px;height:24px;}
.mobile-nav{display:none;flex-direction:column;gap:2px;background:var(--paper);border-bottom:1px solid var(--border);padding:8px 24px 16px;}
.mobile-nav.open{display:flex;}
.mobile-nav a{padding:10px 4px;font-size:14px;font-weight:500;color:var(--ink);border-bottom:1px solid var(--border);}
.mobile-nav a:last-child{border-bottom:none;}
/* Footer */
.site-footer{border-top:1px solid var(--border);padding:36px 0 20px;margin-top:16px;}
.footer-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:24px;margin-bottom:24px;}
.footer-brand .logo{font-size:18px;}
.footer-brand p{font-size:12.5px;color:var(--muted);line-height:1.6;max-width:280px;margin:8px 0 0;}
.footer-col h5{font-family:var(--font-mono);font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:0 0 10px;font-weight:600;}
.footer-col ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px;}
.footer-col a{font-size:12.5px;color:var(--ink);}
.footer-col a:hover{color:var(--gold);}
.footer-disclosure{font-size:10.5px;color:var(--muted);border-top:1px solid var(--border);padding-top:14px;line-height:1.6;}
.footer-bottom{display:flex;justify-content:space-between;align-items:center;margin-top:12px;font-family:var(--font-mono);font-size:10.5px;color:var(--muted);flex-wrap:wrap;gap:8px;}
/* Shared bits */
.section-heading{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:18px;border-bottom:1px solid var(--border);padding-bottom:10px;}
.section-heading h2{font-size:19px;font-weight:600;color:var(--ink);}
.btn{display:inline-flex;align-items:center;gap:8px;border:none;cursor:pointer;border-radius:var(--radius);font-family:var(--font-body);font-size:14.5px;font-weight:500;padding:12px 22px;background:var(--up);color:#fff;}
.btn:hover{background:var(--up-dark);color:#fff;}
.btn-outline{font-family:var(--font-mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink);background:#fff;border:1px solid var(--border-strong);padding:13px 28px;border-radius:var(--radius);cursor:pointer;}
.btn-outline:hover{border-color:var(--ink);background:var(--ink);color:#fff;}
.badge{display:inline-block;font-size:11px;font-weight:700;padding:2px 8px;border-radius:2px;}
.badge-ban{background:var(--ban-bg);color:var(--ban-text);}
.badge-near{background:var(--near-bg);color:var(--near-text);}
.crumb,.breadcrumbs{max-width:var(--wrap);margin:0 auto;padding:10px 24px;font-family:var(--font-mono);font-size:12px;color:var(--muted-2);display:flex;flex-wrap:wrap;gap:8px;}
.breadcrumbs a,.crumb a{color:var(--muted-2);}
.breadcrumbs a:hover,.crumb a:hover{color:var(--gold);}
.breadcrumbs .current{color:var(--ink);}
.faq-item{border-bottom:1px solid var(--line);padding:20px 0;}
.faq-q{width:100%;display:flex;align-items:center;justify-content:space-between;gap:20px;background:none;border:none;padding:0;cursor:pointer;text-align:left;font-family:var(--font-display);font-size:22px;font-weight:500;color:var(--ink);}
.faq-sign{font-family:var(--font-mono);font-size:18px;color:var(--faint);flex-shrink:0;}
.faq-a{display:none;flex-direction:column;gap:13px;margin-top:16px;font-size:16px;line-height:1.7;color:var(--muted);}
.faq-item.open .faq-a{display:flex;}
.report-body.expanded{max-height:none !important;}
.report-body.expanded+.report-fade,.report-body.expanded .report-fade{display:none;}
.entry-content{max-width:72ch;font-size:16px;line-height:1.75;color:var(--ink-soft);}
.entry-content h2,.entry-content h3{margin-top:32px;margin-bottom:12px;}
.entry-content p{margin:0 0 16px;}
.entry-content img{border-radius:var(--radius);}
.entry-title{margin-bottom:18px;}
.entry-meta{font-family:var(--font-mono);font-size:12px;color:var(--faint);margin-bottom:24px;}
/* News (page-news.php, index.php, single.php) */
.si-main{max-width:var(--wrap);margin:0 auto;padding:44px 24px 80px;width:100%;}
.si-kicker{font-family:var(--font-mono);font-size:12px;font-weight:600;letter-spacing:1px;text-transform:uppercase;color:var(--gold);}
.si-title{font-family:var(--font-display);font-size:clamp(1.7rem,5vw,2.6rem);font-weight:600;letter-spacing:-0.5px;margin:8px 0 10px;color:var(--ink);}
.si-lede{font-size:1rem;line-height:1.6;color:var(--ink-soft);max-width:640px;margin:0;}
.si-hero-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:32px;margin-bottom:56px;align-items:start;}
.si-feature-col{display:flex;flex-direction:column;gap:32px;}
.si-side{display:flex;flex-direction:column;gap:22px;border-left:1px solid var(--line);padding-left:28px;}
.si-card{background:#fff;border-radius:var(--radius);box-shadow:var(--shadow);padding:16px;border:1px solid var(--line-2);}
.si-card-img{aspect-ratio:1200/630;width:100%;border-radius:var(--radius);overflow:hidden;margin-bottom:14px;background:var(--card);display:flex;align-items:center;justify-content:center;}
.si-card-img span{font-family:var(--font-display);font-size:26px;font-weight:600;color:var(--border-strong);}
.si-tag{display:inline-block;font-family:var(--font-mono);font-size:11px;font-weight:600;letter-spacing:.5px;text-transform:uppercase;color:var(--ink);background:#f0d97e;border-radius:3px;padding:3px 9px;margin-bottom:10px;}
.si-card h2{font-family:var(--font-display);font-size:1.5rem;font-weight:600;line-height:1.3;margin:0 0 8px;}
.si-card p{font-size:14px;line-height:1.6;color:var(--ink-soft);margin:0 0 10px;}
.si-meta{font-family:var(--font-mono);font-size:12px;color:var(--faint);}
.si-meta b{color:var(--ink-soft);}
.si-row{margin-bottom:52px;}
.si-row-head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:18px;}
.si-row-head h2{font-family:var(--font-display);font-size:1.2rem;font-weight:600;margin:0;color:var(--ink);}
.si-row-head a{font-family:var(--font-mono);font-size:12px;color:var(--gold);font-weight:600;}
.si-card-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;}
.si-card-sm{background:#fff;border-radius:var(--radius);box-shadow:var(--shadow);border:1px solid var(--line-2);border-top:2px solid var(--ink);padding:14px;}
.si-card-sm h3{font-family:var(--font-display);font-size:1rem;font-weight:600;line-height:1.35;margin:0 0 8px;}
.si-pagination{display:flex;gap:18px;align-items:center;justify-content:center;padding-top:12px;border-top:1px solid var(--line);font-family:var(--font-mono);font-size:13px;}
.si-pagination a,.si-pagination span.current{color:var(--ink);}
.si-pagination span.current{color:#fff;background:var(--ink);border-radius:3px;padding:6px 12px;}
.si-pagination a.next{color:var(--gold);font-weight:600;}
.aq-tab.active{color:var(--gold);border-bottom-color:var(--gold);}
.aq-panel.active{display:flex;}
.aq-content .entry-title{font-size:38px;margin:0 0 24px;}
/* ==========================================================================
   Responsive — desktop / tablet / phone
   ========================================================================== */
body{overflow-x:hidden;}
.entry-content table{width:100%;border-collapse:collapse;}
/* ==========================================================================
   Accessibility, editor content & form defaults
   ========================================================================== */
html{scroll-padding-top:86px;}
.screen-reader-text{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;}
.skip-link{position:absolute;left:-9999px;top:0;z-index:200;background:var(--ink);color:var(--paper);padding:10px 16px;font-size:14px;border-radius:0 0 3px 0;}
.skip-link:focus{left:0;color:var(--paper);}
:focus-visible{outline:2px solid var(--gold);outline-offset:2px;}
a.si-card-img{display:flex;text-decoration:none;}
/* Block-editor content inside posts and pages */
.entry-content ul,.entry-content ol{margin:0 0 16px;padding-left:22px;}
.entry-content li{margin-bottom:6px;}
.entry-content blockquote{margin:20px 0;padding:4px 0 4px 18px;border-left:3px solid var(--gold);color:var(--muted);font-style:italic;}
.entry-content th,.entry-content td{border:1px solid var(--line);padding:9px 12px;text-align:left;font-size:14.5px;}
.entry-content th{background:var(--card);font-family:var(--font-mono);font-size:11px;letter-spacing:.05em;text-transform:uppercase;}
.entry-content figure{margin:22px 0;}
.entry-content figcaption{font-size:12.5px;color:var(--faint);margin-top:7px;}
.entry-content a{text-decoration:underline;text-underline-offset:2px;}
.entry-content pre{background:var(--card);padding:14px 16px;border-radius:var(--radius);overflow-x:auto;font-family:var(--font-mono);font-size:13px;}
.alignwide{max-width:min(1100px,100%);margin-left:auto;margin-right:auto;}
.alignfull{max-width:100%;}
.aligncenter{margin-left:auto;margin-right:auto;}
/* Forms — scoped so the Option Calculator's own input sizing is never overridden */
.search-form{display:flex;gap:8px;}
.search-form label{flex:1;}
.search-form input[type="search"],
.search-form input[type="text"],
.comment-form input[type="text"],
.comment-form input[type="email"],
.comment-form input[type="url"],
.comment-form textarea,
.entry-content input[type="text"],
.entry-content input[type="email"],
.entry-content textarea{width:100%;background:#fff;border:1px solid var(--border-strong);border-radius:var(--radius);
  padding:11px 13px;color:var(--ink);font-family:var(--font-body);font-size:15px;}
.search-form input:focus,.comment-form input:focus,.comment-form textarea:focus{border-color:var(--gold);outline:none;}
.search-form input[type="submit"],.search-form button,.comment-form input[type="submit"]{background:var(--ink);color:var(--paper);border:none;border-radius:var(--radius);
  padding:11px 20px;font-family:var(--font-mono);font-size:12.5px;letter-spacing:.04em;cursor:pointer;width:auto;}
.search-form input[type="submit"]:hover,.search-form button:hover,.comment-form input[type="submit"]:hover{background:var(--ink-hover);}
/* Comments */
.comments-area{margin-top:44px;border-top:1px solid var(--line);padding-top:28px;}
.comments-area h2,.comments-area .comment-reply-title{font-family:var(--font-display);font-size:20px;margin:0 0 18px;}
.comments-area ol li{border-bottom:1px solid var(--line-2);padding:16px 0;}
.comments-area .comment-meta{font-family:var(--font-mono);font-size:12px;color:var(--faint);margin-bottom:6px;}
.comment-form p{margin:0 0 14px;}
/* Pagination links spacing (paginate_links plain output) */
.si-pagination a,.si-pagination span{padding:6px 10px;}
/* ==========================================================================
   F&O Ban List — stacked card layout on phones
   The 8-column table side-scrolls badly under ~600px, so each row becomes a
   card. Labels come from the data-label attribute set in mwpl-tracker.js.
   ========================================================================== */
.mwpl-sort-bar{display:none;align-items:center;gap:8px;width:100%;}

@media (max-width:1024px){
  .wrap{padding:0 20px;}
  .si-main{padding:36px 20px 64px;}
}
@media (max-width:900px){
  .site-nav{display:none;}
  .menu-toggle{display:inline-flex;}
  .footer-grid{grid-template-columns:1fr 1fr !important;}
  .si-hero-grid{grid-template-columns:1fr !important;}
  .si-card-grid{grid-template-columns:repeat(2,1fr) !important;}
  .si-side{border-left:none !important;padding-left:0 !important;border-top:1px solid var(--line);padding-top:24px !important;}
  .si-main{padding:32px 18px 56px !important;}
  .si-card h2{font-size:1.35rem;}
}
@media (max-width:700px){
  /* Touch targets. 44px is the minimum comfortable tap size; nav links,
     pagination and FAQ toggles were all below it. */
  .mobile-nav a{padding:13px 4px;min-height:44px;display:flex;align-items:center;}
  .si-pagination a,.si-pagination span{padding:11px 14px;min-height:44px;min-width:44px;
    display:inline-flex;align-items:center;justify-content:center;}
  .si-pagination{display:flex;flex-wrap:wrap;gap:4px;align-items:center;}
  .faq-q{min-height:44px;padding:4px 0;}
  .footer-col a,.footer-bottom a{display:inline-flex;align-items:center;padding:6px 0;min-height:44px;}
  .site-header-row{padding:12px 16px;}
  .wrap{padding:0 16px;}
  .container{padding:0 16px;}
  .mobile-nav{padding:8px 16px 16px;}
  .breadcrumbs,.crumb{padding:10px 16px;}
  .si-main{padding:28px 16px 56px;}
  .site-footer{padding:28px 0 18px;}
  .faq-q{font-size:17px;}
  .faq-a{font-size:15px;}
  .entry-content{font-size:15.5px;}
  .entry-content table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch;}
  .wp-block-table{overflow-x:auto;}
  .si-card h2{font-size:1.2rem;}
  .si-title{font-size:clamp(1.5rem,7vw,2rem);}
  /* iOS: keep form text at 16px so focusing a field doesn't zoom the page */
  input[type="text"],input[type="number"],input[type="search"],input[type="email"],textarea,select{font-size:16px !important;}
  #out-cePremium,#out-pePremium{font-size:34px !important;}
  html{scroll-padding-top:70px;}
  .si-hero-grid{gap:24px;margin-bottom:36px;}
  .si-row{margin-bottom:36px;}
  .search-form{flex-direction:column;}
  .search-form button,.search-form input[type="submit"]{width:100%;}
  .footer-bottom{flex-direction:column;align-items:flex-start;}
}
@media (max-width:560px){
  .footer-grid{grid-template-columns:1fr !important;}
  .si-card-grid{grid-template-columns:1fr !important;}
  .si-pagination{flex-wrap:wrap;gap:12px !important;}
}
@media (max-width:420px){
  .site-header-row{gap:10px;}
  .logo{font-size:17px;}
  .nav-cta{padding:8px 14px;font-size:12px;}
  #out-cePremium,#out-pePremium{font-size:30px !important;}
  .btn,.btn-outline{width:100%;justify-content:center;}
}