/* ============================================================
   Pressure Tested Co. — Bridge styles
   ------------------------------------------------------------
   Things theme.json can't express cleanly: industrial textures,
   sticky-header behavior, search overlay, marquee word, hover
   shines, product-card affordances.

   Conventions: every selector is scoped with .ptc-* so it does
   not collide with the parent theme or any installed plugins.
   ============================================================ */

/* ── Brand color shortcuts (mirrors theme.json palette) ────── */
:root {
  --ptc-linen:        #ede5d0;
  --ptc-linen-50:     #f6f1e2;
  --ptc-charcoal:     #1a1814;
  --ptc-charcoal-800: #26231d;
  --ptc-steel:        #5b6066;
  --ptc-rust:         #b8531f;
  --ptc-rust-400:     #cf6b34;
  --ptc-rust-600:     #a04617;
}

/* ── Page background (in case theme.json is partial) ───────── */
body.wp-site-blocks,
.editor-styles-wrapper {
  background: var(--ptc-linen);
}

/* ── Industrial textures ───────────────────────────────────── */
.ptc-tex-paper {
  background-image:
    radial-gradient(rgba(26, 24, 20, 0.05) 1px, transparent 1px),
    radial-gradient(rgba(26, 24, 20, 0.04) 1px, transparent 1px);
  background-size: 5px 5px, 11px 11px;
  background-position: 0 0, 2px 3px;
}
.ptc-tex-dark {
  background-image:
    radial-gradient(rgba(237, 229, 208, 0.04) 1px, transparent 1px),
    radial-gradient(rgba(237, 229, 208, 0.03) 1px, transparent 1px);
  background-size: 5px 5px, 13px 13px;
}
.ptc-tex-stripe {
  background-image: repeating-linear-gradient(
    135deg,
    rgba(26, 24, 20, 0.04) 0 6px,
    transparent 6px 14px
  );
}
.ptc-tex-stripe--dark {
  background-image: repeating-linear-gradient(
    135deg,
    rgba(237, 229, 208, 0.05) 0 6px,
    transparent 6px 14px
  );
}

/* ── Sticky header (used by parts/header.html) ─────────────── */
.ptc-header {
  position: sticky;
  top: 0;
  z-index: 40;
  background: rgba(237, 229, 208, 0.95);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border-bottom: 1px solid rgba(26, 24, 20, 0.15);
}
.ptc-announcement {
  font-family: var(--wp--preset--font-family--mono, monospace);
  font-size: 11px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
}
.ptc-headline-strip {
  position: relative;
  border-top: 1px solid rgba(237, 229, 208, 0.1);
  overflow: hidden;
}
.ptc-headline-strip h1,
.ptc-headline-strip h2 {
  margin: 0;
  line-height: 0.9;
  font-size: clamp(28px, 4.6vw, 64px);
  color: var(--ptc-linen);
  text-wrap: balance;
}
.ptc-headline-strip .ptc-rust { color: var(--ptc-rust-400); }

/* ── Eyebrows / spec strips ────────────────────────────────── */
.ptc-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  font-family: var(--wp--preset--font-family--mono, monospace);
  font-size: 11px;
  letter-spacing: 0.25em;
  text-transform: uppercase;
  color: var(--ptc-rust);
}
.ptc-eyebrow::before {
  content: "";
  display: inline-block;
  width: 32px;
  height: 1px;
  background: currentColor;
}
.ptc-eyebrow--linen,
.is-dark .ptc-eyebrow {
  color: var(--ptc-rust-400);
}

/* ── Buttons: shine sweep on hover ─────────────────────────── */
.ptc-shine {
  position: relative;
  overflow: hidden;
}
.ptc-shine::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    120deg,
    transparent 30%,
    rgba(255, 255, 255, 0.18) 50%,
    transparent 70%
  );
  transform: translateX(-100%);
  transition: transform 0.6s ease;
  pointer-events: none;
}
.ptc-shine:hover::after { transform: translateX(100%); }

