/* ==========================================================================
   The Precious Metals Group Inc — pmg-theme
   Design system. Deliberately distinct from buyersofnewyork.com:
   different palette, different type pairing, light ground instead of dark.
   ========================================================================== */

:root{
  --ink:      #12141A;
  --ink-2:    #1E222B;
  --ink-3:    #454B57;
  --paper:    #FAF8F4;
  --stone:    #E9E4DA;
  --stone-2:  #D6CFC1;
  --sea:      #17847D;
  --sea-lt:   #81D8D0;
  --ox:       #6B2130;
  --up:       #1F7A4D;
  --down:     #A32A2A;

  --wrap: 1200px;
  --gut: 24px;

  --f-display: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --f-body:    "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --f-data:    "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

*,*::before,*::after{ box-sizing:border-box; }

html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }

body.pmg{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--f-body);
  font-size:18px;
  line-height:1.75;
  -webkit-font-smoothing:antialiased;
}

img{ max-width:100%; height:auto; display:block; }
a{ color:inherit; }

.pmg-wrap{ max-width:var(--wrap); margin:0 auto; padding:0 var(--gut); }

/* ---- Type ---------------------------------------------------------------- */

.pmg h1,.pmg h2,.pmg h3{
  font-family:var(--f-display);
  font-weight:800;
  line-height:1.12;
  letter-spacing:-0.02em;
  margin:0 0 .5em;
}
.pmg h1{ font-size:clamp(2.6rem,6.2vw,4.6rem); }
.pmg h2{ font-size:clamp(2rem,4.2vw,3.1rem); }
.pmg h3{ font-size:1.45rem; font-weight:700; }

.pmg-eyebrow{
  font-family:var(--f-data);
  font-weight:700;
  font-size:.8rem;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--sea);
  margin:0 0 .9rem;
  display:block;
}

.pmg-lede{ font-size:1.2rem; color:var(--ink-3); max-width:60ch; }

/* ---- Buttons ------------------------------------------------------------- */

