/*
Theme Name: Amped Up Dad
Theme URI: https://ampedupdad.com
Author: Amped Up Dad
Description: Vintage skate/band-poster theme for Amped Up Dad. Grip-tape and crumpled-paper textures, corkboard discoveries, gear guide, and merch. Works with the Amped Up Dad Instagram plugin and WooCommerce.
Version: 1.3.3
Requires at least: 6.2
Requires PHP: 7.4
Text Domain: amped-up-dad
*/

  :root {
    box-sizing: border-box;
    padding-top: env(safe-area-inset-top, 0px);
    padding-bottom: env(safe-area-inset-bottom, 0px);

    --bg: #0d0d0c;
    --bg-alt: #171614;
    --ink: #050505;
    --paper: #f2efe4;
    --red: #ff1e1e;
    --red-deep: #a80f0f;
    --yellow: #d8bd6a;
    --line: #38352e;
    --grip: url('assets/images/grip.png');
    --crumple: url('assets/images/crumple.png');
  }
  html { scroll-padding-top: env(safe-area-inset-top, 0px); }
  * { box-sizing: inherit; }
  body {
    margin: 0;
    background-color: var(--bg);
    background-image: var(--grip);
    background-repeat: repeat;
    background-size: 190px 190px;
    background-blend-mode: overlay;
    color: var(--paper);
    font-family: 'Barlow Condensed', sans-serif;
    font-size: 18px;
    line-height: 1.5;
    -webkit-font-smoothing: antialiased;
  }
  img { max-width: 100%; display: block; }

  /* full-page crumpled/torn paper crease layer, sits above the grip-tape grain */
  .crumple-overlay {
    position: fixed;
    inset: 0;
    pointer-events: none;
    background-image: var(--crumple);
    background-repeat: repeat;
    background-size: 760px 760px;
    mix-blend-mode: overlay;
    opacity: 0.55;
    z-index: 400;
  }
  .crumple-overlay::after {
    content: "";
    position: absolute;
    inset: 0;
    background-image: var(--crumple);
    background-repeat: repeat;
    background-size: 340px 340px;
    background-position: 60px 90px;
    mix-blend-mode: soft-light;
    opacity: 0.5;
  }

  /* grippy black-sandpaper surface for solid ink/alt-bg blocks */
  .grip-surface {
    position: relative;
    background-color: var(--ink);
    background-image: var(--grip);
    background-repeat: repeat;
    background-size: 150px 150px;
    background-blend-mode: overlay;
  }

  .halftone-band {
    background-image: radial-gradient(var(--line) 1px, transparent 1.4px);
    background-size: 7px 7px;
    background-position: 0 0;
  }

  .wrap {
    max-width: 1180px;
    margin: 0 auto;
    padding: 0 24px;
  }

  h1, h2, h3 {
    font-family: 'Anton', sans-serif;
    font-weight: 400;
    letter-spacing: 0.01em;
    line-height: 0.95;
    margin: 0;
  }

  a { color: inherit; }

  /* ---------- NAV ---------- */
  header.site-nav {
    position: sticky;
    top: env(safe-area-inset-top, 0px);
    z-index: 500;
    background-color: rgba(13,13,12,0.94);
    background-image: var(--grip);
    background-repeat: repeat;
    background-size: 140px 140px;
    background-blend-mode: overlay;
    border-bottom: 2px solid var(--red);
    backdrop-filter: blur(4px);
  }
  .nav-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 0;
  }
  header.site-nav img.nav-mark { height: 40px; width: auto; max-width: none; }
  nav.links { display: flex; gap: 28px; font-size: 17px; }
  nav.links a { text-decoration: none; position: relative; padding: 4px 0; }
  nav.links a:hover, nav.links a:focus-visible { color: var(--red); }
  .nav-cta {
    background: var(--red);
    color: var(--ink);
    padding: 8px 18px;
    font-weight: 700;
    text-decoration: none;
    transform: skewX(-6deg);
    display: inline-block;
    border: 2px solid var(--ink);
  }
  .nav-cta span { display: inline-block; transform: skewX(6deg); }
  .nav-toggle { display: none; }

  @media (max-width: 760px) {
    nav.links { display: none; }
    .nav-toggle { display: block; background: none; border: 2px solid var(--paper); color: var(--paper); padding: 6px 10px; font-family: 'Anton'; }
  }

  /* ---------- HERO ---------- */
  .hero {
    position: relative;
    padding: 72px 0 96px;
    overflow: hidden;
    border-bottom: 6px solid var(--ink);
  }
  .hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image: radial-gradient(var(--line) 1.2px, transparent 1.6px);
    background-size: 16px 16px;
    opacity: 0.35;
  }
  .hero-grid {
    position: relative;
    display: grid;
    grid-template-columns: 1.1fr 0.9fr;
    gap: 40px;
    align-items: center;
  }
  @media (max-width: 860px) {
    .hero-grid { grid-template-columns: 1fr; }
  }
  .hero-logo-wrap {
    position: relative;
    display: flex;
    justify-content: center;
  }
  .hero-logo-wrap img {
    width: 100%;
    max-width: 480px;
    transform: rotate(-4deg);
    filter: drop-shadow(10px 10px 0 var(--ink));
  }
  .sticker {
    position: absolute;
    font-family: 'Permanent Marker', cursive;
    background: var(--yellow);
    color: var(--ink);
    padding: 6px 14px;
    font-size: 15px;
    transform: rotate(-8deg);
    border: 2px solid var(--ink);
    box-shadow: 4px 4px 0 var(--ink);
  }
  .sticker.s1 { top: -6px; right: 6%; }
  .sticker.s2 { bottom: 6%; left: -6px; transform: rotate(7deg); }

  .hero-copy .eyebrow-tag {
    display: inline-block;
    background: var(--red);
    color: var(--ink);
    font-family: 'Anton';
    font-size: 14px;
    padding: 4px 10px;
    transform: rotate(-2deg);
    margin-bottom: 18px;
  }
  .hero-copy h1 {
    font-size: clamp(2.4rem, 6vw, 4.2rem);
    color: var(--paper);
  }
  .hero-copy h1 .accent { color: var(--red); }
  .hero-copy p.lede {
    font-size: 20px;
    max-width: 46ch;
    color: #cfccbf;
    margin: 22px 0 30px;
  }
  .hero-ctas { display: flex; gap: 16px; flex-wrap: wrap; }
  .btn {
    font-family: 'Anton';
    font-size: 16px;
    letter-spacing: 0.02em;
    padding: 14px 26px;
    text-decoration: none;
    display: inline-block;
    border: 3px solid var(--ink);
  }
  .btn-primary {
    background: var(--red);
    color: var(--ink);
    box-shadow: 6px 6px 0 var(--ink);
  }
  .btn-primary:hover { transform: translate(2px,2px); box-shadow: 4px 4px 0 var(--ink); }
  .btn-ghost {
    background: transparent;
    color: var(--paper);
    border-color: var(--paper);
  }
  .btn-ghost:hover { border-color: var(--red); color: var(--red); }

  /* ---------- torn divider ---------- */
  .torn {
    height: 40px;
    background-color: var(--bg-alt);
    background-image: var(--grip);
    background-repeat: repeat;
    background-size: 110px 110px;
    background-blend-mode: overlay;
    clip-path: polygon(0% 100%, 3% 30%, 6% 85%, 9% 15%, 12% 70%, 15% 5%, 18% 90%, 21% 35%, 24% 78%, 27% 12%, 30% 95%, 33% 40%, 36% 82%, 39% 8%, 42% 68%, 45% 25%, 48% 92%, 51% 18%, 54% 75%, 57% 3%, 60% 88%, 63% 30%, 66% 80%, 69% 10%, 72% 95%, 75% 45%, 78% 72%, 81% 15%, 84% 90%, 87% 35%, 90% 78%, 93% 8%, 96% 85%, 100% 100%);
  }

  /* ---------- SECTION generic ---------- */
  section { padding: 88px 0; }
  .section-head { max-width: 60ch; margin-bottom: 44px; }
  .section-head .kicker {
    font-family: 'Permanent Marker', cursive;
    color: var(--yellow);
    font-size: 16px;
    display: block;
    margin-bottom: 6px;
    transform: rotate(-1deg);
  }
  .section-head h2 { font-size: clamp(1.8rem, 4vw, 2.6rem); }
  .section-head p { color: #cfccbf; margin-top: 14px; font-size: 18px; }

  /* ---------- SUBMIT A BAND ---------- */
  .submit-band {
    background-color: var(--bg-alt);
    background-image: var(--grip);
    background-repeat: repeat;
    background-size: 150px 150px;
    background-blend-mode: overlay;
    border-top: 4px solid var(--yellow);
    border-bottom: 4px solid var(--yellow);
  }
  .submit-grid {
    display: grid;
    grid-template-columns: 0.9fr 1.1fr;
    gap: 48px;
    align-items: start;
  }
  @media (max-width: 860px) { .submit-grid { grid-template-columns: 1fr; } }
  .submit-copy .kicker { color: var(--yellow); }
  .submit-copy h2 { font-size: clamp(1.9rem, 4.5vw, 2.8rem); margin-bottom: 16px; }
  .submit-copy p { color: #cfccbf; font-size: 18px; max-width: 42ch; }
  .submit-list { margin-top: 26px; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 10px; }
  .submit-list li { font-size: 16px; color: #b9b6a9; padding-left: 20px; position: relative; }
  .submit-list li::before { content: "\2726"; position: absolute; left: 0; color: var(--red); font-size: 13px; top: 3px; }

  .flyer-form {
    background: var(--paper);
    color: var(--ink);
    padding: 32px 28px;
    border: 2px solid var(--ink);
    box-shadow: 9px 9px 0 var(--ink);
    transform: rotate(-1deg);
  }
  .flyer-form .stamp {
    float: right;
    font-family: 'Permanent Marker', cursive;
    color: var(--red-deep);
    border: 3px solid var(--red-deep);
    padding: 6px 12px;
    font-size: 14px;
    transform: rotate(8deg);
    margin: -8px -6px 10px 10px;
  }
  .field { margin-bottom: 18px; }
  .field label {
    display: block;
    font-family: 'Anton';
    font-size: 14px;
    letter-spacing: 0.02em;
    margin-bottom: 6px;
  }
  .field input {
    width: 100%;
    padding: 12px 14px;
    font-family: 'Barlow Condensed';
    font-size: 16px;
    border: 2px solid var(--ink);
    background: #fff;
  }
  .field input:focus-visible { outline: 3px solid var(--red); outline-offset: 1px; }
  .flyer-form button {
    font-family: 'Anton';
    background: var(--red);
    color: var(--ink);
    border: 3px solid var(--ink);
    padding: 14px 24px;
    box-shadow: 5px 5px 0 var(--ink);
    cursor: pointer;
    margin-top: 6px;
  }

  /* ---------- DISCOVERIES corkboard ---------- */
  .cork {
    background-color: var(--bg-alt);
    background-image: var(--grip);
    background-repeat: repeat;
    background-size: 150px 150px;
    background-blend-mode: overlay;
  }
  .board {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 26px;
  }
  @media (max-width: 900px) { .board { grid-template-columns: repeat(2, 1fr); } }
  @media (max-width: 520px) { .board { grid-template-columns: 1fr; } }
  .card-band {
    background: var(--paper);
    color: var(--ink);
    padding: 16px 16px 20px;
    border: 2px solid var(--ink);
    box-shadow: 7px 7px 0 var(--ink);
    transition: transform 0.15s ease;
  }
  .card-band:nth-child(odd) { transform: rotate(-2.5deg); }
  .card-band:nth-child(even) { transform: rotate(2deg); }
  .card-band:hover { transform: rotate(0deg) translateY(-4px); }
  a.card-band { display: block; text-decoration: none; color: var(--ink); }
  a.card-band:focus-visible { transform: rotate(0deg) translateY(-4px); outline: 3px solid var(--red); outline-offset: 4px; }
  .aud-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  @media (prefers-reduced-motion: reduce) { .card-band { transition: none; } }
  .art-swatch {
    aspect-ratio: 1/1;
    margin-bottom: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: 'Anton';
    font-size: 15px;
    text-align: center;
    color: var(--paper);
    padding: 10px;
  }
  .card-band h3 { font-size: 20px; margin-bottom: 4px; }
  .card-band .genre { font-size: 14px; text-transform: uppercase; letter-spacing: 0.08em; color: var(--red-deep); font-weight: 700; }
  .card-band .from { font-size: 14px; color: #4a473e; margin-top: 6px; }

  /* ---------- GEAR ticket stubs ---------- */
  .gear-row {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 22px;
  }
  @media (max-width: 760px) { .gear-row { grid-template-columns: 1fr; } }
  .ticket {
    position: relative;
    background-color: var(--bg-alt);
    background-image: var(--grip);
    background-repeat: repeat;
    background-size: 130px 130px;
    background-blend-mode: overlay;
    border: 2px dashed var(--yellow);
    padding: 22px 18px 24px;
  }
  .ticket::before, .ticket::after {
    content: "";
    position: absolute;
    width: 20px; height: 20px;
    background: var(--bg);
    border-radius: 50%;
    top: 50%;
    transform: translateY(-50%);
  }
  .ticket::before { left: -11px; }
  .ticket::after { right: -11px; }
  .ticket .tag {
    font-family: 'Anton';
    font-size: 13px;
    color: var(--yellow);
    letter-spacing: 0.06em;
  }
  .ticket h3 { font-size: 22px; margin: 8px 0 10px; color: var(--paper); }
  .ticket p { font-size: 15px; color: #b9b6a9; margin: 0 0 16px; }
  .ticket a.shop {
    font-family: 'Anton';
    font-size: 14px;
    color: var(--red);
    text-decoration: none;
    border-bottom: 2px solid var(--red);
    padding-bottom: 2px;
  }

  /* ---------- SOCIAL PROOF / counter ---------- */
  .proof {
    background-image: var(--grip), linear-gradient(180deg, var(--bg) 0%, var(--bg-alt) 100%);
    background-repeat: repeat, no-repeat;
    background-size: 150px 150px, 100% 100%;
    background-blend-mode: overlay, normal;
    border-top: 6px solid var(--ink);
    border-bottom: 6px solid var(--ink);
  }
  .proof-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 50px;
    align-items: center;
  }
  @media (max-width: 800px) { .proof-grid { grid-template-columns: 1fr; } }
  .counter-box {
    text-align: center;
    background-color: var(--ink);
    background-image: var(--grip);
    background-repeat: repeat;
    background-size: 120px 120px;
    background-blend-mode: overlay;
    border: 3px solid var(--red);
    padding: 40px 24px;
    box-shadow: 8px 8px 0 var(--red-deep);
  }
  .counter-box .count {
    font-family: 'Anton';
    font-size: clamp(3rem, 9vw, 5.5rem);
    color: var(--paper);
    line-height: 1;
  }
  .counter-box .count .plus { color: var(--red); }
  .counter-box .label {
    font-family: 'Permanent Marker', cursive;
    color: var(--yellow);
    margin-top: 10px;
    font-size: 16px;
  }
  .proof-copy h2 { font-size: clamp(1.8rem, 4vw, 2.4rem); margin-bottom: 16px; }
  .proof-copy p { color: #cfccbf; font-size: 18px; margin-bottom: 22px; }

  /* ---------- MERCH teaser (base layout; card look defined in li.merch-item below) ---------- */
  .merch-strip {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
  }
  @media (max-width: 760px) { .merch-strip { grid-template-columns: 1fr; } }

  /* ---------- COMMUNITY / email ---------- */
  .community {
    text-align: center;
  }
  .community h2 { font-size: clamp(2rem, 5vw, 3rem); max-width: 20ch; margin: 0 auto 18px; }
  .community p { color: #cfccbf; max-width: 50ch; margin: 0 auto 30px; }
  .email-form {
    display: flex;
    gap: 12px;
    max-width: 460px;
    margin: 0 auto;
    flex-wrap: wrap;
    justify-content: center;
  }
  .email-form input {
    flex: 1 1 240px;
    background: var(--bg-alt);
    border: 2px solid var(--paper);
    color: var(--paper);
    padding: 14px 16px;
    font-family: 'Barlow Condensed';
    font-size: 17px;
  }
  .email-form input:focus-visible { outline: 3px solid var(--red); outline-offset: 2px; }
  .email-form button {
    font-family: 'Anton';
    background: var(--red);
    color: var(--ink);
    border: 3px solid var(--ink);
    padding: 14px 22px;
    box-shadow: 5px 5px 0 var(--ink);
    cursor: pointer;
  }
  .social-icons { display: flex; gap: 18px; justify-content: center; margin-top: 34px; }
  .social-icons a {
    width: 46px; height: 46px;
    border: 2px solid var(--paper);
    display: flex; align-items: center; justify-content: center;
    text-decoration: none;
    font-family: 'Anton';
  }
  .social-icons a:hover { border-color: var(--red); color: var(--red); }

  /* ---------- FOOTER ---------- */
  footer {
    background-color: var(--ink);
    background-image: var(--grip);
    background-repeat: repeat;
    background-size: 140px 140px;
    background-blend-mode: overlay;
    padding: 50px 0 calc(30px + env(safe-area-inset-bottom, 0px));
    border-top: 6px solid var(--red);
  }
  .footer-grid {
    display: grid;
    grid-template-columns: 1.4fr 1fr 1fr;
    gap: 30px;
  }
  @media (max-width: 700px) { .footer-grid { grid-template-columns: 1fr; } }
  footer h4 { font-family: 'Anton'; font-size: 16px; color: var(--yellow); margin-bottom: 14px; }
  footer ul { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 8px; font-size: 15px; }
  footer a { text-decoration: none; color: #cfccbf; }
  footer a:hover { color: var(--red); }
  .disclosure {
    margin-top: 40px;
    padding-top: 24px;
    border-top: 1px solid var(--line);
    font-size: 13px;
    color: #7a776b;
    max-width: 80ch;
  }

  .placeholder-note {
    font-size: 12px;
    color: #7a776b;
    font-style: italic;
  }

/* ==================================================================
   Theme additions (WordPress-specific)
   ================================================================ */
.screen-reader-text{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip-link:focus{clip:auto;width:auto;height:auto;margin:0;padding:10px 16px;position:fixed;top:8px;left:8px;z-index:1000;background:var(--red);color:var(--ink);font-family:'Anton',sans-serif}
body.admin-bar header.site-nav{top:32px}
@media (max-width:782px){body.admin-bar header.site-nav{top:46px}}
.nav-mark-link{display:inline-flex}
.nav-toggle:focus-visible,nav.links a:focus-visible,.nav-cta:focus-visible{outline:3px solid var(--red);outline-offset:3px}
@media (max-width:760px){
  .nav-cta{display:none}
  nav.links.is-open{display:flex;flex-direction:column;gap:14px;position:absolute;top:100%;left:0;right:0;padding:18px 24px 22px;background-color:rgba(13,13,12,.98);border-bottom:2px solid var(--red)}
  nav.links.is-open a{font-size:20px}
}

/* Forms: messages + honeypot */
.form-msg{padding:10px 14px;border:2px solid var(--ink);margin-bottom:16px;font-weight:600}
.form-msg.ok{background:#d6ecc6}
.form-msg.err{background:#f5c6c6}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.field input:focus-visible,.email-form input:focus-visible{outline:3px solid var(--red);outline-offset:2px}

/* Merch teaser: card look now lives in the li.merch-item WooCommerce block below */
.merch-soon{color:#cfccbf;max-width:52ch}
.merch-more{margin-top:32px}
.aud-empty a{color:var(--red)}
.admin-hint{font-size:14px;color:var(--yellow);border:2px dashed var(--yellow);padding:8px 12px;display:inline-block}

/* Generic pages, posts, and WooCommerce fallbacks */
.page-main{padding:64px 0 88px;min-height:50vh}
.page-article h1{font-size:clamp(2rem,5vw,3.2rem);margin-bottom:24px}
.entry{max-width:72ch;font-size:19px}
.entry a{color:var(--red)}
.entry h2,.entry h3{margin:32px 0 12px}
.entry img{height:auto}

/* ==================================================================
   WooCommerce: shop archive, single product, cart, checkout, account
   ================================================================ */

.shop-hero{padding:56px 0 8px}
.shop-hero .kicker{font-family:'Permanent Marker',cursive;color:var(--yellow);font-size:16px;display:block;margin-bottom:6px;transform:rotate(-1deg)}
.shop-hero h1{font-family:'Anton',sans-serif;font-size:clamp(2.2rem,5vw,3.4rem);color:var(--paper)}
.shop-hero .woocommerce-products-header__description{color:#cfccbf;max-width:60ch;margin-top:14px;font-size:18px}
.shop-main{padding-bottom:96px}

.shop-toolbar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px;margin-bottom:32px}
.woocommerce-result-count{color:#b9b6a9;font-size:15px;margin:0}
.woocommerce-ordering{margin:0}
.woocommerce-ordering select{
	background:#fff;color:var(--ink);border:2px solid var(--ink);
	font-family:'Barlow Condensed',sans-serif;font-size:17px;font-weight:600;padding:9px 12px;
}
.woocommerce-ordering select:focus-visible{outline:3px solid var(--red);outline-offset:2px}

/* Product grid — reuses .merch-strip so the shop page matches the homepage teaser exactly */
.shop-grid{list-style:none;margin:0;padding:0}
.merch-strip.products{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
@media (max-width:900px){.merch-strip.products{grid-template-columns:repeat(2,1fr)}}
@media (max-width:600px){.merch-strip.products{grid-template-columns:1fr}}
li.merch-item{
	list-style:none;background:var(--paper);color:var(--ink);border:2px solid var(--ink);
	box-shadow:6px 6px 0 var(--ink);padding:20px;position:relative;
}
li.merch-item .merch-item-link{display:block;text-decoration:none;color:var(--ink)}
li.merch-item .swatch{aspect-ratio:1/1;background:#fff;border:2px solid var(--ink);overflow:hidden;margin-bottom:14px;position:relative}
li.merch-item .swatch img{width:100%;height:100%;object-fit:contain;display:block;opacity:1}
li.merch-item h3{font-family:'Anton',sans-serif;font-weight:400;font-size:19px;margin:0}
li.merch-item .price{font-family:'Anton',sans-serif;color:var(--red-deep);margin-top:6px;font-size:17px}
li.merch-item .price del{opacity:.55;margin-right:8px;font-size:14px}
li.merch-item .price ins{text-decoration:none}
li.merch-item .onsale{
	position:absolute;top:10px;left:10px;z-index:2;background:var(--red);color:var(--ink);
	font-family:'Anton',sans-serif;font-size:12px;padding:4px 10px;transform:rotate(-4deg);
	border:2px solid var(--ink);
}
.merch-add{margin-top:14px}
li.merch-item a.button,li.merch-item a.added_to_cart{
	display:inline-block;font-family:'Anton',sans-serif;font-size:14px;
	background:var(--red);color:var(--ink);border:2px solid var(--ink);
	padding:9px 16px;text-decoration:none;box-shadow:4px 4px 0 var(--ink);
}
li.merch-item a.button:hover,li.merch-item a.button:focus-visible{transform:translate(2px,2px);box-shadow:2px 2px 0 var(--ink)}
li.merch-item a.button{transition:transform .15s ease,box-shadow .15s ease}
li.merch-item a.button:focus-visible{outline:3px solid var(--paper);outline-offset:2px}
li.merch-item a.button.loading{opacity:.7}
@media (prefers-reduced-motion:reduce){li.merch-item a.button{transition:none}}
.merch-more{margin-top:32px}

.shop-pagination{margin-top:48px;text-align:center}
.woocommerce-pagination ul{display:inline-flex;gap:8px;list-style:none;padding:0;margin:0}
.woocommerce-pagination a,.woocommerce-pagination span{
	display:inline-block;padding:8px 14px;border:2px solid var(--paper);color:var(--paper);
	text-decoration:none;font-family:'Anton',sans-serif;
}
.woocommerce-pagination .current{background:var(--red);border-color:var(--ink);color:var(--ink)}
.woocommerce-pagination a:hover,.woocommerce-pagination a:focus-visible{border-color:var(--red);color:var(--red)}

.woocommerce-info,.woocommerce-message,.woocommerce-error,.woocommerce-noreviews{
	list-style:none;background:#fff;color:var(--ink);border:3px solid var(--ink);border-left-width:12px;
	padding:16px 20px;margin:0 0 28px;font-size:18px;font-weight:600;
}
.woocommerce-info{border-left-color:var(--yellow)}
.woocommerce-message{border-left-color:#3a6b2a}
.woocommerce-error{border-left-color:var(--red)}
.woocommerce-info::before,.woocommerce-message::before,.woocommerce-error::before{display:none}
.woocommerce-info,.woocommerce-message{display:flex;flex-wrap:wrap;align-items:center;gap:12px}
.woocommerce-message a.button{order:2;margin-left:auto}
.woocommerce-info a:not(.button),.woocommerce-message a:not(.button),.woocommerce-error a{color:var(--red-deep)}

/* Single product */
.single-product-main{padding:64px 0 96px}
.woocommerce div.product{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:start}
@media (max-width:860px){.woocommerce div.product{grid-template-columns:1fr}}
.woocommerce div.product .woocommerce-product-gallery{background:#fff;border:3px solid var(--ink);box-shadow:9px 9px 0 var(--ink);padding:12px}
.woocommerce div.product .woocommerce-product-gallery img{width:100%;height:auto;display:block}
.woocommerce div.product .flex-control-thumbs{display:flex;gap:8px;margin-top:10px;padding:0;list-style:none}
.woocommerce div.product .flex-control-thumbs li{width:64px}
.woocommerce div.product .flex-control-thumbs img{border:3px solid var(--ink);background:#fff;cursor:pointer;opacity:1}
.woocommerce div.product .flex-control-thumbs img.flex-active{border-color:var(--red)}

.woocommerce div.product .summary{background:var(--paper);color:var(--ink);padding:28px 26px;border:2px solid var(--ink);box-shadow:9px 9px 0 var(--ink)}
.woocommerce div.product .summary h1.product_title{font-family:'Anton',sans-serif;font-weight:400;font-size:clamp(1.8rem,4vw,2.6rem);margin:0 0 12px}
.woocommerce div.product .summary p.price,.woocommerce div.product .summary .price{font-family:'Anton',sans-serif;color:var(--red-deep);font-size:26px;margin-bottom:18px}
.woocommerce div.product .summary .price del{opacity:.55;font-size:18px;margin-right:10px}
.woocommerce div.product .summary .price ins{text-decoration:none}
.woocommerce div.product .summary .woocommerce-product-details__short-description{font-size:17px;color:#3a3730;margin-bottom:20px}
.woocommerce div.product .summary .stock{font-family:'Barlow Condensed',sans-serif;font-weight:600;margin-bottom:16px}
.woocommerce div.product .summary .stock.out-of-stock{color:var(--red-deep)}
.woocommerce div.product .summary .stock.in-stock{color:#3a6b2a}

.woocommerce div.product form.cart{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:10px}
.woocommerce div.product form.cart .quantity{margin:0}
.woocommerce div.product form.cart .qty{
	width:64px;padding:10px;border:2px solid var(--ink);font-family:'Barlow Condensed',sans-serif;font-size:16px;background:#fff;
}
.woocommerce div.product form.cart .qty:focus-visible{outline:3px solid var(--red);outline-offset:1px}
.woocommerce div.product form.cart button.single_add_to_cart_button{
	font-family:'Anton',sans-serif;font-size:16px;background:var(--red);color:var(--ink);
	border:3px solid var(--ink);padding:13px 24px;box-shadow:5px 5px 0 var(--ink);cursor:pointer;
}
.woocommerce div.product form.cart button.single_add_to_cart_button:hover{transform:translate(2px,2px);box-shadow:3px 3px 0 var(--ink)}
.woocommerce div.product form.cart button.single_add_to_cart_button:focus-visible{outline:3px solid var(--red-deep);outline-offset:2px}
.woocommerce div.product form.cart table.variations{width:100%;margin-bottom:16px}
.woocommerce div.product form.cart table.variations select{
	width:100%;padding:10px;border:2px solid var(--ink);font-family:'Barlow Condensed',sans-serif;font-size:16px;background:#fff;
}
.woocommerce div.product .woocommerce-variation-price{margin-bottom:12px;font-family:'Anton',sans-serif;color:var(--red-deep)}

.woocommerce-tabs{grid-column:1/-1;margin-top:40px}
.woocommerce-tabs ul.tabs{display:flex;gap:6px;list-style:none;padding:0;margin:0 0 -2px;flex-wrap:wrap}
.woocommerce-tabs ul.tabs li{margin:0}
.woocommerce-tabs ul.tabs li a{
	display:inline-block;padding:10px 18px;border:2px solid var(--ink);border-bottom:none;
	color:var(--ink);text-decoration:none;font-family:'Anton',sans-serif;font-size:15px;background:#fff;
}
.woocommerce-tabs ul.tabs li.active a{background:var(--red);color:var(--ink)}
.woocommerce-tabs .panel{border:2px solid var(--ink);padding:26px;background:var(--paper);color:var(--ink);font-size:18px}
.woocommerce-tabs .panel h2{font-family:'Anton',sans-serif;font-weight:400;color:var(--ink);margin-top:0}

.related.products{grid-column:1/-1;margin-top:56px}
.related.products > h2{font-family:'Anton',sans-serif;font-size:clamp(1.6rem,4vw,2.2rem);color:var(--paper);margin-bottom:24px}
.related.products ul.products{list-style:none;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
@media (max-width:860px){.related.products ul.products{grid-template-columns:1fr 1fr}}

/* ==================================================================
   Cart, checkout and account pages: one solid card, dark text, white fields.
   (These pages are drawn by page.php, which adds .store-card.)
   ================================================================ */
.store-card{background:var(--paper);color:var(--ink);border:3px solid var(--ink);box-shadow:9px 9px 0 var(--ink);padding:32px 28px;font-size:18px}
.entry.store-card{max-width:none}
.store-card h2,.store-card h3{font-family:'Anton',sans-serif;font-weight:400;color:var(--ink);line-height:1.05;margin:0 0 16px}
.store-card a{color:var(--red-deep);font-weight:700}
.store-card label{font-weight:700;color:var(--ink)}
.store-card abbr.required{color:var(--red-deep);text-decoration:none}
.store-card .form-row{margin-bottom:16px}
.store-card table.shop_table{width:100%;border-collapse:collapse;margin-bottom:24px;border:0}
.store-card table.shop_table th{font-family:'Anton',sans-serif;font-weight:400;text-align:left;padding:12px 10px;border-bottom:3px solid var(--ink)}
.store-card table.shop_table td{padding:14px 10px;border-bottom:1px solid #c9c4b3;vertical-align:middle}
.store-card table.shop_table img{width:72px;height:auto;border:2px solid var(--ink);background:#fff}
.store-card .product-name a{color:var(--ink);text-decoration:none}
.store-card .product-remove a.remove{color:var(--red-deep) !important;font-weight:700}
.store-card .checkout-button,.store-card #place_order{display:block;width:100%;float:none !important;text-align:center;font-size:20px;padding:18px 24px}
.store-card #payment{background:#fff;border:2px solid var(--ink);border-radius:0}
.store-card #payment ul.payment_methods{border-bottom:2px solid var(--ink);padding:16px}
.store-card #payment div.payment_box{background:var(--paper);color:var(--ink);border-radius:0}
.store-card #payment div.payment_box::before{display:none}
.store-card #payment div.form-row{padding:16px}
.store-card .woocommerce-thankyou-order-received{font-family:'Anton',sans-serif;font-size:24px;background:var(--yellow);color:var(--ink);border:3px solid var(--ink);padding:16px 20px;margin-bottom:24px}
.store-card .woocommerce-MyAccount-navigation ul{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:10px;margin:0 0 28px}
.store-card .woocommerce-MyAccount-navigation a{display:inline-block;padding:10px 16px;border:2px solid var(--ink);background:#fff;color:var(--ink);text-decoration:none;font-family:'Anton',sans-serif;font-weight:400;font-size:15px}
.store-card .woocommerce-MyAccount-navigation .is-active a{background:var(--red)}
/* Cart and checkout blocks (newer WooCommerce versions use these instead of the classic forms) */
.store-card .wc-block-components-product-name{color:var(--ink);font-weight:700;text-decoration:none}
.store-card .wc-block-cart__submit-button,.store-card .wc-block-components-checkout-place-order-button{width:100%;font-size:20px;padding:18px 24px}
.store-card .wc-block-components-title,.store-card .wc-block-components-checkout-step__title{font-family:'Anton',sans-serif;font-weight:400;color:var(--ink)}
.store-card .wc-block-components-order-summary,.store-card .wc-block-components-totals-wrapper{color:var(--ink)}

/* Cart > Checkout > Done progress bar */
.store-steps{display:flex;flex-wrap:wrap;list-style:none;margin:0 0 28px;padding:0}
.store-steps li{flex:1 1 0;min-width:110px;background:#fff;color:#5a564b;border:2px solid var(--ink);padding:10px 14px;font-family:'Anton',sans-serif;font-size:16px;text-align:center}
.store-steps li + li{margin-left:-2px}
.store-steps li.is-done{background:var(--yellow);color:var(--ink)}
.store-steps li.is-current{background:var(--red);color:var(--ink)}

/* Header cart link (all pages) */
.aud-cart-link{display:inline-flex;align-items:center;gap:8px;font-family:'Anton',sans-serif;font-size:15px;color:var(--paper);text-decoration:none;border:2px solid var(--paper);padding:6px 12px}
.aud-cart-link:hover{border-color:var(--red);color:var(--red)}
.aud-cart-link:focus-visible{outline:3px solid var(--red);outline-offset:3px}
.aud-cart-count{background:var(--red);color:var(--ink);min-width:22px;padding:1px 6px;text-align:center;font-size:14px}
@media (max-width:760px){.aud-cart-link{order:2;margin-left:auto;margin-right:10px}.nav-toggle{order:3}}

/* ==================================================================
   STORE CLEAN-UP: solid, readable, no texture and nothing see-through.
   body.aud-store is added by functions.php on the shop, product, cart,
   checkout and account pages. The homepage keeps its textures.
   ================================================================ */
body.aud-store{background-color:var(--bg);background-image:none}
body.aud-store .crumple-overlay{display:none}
body.aud-store header.site-nav{background-color:var(--bg);background-image:none;-webkit-backdrop-filter:none;backdrop-filter:none}
body.aud-store footer{background-color:var(--ink);background-image:none}
body.aud-store .torn{background-color:var(--bg-alt);background-image:none}
body.aud-cart .community,body.aud-checkout .community{display:none}

/* Product images always at full strength (the zoom layer is left alone) */
body.aud-store .woocommerce-product-gallery{opacity:1 !important}
body.aud-store .woocommerce-product-gallery img:not(.zoomImg),
body.aud-store .flex-control-thumbs img,
body.aud-store li.merch-item img,
body.aud-store .store-card img,
body.aud-store .wc-block-components-product-image img{opacity:1 !important}
body.aud-store .flex-control-thumbs img.flex-active{border-color:var(--red)}

/* Keep WooCommerce's float layout from fighting the grid */
body.aud-store ul.products::before,body.aud-store ul.products::after{display:none !important;content:none !important}
body.aud-store ul.products li.merch-item{float:none !important;width:auto !important;margin:0 !important;clear:none !important;min-width:0}
/* Every product list (shop, categories, related products) is a 3, 2 or 1 column grid */
body.aud-store ul.products{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
@media (max-width:900px){body.aud-store ul.products{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){body.aud-store ul.products{grid-template-columns:1fr}}

/* Dropdowns and fields: white box, dark bold text */
body.aud-store select,
body.aud-store input[type="text"],body.aud-store input[type="email"],body.aud-store input[type="tel"],
body.aud-store input[type="password"],body.aud-store input[type="number"],body.aud-store input[type="search"],
body.aud-store input[type="url"],body.aud-store textarea{
	background-color:#fff !important;color:var(--ink) !important;border:2px solid var(--ink) !important;
	border-radius:0 !important;font-family:'Barlow Condensed',sans-serif;font-size:18px;font-weight:600;
}
body.aud-store select{padding:10px 36px 10px 12px;min-height:46px}
body.aud-store input[type="text"],body.aud-store input[type="email"],body.aud-store input[type="tel"],
body.aud-store input[type="password"],body.aud-store input[type="search"],body.aud-store input[type="url"],
body.aud-store textarea{padding:11px 14px}
body.aud-store select option{background:#fff;color:var(--ink)}
body.aud-store ::placeholder{color:#6b675b;opacity:1}
body.aud-store select:focus-visible,body.aud-store input:focus-visible,body.aud-store textarea:focus-visible{outline:3px solid var(--red);outline-offset:2px}
/* Country and state pickers on the classic checkout */
body.aud-store .select2-container--default .select2-selection--single{background:#fff;border:2px solid var(--ink);border-radius:0;height:auto;min-height:46px}
body.aud-store .select2-container--default .select2-selection--single .select2-selection__rendered{color:var(--ink);font-weight:600;font-size:18px;line-height:42px;padding-left:12px}
body.aud-store .select2-container--default .select2-selection--single .select2-selection__arrow{height:42px}
body.aud-store .select2-dropdown{background:#fff;border:2px solid var(--ink);border-radius:0}
body.aud-store .select2-results__option{color:var(--ink);font-size:17px;padding:10px 12px}
body.aud-store .select2-container--default .select2-results__option[aria-selected="true"],
body.aud-store .select2-container--default .select2-results__option[data-selected="true"]{background:var(--yellow);color:var(--ink)}
body.aud-store .select2-container--default .select2-results__option--highlighted[aria-selected],
body.aud-store .select2-container--default .select2-results__option--highlighted[data-selected]{background:var(--red);color:var(--ink)}
body.aud-store .select2-search--dropdown .select2-search__field{background:#fff !important;color:var(--ink) !important;border:2px solid var(--ink) !important}
/* Same treatment for the block-based checkout fields */
body.aud-store .wc-block-components-text-input input,
body.aud-store .wc-block-components-textarea,
body.aud-store .wc-block-components-select select,
body.aud-store .wc-blocks-components-select__select,
body.aud-store .wc-block-components-combobox input{background:#fff !important;color:var(--ink) !important}
body.aud-store .wc-block-components-text-input label,
body.aud-store .wc-blocks-components-select__label{color:#4a473e !important}
body.aud-store .components-form-token-field__suggestion{color:var(--ink)}

/* Buttons: solid red, dark text, never faded */
body.aud-store a.button,body.aud-store button.button,body.aud-store input.button,
body.aud-store #place_order,body.aud-store .checkout-button,body.aud-store .single_add_to_cart_button,
body.aud-store .wc-block-components-button:not(.is-link){
	font-family:'Anton',sans-serif !important;font-weight:400 !important;font-size:16px;letter-spacing:.01em;
	background:var(--red) !important;color:var(--ink) !important;border:3px solid var(--ink) !important;border-radius:0 !important;
	box-shadow:5px 5px 0 var(--ink);padding:13px 24px;line-height:1.2;text-decoration:none;cursor:pointer;opacity:1 !important;
}
body.aud-store a.button:hover,body.aud-store button.button:hover,body.aud-store #place_order:hover,
body.aud-store .checkout-button:hover,body.aud-store .single_add_to_cart_button:hover{transform:translate(2px,2px);box-shadow:3px 3px 0 var(--ink)}
body.aud-store a.button:focus-visible,body.aud-store button:focus-visible,body.aud-store #place_order:focus-visible{outline:3px solid var(--ink);outline-offset:3px}
body.aud-store li.merch-item a.button{padding:10px 18px;font-size:15px;box-shadow:4px 4px 0 var(--ink)}
body.aud-store .button:disabled,body.aud-store .button[disabled],body.aud-store .button.disabled,
body.aud-store .single_add_to_cart_button.disabled{background:#cfcabb !important;color:#5a564b !important;box-shadow:none;cursor:not-allowed;transform:none}

/* Tabs: remove WooCommerce's rounded, faded default decoration */
body.aud-store .woocommerce-tabs ul.tabs::before,
body.aud-store .woocommerce-tabs ul.tabs li::before,
body.aud-store .woocommerce-tabs ul.tabs li::after{display:none !important}
body.aud-store .woocommerce-tabs ul.tabs li{background:none !important;border:0 !important;border-radius:0 !important}
body.aud-store .summary a:not(.button),body.aud-store .woocommerce-tabs .panel a{color:var(--red-deep);font-weight:700}
body.aud-store a.reset_variations{display:inline-block;margin-top:8px}

/* Product cards: centered name, price and button */
li.merch-item{text-align:center}
li.merch-item .merch-add{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:10px}
li.merch-item .merch-add a.added_to_cart{margin:0}

/* Footer legal links */
.legal-links{display:flex;flex-wrap:wrap;gap:20px;margin:16px 0 0;font-size:14px}
.legal-links a{color:#cfccbf;text-decoration:underline}
.legal-links a:hover,.legal-links a:focus-visible{color:var(--red)}

/* ==================================================================
   Motion (v1.2). Everything here is transform-based, so the page is
   fully visible before anything moves, and all of it switches off for
   visitors who ask their device for reduced motion.
   ================================================================ */

/* ---- Hero: load sequence ---- */
.hero-title .ln { display: block; animation: aud-kick-in .5s cubic-bezier(.3,1.4,.5,1) both; }
.hero-title .ln:nth-child(1) { animation-delay: .25s; }
.hero-title .ln:nth-child(2) { animation-delay: .35s; }
.hero-title .ln:nth-child(3) { animation-delay: .45s; }
.hero .eyebrow-tag { animation: aud-slap-l .45s cubic-bezier(.3,1.4,.5,1) .12s both; }
.hero .lede { animation: aud-rise-in .5s ease .6s both; }
.hero .hero-ctas { animation: aud-rise-in .5s ease .7s both; }
.hero-logo-wrap img { animation: aud-drop .85s cubic-bezier(.2,.9,.3,1) .1s both, aud-bob 5s ease-in-out 1.3s infinite; }
.hero .sticker.s1 { animation: aud-slap-r .5s cubic-bezier(.3,1.4,.5,1) .8s both; }
.hero .sticker.s2 { animation: aud-slap-l .5s cubic-bezier(.3,1.4,.5,1) .95s both; }
.hero .sticker:hover { animation: aud-jolt .3s linear; }
.hero::before { animation: aud-dots 40s linear infinite; }

/* ---- Ticker under the hero ---- */
.aud-ticker-clip { overflow: hidden; padding-block: 14px 18px; }
.aud-ticker { background: var(--red); color: var(--ink); border-block: 3px solid var(--ink); transform: rotate(-1.2deg); margin-inline: -20px; overflow: hidden; white-space: nowrap; }
.aud-ticker-track { display: inline-flex; animation: aud-ticker 30s linear infinite; }
.aud-ticker:hover .aud-ticker-track { animation-play-state: paused; }
.aud-ticker span { font-family: 'Anton', sans-serif; font-size: clamp(18px, 2.6vw, 26px); letter-spacing: .03em; text-transform: uppercase; white-space: nowrap; padding: 8px 0.5em 8px 0; }

/* ---- Scroll reveals (classes added by theme.js once, then removed) ---- */
.aud-stamp { animation: aud-stamp-k .5s cubic-bezier(.3,1.6,.5,1) both; transform-origin: left center; }
.aud-write { animation: aud-write-k .7s steps(18) both; }
.aud-deal { animation: aud-deal-k .6s cubic-bezier(.3,1.3,.5,1) calc(var(--aud-i, 0) * 90ms) both; }
.aud-pin { animation: aud-pin-k .55s cubic-bezier(.3,1.4,.5,1) calc(var(--aud-i, 0) * 110ms) both; }
.aud-rise { animation: aud-rise-in .5s ease calc(var(--aud-i, 0) * 90ms) both; }
.aud-slap { animation: aud-slap-k .6s cubic-bezier(.3,1.4,.5,1) both; }
.aud-kick { animation: aud-kick-k .6s ease both; }

/* ---- Hover ---- */
#discover .card-band { transform-origin: 50% 0; }
#discover .card-band:hover { animation: aud-swing .9s ease-out; }
#gear .ticket { transition: translate .2s ease, box-shadow .2s ease; }
#gear .ticket:hover { translate: 0 -6px; box-shadow: 8px 8px 0 var(--red); }
#gear .ticket a.shop { display: inline-block; transition: translate .2s ease; }
#gear .ticket:hover a.shop { translate: 4px 0; }
#merch .merch-item { transition: translate .2s ease, rotate .2s ease; }
#merch .merch-item:hover { translate: 0 -6px; rotate: -1.2deg; }
.btn:hover { animation: aud-jolt .3s linear; }

/* ---- Header: shrinks once you scroll, with a progress bar ---- */
header.site-nav { transition: box-shadow .25s ease; }
header.site-nav .nav-row { transition: padding .25s ease; }
header.site-nav img.nav-mark { transition: height .25s ease; }
header.site-nav.is-scrolled { box-shadow: 0 6px 0 rgba(0, 0, 0, .35); }
header.site-nav.is-scrolled .nav-row { padding-block: 6px; }
header.site-nav.is-scrolled img.nav-mark { height: 32px; }
.aud-progress { position: absolute; left: 0; right: 0; bottom: -2px; height: 2px; background: var(--yellow); transform-origin: left; transform: scaleX(0); pointer-events: none; }

/* ---- Keyframes ---- */
@keyframes aud-drop { 0% { translate: 0 -48px; scale: 1.16; } 55% { translate: 0 8px; scale: .96; } 78% { translate: 0 -3px; scale: 1.01; } 100% { translate: 0 0; scale: 1; } }
@keyframes aud-bob { 0%, 100% { translate: 0 0; } 50% { translate: 0 -7px; } }
@keyframes aud-slap-r { 0% { translate: 90px -30px; rotate: 28deg; scale: 1.5; } 70% { scale: .94; } 100% { translate: 0 0; rotate: 0deg; scale: 1; } }
@keyframes aud-slap-l { 0% { translate: -90px 30px; rotate: -28deg; scale: 1.5; } 70% { scale: .94; } 100% { translate: 0 0; rotate: 0deg; scale: 1; } }
@keyframes aud-kick-in { 0% { translate: -46px 0; rotate: -4deg; } 70% { translate: 4px 0; } 100% { translate: 0 0; rotate: 0deg; } }
@keyframes aud-rise-in { 0% { translate: 0 18px; } 100% { translate: 0 0; } }
@keyframes aud-dots { to { background-position: 160px 80px; } }
@keyframes aud-ticker { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@keyframes aud-stamp-k { 0% { scale: 1.28; } 60% { scale: .96; } 100% { scale: 1; } }
@keyframes aud-write-k { from { clip-path: inset(0 100% 0 0); } to { clip-path: inset(0 0 0 0); } }
@keyframes aud-deal-k { 0% { translate: 0 46px; rotate: 5deg; } 70% { translate: 0 -4px; } 100% { translate: 0 0; rotate: 0deg; } }
@keyframes aud-pin-k { 0% { translate: 0 -36px; scale: 1.08; } 65% { translate: 0 4px; scale: .98; } 100% { translate: 0 0; scale: 1; } }
@keyframes aud-slap-k { 0% { scale: 1.12; rotate: 3deg; } 65% { scale: .98; rotate: -.5deg; } 100% { scale: 1; rotate: 0deg; } }
@keyframes aud-kick-k { 0% { scale: .9; } 40% { scale: 1.06; } 70% { scale: .98; } 100% { scale: 1; } }
@keyframes aud-swing { 0% { rotate: 0deg; } 20% { rotate: 4deg; } 45% { rotate: -3deg; } 70% { rotate: 1.5deg; } 100% { rotate: 0deg; } }
@keyframes aud-jolt { 0%, 100% { translate: 0 0; } 25% { translate: -2px 1px; } 50% { translate: 2px -1px; } 75% { translate: -1px 1px; } }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition-duration: 0s !important; }
  .aud-ticker-track { transform: none !important; }
}

/* The Green Room newsletter (from the Amped Up Dad Green Room plugin), placed under the gear guide */
.green-room-slot { padding-block: clamp(56px, 7vw, 96px); }

/* Follower count section: if no count can show, the copy and button stand on their own */
.proof-grid--solo { grid-template-columns: 1fr; max-width: 760px; }

/* ==================================================================
   Blog / affiliate articles (v1.3)
   The listing page, category pages, search, and single articles.
   ================================================================ */

/* Header: five links fit on mid-size screens */
nav.links a[aria-current="page"] { color: var(--red); }
@media (min-width: 761px) and (max-width: 1080px) {
  nav.links { gap: 18px; font-size: 16px; }
  .nav-cta { padding: 8px 12px; }
}

/* ---- Listing page header ---- */
.blog-hero { position: relative; padding: 72px 0 44px; overflow: hidden; }
.blog-hero::before {
  content: ""; position: absolute; inset: 0;
  background-image: radial-gradient(var(--line) 1.2px, transparent 1.6px);
  background-size: 16px 16px; opacity: .35; pointer-events: none;
}
.blog-hero .wrap { position: relative; }
.blog-hero .kicker,
.article-hero .kicker { font-family: 'Permanent Marker', cursive; color: var(--yellow); font-size: 17px; display: block; margin-bottom: 8px; transform: rotate(-1deg); }
.blog-hero h1 { font-size: clamp(2.8rem, 8vw, 5.4rem); color: var(--paper); max-width: 16ch; text-shadow: 5px 5px 0 var(--red-deep); }
.blog-intro { font-size: 20px; color: #cfccbf; max-width: 56ch; margin: 20px 0 0; }
.blog-back { display: inline-block; margin-bottom: 18px; font-size: 15px; letter-spacing: .06em; text-transform: uppercase; color: #b9b6a9; text-decoration: none; }
.blog-back:hover, .blog-back:focus-visible { color: var(--red); }

.post-chips { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 30px; }
.post-chips a {
  font-family: 'Anton', sans-serif; font-size: 15px; letter-spacing: .03em; text-transform: uppercase;
  color: var(--paper); text-decoration: none; border: 2px solid var(--paper); padding: 6px 14px;
  transition: translate .15s ease, background-color .15s ease, color .15s ease;
}
.post-chips a:hover { border-color: var(--red); color: var(--red); translate: 0 -2px; }
.post-chips a[aria-current="page"] { background: var(--red); border-color: var(--ink); color: var(--ink); box-shadow: 4px 4px 0 var(--ink); }
.post-chips a:focus-visible { outline: 3px solid var(--red); outline-offset: 3px; }

.blog-list { padding: 20px 0 104px; }
.blog-more-head { margin: 76px 0 34px; }

/* ---- Article cards (paper, hard shadow, same family as the corkboard cards) ---- */
.post-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 30px; }
@media (max-width: 960px) { .post-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 620px) { .post-grid { grid-template-columns: 1fr; } }

.post-card {
  position: relative; display: flex; flex-direction: column;
  background: var(--paper); color: var(--ink);
  border: 2px solid var(--ink); box-shadow: 7px 7px 0 #000;
  transition: translate .2s ease, box-shadow .2s ease;
}
.post-grid .post-card:nth-child(odd) { rotate: -.7deg; }
.post-grid .post-card:nth-child(even) { rotate: .6deg; }
.post-card:hover, .post-card:focus-within { translate: 0 -6px; box-shadow: 9px 9px 0 var(--red); }
.post-card-img { display: block; aspect-ratio: 16 / 10; overflow: hidden; border-bottom: 2px solid var(--ink); background: var(--bg-alt); }
.post-card-img img { width: 100%; height: 100%; object-fit: cover; transition: scale .35s ease; }
.post-card:hover .post-card-img img { scale: 1.04; }
.post-card-img.is-blank {
  display: flex; align-items: center; justify-content: center;
  background-color: var(--ink); background-image: var(--grip); background-size: 120px 120px; background-blend-mode: overlay;
}
.post-card-img.is-blank img { width: 52%; height: auto; object-fit: contain; rotate: -4deg; filter: drop-shadow(5px 5px 0 var(--red-deep)); }
.post-card:hover .post-card-img.is-blank img { scale: 1.06; }
.post-card-body { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; padding: 18px 20px 20px; flex: 1; }
.post-tag {
  display: inline-block; font-family: 'Anton', sans-serif; font-size: 13px; letter-spacing: .05em; text-transform: uppercase;
  background: var(--red); color: var(--ink); padding: 3px 9px; border: 2px solid var(--ink); rotate: -2deg;
}
.post-card-title { font-size: 25px; line-height: 1.04; }
.post-card-title a { color: var(--ink); text-decoration: none; }
.post-card-title a::after { content: ""; position: absolute; inset: 0; z-index: 1; } /* whole card is clickable */
.post-card-title a:focus-visible { outline: none; }
.post-card:focus-within { outline: 3px solid var(--red); outline-offset: 4px; }
.post-card-excerpt { margin: 0; font-size: 17px; line-height: 1.4; color: #3d3a32; }
.post-meta { margin: auto 0 0; padding-top: 6px; font-size: 14px; letter-spacing: .06em; text-transform: uppercase; color: #6b675b; display: flex; flex-wrap: wrap; gap: 6px; }

/* Featured (newest) article on the blog page */
.post-card--feature { display: grid; grid-template-columns: 1.25fr 1fr; box-shadow: 10px 10px 0 var(--red-deep); }
.post-card--feature:hover, .post-card--feature:focus-within { box-shadow: 12px 12px 0 var(--red); }
.post-card--feature .post-card-img { position: relative; aspect-ratio: auto; min-height: 340px; border-bottom: 0; border-right: 2px solid var(--ink); }
.post-card--feature .post-card-img img { position: absolute; inset: 0; }
.post-card--feature .post-card-img.is-blank img { position: static; width: 46%; }
.post-card--feature .post-card-body { padding: 34px 32px 32px; gap: 14px; justify-content: center; }
.post-card--feature .post-card-title { font-size: clamp(2rem, 3.4vw, 2.9rem); }
.post-card--feature .post-card-excerpt { font-size: 19px; }
.post-card--feature .post-meta { margin: 0; }
.post-card--feature .btn { position: relative; z-index: 2; margin-top: 8px; }
.post-card-stamp {
  position: absolute; top: 16px; left: 16px; z-index: 1;
  font-family: 'Permanent Marker', cursive; font-size: 16px; color: var(--red-deep);
  background: var(--paper); border: 3px solid var(--red-deep); padding: 4px 12px; rotate: -7deg;
}
@media (max-width: 820px) {
  .post-card--feature { grid-template-columns: 1fr; }
  .post-card--feature .post-card-img { min-height: 0; aspect-ratio: 16 / 10; border-right: 0; border-bottom: 2px solid var(--ink); }
  .post-card--feature .post-card-body { padding: 22px 20px 24px; }
}

/* Pagination */
.aud-pagination { margin-top: 56px; }
.aud-pagination .nav-links, nav.page-links { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.aud-pagination .page-numbers, nav.page-links .post-page-numbers {
  font-family: 'Anton', sans-serif; font-size: 16px; text-decoration: none; color: var(--paper);
  border: 2px solid var(--paper); padding: 8px 14px; min-width: 44px; text-align: center;
}
.aud-pagination a.page-numbers:hover { border-color: var(--red); color: var(--red); }
.aud-pagination .page-numbers.current, nav.page-links .post-page-numbers.current { background: var(--red); color: var(--ink); border-color: var(--ink); box-shadow: 4px 4px 0 var(--ink); }
.aud-pagination .page-numbers.dots { border-color: transparent; }

/* Empty state */
.blog-empty {
  max-width: 640px; background: var(--paper); color: var(--ink); padding: 34px 30px;
  border: 2px solid var(--ink); box-shadow: 9px 9px 0 #000; rotate: -.8deg;
}
.blog-empty h2 { font-size: clamp(1.7rem, 4vw, 2.3rem); margin-bottom: 12px; }
.blog-empty p { color: #3d3a32; margin: 0 0 18px; }
.blog-empty .admin-hint { color: var(--red-deep); border-color: var(--red-deep); margin: 0; }

/* ---- Single article ---- */
.article-main { padding-bottom: 0; }
.article-hero { position: relative; padding: 64px 0 0; }
.article-hero::before {
  content: ""; position: absolute; inset: 0 0 auto 0; height: 100%;
  background-image: radial-gradient(var(--line) 1.2px, transparent 1.6px);
  background-size: 16px 16px; opacity: .3; pointer-events: none;
}
.article-hero .wrap { position: relative; }
.article-hero-inner { max-width: 868px; }
.article-crumbs { margin: 0 0 18px; display: flex; flex-wrap: wrap; gap: 8px; font-size: 15px; letter-spacing: .06em; text-transform: uppercase; color: #7a776b; }
.article-crumbs a { color: #b9b6a9; text-decoration: none; }
.article-crumbs a:hover, .article-crumbs a:focus-visible { color: var(--red); }
.article-hero .eyebrow-tag {
  display: inline-block; background: var(--red); color: var(--ink); font-family: 'Anton', sans-serif;
  font-size: 14px; letter-spacing: .04em; text-transform: uppercase; padding: 4px 10px; transform: rotate(-2deg); margin-bottom: 18px;
}
.article-title { font-size: clamp(2.4rem, 6.4vw, 4.6rem); color: var(--paper); line-height: .98; text-shadow: 5px 5px 0 var(--red-deep); }
.article-dek { font-size: 21px; color: #cfccbf; max-width: 58ch; margin: 22px 0 0; }
.article-meta { color: #a29f92; margin-top: 22px; padding-top: 0; }
.article-cover { margin: 40px 0 0; border: 3px solid var(--ink); box-shadow: 10px 10px 0 var(--red-deep); rotate: -.5deg; background: var(--ink); }
.article-cover img { width: 100%; height: auto; aspect-ratio: 2 / 1; object-fit: cover; }
.article-cover figcaption { font-size: 14px; color: #a29f92; padding: 8px 12px; background: var(--ink); }

/* The paper sheet the article sits on. It sits above the crease overlay so text stays crisp. */
.article-sheet {
  position: relative; z-index: 401; max-width: 868px; margin: 48px 0 0;
  background: var(--paper); color: #1d1b17;
  padding: clamp(26px, 5vw, 60px) clamp(20px, 5.5vw, 64px) clamp(30px, 5vw, 56px);
  border: 2px solid var(--ink); box-shadow: 10px 10px 0 #000;
}
.article-sheet::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background-image: var(--crumple); background-size: 620px 620px; mix-blend-mode: multiply; opacity: .1;
}
.article-sheet::after { /* tape strip */
  content: ""; position: absolute; top: -16px; left: 50%; width: 132px; height: 32px; translate: -50% 0; rotate: -3deg;
  background: rgba(216, 189, 106, .78); border-inline: 2px dashed rgba(5, 5, 5, .18);
}
.article-sheet > * { position: relative; }

.aff-notice {
  display: flex; gap: 14px; align-items: flex-start; margin: 0 0 34px; padding: 14px 18px;
  background: #f6e7b0; border: 2px dashed var(--ink); font-size: 16px; line-height: 1.45; color: #2a2721;
}
.aff-notice p { margin: 0; }
.aff-notice-tag { flex: none; font-family: 'Anton', sans-serif; font-size: 13px; letter-spacing: .05em; text-transform: uppercase; background: var(--ink); color: var(--yellow); padding: 3px 8px; margin-top: 2px; }
@media (max-width: 520px) { .aff-notice { flex-direction: column; gap: 8px; } }

/* Article typography (ink on paper) */
.article-body { max-width: none; font-size: 20px; line-height: 1.62; font-weight: 500; }
.article-body > *:first-child { margin-top: 0; }
.article-body p { margin: 0 0 1.1em; }
.article-body h2, .article-body h3, .article-body h4 { color: var(--ink); line-height: 1.05; }
.article-body h2 { font-size: clamp(1.75rem, 3.4vw, 2.35rem); margin: 1.7em 0 .55em; padding-left: 14px; border-left: 7px solid var(--red); }
.article-body h3 { font-size: clamp(1.4rem, 2.6vw, 1.7rem); margin: 1.5em 0 .5em; }
.article-body h4 { font-family: 'Anton', sans-serif; font-weight: 400; font-size: 1.2rem; letter-spacing: .02em; margin: 1.3em 0 .4em; }
.article-body a { color: var(--red-deep); font-weight: 700; text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 3px; }
.article-body a:hover { background: var(--yellow); color: var(--ink); }
.article-body a:focus-visible { outline: 3px solid var(--red); outline-offset: 2px; }
.article-body strong { color: var(--ink); }
.article-body ul, .article-body ol { margin: 0 0 1.2em; padding-left: 1.3em; }
.article-body li { margin-bottom: .35em; }
.article-body ul { list-style: none; padding-left: 1.4em; }
.article-body ul > li { position: relative; }
.article-body ul > li::before { content: "\2726"; position: absolute; left: -1.3em; top: .1em; color: var(--red); font-size: .7em; }
.article-body ol > li::marker { font-family: 'Anton', sans-serif; color: var(--red-deep); }
.article-body img { height: auto; border: 2px solid var(--ink); }
.article-body figure { margin: 1.6em 0; }
.article-body figcaption, .article-body .wp-element-caption { font-size: 15px; color: #5a564b; margin-top: 8px; text-align: left; }
.article-body .alignwide, .article-body .alignfull { max-width: 100%; }
.article-body .aligncenter { margin-inline: auto; }
.article-body blockquote, .article-body .wp-block-quote {
  margin: 1.6em 0; padding: 18px 22px; background: #e7e1cf; border-left: 7px solid var(--ink);
  font-size: 1.1em; font-weight: 600;
}
.article-body blockquote p:last-of-type { margin-bottom: 0; }
.article-body blockquote cite { display: block; margin-top: 10px; font-size: 15px; font-style: normal; text-transform: uppercase; letter-spacing: .06em; color: #5a564b; }
.article-body .wp-block-pullquote { border-block: 5px solid var(--ink); padding: 26px 8px; margin: 1.8em 0; text-align: center; }
.article-body .wp-block-pullquote blockquote { background: none; border: 0; padding: 0; margin: 0; font-family: 'Anton', sans-serif; font-weight: 400; font-size: clamp(1.5rem, 3.4vw, 2.1rem); line-height: 1.1; }
.article-body hr, .article-body .wp-block-separator { border: 0; height: 4px; margin: 2.2em auto; background: repeating-linear-gradient(90deg, var(--ink) 0 14px, transparent 14px 22px); opacity: 1; }
.article-body code { font-size: .88em; background: #e2dccb; padding: 1px 5px; }
.article-body pre { background: var(--ink); color: var(--paper); padding: 16px 18px; overflow-x: auto; font-size: 15px; }
.article-body pre code { background: none; padding: 0; }
.article-body iframe, .article-body .wp-block-embed { max-width: 100%; }
.article-body .wp-block-embed { margin: 1.6em 0; }

/* Tables (also the "Top picks table" pattern) */
.article-body .wp-block-table { overflow-x: auto; margin: 1.8em 0; }
.article-body table { width: 100%; border-collapse: collapse; font-size: 17px; background: #fff; border: 2px solid var(--ink); }
.article-body th { background: var(--ink); color: var(--paper); font-family: 'Anton', sans-serif; font-weight: 400; letter-spacing: .03em; text-align: left; padding: 10px 14px; }
.article-body td { padding: 10px 14px; border-top: 1px solid #cfc9b6; vertical-align: top; }
.article-body tbody tr:nth-child(even) td { background: #f7f4ea; }
.article-body .aud-picks-table td:first-child { font-family: 'Anton', sans-serif; font-size: 15px; letter-spacing: .03em; text-transform: uppercase; color: var(--red-deep); white-space: nowrap; }
.article-body .aud-picks-table td:nth-child(2) { font-weight: 700; color: var(--ink); }

/* Buttons inside articles (core Button block, the affiliate button pattern) */
.article-body .wp-block-buttons { margin: 1.4em 0; gap: 14px; }
.article-body .wp-block-button__link,
.article-body .wp-block-file__button {
  font-family: 'Anton', sans-serif; font-size: 17px; letter-spacing: .03em; font-weight: 400; text-decoration: none;
  background: var(--red); color: var(--ink); border: 3px solid var(--ink); border-radius: 0;
  padding: 14px 26px; box-shadow: 6px 6px 0 var(--ink); transition: translate .15s ease, box-shadow .15s ease;
}
.article-body .wp-block-button__link:hover { background: var(--red); color: var(--ink); translate: 2px 2px; box-shadow: 4px 4px 0 var(--ink); }
.article-body .wp-block-button__link:focus-visible { outline: 3px solid var(--ink); outline-offset: 4px; }
.article-body .is-style-outline .wp-block-button__link { background: transparent; color: var(--ink); }
.article-body .aud-buy .wp-block-button__link::after { content: " \2192"; }

/* Pattern: Gear pick card */
.article-body .aud-pick {
  position: relative; margin: 2.4em 0 2em; padding: 34px 28px 26px;
  background: #fff; border: 3px solid var(--ink); box-shadow: 8px 8px 0 var(--ink);
}
.article-body .aud-pick > * { margin-block: 0 14px; }
.article-body .aud-pick > *:last-child { margin-bottom: 0; }
.article-body .aud-pick .aud-pick-badge {
  position: absolute; top: -17px; left: 22px; margin: 0;
  font-family: 'Anton', sans-serif; font-size: 15px; letter-spacing: .04em; text-transform: uppercase;
  background: var(--red); color: var(--ink); border: 2px solid var(--ink); padding: 4px 12px; rotate: -2deg;
}
.article-body .aud-pick h3 { margin: 0 0 8px; font-size: clamp(1.5rem, 3vw, 1.9rem); }
.article-body .aud-pick-img img { border: 0; max-height: 300px; width: auto; margin-inline: auto; object-fit: contain; }
.article-body .aud-pick-list { border-top: 2px dashed var(--ink); padding-top: 14px; }
.article-body .aud-pick .wp-block-buttons { margin-bottom: 0; }

/* Pattern: Quick verdict */
.article-body .aud-verdict {
  margin: 2em 0; padding: 26px 26px 24px; color: var(--paper);
  background-color: var(--ink); background-image: var(--grip); background-size: 130px 130px; background-blend-mode: overlay;
  border: 3px solid var(--ink); box-shadow: 8px 8px 0 var(--red);
}
.article-body .aud-verdict > * { margin-block: 0 12px; }
.article-body .aud-verdict > *:last-child { margin-bottom: 0; }
.article-body .aud-verdict .aud-verdict-label { font-family: 'Permanent Marker', cursive; color: var(--yellow); font-size: 18px; rotate: -1deg; }
.article-body .aud-verdict h3 { color: var(--paper); font-size: clamp(1.5rem, 3vw, 2rem); }
.article-body .aud-verdict p, .article-body .aud-verdict strong { color: #e4e0d2; }
.article-body .aud-verdict a:not(.wp-block-button__link) { color: var(--yellow); }
.article-body .aud-verdict .wp-block-button__link { box-shadow: 6px 6px 0 #000; border-color: #000; }

/* Pattern: Pros and cons */
.article-body .aud-proscons { gap: 20px; margin: 1.8em 0; }
.article-body .aud-proscons > .wp-block-column { background: #fff; border: 2px solid var(--ink); padding: 18px 20px 8px; }
.article-body .aud-proscons .aud-pros { border-top: 8px solid var(--yellow); }
.article-body .aud-proscons .aud-cons { border-top: 8px solid var(--red); }
.article-body .aud-proscons h4 { margin-top: 0; }
.article-body .aud-pros ul > li::before { content: "+"; font-family: 'Anton', sans-serif; font-size: 1em; top: 0; color: #8a6d12; }
.article-body .aud-cons ul > li::before { content: "\2212"; font-family: 'Anton', sans-serif; font-size: 1em; top: 0; color: var(--red-deep); }

/* Tags under the article */
.article-tags { display: flex; flex-wrap: wrap; gap: 10px; margin: 36px 0 0; padding-top: 22px; border-top: 2px dashed var(--ink); }
.article-tags a { font-size: 15px; font-weight: 700; color: var(--ink); text-decoration: none; border: 2px solid var(--ink); padding: 3px 10px; }
.article-tags a:hover { background: var(--ink); color: var(--paper); }

/* Comments (only if turned on for a post) */
.article-comments { max-width: 868px; margin: 56px 0 0; }
.article-comments h2, .article-comments h3 { font-size: clamp(1.5rem, 3vw, 2rem); margin-bottom: 18px; }
.article-comments ol, .article-comments ul { list-style: none; padding: 0; }
.article-comments .comment-body { border: 2px solid var(--line); padding: 16px 18px; margin-bottom: 14px; background: var(--bg-alt); }
.article-comments .comment-meta { font-size: 14px; color: #a29f92; }
.article-comments .comment-meta a { color: inherit; text-decoration: none; }
.article-comments .children { margin-left: 24px; }
.article-comments label { display: block; font-family: 'Anton', sans-serif; font-size: 14px; margin-bottom: 6px; }
.article-comments input[type="text"], .article-comments input[type="email"], .article-comments input[type="url"], .article-comments textarea {
  width: 100%; padding: 12px 14px; font-family: 'Barlow Condensed', sans-serif; font-size: 17px; border: 2px solid var(--ink); background: #fff; color: var(--ink);
}
.article-comments input:focus-visible, .article-comments textarea:focus-visible { outline: 3px solid var(--red); outline-offset: 2px; }
.article-comments .form-submit input[type="submit"] {
  font-family: 'Anton', sans-serif; font-size: 16px; background: var(--red); color: var(--ink); border: 3px solid var(--ink);
  padding: 12px 22px; box-shadow: 5px 5px 0 #000; cursor: pointer;
}
.article-comments .comment-form-cookies-consent label { display: inline; font-family: inherit; font-size: 15px; }

/* Center the article column on wide screens */
@media (min-width: 960px) {
  .article-hero-inner, .article-sheet, .article-comments { margin-inline: auto; }
  .article-cover { max-width: 1040px; margin-inline: auto; }
}

.related-articles .merch-more { margin-top: 40px; }

/* Load motion for the blog and article headers */
.blog-hero .kicker, .article-hero .kicker { animation: aud-write-k .7s steps(18) .1s both; }
.blog-hero h1, .article-title { animation: aud-kick-in .5s cubic-bezier(.3,1.4,.5,1) .15s both; }
.blog-intro, .article-dek, .article-meta { animation: aud-rise-in .5s ease .35s both; }
.post-chips { animation: aud-rise-in .5s ease .45s both; }
.article-hero .eyebrow-tag { animation: aud-slap-l .45s cubic-bezier(.3,1.4,.5,1) .05s both; }
.article-cover { animation: aud-rise-in .6s ease .4s both; }
@media (prefers-reduced-motion: reduce) {
  .post-card, .post-card-img img, .post-chips a { transition: none; }
}

/* 1.3.1: red category tag doubles as the "back to blog" link when it would repeat the breadcrumb. */
a.eyebrow-tag { text-decoration: none; }
a.eyebrow-tag:hover, a.eyebrow-tag:focus-visible { background: var(--paper); color: var(--ink); }

/* 1.3.3: smaller featured image on articles (about 60% of the old width), centered. */
html body .article-cover { max-width: 640px; margin-inline: auto; }
@media (max-width: 700px) { html body .article-cover { max-width: 100%; } }
