/*
Theme Name: Trueshot
Theme URI: https://trueshot.co.uk
Author: Josh — Trueshot
Author URI: https://trueshot.co.uk
Description: The Trueshot base theme. Holds the brand system — colour tokens, type scale, layout and components — plus the template hierarchy. Don't edit this theme directly; make changes in the Trueshot Child theme so updates here don't overwrite your work.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.8
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: trueshot
Tags: one-column, custom-menu, custom-logo, featured-images, translation-ready
*/

/* ============================================================
   1. TOKENS
   Every colour and typeface in the theme resolves to one of
   these. Override them in the child theme's style.css rather
   than hunting down individual rules.
   ============================================================ */
:root{
  --ts-ink:#1A1D1B;
  --ts-ink-raised:#22261F;
  --ts-moss:#3D4F3A;
  --ts-ember:#D97D3D;
  --ts-ember-lift:#E88F52;
  --ts-bone:#F2EFE9;

  --ts-bone-dim:rgba(242,239,233,.62);
  --ts-bone-faint:rgba(242,239,233,.14);
  --ts-ink-dim:rgba(26,29,27,.66);
  --ts-ink-faint:rgba(26,29,27,.14);

  --ts-font-display:"Archivo",system-ui,sans-serif;
  --ts-font-mono:"IBM Plex Mono",ui-monospace,monospace;
  --ts-font-body:"Inter",system-ui,sans-serif;

  --ts-maxw:1160px;
  --ts-maxw-prose:68ch;
  --ts-gut:clamp(20px,5vw,64px);
  --ts-section:clamp(64px,10vh,124px);

  --ts-ease:cubic-bezier(.2,.7,.3,1);
}

/* ============================================================
   2. RESET & BASE
   ============================================================ */
*,*::before,*::after{box-sizing:border-box}
body,h1,h2,h3,h4,p,figure,blockquote,dl,dd,ul,ol{margin:0}
ul[class],ol[class]{list-style:none;padding:0}
img,svg,video{max-width:100%;height:auto;display:block}
html{scroll-behavior:smooth}

body{
  background:var(--ts-ink);
  color:var(--ts-bone);
  font-family:var(--ts-font-body);
  font-size:17px;
  line-height:1.62;
  -webkit-font-smoothing:antialiased;
}

a{color:var(--ts-ember);text-decoration-thickness:1px;text-underline-offset:3px}
a:hover{color:var(--ts-ember-lift)}
a:focus-visible,button:focus-visible,input:focus-visible,
select:focus-visible,textarea:focus-visible{outline:2px solid var(--ts-ember);outline-offset:3px}

/* ============================================================
   3. LAYOUT
   ============================================================ */
.ts-wrap{max-width:var(--ts-maxw);margin-inline:auto;padding-inline:var(--ts-gut)}
.ts-prose{max-width:var(--ts-maxw-prose)}
.ts-section{padding-block:var(--ts-section)}
.ts-band-light{background:var(--ts-bone);color:var(--ts-ink)}
.ts-band-light a{color:var(--ts-moss)}
.ts-band-moss{background:var(--ts-moss);color:var(--ts-bone)}
.ts-stack > * + *{margin-top:1.1em}

