/*
Theme Name: Barking Past
Theme URI: https://barkingpast.com
Author: Barking Past
Description: Archival editorial theme for the Barking Past canine-history channel.
Version: 1.1.1
Text Domain: barking-past
*/

html { scroll-behavior: smooth; }
body.admin-bar { padding-top: 0; }
#shop { display: none; }

/* 1.1 — weathered archive-cover art direction */
body {
  background-color: #171008 !important;
  background-image:
    radial-gradient(ellipse at 50% -10%, rgba(126, 85, 37, .24), transparent 48%),
    linear-gradient(90deg, rgba(0,0,0,.34), transparent 8%, transparent 92%, rgba(0,0,0,.36)),
    url("images/leather.jpg") !important;
  background-size: auto, auto, 960px 600px !important;
  background-repeat: no-repeat, no-repeat, repeat !important;
  background-attachment: fixed, fixed, fixed !important;
}

body::before {
  box-shadow:
    inset 0 0 0 3px rgba(190, 145, 65, .72),
    inset 0 0 0 6px rgba(12, 8, 4, .9),
    inset 0 0 0 8px rgba(91, 59, 25, .6),
    inset 0 0 180px rgba(0, 0, 0, .72) !important;
}

header.top {
  background:
    linear-gradient(180deg, rgba(57, 39, 20, .97), rgba(21, 14, 8, .98)),
    url("images/leather-bg.jpg") center/700px auto !important;
  border-top: 1px solid rgba(229, 190, 108, .48);
  border-bottom: 3px ridge #92703b !important;
  box-shadow:
    0 8px 24px rgba(0,0,0,.72),
    inset 0 1px rgba(255,255,255,.08),
    inset 0 -8px 18px rgba(0,0,0,.3) !important;
}

.brand img.logo,
.foot-brand img,
.emblem,
.dossier-logo {
  background: #1b120b;
  object-fit: cover !important;
  object-position: 50% 50% !important;
  border-radius: 50% !important;
  clip-path: circle(48.7% at 50% 50%);
}

.brand img.logo,
.foot-brand img {
  border: 2px solid #b18a48;
  box-shadow:
    0 0 0 3px #2a1b0d,
    0 0 0 4px rgba(218,177,91,.62),
    0 8px 18px rgba(0,0,0,.72) !important;
}

nav.links a {
  text-shadow: 0 1px 2px #000;
}

.masthead {
  padding: 58px 0 66px !important;
  background:
    radial-gradient(ellipse at center, rgba(99,67,29,.18), transparent 68%),
    linear-gradient(rgba(0,0,0,.08), rgba(0,0,0,.23));
  border-bottom: 7px double #9e7a3e !important;
}

.plate {
  padding: 10px;
  border: 2px solid #d0aa63 !important;
  background:
    linear-gradient(135deg, #3d2a14, #bb9050 18%, #4b3217 38%, #d0aa63 53%, #4a3015 73%, #a17a3e) !important;
  box-shadow:
    0 38px 80px -26px rgba(0,0,0,.95),
    0 0 0 5px #100b06,
    0 0 0 7px rgba(191,145,67,.75),
    inset 0 0 14px rgba(255,221,148,.42) !important;
}

.plate::before,
.plate::after {
  width: 62px !important;
  height: 62px !important;
  border-width: 4px !important;
  border-color: #c79b50 !important;
  filter: drop-shadow(0 2px 2px #000);
}

.plate img {
  border: 2px solid #171008;
  filter: sepia(.08) contrast(1.05) saturate(.88);
}

.masthead .cap {
  color: #d5bd8e !important;
  text-shadow: 0 2px 3px #000;
}

.intro,
.section,
.enlist-band {
  position: relative;
}

.intro::before,
.section.divider::before,
.enlist-band::before {
  content: "";
  position: absolute;
  inset: 18px 22px;
  pointer-events: none;
  border: 1px solid rgba(181,139,67,.18);
  box-shadow: inset 0 0 42px rgba(0,0,0,.18);
}

.intro {
  background:
    linear-gradient(90deg, rgba(12,8,4,.28), rgba(76,49,20,.13) 50%, rgba(12,8,4,.28));
}

.intro h1,
.sec-head h2,
.ethos h2,
.process h3 {
  text-shadow:
    0 2px 0 #110b06,
    0 4px 14px rgba(0,0,0,.82) !important;
}

.emblem {
  border: 3px solid #b88c45;
  outline: 7px solid rgba(14,9,5,.82);
  box-shadow:
    0 0 0 9px rgba(184,140,69,.36),
    0 30px 60px -18px rgba(0,0,0,.95) !important;
}

.section.divider {
  border-top: 7px double rgba(169,132,63,.62) !important;
  background:
    radial-gradient(ellipse at 50% 0, rgba(125,84,35,.14), transparent 50%),
    linear-gradient(180deg, rgba(0,0,0,.12), rgba(0,0,0,.03) 30%, rgba(0,0,0,.18));
}

.vid,
.photo,
.tn {
  border: 1px solid #73512a;
  outline: 1px solid rgba(220,186,116,.2);
  box-shadow:
    0 25px 52px -22px rgba(0,0,0,.96),
    0 0 0 5px rgba(23,14,7,.45) !important;
}

.doc,
.enlist {
  border: 2px solid #8b6936 !important;
  outline: 7px solid rgba(18,11,6,.58);
  box-shadow:
    0 34px 72px -24px rgba(0,0,0,.98),
    0 0 0 9px rgba(166,126,61,.27) !important;
}

.ethos,
.cta,
footer {
  background:
    linear-gradient(rgba(10,6,3,.46),rgba(10,6,3,.68)),
    url("images/leather-bg.jpg") center/900px auto !important;
}

.btn {
  border: 1px solid #c69a50 !important;
  box-shadow:
    inset 0 1px rgba(255,238,194,.2),
    inset 0 -7px 14px rgba(0,0,0,.28),
    0 8px 22px rgba(0,0,0,.5) !important;
}

@media (max-width: 880px) {
  .masthead { padding: 34px 0 40px !important; }
  .plate { padding: 5px; }
  .intro::before,
  .section.divider::before,
  .enlist-band::before { inset: 10px 8px; }
}