/* ── Product card affordances (over woocommerce/product-template) ── */
.ptc-product-grid .wp-block-woocommerce-product-template > li {
  position: relative;
  background: var(--ptc-linen-50);
  border: 1px solid rgba(26, 24, 20, 0.12);
  padding: 0;
  transition: border-color 0.2s ease;
}
.ptc-product-grid .wp-block-woocommerce-product-template > li:hover {
  border-color: rgba(26, 24, 20, 0.45);
}
.ptc-product-grid .wp-block-woocommerce-product-template > li::before,
.ptc-product-grid .wp-block-woocommerce-product-template > li::after {
  content: "";
  position: absolute;
  width: 12px;
  height: 12px;
  border: 1px solid var(--ptc-charcoal);
  pointer-events: none;
}
.ptc-product-grid .wp-block-woocommerce-product-template > li::before {
  top: -1px; left: -1px;
  border-right: none; border-bottom: none;
}
.ptc-product-grid .wp-block-woocommerce-product-template > li::after {
  bottom: -1px; right: -1px;
  border-left: none; border-top: none;
}
.ptc-product-grid .wc-block-product-image { background: var(--ptc-linen-50); }
.ptc-product-grid .wc-block-components-product-name {
  font-family: var(--wp--preset--font-family--display, "Oswald", sans-serif);
  text-transform: uppercase;
  font-weight: 700;
  letter-spacing: 0.01em;
  font-size: 18px;
  line-height: 1.1;
}
.ptc-product-grid .wc-block-components-product-price {
  font-family: var(--wp--preset--font-family--display, "Oswald", sans-serif);
  font-size: 20px;
  font-weight: 600;
}

/* ── Trust badge row ───────────────────────────────────────── */
.ptc-trust {
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
}
.ptc-trust__row {
  display: flex;
  align-items: center;
  gap: 12px;
  border: 1px solid rgba(26, 24, 20, 0.15);
  background: var(--ptc-linen-50);
  padding: 12px 14px;
}
.ptc-trust__row svg { color: var(--ptc-rust); flex-shrink: 0; }
.ptc-trust__label {
  font-family: var(--wp--preset--font-family--mono, monospace);
  font-size: 11px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: rgba(26, 24, 20, 0.85);
}
.ptc-trust__no {
  margin-left: auto;
  font-family: var(--wp--preset--font-family--mono, monospace);
  font-size: 10px;
  letter-spacing: 0.2em;
  color: rgba(26, 24, 20, 0.4);
}

/* ── Trade tiles (Shop by Trade) ───────────────────────────── */
.ptc-tile {
  position: relative;
  border: 1px solid rgba(26, 24, 20, 0.15);
  background: var(--ptc-linen-50);
  padding: 24px;
  min-height: 200px;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  transition: border-color 0.2s ease;
}
.ptc-tile:hover { border-color: rgba(26, 24, 20, 0.6); }
.ptc-tile__tag,
.ptc-tile__no {
  position: absolute;
  top: 12px;
  font-family: var(--wp--preset--font-family--mono, monospace);
  font-size: 10px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: rgba(26, 24, 20, 0.45);
}
.ptc-tile__tag { left: 12px; }
.ptc-tile__no  { right: 12px; }
.ptc-tile__icon { color: var(--ptc-rust); margin: 28px 0 auto; }
.ptc-tile__label {
  font-family: var(--wp--preset--font-family--display, "Oswald", sans-serif);
  text-transform: uppercase;
  font-size: 28px;
  line-height: 0.95;
  letter-spacing: 0.02em;
  margin: 0;
}
.ptc-tile__copy {
  font-size: 13px;
  color: rgba(26, 24, 20, 0.7);
  margin: 6px 0 0;
  max-width: 28ch;
}
.ptc-tile__cta {
  margin-top: 20px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-family: var(--wp--preset--font-family--display, "Oswald", sans-serif);
  text-transform: uppercase;
  font-size: 12px;
  letter-spacing: 0.1em;
  color: var(--ptc-charcoal);
  text-decoration: none;
}
.ptc-tile:hover .ptc-tile__cta { color: var(--ptc-rust); }
.ptc-tile::after {
  content: "";
  position: absolute;
  bottom: 0; left: 0; right: 0;
  height: 4px;
  background: var(--ptc-rust);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.3s ease;
}
.ptc-tile:hover::after { transform: scaleX(1); }