.screen-reader-text{
  position:absolute!important;width:1px;height:1px;overflow:hidden;
  clip:rect(1px,1px,1px,1px);white-space:nowrap;
}
.ts-skip{
  position:absolute;left:-9999px;top:0;z-index:200;
  background:var(--ts-ember);color:var(--ts-ink);padding:12px 18px;
  font-family:var(--ts-font-mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;
}
.ts-skip:focus{left:8px;top:8px}

/* ============================================================
   4. TYPE
   ============================================================ */
.ts-display{
  font-family:var(--ts-font-display);
  font-variation-settings:"wdth" 108,"wght" 700;
  letter-spacing:-.035em;line-height:.95;
}
h1.ts-display{font-size:clamp(40px,7vw,88px)}
h2.ts-display{font-size:clamp(30px,4.6vw,56px)}

.entry-content h2,.entry-content h3,.entry-content h4{
  font-family:var(--ts-font-display);
  font-variation-settings:"wdth" 104,"wght" 700;
  letter-spacing:-.02em;line-height:1.15;
  margin-top:1.8em;margin-bottom:.5em;
}
.entry-content h2{font-size:clamp(26px,3.2vw,36px)}
.entry-content h3{font-size:22px}
.entry-content h4{font-size:19px}
.entry-content p,.entry-content ul,.entry-content ol{margin-bottom:1.1em}
.entry-content ul,.entry-content ol{padding-left:1.3em}
.entry-content li{margin-bottom:.4em}
.entry-content blockquote{
  border-left:3px solid var(--ts-ember);padding-left:22px;margin:1.6em 0;
  font-size:1.1em;color:var(--ts-bone-dim);
}
.ts-band-light .entry-content blockquote{color:var(--ts-ink-dim)}
.entry-content code{font-family:var(--ts-font-mono);font-size:.9em;background:rgba(242,239,233,.08);padding:2px 6px}
.ts-band-light .entry-content code{background:rgba(26,29,27,.08)}
.entry-content pre{
  font-family:var(--ts-font-mono);font-size:14px;overflow:auto;
  background:var(--ts-ink-raised);color:var(--ts-bone);padding:20px;margin-bottom:1.2em;
}
.entry-content img{margin-block:1.4em}

.ts-eyebrow{
  font-family:var(--ts-font-mono);font-size:11px;font-weight:500;
  letter-spacing:.22em;text-transform:uppercase;color:var(--ts-ember);
}
.ts-eyebrow--muted{color:var(--ts-bone-dim)}
.ts-band-light .ts-eyebrow--muted{color:var(--ts-ink-dim)}
.ts-lede{font-size:clamp(17px,1.9vw,21px);color:var(--ts-bone-dim);max-width:54ch}
.ts-band-light .ts-lede{color:var(--ts-ink-dim)}
.ts-meta{font-family:var(--ts-font-mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--ts-bone-dim)}
.ts-band-light .ts-meta{color:var(--ts-ink-dim)}

/* ============================================================
   5. COMPONENTS
   ============================================================ */
.ts-btn{
  display:inline-flex;align-items:center;gap:12px;
  font-family:var(--ts-font-mono);font-size:12px;letter-spacing:.14em;
  text-transform:uppercase;text-decoration:none;cursor:pointer;border:0;
  padding:16px 26px;background:var(--ts-ember);color:var(--ts-ink);
  transition:transform .25s var(--ts-ease),background .25s;
}
.ts-btn:hover{background:var(--ts-ember-lift);color:var(--ts-ink);transform:translateY(-2px)}
.ts-btn__tick{width:14px;height:1px;background:currentColor;transition:width .25s}
.ts-btn:hover .ts-btn__tick{width:24px}
.ts-btn--ghost{background:transparent;color:currentColor;box-shadow:inset 0 0 0 1px var(--ts-bone-faint)}
.ts-btn--ghost:hover{background:transparent;box-shadow:inset 0 0 0 1px var(--ts-ember);color:var(--ts-ember)}

/* header */
.ts-header{
  position:sticky;top:0;z-index:50;
  background:rgba(26,29,27,.88);backdrop-filter:blur(10px);
  border-bottom:1px solid var(--ts-bone-faint);
}
.ts-header .ts-wrap{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:70px}
.ts-mark{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ts-bone)}
.ts-mark:hover{color:var(--ts-bone)}
.ts-mark span{
  font-family:var(--ts-font-display);font-variation-settings:"wdth" 100,"wght" 700;
  letter-spacing:-.02em;font-size:19px;
}
.ts-nav ul{display:flex;gap:32px;align-items:center;margin:0;padding:0;list-style:none}
.ts-nav a{
  font-family:var(--ts-font-mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--ts-bone-dim);text-decoration:none;transition:color .2s;
}
.ts-nav a:hover,.ts-nav .current-menu-item > a{color:var(--ts-bone)}
.ts-nav-toggle{
  display:none;background:transparent;border:1px solid var(--ts-bone-faint);color:var(--ts-bone);
  font-family:var(--ts-font-mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;
  padding:10px 14px;cursor:pointer;
}
@media(max-width:860px){
  .ts-nav-toggle{display:block}
  .ts-nav{display:none;width:100%;order:3;padding-bottom:20px}
  .ts-nav.is-open{display:block}
  .ts-nav ul{flex-direction:column;align-items:flex-start;gap:16px}
  .ts-header .ts-wrap{flex-wrap:wrap}
}

/* page + post headers */
.ts-page-head{padding-block:clamp(56px,9vh,110px) clamp(30px,5vh,54px)}
.ts-page-head .ts-rule{height:1px;background:var(--ts-bone-faint);margin-block:34px}
.ts-band-light .ts-rule{background:var(--ts-ink-faint)}

/* card grid for archives */
.ts-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1px;background:var(--ts-bone-faint)}
.ts-card{
  background:var(--ts-ink);padding:28px 26px 26px;
  display:flex;flex-direction:column;gap:13px;transition:background .3s;
}
.ts-card:hover{background:var(--ts-ink-raised)}
.ts-card h2,.ts-card h3{
  font-family:var(--ts-font-display);font-variation-settings:"wdth" 104,"wght" 600;
  letter-spacing:-.02em;font-size:22px;line-height:1.15;
}
.ts-card h2 a,.ts-card h3 a{color:inherit;text-decoration:none}
.ts-card h2 a:hover,.ts-card h3 a:hover{color:var(--ts-ember)}
.ts-card p{color:var(--ts-bone-dim);font-size:15px}
.ts-card .ts-thumb{margin:-28px -26px 4px;border-bottom:1px solid var(--ts-bone-faint)}
.ts-card .ts-thumb img{width:100%;aspect-ratio:16/10;object-fit:cover}
.ts-card .ts-more{margin-top:auto;padding-top:16px}

