/* Tramps — the Black Friday Sale page (page-black-friday.php, 3.15.276).
   After the shop's styles (the list below is the Sale page's own). Black and brass, wax seals,
   gift tags; on Black Friday (to the end of Cyber Monday) the brass leads. */

.tramps-bf{--bf-brass:#CDB58A;--bf-deep:#B08D57;--bf-cream:#F4F1EA;--bf-coal:#1B1A18;--bf-dim:#8E8B85;--bf-soft:#D9D4CA;--bf-wrap:min(var(--maxw,1600px),100%)}
.tramps-bf :where(#deals,#gifts,#sale){scroll-margin-top:calc(var(--head-h,120px) + 12px)}
.bf-k{display:block;font:700 .7rem/1.3 var(--sans);letter-spacing:.22em;text-transform:uppercase;color:var(--bf-deep)}
.bf-btn{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 30px;border-radius:999px;font:800 .75rem/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;text-decoration:none;transition:transform .2s var(--ease),box-shadow .2s,background .2s,color .2s}
.bf-btn:hover{transform:translateY(-2px)}
.bf-btn--brass{background:var(--bf-brass);color:var(--ink)}
.bf-btn--brass:hover{color:var(--ink);box-shadow:0 18px 36px -18px rgba(205,181,138,.75)}
.bf-btn--ink{background:var(--ink);color:#fff}
.bf-btn--ink:hover{color:#fff;box-shadow:0 18px 36px -20px rgba(0,0,0,.6)}
.bf-btn--line{border:1.5px solid var(--ink);color:var(--ink)}
.bf-btn--line:hover{background:var(--ink);color:#fff}

/* ---- the hero ---- */
.bfh{max-width:var(--maxw,1600px);margin:clamp(12px,2vw,22px) auto 0;padding:0 var(--gut)}
.bfh-in{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);min-height:clamp(420px,34vw,500px);border-radius:var(--r-lg,26px);overflow:hidden;background:var(--ink);color:var(--bf-cream);isolation:isolate}
.bfh-c{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:16px;padding:clamp(32px,3.6vw,52px) clamp(28px,4vw,58px)}
.bfh .bf-k{color:var(--bf-brass)}
.bfh h1{margin:0;font:400 clamp(3rem,5.6vw,5.25rem)/.98 var(--serif);letter-spacing:-.02em;color:var(--bf-cream)}
.bfh h1 em{color:var(--bf-brass)}
.bfh-line{margin:0;font:italic 400 clamp(1.25rem,1.9vw,1.65rem)/1.2 var(--serif);color:var(--bf-cream)}
.bfh-stand{margin:0;max-width:480px;font-size:1rem;line-height:1.6;color:var(--bf-soft)}
.bfh-acts{display:flex;flex-wrap:wrap;align-items:center;gap:18px 24px;margin-top:4px}
.bfh-left{display:inline-flex;align-items:center;gap:10px;padding:8px 14px;border-radius:999px;background:var(--bf-coal);font-size:.82rem;line-height:1.35;color:var(--bf-soft)}
.bfh-left b{color:var(--bf-cream)}
.bfh-pulse{position:relative;flex:none;width:8px;height:8px;border-radius:50%;background:#E0654A}
.bfh-pulse::after{content:"";position:absolute;inset:-4px;border-radius:50%;border:2px solid rgba(224,101,74,.55);animation:bf-pulse 1.8s ease-out infinite}
@keyframes bf-pulse{0%{transform:scale(.6);opacity:1}100%{transform:scale(1.6);opacity:0}}
@media (prefers-reduced-motion:reduce){.bfh-pulse::after{animation:none;opacity:0}}
.bfh-ph{position:relative;margin:0;min-height:100%;background-size:cover;background-repeat:no-repeat}
.bfh-ph::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#0B0B0B 0%,rgba(11,11,11,0) 34%)}
.bfh-seal{position:absolute;right:clamp(16px,2vw,28px);bottom:clamp(16px,2vw,28px);width:clamp(118px,11vw,156px);height:auto;transform:rotate(-12deg);filter:drop-shadow(0 14px 26px rgba(0,0,0,.45))}
.bfh--extra .bfh-seal{top:clamp(16px,2vw,28px);bottom:auto;transform:rotate(10deg)}
/* Black Friday to Cyber Monday: An extra / 20% off / the sale. */
.bfh-x{display:flex;flex-direction:column;gap:2px;line-height:.95}
.bfh-x span{font-size:clamp(1.6rem,2.6vw,2.5rem)}
.bfh-x b{font-weight:400;font-size:clamp(4.4rem,9.4vw,8.75rem);line-height:.92;color:var(--bf-brass)}
.bfh-x em{font-size:clamp(2rem,3.2vw,3rem);color:var(--bf-cream)!important}

/* the countdown */
.bfc{display:flex;align-items:center;gap:8px}
.bfc-l{display:flex;flex-direction:column;gap:2px;margin-right:6px;font:700 .68rem/1.15 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--bf-brass)}
.bfc-l i{font:italic 400 .95rem/1.15 var(--serif);letter-spacing:0;text-transform:none}
.bfh--extra .bfc-l{color:var(--bf-dim);letter-spacing:.18em}
.bfc-units{display:flex;gap:8px}
.bfc-u{display:flex;flex-direction:column;align-items:center;justify-content:center;width:54px;height:58px;border-radius:10px;background:var(--bf-coal)}
.bfc-u b{font:400 1.38rem/1 var(--serif);font-variant-numeric:tabular-nums;color:var(--bf-cream)}
.bfc-u small{margin-top:5px;font:700 .56rem/1 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--bf-dim)}
.bfc.is-done .bfc-units{opacity:.4}

/* ---- why Tramps ---- */
.bfw{max-width:var(--maxw,1600px);margin:16px auto 0;padding:0 var(--gut)}
.bfw-in{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin:0;padding:0;list-style:none;border:1px solid #E2DCCF;border-radius:18px;background:#FBF9F4}
.bfw-in li{display:flex;align-items:center;gap:14px;padding:16px 22px;min-width:0}
.bfw-in li + li{border-left:1px solid #E2DCCF}
.bfw-i{display:grid;place-items:center;flex:none;width:36px;height:36px;border-radius:50%;background:var(--ink);color:var(--bf-brass)}
.bfw-in b{display:block;font-size:.88rem;font-weight:700;color:var(--ink)}
.bfw-in small{display:block;margin-top:3px;font-size:.8rem;line-height:1.35;color:#5E5D59}

/* ---- the best deals ---- */
.bfd{margin-top:clamp(40px,5vw,64px);background:var(--ink);color:var(--bf-cream)}
.bfd-in{max-width:var(--maxw,1600px);margin:0 auto;padding:clamp(44px,5vw,64px) var(--gut) clamp(52px,6vw,72px);display:flex;flex-direction:column;gap:34px}
.bfd-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:16px 40px}
.bfd .bf-k{color:var(--bf-brass);margin-bottom:10px}
.bfd h2{margin:0;font:400 clamp(2.3rem,3.7vw,3.25rem)/1 var(--serif);color:var(--bf-cream)}
.bfd h2 em{color:var(--bf-brass)}
.bfd h2 span{font-size:.65em}
.bfd-r{display:flex;flex-direction:column;align-items:flex-end;gap:8px;font-size:.88rem;color:#B5B0A6}
.bfd-r a{color:var(--bf-cream);font:800 .75rem/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;text-decoration:underline;text-underline-offset:4px}
.bfd-r a:hover{color:var(--bf-brass)}
.bfd-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:40px 22px;margin:0;padding:0;list-style:none}
.bfd-card{display:flex;flex-direction:column;gap:14px;min-width:0}
.bfd-ph{position:relative;aspect-ratio:4/5;border-radius:18px;overflow:hidden;background:var(--bf-coal)}
.bfd-media{position:absolute;inset:0;display:block}
.bfd-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.bfd-card:hover .bfd-media img{transform:scale(1.04)}
.bfd-media::after{content:"";position:absolute;inset:auto 0 0 0;height:40%;background:linear-gradient(to top,rgba(11,11,11,.55),rgba(11,11,11,0));pointer-events:none}
.bfd-off{position:absolute;left:14px;top:14px;display:grid;place-items:center;width:62px;height:62px;border-radius:50%;background:var(--bf-brass);color:var(--ink);font:400 1.18rem/1 var(--serif);box-shadow:0 10px 24px -10px rgba(0,0,0,.6);pointer-events:none}
.bfd-tags{position:absolute;right:14px;top:14px;display:flex;flex-direction:column;align-items:flex-end;gap:6px;pointer-events:none}
.bfd-tags span{padding:7px 11px;border-radius:999px;font:700 .62rem/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;white-space:nowrap}
.bfd-last{background:rgba(11,11,11,.82);color:var(--bf-cream)}
.bfd-x{background:var(--bf-cream);color:var(--ink);font-weight:800!important}
.bfd-n{position:absolute;left:16px;bottom:16px;z-index:1;font:italic 400 .95rem/1 var(--serif);color:var(--bf-cream)}
.bfd-qa{position:absolute;right:12px;bottom:12px;display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 16px;border:0;border-radius:999px;background:var(--bf-cream);color:var(--ink);font:800 .68rem/1 var(--sans);letter-spacing:.12em;text-transform:uppercase;cursor:pointer;transition:transform .2s var(--ease),background .2s}
.bfd-qa span{font-size:1rem;line-height:1}
.bfd-qa:hover{background:#fff;transform:translateY(-2px)}
.bfd-body{display:flex;flex-direction:column;gap:5px}
.bfd-brand{font:700 .7rem/1.2 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--bf-brass)}
.bfd-name{color:var(--bf-cream);font:400 1.1rem/1.3 var(--serif);text-decoration:none}
.bfd-name:hover{color:var(--bf-brass)}
.bfd-price{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px;margin-top:2px}
.bfd-price b{font-size:1.06rem;font-weight:700;color:var(--bf-cream)}
.bfd-price s{font-size:.88rem;color:var(--bf-dim)}
.bfd-save{font-size:.75rem;font-style:normal;font-weight:700;color:var(--bf-brass)}
.bfd-price .woocommerce-Price-amount{color:inherit}
.bfd-sizes{font-size:.75rem;line-height:1.4;color:var(--bf-dim)}
.tramps-bf--extra .bfd{background:#14120F}

/* ---- gifts, $20 to $500 ---- */
.bfg{max-width:var(--maxw,1600px);margin:clamp(52px,6vw,76px) auto 0;padding:0 var(--gut);display:flex;flex-direction:column;gap:22px}
.bfg-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:12px 40px}
.bfg-head .bf-k{color:#8A6B3A;margin-bottom:10px}
.bfg h2{margin:0;font:400 clamp(2.1rem,3.3vw,2.9rem)/1 var(--serif);color:var(--ink)}
.bfg-head p{margin:0;font-size:.95rem;color:#5E5D59}
.bfg-tags{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:20px;margin:0;padding:34px 0 6px;list-style:none}
.bfg-tag{position:relative;display:flex;flex-direction:column;gap:10px;min-height:196px;height:100%;padding:42px 22px 22px;border:1px solid #E2DCCF;border-radius:16px;background:var(--bf-cream);color:var(--ink);text-decoration:none;
  transform:rotate(var(--tilt,0deg));box-shadow:0 26px 50px -34px rgba(0,0,0,.35);transition:transform .3s var(--ease),box-shadow .3s}
.bfg-tag:hover{color:var(--ink);transform:rotate(0deg) translateY(-4px);box-shadow:0 30px 56px -30px rgba(0,0,0,.45)}
.bfg-tag--dark{border-color:var(--ink);background:var(--ink);color:var(--bf-cream);box-shadow:0 26px 50px -30px rgba(0,0,0,.6)}
.bfg-tag--dark:hover{color:var(--bf-cream)}
.bfg-string{position:absolute;left:50%;top:-30px;width:110px;height:36px;margin-left:-55px}
.bfg-hole{position:absolute;left:50%;top:15px;width:13px;height:13px;margin-left:-6.5px;border-radius:50%;background:#fff;box-shadow:inset 0 0 0 2px var(--bf-deep)}
.bfg-tag--dark .bfg-hole{box-shadow:inset 0 0 0 2px var(--bf-brass)}
.bfg-kick{font:700 .62rem/1.2 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:#8A6B3A}
.bfg-tag--dark .bfg-kick{color:var(--bf-brass)}
.bfg-range{font:400 clamp(1.5rem,2.1vw,1.9rem)/1.05 var(--serif)}
.bfg-foot{margin-top:auto;display:flex;justify-content:space-between;align-items:baseline;gap:8px;font-size:.75rem;color:#5E5D59}
.bfg-tag--dark .bfg-foot{color:#B5B0A6}
.bfg-go{font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--ink);text-decoration:underline;text-underline-offset:4px}
.bfg-tag--dark .bfg-go{color:var(--bf-cream)}

/* ---- everything in the sale ---- */
.bfs{max-width:var(--maxw,1600px);margin:clamp(56px,6vw,84px) auto 0;padding:0 var(--gut);display:flex;flex-direction:column;gap:18px}
.bfs-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:10px 16px;padding-top:clamp(28px,3vw,40px);border-top:1px solid var(--line)}
.bfs h2{margin:0;font:400 clamp(1.75rem,2.4vw,2.15rem)/1.1 var(--serif);color:var(--ink)}
.bfs-clear{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:0 16px;border:1px solid #D5D2CB;border-radius:999px;color:var(--ink);font:700 .72rem/1 var(--sans);letter-spacing:.1em;text-transform:uppercase;text-decoration:none}
.bfs-clear:hover{border-color:var(--ink)}
.bfs-size{display:flex;flex-wrap:wrap;align-items:center;gap:10px 22px;padding:16px 20px;border-radius:16px;background:var(--fog,#F4F3F0)}
.bfs-size > b{font:italic 400 1.1rem/1.2 var(--serif)}
.bfs-g{display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.bfs-l{margin-right:2px;font:700 .66rem/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--slate)}
.bfs-g a{display:inline-grid;place-items:center;min-width:44px;min-height:40px;padding:0 8px;border:1px solid #D5D2CB;border-radius:9px;background:#fff;color:var(--ink);font:600 .82rem/1 var(--sans);text-decoration:none;transition:border-color .15s,background .15s,color .15s}
.bfs-g a:hover{border-color:var(--ink)}
.bfs-g a.is-on{background:var(--ink);border-color:var(--ink);color:#fff}
.tramps-bf > .shop-results{margin-top:6px}

/* ---- the stylist, and the small print ---- */
.bfst{max-width:var(--maxw,1600px);margin:clamp(52px,6vw,80px) auto 0;padding:0 var(--gut)}
.bfst-in{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px 40px;padding:clamp(26px,3vw,36px) clamp(24px,3.4vw,42px);border-radius:var(--r-lg,26px);background:var(--fog,#F4F3F0)}
.bfst-c{display:flex;flex-direction:column;gap:8px;max-width:640px}
.bfst h2{margin:0;font:400 clamp(1.4rem,2vw,1.75rem)/1.25 var(--serif);color:var(--ink)}
.bfst p{margin:0;font-size:.95rem;line-height:1.55;color:#5E5D59}
.bfst-acts{display:flex;flex-wrap:wrap;gap:10px}
.bfst-acts .bf-btn{min-height:50px;padding:0 24px}
.bfst-small{margin:26px 0 0;font-size:.75rem;line-height:1.6;color:var(--slate);text-align:center}

/* ---- the phone's Shop deals pill, above the phone bar ---- */
.bfpill{display:none}
@media (max-width:1079px){
  .bfpill{position:fixed;left:50%;bottom:calc(82px + env(safe-area-inset-bottom,0px));z-index:89;display:flex;align-items:center;justify-content:space-between;gap:10px;width:min(366px,calc(100vw - 24px));min-height:48px;padding:0 6px 0 18px;
    border-radius:999px;background:var(--bf-brass);color:var(--ink);text-decoration:none;font-size:.75rem;font-weight:600;box-shadow:0 16px 34px -14px rgba(0,0,0,.5);
    transform:translate(-50%,calc(100% + 110px));opacity:0;pointer-events:none;transition:transform .35s var(--ease),opacity .35s var(--ease),bottom .35s var(--ease)}
  .bfpill[hidden]{display:none}
  .bfpill.is-on{transform:translate(-50%,0);opacity:1;pointer-events:auto}
  .bfpill:hover{color:var(--ink)}
  .bfpill i{font:italic 400 .82rem/1 var(--serif)}
  .bfpill-go{display:inline-flex;align-items:center;min-height:36px;padding:0 14px;border-radius:999px;background:var(--ink);color:var(--bf-cream);font:800 .62rem/1 var(--sans);letter-spacing:.14em;text-transform:uppercase}
  html.pn-away .bfpill{bottom:calc(14px + env(safe-area-inset-bottom,0px))}
}

/* ---- tablets ---- */
@media (max-width:1100px){
  .bfd-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .bfg-tags{grid-template-columns:repeat(3,minmax(0,1fr));row-gap:46px}
  .bfw-in{grid-template-columns:repeat(2,minmax(0,1fr))}
  .bfw-in li:nth-child(3){border-left:0}
  .bfw-in li:nth-child(n+3){border-top:1px solid #E2DCCF}
}
@media (max-width:900px){
  .bfh-in{grid-template-columns:1fr}
  .bfh-ph{order:-1;min-height:clamp(220px,46vw,340px)}
  .bfh-ph::before{background:linear-gradient(0deg,#0B0B0B 0%,rgba(11,11,11,0) 60%)}
  .bfh-seal,.bfh--extra .bfh-seal{top:14px;right:14px;bottom:auto;width:clamp(86px,16vw,120px);transform:rotate(10deg)}
}

/* ---- phones ---- */
@media (max-width:760px){
  .bfh{margin-top:12px}
  .bfh-in{border-radius:22px}
  .bfh-c{gap:12px;padding:4px 20px 24px}
  .bfh h1{font-size:clamp(2.5rem,12vw,3rem)}
  .bfh-x b{font-size:clamp(4rem,22vw,5.6rem)}
  .bfh-stand{font-size:.92rem}
  .bfh-acts{flex-direction:column;align-items:stretch;gap:12px;width:100%}
  .bfh-acts .bf-btn{width:100%;min-height:50px}
  .bfc{justify-content:space-between;gap:6px;padding:12px 14px;border:1px solid rgba(205,181,138,.45);border-radius:14px}
  .bfc-units{gap:6px}
  .bfc-u{width:48px;height:52px}
  .bfc-u b{font-size:1.18rem}
  .bfc-l{font-size:.62rem}
  .bfh-left{padding:0;background:none;font-size:.78rem}
  .bfw-in{border-radius:16px}
  .bfw-in li{gap:10px;padding:12px 12px}
  .bfw-i{width:auto;height:auto;background:none;color:#8A6B3A}
  .bfw-in b{font-size:.8rem}
  .bfw-in small{font-size:.72rem}
  .bfd{margin-top:36px}
  .bfd-in{gap:22px;padding:40px var(--gut) 44px}
  .bfd-head{flex-direction:column;align-items:flex-start;gap:8px}
  .bfd h2{font-size:2.25rem}
  .bfd-r{align-items:flex-start;flex-direction:row;flex-wrap:wrap;gap:6px 16px;font-size:.82rem}
  .bfd-grid{gap:26px 12px}
  .bfd-card{gap:10px}
  .bfd-ph{border-radius:14px}
  .bfd-off{left:8px;top:8px;width:44px;height:44px;font-size:.88rem}
  .bfd-tags{left:8px;right:auto;top:auto;bottom:10px;align-items:flex-start;max-width:calc(100% - 64px)}
  .bfd-tags span{padding:5px 7px;font-size:.52rem;letter-spacing:.05em}
  .bfd-n{display:none}
  .bfd-qa{right:8px;bottom:8px;justify-content:center;width:44px;min-height:44px;padding:0;font-size:0;letter-spacing:0}
  .bfd-qa span{font-size:1.4rem}
  .bfd-name{font-size:.94rem}
  .bfd-price b{font-size:.88rem}
  .bfd-price s{font-size:.8rem}
  .bfd-save{display:none}
  .bfd-sizes{font-size:.7rem}
  .bfg{margin-top:40px;gap:4px;padding:0}
  .bfg-head{padding:0 var(--gut)}
  .bfg-head p{display:none}
  .bfg h2{font-size:2rem}
  .bfg-tags{display:flex;gap:14px;overflow-x:auto;padding:34px var(--gut) 18px;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .bfg-tags::-webkit-scrollbar{display:none}
  .bfg-tags li{flex:none;width:158px;scroll-snap-align:start}
  .bfg-tag{min-height:186px;padding:36px 16px 16px}
  .bfg-string{width:96px;height:32px;margin-left:-48px;top:-26px}
  .bfg-range{font-size:1.5rem}
  .bfg-foot{flex-direction:column;gap:6px;font-size:.7rem}
  .bfs{margin-top:28px;gap:14px}
  .bfs-head{padding-top:28px}
  .bfs-size{flex-direction:column;align-items:stretch;gap:10px;padding:14px}
  .bfs-g{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}
  .bfs-g::-webkit-scrollbar{display:none}
  .bfs-g a{flex:none;min-width:46px;min-height:42px}
  .bfst-in{flex-direction:column;align-items:stretch;gap:14px;padding:24px 20px}
  .bfst h2{font-size:1.25rem}
  .bfst-acts{flex-direction:column}
  .bfst-acts .bf-btn{width:100%;min-height:48px}
}