.pmg-btn{
  display:inline-flex; align-items:center; gap:.5rem;
  font-family:var(--f-body); font-size:1.02rem; font-weight:700;
  letter-spacing:.01em;
  padding:1.05rem 1.9rem;
  border:1px solid var(--ink);
  background:var(--ink); color:var(--paper);
  text-decoration:none; cursor:pointer;
  transition:background .18s ease, color .18s ease, border-color .18s ease;
}
.pmg-btn:hover{ background:var(--sea); border-color:var(--sea); color:#fff; }

.pmg-btn--sea{ background:var(--sea); border-color:var(--sea); color:#fff; }
.pmg-btn--sea:hover{ background:var(--ink); border-color:var(--ink); }

.pmg-btn--ghost{ background:transparent; color:var(--ink); }
.pmg-btn--ghost:hover{ background:var(--ink); color:var(--paper); border-color:var(--ink); }

.pmg-btn--onink{ background:transparent; color:var(--paper); border-color:rgba(250,248,244,.5); }
.pmg-btn--onink:hover{ background:var(--paper); color:var(--ink); border-color:var(--paper); }

.pmg a:focus-visible,.pmg button:focus-visible,.pmg summary:focus-visible{
  outline:2px solid var(--sea-lt); outline-offset:3px;
}

/* ---- Utility bar --------------------------------------------------------- */

.pmg-util{
  background:var(--ink); color:rgba(250,248,244,.85);
  font-family:var(--f-data); font-size:.8rem; font-weight:600; letter-spacing:.04em;
}
.pmg-util .pmg-wrap{
  display:flex; align-items:center; justify-content:space-between;
  gap:1rem; min-height:38px; flex-wrap:wrap;
}
.pmg-util a{ text-decoration:none; }
.pmg-util a:hover{ color:var(--sea-lt); }
.pmg-util__set{ display:flex; gap:1.4rem; flex-wrap:wrap; }

/* ---- Header -------------------------------------------------------------- */

.pmg-head{
  position:sticky; top:0; z-index:60;
  background:var(--paper);
  border-bottom:1px solid var(--stone);
}
.pmg-head .pmg-wrap{
  display:flex; align-items:center; justify-content:space-between;
  gap:1.5rem; min-height:78px;
}
.pmg-logo{
  font-family:var(--f-display); font-size:1.28rem; font-weight:600;
  letter-spacing:.01em; text-decoration:none; line-height:1.15;
}
.pmg-logo span{
  display:block; font-family:var(--f-data); font-size:.6rem;
  letter-spacing:.26em; text-transform:uppercase; color:var(--sea);
  margin-top:.18rem;
}
.pmg-nav{ display:flex; align-items:center; gap:1.9rem; }
.pmg-nav a{
  font-size:1rem; font-weight:600; text-decoration:none; letter-spacing:.01em;
  padding-bottom:2px; border-bottom:1px solid transparent;
}
.pmg-nav a:hover{ border-bottom-color:var(--sea); }

.pmg-burger{
  display:none; background:none; border:0; padding:.4rem;
  font-family:var(--f-data); font-size:.75rem; letter-spacing:.18em;
  text-transform:uppercase; cursor:pointer; color:var(--ink);
}

@media (max-width:940px){
  .pmg-nav{
    position:fixed; inset:118px 0 auto 0;
    flex-direction:column; align-items:flex-start; gap:0;
    background:var(--paper); border-bottom:1px solid var(--stone);
    padding:0 var(--gut); max-height:0; overflow:hidden;
    transition:max-height .3s ease, padding .3s ease;
  }
  .pmg-nav[data-open="true"]{ max-height:70vh; padding:1rem var(--gut) 2rem; overflow-y:auto; }
  .pmg-nav a{ width:100%; padding:.85rem 0; border-bottom:1px solid var(--stone); }
  .pmg-nav .pmg-btn{ margin-top:1rem; width:100%; justify-content:center; }
  .pmg-burger{ display:block; }
}

/* ---- Signature: the tape ------------------------------------------------- */
/* The one bold element on the page. Everything else stays quiet. */

.pmg-tape{
  background:var(--ink-2);
  border-top:1px solid rgba(23,132,125,.4);
  border-bottom:1px solid rgba(23,132,125,.4);
  overflow:hidden;
  position:relative;
}
.pmg-tape__inner{
  display:flex; align-items:center; gap:2.6rem;
  padding:.62rem 0;
  font-family:var(--f-data); font-size:.8rem;
  color:var(--paper);
  white-space:nowrap;
}
.pmg-tape__label{
  font-size:.72rem; font-weight:700; letter-spacing:.24em; text-transform:uppercase;
  color:var(--sea-lt); flex-shrink:0;
  padding-right:2.6rem; border-right:1px solid rgba(250,248,244,.16);
}
.pmg-tape__row{ display:flex; align-items:center; gap:2.6rem; flex-wrap:wrap; }
.pmg-tape__item{ display:flex; align-items:baseline; gap:.55rem; }
.pmg-tape__metal{
  font-size:.72rem; font-weight:600; letter-spacing:.2em; text-transform:uppercase;
  color:rgba(250,248,244,.55);
}
.pmg-tape__val{ font-size:1.05rem; font-weight:700; font-variant-numeric:tabular-nums; }
.pmg-tape__dir{ font-size:.7rem; }
.pmg-tape__dir[data-dir="up"]{ color:#4FBE86; }
.pmg-tape__dir[data-dir="down"]{ color:#E06A6A; }
.pmg-tape__dir[data-dir="flat"]{ color:rgba(250,248,244,.4); }
.pmg-tape__note{
  margin-left:auto; font-size:.6rem; letter-spacing:.14em; text-transform:uppercase;
  color:rgba(250,248,244,.45); flex-shrink:0;
}
.pmg-tape[data-state="loading"] .pmg-tape__val{ opacity:.35; }

@media (max-width:860px){
  .pmg-tape__inner{ gap:1.4rem; overflow-x:auto; scrollbar-width:none; }
  .pmg-tape__inner::-webkit-scrollbar{ display:none; }
  .pmg-tape__row{ gap:1.6rem; flex-wrap:nowrap; }
  .pmg-tape__label{ padding-right:1.4rem; }
  .pmg-tape__note{ display:none; }
}

/* ---- Hero ---------------------------------------------------------------- */

.pmg-hero{
  position:relative; background:var(--ink); color:var(--paper);
  min-height:clamp(460px,64vh,660px);
  display:flex; align-items:center;
}
.pmg-hero__bg{
  position:absolute; inset:0;
  background-size:cover; background-position:center 45%;
  opacity:.42;
}
.pmg-hero::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(100deg, rgba(18,20,26,.94) 0%, rgba(18,20,26,.72) 48%, rgba(18,20,26,.35) 100%);
}
.pmg-hero .pmg-wrap{ position:relative; z-index:2; padding-top:4.5rem; padding-bottom:4.5rem; }
.pmg-hero h1{ max-width:16ch; margin-bottom:1.1rem; }
.pmg-hero h1 em{ font-style:italic; color:var(--sea-lt); }
.pmg-hero p{ max-width:48ch; color:rgba(250,248,244,.82); font-size:1.1rem; margin-bottom:2rem; }
.pmg-hero__cta{ display:flex; gap:.8rem; flex-wrap:wrap; }
.pmg-hero__eyebrow{ color:var(--sea-lt); }

/* ---- Trust strip --------------------------------------------------------- */

.pmg-trust{ background:var(--stone); border-bottom:1px solid var(--stone-2); }
.pmg-trust__grid{
  display:grid; grid-template-columns:repeat(4,1fr);
  padding:2.2rem 0;
}
.pmg-trust__item{ padding:0 1.6rem; border-left:1px solid var(--stone-2); }
.pmg-trust__item:first-child{ border-left:0; padding-left:0; }
.pmg-trust__item strong{
  display:block; font-family:var(--f-display); font-weight:800; font-size:1.22rem; margin-bottom:.2rem;
}
.pmg-trust__item span{ font-size:.98rem; color:var(--ink-3); }
@media (max-width:820px){
  .pmg-trust__grid{ grid-template-columns:1fr 1fr; gap:1.6rem 0; }
  .pmg-trust__item:nth-child(odd){ border-left:0; padding-left:0; }
}

/* ---- Sections ------------------------------------------------------------ */

.pmg-sec{ padding:clamp(4rem,8vw,6.5rem) 0; }
.pmg-sec--ink{ background:var(--ink); color:var(--paper); }
.pmg-sec--ink .pmg-lede{ color:rgba(250,248,244,.72); }
.pmg-sec--stone{ background:var(--stone); }
.pmg-sec__head{ max-width:64ch; margin-bottom:3rem; }

/* ---- What we buy --------------------------------------------------------- */

.pmg-buy{ display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--stone-2); border:1px solid var(--stone-2); }
.pmg-buy__card{
  position:relative; background:var(--paper);
  min-height:290px; padding:1.6rem;
  display:flex; flex-direction:column; justify-content:flex-end;
  text-decoration:none; overflow:hidden;
  transition:transform .3s ease;
}
.pmg-buy__img{
  position:absolute; inset:0;
  background-size:cover; background-position:center 55%;
  transition:transform .5s ease, opacity .3s ease;
}
.pmg-buy__card::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(to top, rgba(18,20,26,.9) 0%, rgba(18,20,26,.32) 55%, rgba(18,20,26,.12) 100%);
}
.pmg-buy__card:hover .pmg-buy__img{ transform:scale(1.06); }
.pmg-buy__body{ position:relative; z-index:2; color:var(--paper); }
.pmg-buy__body h3{ margin:0 0 .3rem; font-size:1.55rem; }
.pmg-buy__body span{
  font-family:var(--f-data); font-weight:600; font-size:.82rem; letter-spacing:.18em;
  text-transform:uppercase; color:var(--sea-lt);
}
@media (max-width:900px){ .pmg-buy{ grid-template-columns:1fr 1fr; } }
@media (max-width:560px){ .pmg-buy{ grid-template-columns:1fr; } }

/* ---- Process ------------------------------------------------------------- */
/* Numbered because it genuinely is a sequence — do this, then this, then paid. */

.pmg-steps{ display:grid; grid-template-columns:repeat(3,1fr); gap:2.4rem; }
.pmg-step__num{
  font-family:var(--f-display); font-size:2.6rem; line-height:1;
  color:var(--sea); display:block; margin-bottom:.7rem;
}
.pmg-step{ border-top:1px solid rgba(23,132,125,.45); padding-top:1.4rem; }
.pmg-step h3{ margin-bottom:.4rem; }
.pmg-step p{ margin:0; color:rgba(250,248,244,.8); font-size:1.05rem; }
@media (max-width:820px){ .pmg-steps{ grid-template-columns:1fr; gap:2rem; } }

/* ---- Showroom ------------------------------------------------------------ */

.pmg-showroom{ display:grid; grid-template-columns:1.05fr .95fr; gap:3.5rem; align-items:center; }
.pmg-showroom__facts{
  display:grid; grid-template-columns:1fr 1fr; gap:1.8rem;
  margin:2rem 0; padding-top:1.8rem; border-top:1px solid var(--stone-2);
}
.pmg-fact dt{
  font-family:var(--f-data); font-weight:700; font-size:.78rem; letter-spacing:.2em;
  text-transform:uppercase; color:var(--sea); margin-bottom:.35rem;
}
.pmg-fact dd{ margin:0; font-size:1.08rem; line-height:1.5; }
.pmg-fact dd a{ text-decoration:none; border-bottom:1px solid var(--stone-2); }
.pmg-fact dd a:hover{ border-bottom-color:var(--sea); }
.pmg-showroom__img img{ width:100%; aspect-ratio:4/5; object-fit:cover; }
@media (max-width:900px){
  .pmg-showroom{ grid-template-columns:1fr; gap:2.4rem; }
  .pmg-showroom__img{ order:-1; }
  .pmg-showroom__img img{ aspect-ratio:16/10; }
}

/* ---- Reviews ------------------------------------------------------------- */

.pmg-rating{
  display:flex; align-items:center; gap:1rem; margin-bottom:2.4rem;
  font-family:var(--f-data); font-size:.74rem; letter-spacing:.16em; text-transform:uppercase;
}
.pmg-rating strong{ font-size:1.5rem; letter-spacing:0; font-family:var(--f-display); }
.pmg-stars{ color:var(--sea-lt); letter-spacing:.1em; }

.pmg-reviews{ display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--stone-2); border:1px solid var(--stone-2); }
.pmg-review{ background:var(--paper); padding:2rem 1.7rem; }
.pmg-review p{ margin:.7rem 0 1.4rem; font-size:1.1rem; }
.pmg-review cite{
  font-style:normal; font-family:var(--f-data); font-weight:700; font-size:.8rem;
  letter-spacing:.16em; text-transform:uppercase; color:var(--ink-3);
}
@media (max-width:900px){ .pmg-reviews{ grid-template-columns:1fr; } }