/* ── Watermark word ────────────────────────────────────────── */
.ptc-watermark {
  pointer-events: none;
  user-select: none;
  position: absolute;
  left: 50%;
  bottom: -40px;
  transform: translateX(-50%);
  font-family: var(--wp--preset--font-family--display, "Oswald", sans-serif);
  font-weight: 700;
  text-transform: uppercase;
  font-size: clamp(120px, 22vw, 360px);
  line-height: 0.9;
  color: rgba(237, 229, 208, 0.035);
  white-space: nowrap;
}

/* ── Marquee word in footer ────────────────────────────────── */
.ptc-marquee-word {
  overflow: hidden;
  border-top: 1px solid rgba(237, 229, 208, 0.15);
}
.ptc-marquee-word p {
  font-family: var(--wp--preset--font-family--display, "Oswald", sans-serif);
  text-transform: uppercase;
  font-weight: 700;
  letter-spacing: 0.04em;
  font-size: clamp(80px, 16vw, 260px);
  line-height: 0.9;
  text-align: center;
  color: rgba(237, 229, 208, 0.07);
  white-space: nowrap;
  margin: 4px 0;
}

/* ── Search overlay ────────────────────────────────────────── */
.ptc-search-overlay {
  position: fixed;
  inset: 0;
  z-index: 9999;
  background: rgba(26, 24, 20, 0.85);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  display: none;
  align-items: flex-start;
  justify-content: center;
  padding: 96px 16px 16px;
}
.ptc-search-overlay[data-open="true"] { display: flex; }
.ptc-search-overlay__panel {
  width: 100%;
  max-width: 720px;
  background: var(--ptc-linen);
  border: 1px solid var(--ptc-rust);
}
.ptc-search-overlay__head {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 20px;
  border-bottom: 1px solid rgba(26, 24, 20, 0.15);
}
.ptc-search-overlay__input {
  flex: 1;
  background: transparent;
  border: 0;
  outline: 0;
  font-size: 18px;
  color: var(--ptc-charcoal);
}
.ptc-search-overlay__input::placeholder { color: rgba(26, 24, 20, 0.4); }
.ptc-search-overlay__close {
  background: transparent;
  border: 0;
  cursor: pointer;
  padding: 6px;
  color: rgba(26, 24, 20, 0.65);
}
.ptc-search-overlay__close:hover { color: var(--ptc-rust); }
.ptc-search-overlay__body { padding: 20px; }
.ptc-search-overlay__hint {
  font-family: var(--wp--preset--font-family--mono, monospace);
  font-size: 10px;
  letter-spacing: 0.25em;
  text-transform: uppercase;
  color: rgba(26, 24, 20, 0.6);
  margin-bottom: 12px;
}
.ptc-search-overlay__chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.ptc-search-overlay__chips a {
  display: inline-block;
  padding: 6px 12px;
  font-family: var(--wp--preset--font-family--mono, monospace);
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  border: 1px solid rgba(26, 24, 20, 0.25);
  color: var(--ptc-charcoal);
  text-decoration: none;
}
.ptc-search-overlay__chips a:hover {
  border-color: var(--ptc-rust);
  color: var(--ptc-rust);
}

/* Body lock when overlay is open */
body.ptc-search-open { overflow: hidden; }