/* pagination */
.ts-pagination{margin-top:44px;display:flex;gap:10px;flex-wrap:wrap}
.ts-pagination .page-numbers{
  font-family:var(--ts-font-mono);font-size:12px;letter-spacing:.1em;
  padding:11px 15px;border:1px solid var(--ts-bone-faint);color:var(--ts-bone-dim);text-decoration:none;
}
.ts-pagination .page-numbers:hover,.ts-pagination .current{
  border-color:var(--ts-ember);color:var(--ts-ember);
}

/* footer */
.ts-footer{border-top:1px solid var(--ts-bone-faint);padding-block:36px}
.ts-footer .ts-wrap{
  display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;
  font-family:var(--ts-font-mono);font-size:12px;letter-spacing:.08em;color:var(--ts-bone-dim);
}
.ts-footer a{color:var(--ts-bone-dim);text-decoration:none}
.ts-footer a:hover{color:var(--ts-ember)}
.ts-footer ul{display:flex;gap:24px;flex-wrap:wrap;list-style:none;margin:0;padding:0}

/* WordPress core classes it will expect to find */
.alignleft{float:left;margin:0 1.5em 1em 0}
.alignright{float:right;margin:0 0 1em 1.5em}
.aligncenter{margin-inline:auto;display:block}
.alignwide{max-width:calc(var(--ts-maxw) - 2rem)}
.alignfull{max-width:none;width:100%}
.wp-caption-text,.wp-element-caption{
  font-family:var(--ts-font-mono);font-size:12px;color:var(--ts-bone-dim);margin-top:8px;
}
.sticky .ts-card{box-shadow:inset 3px 0 0 var(--ts-ember)}

@media(prefers-reduced-motion:reduce){
  *{animation-duration:.001ms!important;transition-duration:.001ms!important}
  html{scroll-behavior:auto}
}