/* ---- FAQ ----------------------------------------------------------------- */

.pmg-faq{ max-width:860px; }
.pmg-faq details{ border-bottom:1px solid var(--stone-2); }
.pmg-faq summary{
  cursor:pointer; list-style:none; padding:1.35rem 2.5rem 1.35rem 0;
  position:relative; font-weight:700; font-size:1.15rem;
}
.pmg-faq summary::-webkit-details-marker{ display:none; }
.pmg-faq summary::after{
  content:"+"; position:absolute; right:.4rem; top:50%; transform:translateY(-50%);
  font-family:var(--f-data); font-size:1.2rem; color:var(--sea); transition:transform .2s ease;
}
.pmg-faq details[open] summary::after{ content:"–"; }
.pmg-faq details p{ margin:0 0 1.4rem; color:var(--ink-3); max-width:70ch; }

/* ---- Policy note --------------------------------------------------------- */

.pmg-policy{ border-left:3px solid var(--sea); padding-left:2rem; max-width:74ch; }
.pmg-policy p{ margin:0; color:var(--ink-3); }
@media (max-width:640px){ .pmg-policy{ padding-left:1.2rem; } }

/* ---- Articles ------------------------------------------------------------ */

.pmg-posts{ display:grid; grid-template-columns:repeat(3,1fr); gap:2rem; }
.pmg-post{ text-decoration:none; display:block; }
.pmg-post img{ width:100%; aspect-ratio:3/2; object-fit:cover; margin-bottom:1rem; }
.pmg-post__ph{ width:100%; aspect-ratio:3/2; background:var(--stone); margin-bottom:1rem; }
.pmg-post h3{ font-size:1.3rem; margin-bottom:.4rem; }
.pmg-post span{
  font-family:var(--f-data); font-weight:700; font-size:.78rem; letter-spacing:.18em;
  text-transform:uppercase; color:var(--sea);
}
@media (max-width:860px){ .pmg-posts{ grid-template-columns:1fr; } }

