/* Ballistics101 Site Redesign / Concept 1.
   Loaded after page.css. This file governs interior pages only.
   Original content tables, PHP includes, and content are preserved.
*/
:root { --b101-red:#c92b2e; --b101-dark:#151719; --b101-ink:#23262a; --b101-paper:#f2f1ee; }
html {box-sizing:border-box;-webkit-text-size-adjust:100%;}
*,*::before,*::after {box-sizing:inherit;}
body {margin:0;background:var(--b101-paper);color:var(--b101-ink);font-family:Arial,Helvetica,sans-serif;background-image:none;background-attachment:scroll;}
img,iframe,video,svg {max-width:100%;}
img {height:auto;}
a {transition:color .18s ease;}
a:hover {color:var(--b101-red);}
#main-table {width:100%!important;max-width:1180px;margin:0 auto;border-spacing:0;table-layout:auto;background:#fff;box-shadow:0 12px 38px rgba(0,0,0,.08);}
#main-table > tbody > tr > td {min-width:0;}
#center-table,#center-table-new,#center-table-ad {background:#f7f7f5!important;min-width:0;padding:22px 18px 45px;vertical-align:top;}
#center-table > table, #center-table-new > table,#center-table-ad > table {max-width:100%;}
#center-table h1,#center-table-new h1,#center-table-ad h1,.ammunition-type-header-h1 {font-family:Impact,'Arial Narrow',Arial,sans-serif!important;color:#222529!important;font-size:clamp(24px,3.5vw,40px)!important;line-height:1.14;letter-spacing:.035em!important;font-weight:700!important;margin:18px 0!important;text-transform:uppercase;}
#center-table h2,#center-table-new h2 {color:#24272a;}
#center-table p,#center-table-new p,#center-table-ad p {line-height:1.65;}
#center-table .text,#center-table-new .text,#center-table-ad .text {font-family:Arial,Helvetica,sans-serif;font-size:14px;line-height:1.75;color:#373a3d;}
#center-table .textlight,#center-table-new .textlight,#center-table-ad .textlight {font-family:Arial,Helvetica,sans-serif;font-size:13px;line-height:1.65;}
#center-table a,#center-table-new a,#center-table-ad a {color:#a52327;}
#center-table a:hover,#center-table-new a:hover,#center-table-ad a:hover {color:#6d1115;}
/* Shared header */
.b101-header-cell {padding:0!important;background:#151719!important;border:0;}
.b101-header {background:#17191b;color:#f6f6f6;position:relative;z-index:20;border-bottom:3px solid #c92b2e;}
.b101-header-inner {width:calc(100% - 52px);max-width:1120px;margin:auto;min-height:120px;display:flex;align-items:center;justify-content:space-between;gap:20px;}

.b101-brand {
    margin-left: 60px;
}

.b101-brand {display:inline-flex;flex-direction:column;text-decoration:none!important;flex-shrink:0;gap:3px;color:#fff!important;}
.b101-brand:hover {color:#fff!important;}
.b101-brand-word {font-family:Arial,Helvetica,sans-serif;font-size:clamp(21px,2.5vw,29px);font-weight:900;letter-spacing:0px;line-height:1;white-space:nowrap;}
.b101-brand-word span,.b101-footer-brand span {color:#df383d;}
.b101-brand-word small,.b101-footer-brand small {font-size:12px;letter-spacing:0px;}
.b101-brand-caption {font-size:8px;font-weight:700;letter-spacing:1.8px;color:#92979b;}
.b101-nav {display:flex;justify-content:flex-end;align-items:center;gap:17px;}
.b101-nav>a,.b101-dropdown>summary {padding:12px 0;text-decoration:none!important;color:#e7e7e7!important;white-space:nowrap;font:700 11px Arial,Helvetica,sans-serif;letter-spacing:.55px;cursor:pointer;}
.b101-dropdown>summary {list-style:none;}
.b101-dropdown>summary::-webkit-details-marker {display:none;}
.b101-dropdown>summary:after {content:'⌄';margin-left:5px;font-size:11px;color:#e03b40;}
.b101-nav>a:hover,.b101-dropdown>summary:hover {color:#f04b4e!important;}
.b101-dropdown {position:relative;}
.b101-dropdown-menu {position:absolute;top:100%;left:0;max-height:65vh;overflow-y:auto;min-width:218px;background:#22262a;border-top:2px solid #d33237;box-shadow:0 15px 25px #0005;padding:7px 0;z-index:100;}
.b101-dropdown-menu a {display:block;text-decoration:none;color:#eee!important;padding:10px 17px;font-size:12px;line-height:1.2;white-space:nowrap;}
.b101-dropdown-menu a:hover {background:#34393d;color:#fff!important;}
.b101-menu-toggle {display:none;appearance:none;background:transparent;color:white;border:1px solid #53585e;padding:9px 14px;font-size:12px;letter-spacing:1px;font-weight:800;cursor:pointer;}
/* Main content */
#ballistics-chart,#ballistics-chartb {background:#fff;width:100%!important;max-width:100%;border-collapse:collapse;}
#ballistics-chart td,#ballistics-chart th,#ballistics-chartb td,#ballistics-chartb th {font:12px/1.4 Arial,Helvetica,sans-serif;padding:11px 12px;border-color:#e1e3e4;}
#ballistics-chart th,#ballistics-chartb th {background:#33383d;color:#fff;font-weight:700;text-transform:uppercase;letter-spacing:.4px;}
#ballistics-chart tr .ammunition-type-header,#ballistics-chartb tr .ammunition-type-header {background:#eaeaea!important;color:#222;border-left:4px solid #c92b2e;padding:13px 14px;text-align:left;}
#ballistics-chart tr .ammunition-type-header h2,#ballistics-chartb tr .ammunition-type-header h2 {font:700 15px Arial,Helvetica,sans-serif;letter-spacing:.4px;padding:0;margin:0;color:#222;}
#ballistics-chart tr:hover,#ballistics-chartb tr:hover {background:#fff5f5;}
#ballistics-chart tr[bgcolor],#ballistics-chartb tr[bgcolor] {background-color:#f4f5f5;}
.linedivide,.linedivide2,.linedivide3 {max-width:100%;}
input,select,textarea,button {max-width:100%;}
input[type=text],input[type=number],select,textarea {min-height:36px;border:1px solid #b9bdc1;border-radius:3px;padding:7px;background:#fff;font-size:16px;}
input[type=button],input[type=submit],button:not(.b101-menu-toggle) {cursor:pointer;}
/* Footer */
.b101-footer {background:#111315;color:#eee;width:100%;padding:48px 28px 20px;text-align:left;font-family:Arial,Helvetica,sans-serif;}
.b101-footer-inner {max-width:1100px;margin:auto;display:grid;grid-template-columns:2fr repeat(3,1fr);gap:35px;}
.b101-footer-brand {color:#fff!important;text-decoration:none;font-weight:900;letter-spacing:-1px;font-size:24px;white-space:nowrap;}
.b101-footer-brand small {font-size:11px;}
.b101-footer p {color:#a8adb2;font-size:12px;line-height:1.6;}
.b101-footer-note {max-width:240px;}
.b101-footer-column {display:flex;flex-direction:column;gap:12px;}
.b101-footer-column h2 {font:800 11px Arial,Helvetica,sans-serif;text-transform:uppercase;letter-spacing:1.7px;color:#fff;margin:0 0 8px;}
.b101-footer-column a {font-size:12px;text-decoration:none;color:#b9bfc2;}
.b101-footer-column a:hover {color:#f66;}
.b101-footer-bottom {max-width:1100px;margin:45px auto 0;padding-top:20px;border-top:1px solid #3a3d40;display:flex;justify-content:space-between;gap:20px;color:#858a8d;font-size:10px;letter-spacing:1.1px;}
/* Tablet and mobile: legacy chart tables scroll, rather than compressing data. */
@media(max-width:1050px) {
  .b101-header-inner{width:calc(100% - 30px);}
  .b101-nav{gap:9px;}
  .b101-nav>a,.b101-dropdown>summary{font-size:10px;}
  #center-table,#center-table-new,#center-table-ad{padding:20px 12px 40px;}
}
@media(max-width:850px) {
  .b101-header-inner{min-height:77px;}
  .b101-menu-toggle{display:block;}
  .b101-nav{display:none;position:absolute;left:0;right:0;top:100%;background:#17191b;padding:10px 22px 22px;flex-direction:column;align-items:stretch;gap:0;border-bottom:2px solid #c92b2e;max-height:calc(100vh - 79px);overflow-y:auto;}
  .b101-nav.b101-is-open{display:flex;}
  .b101-nav>a,.b101-dropdown>summary{display:block;padding:13px 5px;font-size:13px;border-bottom:1px solid #393c3f;}
  .b101-dropdown-menu{position:static;min-width:0;max-height:none;box-shadow:none;background:#25292c;border-top:none;padding:3px 0;}
  .b101-dropdown-menu a{white-space:normal;padding:11px 16px;}
  .b101-footer-inner{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media(max-width:680px) {
  #main-table {box-shadow:none;width:100%!important;}
  #main-table > tbody > tr > td {max-width:100vw;}
  #center-table,#center-table-new,#center-table-ad {padding:16px 10px 32px;}
  #center-table>table,#center-table-new>table,#center-table-ad>table {max-width:100%!important;width:100%!important;}
  #center-table img,#center-table-new img,#center-table-ad img {max-width:100%;height:auto!important;}
  .b101-brand-word{font-size:23px;}
  .b101-brand-caption{letter-spacing:1.2px;}
  /* Existing layouts feature wide data tables and embedded fixed-width tables.
     The chart keeps its columns readable; users swipe sideways within it. */
  #ballistics-chart,#ballistics-chartb {display:block;overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:calc(100vw - 20px);}
  #ballistics-chart tbody,#ballistics-chartb tbody {min-width:590px;display:table;width:100%;}
  #ballistics-chart td,#ballistics-chart th,#ballistics-chartb td,#ballistics-chartb th {white-space:nowrap;font-size:11px;padding:9px 10px;}
  #ballistics-chart td[colspan],#ballistics-chartb td[colspan] {white-space:normal;}
  .sponsored {display:none;}
  .b101-footer{padding:34px 18px 22px;}
  .b101-footer-inner{grid-template-columns:1fr 1fr;gap:29px 14px;}
  .b101-footer-intro{grid-column:1/-1;}
  .b101-footer-bottom{flex-direction:column;gap:8px;margin-top:26px;}
}
@media(max-width:390px) {
  .b101-footer-inner{grid-template-columns:1fr;}
  .b101-footer-intro{grid-column:auto;}
}
@media(prefers-reduced-motion:reduce){*,*:before,*:after {transition:none!important;}}

/* ================================================================
   Ballistics101 global mobile article / review text layout fix
   2026-11: Keep legacy text tables from widening the phone viewport.
   Applied to review pages, articles, and other prose-heavy pages.
   Ammunition comparison charts retain their separate scrolling rules.
   ================================================================ */
@media screen and (max-width: 1050px) {
  html, body { max-width: 100%; overflow-x: clip; }
  #main-table { width:100% !important; max-width:100% !important; min-width:0 !important; table-layout:auto !important; }
  #main-table > tbody > tr > td:not(.b101-header-cell),
  #center-table, #center-table-new, #center-table-ad {
    min-width:0 !important;
    width:100% !important;
    max-width:100% !important;
  }

  /* Mobile header logo alignment */
@media (max-width: 768px) {
    .b101-brand {
        margin-left: 0;
    }
}

  /* An article's legacy table is a layout wrapper, not a data table.
     Convert it to a vertical stack on mobile. This also fixes malformed
     two-cell article rows found in some older reviews. */
  #center-table table:has(p):not(:has(#ballistics-chart, #ballistics-chartb)),
  #center-table-new table:has(p):not(:has(#ballistics-chart, #ballistics-chartb)),
  #center-table-ad table:has(p):not(:has(#ballistics-chart, #ballistics-chartb)) {
    display:block !important;
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    table-layout:auto !important;
  }
  #center-table table:has(p):not(:has(#ballistics-chart, #ballistics-chartb)) > tbody,
  #center-table-new table:has(p):not(:has(#ballistics-chart, #ballistics-chartb)) > tbody,
  #center-table-ad table:has(p):not(:has(#ballistics-chart, #ballistics-chartb)) > tbody,
  #center-table table:has(p):not(:has(#ballistics-chart, #ballistics-chartb)) > tbody > tr,
  #center-table-new table:has(p):not(:has(#ballistics-chart, #ballistics-chartb)) > tbody > tr,
  #center-table-ad table:has(p):not(:has(#ballistics-chart, #ballistics-chartb)) > tbody > tr,
  #center-table table:has(p):not(:has(#ballistics-chart, #ballistics-chartb)) > tbody > tr > td,
  #center-table-new table:has(p):not(:has(#ballistics-chart, #ballistics-chartb)) > tbody > tr > td,
  #center-table-ad table:has(p):not(:has(#ballistics-chart, #ballistics-chartb)) > tbody > tr > td {
    display:block !important;
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    height:auto !important;
  }

  /* Reset fixed-width introductory/spacer tables, without changing
     the behavior of actual ballistic comparison data tables. */
  #center-table > table:not(#ballistics-chart):not(#ballistics-chartb),
  #center-table-new > table:not(#ballistics-chart):not(#ballistics-chartb),
  #center-table-ad > table:not(#ballistics-chart):not(#ballistics-chartb) {
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
  }

  #center-table p, #center-table-new p, #center-table-ad p,
  #center-table .text, #center-table-new .text, #center-table-ad .text,
  #center-table .text2, #center-table-new .text2, #center-table-ad .text2 {
    max-width:100% !important;
    min-width:0 !important;
    width:auto !important;
    margin-right:0 !important;
    white-space:normal !important;
    overflow-wrap:anywhere;
    word-break:normal;
    line-height:1.65;
  }
  #center-table img, #center-table-new img, #center-table-ad img {
    max-width:100% !important;
    height:auto !important;
  }
  /* Large inline graphics/iframes must not resize the article wrapper. */
  #center-table iframe, #center-table-new iframe, #center-table-ad iframe {
    max-width:100% !important;
  }
}

/* Mobile article fix: allow the shared main table to calculate a full-width
   content column even though legacy header/footer rows use colspan=2. */

/* Legacy shell repair: table-based pages use a two-column header but only
   one content cell. On small screens the shell must behave as one column.
   This prevents articles from being squeezed to half width or widened
   by older fixed-width images and nested layout tables. */
@media screen and (max-width: 1050px) {
  #main-table,
  #main-table > tbody,
  #main-table > tbody > tr,
  #main-table > tbody > tr > td {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }
}
/* Homepage logo alignment */
body.home .b101-header-inner {
    justify-content: center;
}
/* Align navigation logo with page content */
.site-header .header-inner {
    width: 88%;
    max-width: 1180px;
    margin-left: auto;
    margin-right: auto;
}