/* ── Card "stamp" tick corners (re-usable) ─────────────────── */
.ptc-ticks { position: relative; }
.ptc-ticks::before,
.ptc-ticks::after {
  content: "";
  position: absolute;
  width: 12px;
  height: 12px;
  border: 1px solid currentColor;
  opacity: 0.45;
  pointer-events: none;
}
.ptc-ticks::before { top: -1px; left: -1px; border-right: none; border-bottom: none; }
.ptc-ticks::after  { bottom: -1px; right: -1px; border-left: none; border-top: none; }

/* ── Section spacing helpers ───────────────────────────────── */
.ptc-section {
  padding-top: var(--wp--preset--spacing--section);
  padding-bottom: var(--wp--preset--spacing--section);
}
.ptc-section--tight {
  padding-top: clamp(40px, 6vw, 80px);
  padding-bottom: clamp(40px, 6vw, 80px);
}

/* ── Cover for the mugs feature ────────────────────────────── */
.ptc-mug {
  position: relative;
  width: 240px;
  height: 240px;
  margin: 0 auto;
}
.ptc-mug__body {
  position: absolute;
  inset: 8% 18% 8% 0;
  border-radius: 14px;
  background: var(--ptc-linen-50);
  box-shadow: inset 0 -14px 0 rgba(0, 0, 0, 0.05);
}
.ptc-mug__handle {
  position: absolute;
  right: 2%;
  top: 24%;
  width: 22%;
  height: 52%;
  border: 8px solid var(--ptc-linen-50);
  border-radius: 0 999px 999px 0;
}
.ptc-mug__art {
  position: absolute;
  inset: 20% 28% 20% 8%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  text-align: center;
  padding: 0 8px;
  color: var(--ptc-charcoal);
  font-family: var(--wp--preset--font-family--display, "Oswald", sans-serif);
  text-transform: uppercase;
  font-weight: 700;
  line-height: 0.95;
}
.ptc-mug__art .ptc-mug__hero { font-size: 30px; color: var(--ptc-rust); }
.ptc-mug__art .ptc-mug__line { font-size: 22px; }

/* ── Newsletter form ───────────────────────────────────────── */
.ptc-newsletter {
  border: 1px solid rgba(26, 24, 20, 0.2);
  background: var(--ptc-linen-50);
  padding: 24px;
}
.ptc-newsletter__row {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
@media (min-width: 640px) {
  .ptc-newsletter__row { flex-direction: row; }
}
.ptc-newsletter input[type="email"] {
  flex: 1;
  height: 56px;
  padding: 0 16px;
  border: 1px solid rgba(26, 24, 20, 0.25);
  background: var(--ptc-linen);
  font-size: 15px;
  color: var(--ptc-charcoal);
}
.ptc-newsletter input[type="email"]:focus {
  outline: none;
  border-color: var(--ptc-rust);
}

/* ── Logo on linen "swatch" (footer) ───────────────────────── */
.ptc-logo-swatch {
  display: inline-block;
  background: var(--ptc-linen);
  padding: 12px;
}

/* ── Image placeholders (used inside patterns until media is uploaded) ── */
.ptc-placeholder {
  background-color: var(--ptc-charcoal);
  background-image: repeating-linear-gradient(
    45deg,
    rgba(237, 229, 208, 0.05) 0 10px,
    transparent 10px 22px
  );
  color: var(--ptc-linen);
  font-family: var(--wp--preset--font-family--mono, monospace);
  font-size: 11px;
  letter-spacing: 0.25em;
  text-transform: uppercase;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 24px;
  min-height: 220px;
}

/* ── Responsive: collapse the trade tile grid on phones ────── */
@media (max-width: 640px) {
  .ptc-tile { padding: 18px; min-height: 180px; }
  .ptc-tile__label { font-size: 22px; }
  .ptc-watermark { font-size: clamp(80px, 22vw, 200px); bottom: -20px; }
  .ptc-headline-strip h1 { font-size: 28px; }
}