/* ---- Contact ------------------------------------------------------------- */

.pmg-contact{ display:grid; grid-template-columns:.9fr 1.1fr; gap:3.5rem; }
.pmg-contact__links{ display:grid; gap:1px; background:rgba(250,248,244,.16); border:1px solid rgba(250,248,244,.16); margin-top:2rem; }
.pmg-clink{
  background:var(--ink); padding:1.2rem 1.4rem; text-decoration:none;
  display:flex; flex-direction:column; gap:.2rem; transition:background .2s ease;
}
.pmg-clink:hover{ background:var(--ink-2); }
.pmg-clink small{
  font-family:var(--f-data); font-weight:700; font-size:.78rem; letter-spacing:.2em;
  text-transform:uppercase; color:var(--sea-lt);
}
.pmg-clink strong{ font-weight:700; font-size:1.15rem; }

.pmg-form{ display:grid; gap:1.1rem; }
.pmg-form label{
  font-family:var(--f-data); font-weight:700; font-size:.78rem; letter-spacing:.2em;
  text-transform:uppercase; color:var(--sea-lt); display:block; margin-bottom:.45rem;
}
.pmg-form input,.pmg-form textarea,.pmg-form select{
  width:100%; padding:.85rem 1rem; font-family:var(--f-body); font-size:1rem;
  background:rgba(250,248,244,.05); color:var(--paper);
  border:1px solid rgba(250,248,244,.24);
}
.pmg-form input:focus,.pmg-form textarea:focus,.pmg-form select:focus{
  outline:none; border-color:var(--sea-lt); background:rgba(250,248,244,.09);
}
.pmg-form textarea{ min-height:130px; resize:vertical; }
.pmg-form__row{ display:grid; grid-template-columns:1fr 1fr; gap:1.1rem; }
@media (max-width:900px){
  .pmg-contact{ grid-template-columns:1fr; gap:2.6rem; }
  .pmg-form__row{ grid-template-columns:1fr; }
}

/* ---- Footer -------------------------------------------------------------- */

.pmg-foot{ background:var(--ink-2); color:rgba(250,248,244,.82); padding:4rem 0 0; font-size:1.02rem; }
.pmg-foot__grid{ display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:2.5rem; padding-bottom:3rem; }
.pmg-foot h4{
  font-family:var(--f-data); font-weight:700; font-size:.8rem; letter-spacing:.22em;
  text-transform:uppercase; color:var(--sea-lt); margin:0 0 1.1rem;
}
.pmg-foot ul{ list-style:none; margin:0; padding:0; display:grid; gap:.6rem; }
.pmg-foot a{ text-decoration:none; }
.pmg-foot a:hover{ color:var(--sea-lt); }
.pmg-foot__brand{ font-family:var(--f-display); font-size:1.3rem; color:var(--paper); margin:0 0 .8rem; }
.pmg-foot__bar{
  border-top:1px solid rgba(250,248,244,.14); padding:1.6rem 0;
  display:flex; justify-content:space-between; gap:1.4rem; flex-wrap:wrap;
  font-family:var(--f-data); font-size:.66rem; letter-spacing:.14em; text-transform:uppercase;
  color:rgba(250,248,244,.5);
}
.pmg-foot__disc{ font-size:.78rem; line-height:1.6; color:rgba(250,248,244,.45); padding-bottom:2.5rem; max-width:none; }
@media (max-width:900px){ .pmg-foot__grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:560px){ .pmg-foot__grid{ grid-template-columns:1fr; } }

/* ---- Sticky mobile call bar --------------------------------------------- */

.pmg-mobile-bar{ display:none; }
@media (max-width:720px){
  .pmg-mobile-bar{
    display:grid; grid-template-columns:1fr 1fr;
    position:fixed; bottom:0; left:0; right:0; z-index:80;
    border-top:1px solid var(--sea);
  }
  .pmg-mobile-bar a{
    padding:.95rem; text-align:center; text-decoration:none;
    font-family:var(--f-data); font-size:.86rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase;
  }
  .pmg-mobile-bar a:first-child{ background:var(--ink); color:var(--paper); }
  .pmg-mobile-bar a:last-child{ background:var(--sea); color:#fff; }
  body.pmg{ padding-bottom:52px; }
}

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

/* ---- Custom logo ---------------------------------------------------------
   Logo is set in Appearance → Customize → Site Identity, so there's no
   hardcoded file path to break. Falls back to the wordmark if none is set. */

.pmg-logo--img{ line-height:0; }
.pmg-logo--img img{
  height:46px; width:auto; max-width:260px;
  object-fit:contain;
}
@media (max-width:640px){
  .pmg-logo--img img{ height:36px; max-width:190px; }
}
/* Transparent PNG — no plate needed. */

/* ---- Image-less fallbacks ------------------------------------------------
   Cards and hero degrade to a typographic treatment when no photo exists,
   so a missing upload reads as a design choice, not a hole. */

.pmg-buy__card--noimg{
  background:var(--ink);
  border-top:2px solid var(--sea);
  justify-content:space-between;
  min-height:230px;
}
.pmg-buy__card--noimg::after{ display:none; }
.pmg-buy__card--noimg .pmg-buy__body h3{ font-size:1.7rem; }
.pmg-buy__card--noimg .pmg-mark{
  position:relative; z-index:2;
  font-family:var(--f-data); font-size:.62rem; letter-spacing:.24em;
  text-transform:uppercase; color:var(--sea-lt);
}
.pmg-buy__card--noimg:hover{ background:var(--ink-2); }

.pmg-hero--noimg{ background:var(--ink); }
.pmg-hero--noimg::after{
  background:
    radial-gradient(900px 420px at 78% 18%, rgba(129,216,208,.14), transparent 70%),
    linear-gradient(100deg, rgba(18,20,26,.96) 0%, rgba(18,20,26,.86) 60%, rgba(18,20,26,.6) 100%);
}
.pmg-showroom--noimg{ grid-template-columns:1fr; max-width:820px; }

/* ---- Long-form body copy -------------------------------------------------
   Measure capped for readability; H3s carry the subtopics that the page needs
   to cover, so they're structural rather than decorative. */

.pmg-prose{ max-width:68ch; font-size:1.08rem; }
.pmg-prose p{ margin:0 0 1.4rem; }
.pmg-prose h3{
  font-size:1.5rem; margin:2.4rem 0 .7rem;
  padding-top:1.4rem; border-top:1px solid var(--stone-2);
}
.pmg-prose h3:first-of-type{ margin-top:1.8rem; }

/* ---- Find us (sitewide) --------------------------------------------------
   Map is sticky on desktop so it stays visible while transit copy scrolls.
   Aspect-ratio on the iframe keeps it responsive without the old padding hack. */

.pmg-find{ background:var(--stone); padding:clamp(3.5rem,7vw,5.5rem) 0; border-top:1px solid var(--stone-2); }
.pmg-find__grid{ display:grid; grid-template-columns:1.05fr .95fr; gap:3.5rem; align-items:start; }

.pmg-find__actions{ display:flex; gap:.8rem; flex-wrap:wrap; margin:1.8rem 0 0; }

.pmg-find__map{ position:sticky; top:110px; }
.pmg-find__map iframe{
  width:100%; aspect-ratio:4/5; display:block;
  border:1px solid var(--stone-2);
}

.pmg-transit{ margin-top:2.6rem; }
.pmg-transit__row{ padding:1.5rem 0; border-top:1px solid var(--stone-2); }
.pmg-transit__row h3{
  font-size:1.02rem; font-weight:800; margin:0 0 .5rem;
  letter-spacing:.06em; text-transform:uppercase; color:var(--sea);
}
.pmg-transit__row p{ margin:0; font-size:1.02rem; line-height:1.7; color:var(--ink-3); }
.pmg-transit__row strong{ color:var(--ink); font-weight:700; }

@media (max-width:900px){
  .pmg-find__grid{ grid-template-columns:1fr; gap:2.4rem; }
  .pmg-find__map{ position:static; order:-1; }
  .pmg-find__map iframe{ aspect-ratio:4/3; }
}

/* ---- Get an offer form (sitewide) ---------------------------------------
   Generous field height and spacing — this is the money element, so it gets
   the room. Two-up on desktop, single column on mobile. Dark ground so it
   reads as a distinct moment rather than another content band. */

.pmg-offer{
  background:var(--ink);
  color:var(--paper);
  padding:clamp(4rem,8vw,6.5rem) 0;
  scroll-margin-top:130px;          /* clears the sticky header on jump */
}
.pmg-offer__head{ max-width:60ch; margin:0 auto 3.2rem; text-align:center; }
.pmg-offer__head .pmg-lede{ color:rgba(250,248,244,.78); margin:0 auto; }
.pmg-offer__head .pmg-eyebrow{ color:var(--sea-lt); }

.pmg-offer__form{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:1.8rem 2rem;
  max-width:860px;
  margin:0 auto;
}
.pmg-field{ grid-column:1 / -1; }
.pmg-field--half{ grid-column:span 1; }

.pmg-field label{
  display:block;
  font-size:.86rem; font-weight:700;
  letter-spacing:.1em; text-transform:uppercase;
  color:var(--sea-lt);
  margin-bottom:.7rem;
}
.pmg-optional{
  font-weight:500; letter-spacing:.02em; text-transform:none;
  color:rgba(250,248,244,.5); font-size:.86rem;
}

.pmg-field input[type="text"],
.pmg-field input[type="tel"],
.pmg-field input[type="email"],
.pmg-field select,
.pmg-field textarea{
  width:100%;
  padding:1.15rem 1.25rem;
  font-family:var(--f-body); font-size:1.08rem;
  color:var(--paper);
  background:rgba(250,248,244,.06);
  border:1px solid rgba(250,248,244,.28);
  border-radius:2px;
  transition:border-color .18s ease, background .18s ease;
}
.pmg-field textarea{ resize:vertical; min-height:150px; line-height:1.65; }
.pmg-field select{ appearance:none; cursor:pointer;
  background-image:linear-gradient(45deg,transparent 50%,var(--sea-lt) 50%),linear-gradient(135deg,var(--sea-lt) 50%,transparent 50%);
  background-position:calc(100% - 22px) 55%, calc(100% - 15px) 55%;
  background-size:7px 7px,7px 7px; background-repeat:no-repeat;
}
.pmg-field input::placeholder,
.pmg-field textarea::placeholder{ color:rgba(250,248,244,.42); }

.pmg-field input:focus,
.pmg-field select:focus,
.pmg-field textarea:focus{
  outline:none;
  border-color:var(--sea-lt);
  background:rgba(250,248,244,.1);
}

.pmg-field input[type="file"]{
  width:100%; padding:1rem 1.25rem; font-size:.98rem; color:rgba(250,248,244,.8);
  background:rgba(250,248,244,.04);
  border:1px dashed rgba(250,248,244,.3); border-radius:2px; cursor:pointer;
}
.pmg-field input[type="file"]::file-selector-button{
  margin-right:1rem; padding:.6rem 1.1rem; cursor:pointer;
  font-family:var(--f-body); font-size:.9rem; font-weight:700;
  color:var(--ink); background:var(--sea-lt); border:0; border-radius:2px;
}

.pmg-hint{
  display:block; margin-top:.6rem;
  font-size:.92rem; color:rgba(250,248,244,.55); line-height:1.5;
}

.pmg-btn--lg{ padding:1.25rem 3rem; font-size:1.1rem; }

.pmg-field--submit{ text-align:center; margin-top:.6rem; }
.pmg-offer__trust{
  margin:1.6rem auto 0; max-width:56ch;
  font-size:.98rem; line-height:1.65; color:rgba(250,248,244,.55);
}
.pmg-offer__trust a{ color:var(--sea-lt); text-decoration:none; border-bottom:1px solid rgba(129,216,208,.4); }

@media (max-width:720px){
  .pmg-offer__form{ grid-template-columns:1fr; gap:1.6rem; }
  .pmg-field--half{ grid-column:1 / -1; }
  .pmg-offer__head{ text-align:left; }
  .pmg-offer__head .pmg-lede{ margin:0; }
}

/* ---- Contact Form 7 overrides -------------------------------------------
   CF7 wraps every field in <span class="wpcf7-form-control-wrap"> and injects
   its own <p> tags. Both break the grid, so they're neutralised here rather
   than fought in the CF7 markup. */

.pmg-offer .wpcf7{ margin:0; }
.pmg-offer .wpcf7 form > p{ margin:0; }
.pmg-offer .wpcf7-form-control-wrap{ display:block; width:100%; }

.pmg-offer .wpcf7-form-control:not(.wpcf7-submit):not([type="file"]){
  width:100%;
  padding:1.15rem 1.25rem;
  font-family:var(--f-body); font-size:1.08rem;
  color:var(--paper);
  background:rgba(250,248,244,.06);
  border:1px solid rgba(250,248,244,.28);
  border-radius:2px;
  transition:border-color .18s ease, background .18s ease;
}
.pmg-offer textarea.wpcf7-form-control{ resize:vertical; min-height:150px; line-height:1.65; }
.pmg-offer select.wpcf7-form-control{ appearance:none; cursor:pointer;
  background-image:linear-gradient(45deg,transparent 50%,var(--sea-lt) 50%),linear-gradient(135deg,var(--sea-lt) 50%,transparent 50%);
  background-position:calc(100% - 22px) 55%, calc(100% - 15px) 55%;
  background-size:7px 7px,7px 7px; background-repeat:no-repeat;
}
.pmg-offer .wpcf7-form-control:focus{
  outline:none; border-color:var(--sea-lt); background:rgba(250,248,244,.1);
}
.pmg-offer .wpcf7-form-control[type="file"]{
  width:100%; padding:1rem 1.25rem; font-size:.98rem; color:rgba(250,248,244,.8);
  background:rgba(250,248,244,.04);
  border:1px dashed rgba(250,248,244,.3); border-radius:2px; cursor:pointer;
}
.pmg-offer .wpcf7-form-control[type="file"]::file-selector-button{
  margin-right:1rem; padding:.6rem 1.1rem; cursor:pointer;
  font-family:var(--f-body); font-size:.9rem; font-weight:700;
  color:var(--ink); background:var(--sea-lt); border:0; border-radius:2px;
}

/* Validation + response messages, restyled to match the dark panel */
.pmg-offer .wpcf7-not-valid{ border-color:#E06A6A !important; }
.pmg-offer .wpcf7-not-valid-tip{
  display:block; margin-top:.5rem; font-size:.92rem; color:#E06A6A;
}
.pmg-offer .wpcf7-response-output{
  grid-column:1 / -1;
  margin:1.6rem 0 0 !important;
  padding:1.1rem 1.4rem !important;
  border-width:1px !important; border-radius:2px;
  font-size:1rem; text-align:center;
}
.pmg-offer form.sent .wpcf7-response-output{
  border-color:var(--sea-lt) !important; color:var(--sea-lt);
  background:rgba(129,216,208,.08);
}
.pmg-offer form.invalid .wpcf7-response-output,
.pmg-offer form.failed .wpcf7-response-output{
  border-color:#E06A6A !important; color:#E06A6A;
  background:rgba(224,106,106,.08);
}
.pmg-offer .wpcf7-spinner{ background-color:var(--sea-lt); }

/* ---- Service pages -------------------------------------------------------
   Two-column: long-form copy left, sticky sidebar right holding the buy list,
   the walk-in card, and cross-links to the other five services. The sidebar
   is what keeps a phone number on screen through a 900-word read. */

.pmg-hero--service{ min-height:clamp(360px,44vh,480px); }
.pmg-hero--service h1{ max-width:18ch; }

.pmg-service{ display:grid; grid-template-columns:minmax(0,1fr) 340px; gap:4rem; align-items:start; }

.pmg-service .pmg-prose{ max-width:none; }
.pmg-service .pmg-prose h2{
  font-size:clamp(1.6rem,2.6vw,2.1rem);
  margin:2.8rem 0 .8rem; padding-top:1.8rem;
  border-top:1px solid var(--stone-2);
}
.pmg-service .pmg-prose > p:first-child{ font-size:1.18rem; color:var(--ink); }

.pmg-editor{ margin-top:2.4rem; }

.pmg-aside{ position:sticky; top:120px; display:grid; gap:1.4rem; }

.pmg-card{ background:var(--stone); border:1px solid var(--stone-2); padding:1.8rem 1.6rem; }
.pmg-card h3{
  font-size:.86rem; font-weight:800; letter-spacing:.14em; text-transform:uppercase;
  color:var(--sea); margin:0 0 1.1rem;
}
.pmg-card p{ margin:0 0 1.2rem; font-size:1.02rem; line-height:1.6; }
.pmg-card .pmg-btn{ width:100%; justify-content:center; }
.pmg-card__note{ margin:1rem 0 0 !important; font-size:.92rem; color:var(--ink-3); }

.pmg-card--cta{ background:var(--ink); border-color:var(--ink); color:var(--paper); }
.pmg-card--cta h3{ color:var(--sea-lt); }
.pmg-card--cta .pmg-card__note{ color:rgba(250,248,244,.6); }

.pmg-ticks{ list-style:none; margin:0; padding:0; display:grid; gap:.75rem; }
.pmg-ticks li{ position:relative; padding-left:1.6rem; font-size:1rem; line-height:1.5; }
.pmg-ticks li::before{
  content:"✓"; position:absolute; left:0; top:0;
  color:var(--sea); font-weight:700; font-size:.92rem;
}

.pmg-links{ list-style:none; margin:0; padding:0; display:grid; gap:.2rem; }
.pmg-links a{
  display:block; padding:.7rem 0; text-decoration:none; font-weight:600;
  border-bottom:1px solid var(--stone-2);
}
.pmg-links li:last-child a{ border-bottom:0; }
.pmg-links a:hover{ color:var(--sea); }

@media (max-width:1000px){
  .pmg-service{ grid-template-columns:1fr; gap:2.8rem; }
  .pmg-aside{ position:static; grid-template-columns:1fr 1fr; }
}
@media (max-width:640px){
  .pmg-aside{ grid-template-columns:1fr; }
}

/* ==========================================================================
   INVERTED BARS — utility strip light, logo bar dark.
   Appended last so it overrides the original block above without editing it.
   ========================================================================== */

/* Top utility strip → light */
.pmg-util{
  background:var(--paper);
  color:var(--ink-3);
  border-bottom:1px solid var(--stone-2);
}
.pmg-util a:hover{ color:var(--sea); }

/* Logo bar → dark */
.pmg-head{
  background:var(--ink);
  border-bottom:1px solid rgba(129,216,208,.28);
}
.pmg-head .pmg-logo{ color:var(--paper); }
.pmg-head .pmg-logo span{ color:var(--sea-lt); }
.pmg-nav a{ color:var(--paper); }
.pmg-nav a:hover{ border-bottom-color:var(--sea-lt); color:var(--sea-lt); }
.pmg-nav .pmg-btn--sea:hover{
  background:var(--paper); border-color:var(--paper); color:var(--ink);
}
.pmg-burger{ color:var(--paper); }

@media (max-width:940px){
  .pmg-nav{
    background:var(--ink);
    border-bottom:1px solid rgba(129,216,208,.28);
  }
  .pmg-nav a{ border-bottom:1px solid rgba(250,248,244,.14); }
}

/* Tape sits under a dark header now — separate it with the accent, not a fill */
.pmg-tape{ background:var(--ink); border-top-color:rgba(129,216,208,.3); }

/* ---- Footer logo --------------------------------------------------------
   Transparent PNG on dark, so no plate. Capped by height so a wide wordmark
   can't blow out the column. */

.pmg-foot__logo{ margin:0 0 1.4rem; line-height:0; }
.pmg-foot__logo img{
  height:auto; width:auto;
  max-width:250px; max-height:78px;
  object-fit:contain;
}
@media (max-width:900px){
  .pmg-foot__logo img{ max-width:210px; max-height:66px; }
}

/* Utility strip — full NAP needs breathing room, and the two groups were
   running together on mid-width screens. */
.pmg-util .pmg-wrap{ gap:1.4rem 2.4rem; padding-top:.35rem; padding-bottom:.35rem; }
.pmg-util__set{ gap:1.8rem; }
@media (max-width:760px){
  .pmg-util{ font-size:.74rem; }
  .pmg-util .pmg-wrap{ justify-content:flex-start; gap:.4rem 1.2rem; }
}

/* Review block — rating line gets a link out to the GBP so the claim is
   checkable rather than asserted. */
.pmg-rating__link{
  margin-left:auto; font-size:.8rem; font-weight:700;
  letter-spacing:.06em; text-transform:none; color:var(--sea);
  text-decoration:none; border-bottom:1px solid rgba(23,132,125,.35);
}
.pmg-rating__link:hover{ border-bottom-color:var(--sea); }
.pmg-review{ margin:0; }
@media (max-width:640px){
  .pmg-rating{ flex-wrap:wrap; }
  .pmg-rating__link{ margin-left:0; flex-basis:100%; }
}

/* ---- Header logo, matched to the footer -------------------------------
   Was 46px and cramped against a 78px bar. The footer version reads better
   because it has both size and room around it, so the header gets the same:
   taller bar, bigger mark, real breathing space on either side. */

.pmg-head .pmg-wrap{ min-height:104px; }

.pmg-logo--img{ display:flex; align-items:center; }
.pmg-head .pmg-logo--img img{
  height:auto; width:auto;
  max-width:300px; max-height:70px;
  object-fit:contain;
}

/* Nav pulls in slightly so the logo keeps its space at mid widths */
@media (max-width:1180px){
  .pmg-nav{ gap:1.4rem; }
  .pmg-head .pmg-logo--img img{ max-width:250px; max-height:62px; }
}
@media (max-width:940px){
  .pmg-head .pmg-wrap{ min-height:88px; }
  .pmg-head .pmg-logo--img img{ max-width:230px; max-height:58px; }
  /* Dropdown clears the taller bar */
  .pmg-nav{ inset:128px 0 auto 0; }
}
@media (max-width:640px){
  .pmg-head .pmg-wrap{ min-height:76px; }
  .pmg-head .pmg-logo--img img{ max-width:190px; max-height:48px; }
  .pmg-nav{ inset:112px 0 auto 0; }
}

/* Anchor offset follows the taller header */
.pmg-offer{ scroll-margin-top:150px; }
.pmg-aside{ top:140px; }
.pmg-find__map{ top:130px; }

/* ---- Service hero — split ------------------------------------------------
   Copy sits on ink at the page's left rail so it stays aligned with the
   content below; the image runs full-bleed to the right edge. Breaking the
   container on one side only is what keeps it from reading as a boxed banner. */

.pmg-shero{ background:var(--ink); color:var(--paper); overflow:hidden; }

.pmg-shero__inner{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  align-items:stretch;
  min-height:clamp(380px,48vh,520px);
}

.pmg-shero__copy{ display:flex; align-items:center; justify-content:flex-end; }
.pmg-shero__copy-in{
  /* Aligns with .pmg-wrap's left edge, then fills to the split */
  width:100%;
  max-width:calc(var(--wrap) / 2);
  padding:3.5rem var(--gut) 3.5rem max(var(--gut), calc((100vw - var(--wrap)) / 2));
}
.pmg-shero h1{
  font-size:clamp(2.3rem,4.4vw,3.6rem);
  margin-bottom:1rem; max-width:14ch;
}
.pmg-shero p{
  color:rgba(250,248,244,.82);
  font-size:1.08rem; max-width:46ch; margin-bottom:1.9rem;
}
.pmg-shero__meta{
  margin:1.6rem 0 0 !important;
  font-size:.84rem !important; font-weight:700;
  letter-spacing:.1em; text-transform:uppercase;
  color:var(--sea-lt) !important;
}

.pmg-shero__media{ position:relative; min-height:340px; }
.pmg-shero__media img{
  position:absolute; inset:0;
  width:100%; height:100%;
  object-fit:cover; object-position:center;
}
/* Feather the image into the ink so the seam isn't a hard vertical line */
.pmg-shero__media::before{
  content:""; position:absolute; inset:0; z-index:2; pointer-events:none;
  background:linear-gradient(90deg, var(--ink) 0%, rgba(18,20,26,.45) 22%, transparent 55%);
}

.pmg-shero--noimg .pmg-shero__inner{ grid-template-columns:1fr; }
.pmg-shero--noimg .pmg-shero__copy-in{ max-width:var(--wrap); }

@media (max-width:900px){
  .pmg-shero__inner{ grid-template-columns:1fr; min-height:0; }
  .pmg-shero__copy-in{ max-width:none; padding:3rem var(--gut) 2.6rem; }
  .pmg-shero h1{ max-width:none; }
  .pmg-shero__media{ min-height:0; height:clamp(220px,42vw,320px); }
  .pmg-shero__media img{ position:static; }
  .pmg-shero__media::before{
    background:linear-gradient(180deg, var(--ink) 0%, rgba(18,20,26,.3) 25%, transparent 60%);
  }
}

/* ---- Mobile: reclaim the top of the screen -----------------------------
   The utility strip cost three lines before anyone saw the logo. Phone lives
   in the sticky bottom bar and the full address is in the footer, so nothing
   is lost by dropping it here. */

@media (max-width:720px){
  .pmg-util{ display:none; }

  /* Tape tightens up — gold and silver are what people came for */
  .pmg-tape__inner{ padding:.5rem 0; gap:1.1rem; }
  .pmg-tape__label{ font-size:.66rem; padding-right:1.1rem; }
  .pmg-tape__row{ gap:1.3rem; }
  .pmg-tape__metal{ font-size:.66rem; }
  .pmg-tape__val{ font-size:.96rem; }
  .pmg-tape__item{ gap:.4rem; }
}

/* Flat marker sits low and quiet — it's an absence of movement, not data */
.pmg-tape__dir[data-dir="flat"]{ font-size:1rem; line-height:0; opacity:.45; }

/* ---- Service hero alignment fix ----------------------------------------
   The copy box was both right-aligned inside its column AND carrying the
   rail padding, so the offset applied twice and left a dead black gutter.
   Now the box fills its column and a single padding-left puts the text
   exactly on the .pmg-wrap rail. */

.pmg-shero__copy{ justify-content:flex-start; }

.pmg-shero__copy-in{
  width:100%;
  max-width:none;
  padding-top:3.5rem;
  padding-bottom:3.5rem;
  padding-right:3rem;
  padding-left:max(var(--gut), calc((100vw - var(--wrap)) / 2));
}

/* Headline had room for ~14 characters, which broke "Sell Silver in NYC"
   across three lines. Wider measure, slightly smaller ceiling. */
.pmg-shero h1{
  font-size:clamp(2.2rem,3.6vw,3.2rem);
  max-width:20ch;
  text-wrap:balance;
}
.pmg-shero p{ max-width:38ch; }

@media (max-width:900px){
  .pmg-shero__copy-in{
    padding-left:var(--gut);
    padding-right:var(--gut);
  }
  .pmg-shero h1{ max-width:none; }
  .pmg-shero p{ max-width:46ch; }
}