/* I Buy Old Signs — main stylesheet (mobile-first). Edit colors/fonts in :root. */
@font-face{font-family:"Oswald";src:url("../fonts/oswald-variable-latin.woff2") format("woff2");font-weight:200 700;font-style:normal;font-display:swap}
:root{
  --ink:#1f1b17; --ink-2:#3a332c; --cream:#f6efe0; --paper:#fbf7ee; --rust:#b3261e; --rust-d:#8e1d17;
  --green:#1f5a45; --line:#d9ccb2; --muted:#6b5f52; --radius:10px;
  --display:"Oswald","Bebas Neue","Arial Narrow","Roboto Condensed","Helvetica Neue",Arial,sans-serif;
  --body:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
body{margin:0;font-family:var(--body);font-size:1.0625rem;line-height:1.6;color:var(--ink);background:var(--paper)}
img{max-width:100%;height:auto;display:block}
a{color:var(--rust-d)}
a:hover{color:var(--rust)}
:focus-visible{outline:3px solid #e8a33d;outline-offset:2px}
h1,h2,h3{font-family:var(--display);line-height:1.1;margin:0 0 .5em;letter-spacing:.01em}
h3{font-size:1.2rem}
.wrap{width:min(1120px,100% - 2.5rem);margin-inline:auto}
.narrow{max-width:760px}
.visually-hidden{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip-link{position:absolute;left:-999px;top:0;background:var(--ink);color:#fff;padding:.6rem 1rem;z-index:100}
.skip-link:focus{left:.5rem;top:.5rem}

/* Header */
.site-header{background:var(--ink);color:var(--cream);position:sticky;top:0;z-index:50;border-bottom:4px solid var(--rust)}
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:1rem;min-height:60px}
.brand{display:flex;align-items:center;gap:.6rem;color:var(--cream);text-decoration:none}
.brand-text{font-family:var(--display);font-size:1.35rem;text-transform:uppercase;letter-spacing:.06em;font-weight:700}
.site-nav{display:none}
.site-nav a{color:var(--cream);text-decoration:none;font-weight:600;font-size:.95rem;padding:.4rem .2rem;border-bottom:2px solid transparent}
.site-nav a:hover{border-color:var(--rust);color:#fff}
.header-call{display:none}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-height:52px;padding:.8rem 1.4rem;border-radius:var(--radius);
  font-weight:700;font-size:1.05rem;text-decoration:none;border:2px solid transparent;cursor:pointer;font-family:var(--body);transition:background .15s,transform .15s}
.btn:active{transform:translateY(1px)}
.btn-primary{background:var(--rust);color:#fff}
.btn-primary:hover{background:var(--rust-d);color:#fff}
.btn-secondary{background:transparent;color:var(--cream);border-color:var(--cream)}
.btn-secondary:hover{background:var(--cream);color:var(--ink)}
.btn-on-light{color:var(--ink);border-color:var(--ink)}
.btn-on-light:hover{background:var(--ink);color:var(--cream)}
.btn-small{min-height:42px;padding:.5rem 1rem;font-size:.95rem}
.btn-block{width:100%}
.cta-row{display:flex;flex-wrap:wrap;gap:.75rem;margin:1.25rem 0}
.cta-row .btn{flex:1 1 200px}

/* Hero */
.hero{background:var(--ink);color:var(--cream);padding:2.25rem 0 2.75rem;
  background-image:repeating-linear-gradient(90deg,rgba(255,255,255,.025) 0 2px,transparent 2px 14px)}
.hero-inner{display:grid;gap:2rem;align-items:center}
.eyebrow{text-transform:uppercase;letter-spacing:.14em;font-size:.8rem;font-weight:700;color:#e8a33d;margin:0 0 .5rem}
.hero h1{font-size:clamp(2.6rem,11vw,4.6rem);text-transform:uppercase;margin:0 0 .35em;color:#fff}
.lead{font-size:1.15rem;max-width:36em;color:#eadfc9;margin:0}
.quick-facts{list-style:none;padding:0;margin:0;display:grid;gap:.4rem;font-size:.98rem;color:#eadfc9}
.quick-facts li{padding-left:1.1rem;position:relative}
.quick-facts li::before{content:"";position:absolute;left:0;top:.62em;width:.5rem;height:.5rem;border-radius:50%;background:var(--rust)}
.quick-facts strong{color:#fff}
.hero-photo{margin:0;border:6px solid var(--cream);border-radius:6px;box-shadow:0 12px 30px rgba(0,0,0,.45);overflow:hidden;background:#2b251f}
.hero-photo img{width:100%;aspect-ratio:4/3;object-fit:cover}

/* Cut-out photos (transparent background) sit on the dark hero without a frame */
.hero-photo--cutout,.page-photo--cutout{border:0;border-radius:0;box-shadow:none;background:transparent;overflow:visible;max-width:460px;justify-self:center;width:100%}
.hero-photo--cutout img,.page-photo--cutout img{aspect-ratio:auto;object-fit:contain;width:100%;height:auto;filter:drop-shadow(0 16px 32px rgba(0,0,0,.55))}
.page-photo--cutout figcaption{background:transparent;color:#eadfc9;text-align:center;padding:.6rem 0 0}

/* Sections */
.section{padding:3.25rem 0}
.section-alt{background:var(--cream)}
.section-dark{background:var(--ink-2);color:var(--cream)}
.section-dark .section-intro{color:#d7cab2}
.section-title{font-size:clamp(1.8rem,6vw,2.6rem);text-transform:uppercase;position:relative;padding-bottom:.4rem}
.section-title::after{content:"";display:block;width:64px;height:4px;background:var(--rust);margin-top:.5rem}
.section-intro{color:var(--muted);max-width:42em;margin:0 0 1.75rem}

/* What I buy */
.buy-grid{list-style:none;margin:0;padding:0;display:grid;gap:.9rem;grid-template-columns:1fr}
.buy-card{background:#fff;border:2px solid var(--line);border-left:6px solid var(--rust);border-radius:var(--radius);padding:1rem 1.1rem}
.buy-card h3{margin:0 0 .2rem;text-transform:uppercase;color:var(--ink)}
.buy-card p{margin:0;color:var(--muted);font-size:.98rem}
.buy-card:last-child{border-left-color:var(--green)}

/* Gallery */
.gallery{display:grid;gap:1rem;grid-template-columns:1fr}
.gallery-item{margin:0;background:#2b251f;border-radius:8px;overflow:hidden;border:1px solid rgba(255,255,255,.08)}
.gallery-item img{width:100%;aspect-ratio:1/1;object-fit:cover}
.gallery-item figcaption{padding:.6rem .85rem;font-size:.92rem;color:#d7cab2}

/* Two-column info blocks */
.two-col{display:grid;gap:2.25rem}
.info-block p{font-size:1.1rem;margin:0}

/* Steps */
.steps{list-style:none;counter-reset:s;margin:0;padding:0;display:grid;gap:1rem}
.steps li{counter-increment:s;background:#fff;border:2px solid var(--line);border-radius:var(--radius);padding:1.1rem 1.1rem 1.1rem 4.2rem;position:relative}
.steps li::before{content:counter(s);position:absolute;left:1rem;top:1rem;width:2.4rem;height:2.4rem;border-radius:50%;background:var(--rust);color:#fff;
  font-family:var(--display);font-weight:700;font-size:1.2rem;display:grid;place-items:center}
.steps h3{margin:0 0 .2rem;text-transform:uppercase}
.steps p{margin:0;color:var(--muted)}

/* Contact */
.contact-grid{display:grid;gap:2.25rem}
.big-phone{font-family:var(--display);font-size:clamp(2.2rem,10vw,3.2rem);font-weight:700;margin:.4rem 0}
.big-phone a{color:var(--ink);text-decoration:none}
.big-phone a:hover{color:var(--rust)}
.fb-link{color:var(--muted)}
.sell-form{background:#fff;border:2px solid var(--line);border-radius:var(--radius);padding:1.25rem}
.sell-form h3{text-transform:uppercase;font-size:1.4rem}
.form-note{font-size:.9rem;color:var(--muted);margin:0 0 1rem}
.field{margin:0 0 1rem;border:0;padding:0}
.field label,.field legend{display:block;font-weight:700;margin-bottom:.3rem}
.optional{font-weight:400;color:var(--muted)}
input[type=text],input[type=tel],textarea{width:100%;font:inherit;font-size:1rem;padding:.75rem .85rem;border:2px solid #bfb29a;border-radius:8px;background:var(--paper);color:var(--ink)}
input:focus,textarea:focus{border-color:var(--ink);outline:none;box-shadow:0 0 0 3px rgba(232,163,61,.5)}
textarea{resize:vertical;min-height:7rem}
[aria-invalid=true]{border-color:var(--rust)!important}
.hint{font-size:.88rem;color:var(--muted);margin:.3rem 0 0}
.error{font-size:.9rem;color:var(--rust-d);font-weight:700;margin:.3rem 0 0;min-height:0}
.error:empty{display:none}
.radio-row{display:flex;flex-wrap:wrap;gap:1.25rem}
.radio-row label{display:flex;align-items:center;gap:.4rem;font-weight:400;min-height:44px;cursor:pointer}
.radio-row input{width:1.2rem;height:1.2rem;accent-color:var(--rust)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.form-status{margin-top:1rem;font-size:.98rem;display:none;padding:.9rem 1rem;border-radius:8px;background:var(--cream);border-left:5px solid var(--green)}
.form-status.show{display:block}
.form-status.err{border-left-color:var(--rust)}
.form-status .btn{margin-top:.6rem}

/* FAQ */
details{background:#fff;border:2px solid var(--line);border-radius:var(--radius);margin-bottom:.75rem}
summary{cursor:pointer;font-weight:700;padding:1rem 1.1rem;list-style:none;position:relative;padding-right:2.8rem}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";position:absolute;right:1.1rem;top:50%;transform:translateY(-50%);font-size:1.5rem;color:var(--rust)}
details[open] summary::after{content:"\2013"}
details p{margin:0;padding:0 1.1rem 1rem}

/* Footer */
.site-footer{background:var(--ink);color:#d7cab2;padding:2.25rem 0;border-top:4px solid var(--rust)}
.site-footer a{color:var(--cream)}
.footer-brand{font-family:var(--display);text-transform:uppercase;letter-spacing:.06em;font-size:1.3rem;color:#fff;margin:0 0 .4rem}
.footer-inner p{margin:.35rem 0}
.small{font-size:.85rem;color:#a99c86}

/* Mobile call/text bar */
.mobile-bar{position:fixed;left:0;right:0;bottom:0;display:grid;grid-template-columns:1fr 1fr;z-index:60;box-shadow:0 -4px 14px rgba(0,0,0,.25)}
.mobile-bar a{display:flex;align-items:center;justify-content:center;min-height:56px;font-weight:800;font-size:1.1rem;text-decoration:none;
  text-transform:uppercase;letter-spacing:.06em;padding-bottom:env(safe-area-inset-bottom)}
.mobile-bar-call{background:var(--rust);color:#fff}
.mobile-bar-text{background:var(--ink);color:var(--cream)}

/* Simple page (thank-you / 404) */
.simple-page{min-height:60vh;display:grid;place-items:center;text-align:center;padding:3rem 0}
.simple-page .cta-row{justify-content:center}

/* ---------- Larger screens ---------- */
@media (min-width:600px){
  .buy-grid{grid-template-columns:repeat(2,1fr)}
  .gallery{grid-template-columns:repeat(2,1fr)}
  .steps{grid-template-columns:repeat(3,1fr)}
  .steps li{padding:3.9rem 1.1rem 1.1rem}
  .sell-form{padding:1.75rem}
}
@media (min-width:960px){
  .mobile-bar{display:none}
  .site-nav{display:flex;gap:1.5rem}
  .header-call{display:inline-flex}
  .hero{padding:4rem 0 4.5rem}
  .hero-inner{grid-template-columns:1.05fr .95fr;gap:3rem}
  .buy-grid{grid-template-columns:repeat(4,1fr)}
  .gallery{grid-template-columns:repeat(3,1fr)}
  .two-col{grid-template-columns:1fr 1fr;gap:3rem}
  .contact-grid{grid-template-columns:.9fr 1.1fr;gap:3rem;align-items:start}
  .section{padding:4.5rem 0}
}

/* ---------- Photo presentation ---------- */
.hero-photo--portrait{max-width:440px;justify-self:center;width:100%}
.hero-photo--portrait img{aspect-ratio:4/5}
.gallery{grid-auto-flow:dense}
.gallery-item img{aspect-ratio:4/5;transition:transform .35s ease}
.gallery-item--wide img{aspect-ratio:8/5}
.gallery-link{display:block;overflow:hidden}
.gallery-link:hover img,.gallery-link:focus-visible img{transform:scale(1.03)}
@media (min-width:600px){.gallery-item--wide{grid-column:span 2}}
.lead-dark{font-size:1.2rem;color:var(--ink-2)}
.simple-page .section-title::after{margin-inline:auto}

/* Header refinements */
.brand-text{white-space:nowrap}
.site-header .header-call{display:none}
@media (min-width:960px){.site-header .header-call{display:inline-flex}}
@media (max-width:380px){.brand-text{font-size:1.15rem}}
section[id],article[id]{scroll-margin-top:84px}

/* =====================================================================
   Multi-page additions (Nov 2026 rebuild)
   ===================================================================== */
.brand-mark{display:inline-flex;flex:none}
.site-nav a[aria-current=page]{border-color:var(--rust);color:#fff}
.btn svg{flex:none}

/* Mobile menu (nav shows as a row without JS; collapses behind "Menu" with JS) */
.nav-toggle{display:none}
.site-nav{display:flex;flex-wrap:wrap;gap:.25rem 1rem;width:100%;padding:0 0 .6rem}
.header-inner{flex-wrap:wrap}
.nav-phone{display:none}
.js .nav-toggle{display:inline-flex;align-items:center;gap:.55rem;min-height:44px;padding:.4rem .8rem;background:transparent;color:var(--cream);
  border:2px solid rgba(246,239,224,.45);border-radius:8px;font:700 .95rem/1 var(--body);text-transform:uppercase;letter-spacing:.06em;cursor:pointer}
.js .nav-toggle:hover{border-color:var(--cream)}
.nav-toggle-bars{position:relative;width:18px;height:2px;background:currentColor;border-radius:2px}
.nav-toggle-bars::before,.nav-toggle-bars::after{content:"";position:absolute;left:0;width:18px;height:2px;background:currentColor;border-radius:2px;transition:transform .2s}
.nav-toggle-bars::before{top:-6px}.nav-toggle-bars::after{top:6px}
.nav-toggle[aria-expanded=true] .nav-toggle-bars{background:transparent}
.nav-toggle[aria-expanded=true] .nav-toggle-bars::before{transform:translateY(6px) rotate(45deg)}
.nav-toggle[aria-expanded=true] .nav-toggle-bars::after{transform:translateY(-6px) rotate(-45deg)}
@media (max-width:959px){
  .js .site-nav{display:none;flex-direction:column;gap:0;padding:.25rem 0 1rem}
  .js .site-nav.is-open{display:flex}
  .js .site-nav a{display:flex;align-items:center;min-height:48px;font-size:1.05rem;border-bottom:1px solid rgba(246,239,224,.12)}
  .js .site-nav a[aria-current=page]{color:#fff;border-bottom-color:rgba(246,239,224,.12);box-shadow:inset 4px 0 0 var(--rust);padding-left:.8rem}
  .js .nav-phone{display:flex;justify-content:center;margin-top:.75rem;background:var(--rust);border-radius:var(--radius);border-bottom:0!important;color:#fff!important}
  .site-nav a{min-height:44px;display:inline-flex;align-items:center}
}

/* Linked category cards */
.buy-grid > li{display:flex}
.buy-card--link{display:flex;flex-direction:column;width:100%;text-decoration:none;color:inherit;transition:border-color .15s,box-shadow .15s,transform .15s}
.buy-card--link:hover,.buy-card--link:focus-visible{border-color:var(--ink);border-left-color:var(--rust);box-shadow:0 8px 20px rgba(31,27,23,.12);transform:translateY(-2px);color:inherit}
.buy-card--link p{flex:1}
.card-more{display:block;margin-top:.7rem;font-weight:700;font-size:.92rem;color:var(--rust-d)}
.buy-grid > li:last-child .buy-card{border-left-color:var(--green)}
.buy-card:last-child{border-left-color:var(--rust)}
.buy-card--other{background:var(--cream)}
.buy-card--other .card-more{color:var(--green)}
.buy-grid--large .buy-card{padding:1.3rem 1.3rem 1.2rem}
.section-more{margin:1.5rem 0 0;font-weight:700}

/* Inner-page hero */
.page-hero{background:var(--ink);color:var(--cream);padding:1.5rem 0 2.5rem;
  background-image:repeating-linear-gradient(90deg,rgba(255,255,255,.025) 0 2px,transparent 2px 14px)}
.page-hero-inner{display:grid;gap:2rem;align-items:center}
.page-hero h1{font-size:clamp(2.3rem,9.5vw,4rem);text-transform:uppercase;color:#fff;margin:0 0 .35em}
.page-hero .lead{max-width:38em}
.page-hero--compact{padding-bottom:2.75rem}
.hero-note{margin:0;color:#d7cab2;font-size:.98rem}
.breadcrumb ol{list-style:none;display:flex;flex-wrap:wrap;gap:.25rem;margin:0 0 1.1rem;padding:0;font-size:.9rem;color:#bfb29a}
.breadcrumb li+li::before{content:"/";margin-right:.3rem;color:#8a7d68}
.breadcrumb a{color:var(--cream);display:inline-block;padding:.35rem 0}
.breadcrumb [aria-current]{color:#d7cab2;display:inline-block;padding:.35rem 0}
.page-photo{margin:0;border:6px solid var(--cream);border-radius:6px;box-shadow:0 12px 30px rgba(0,0,0,.45);overflow:hidden;background:#2b251f}
.page-photo img{width:100%;aspect-ratio:4/3;object-fit:cover}
.page-photo--portrait{max-width:400px;justify-self:center;width:100%}
.page-photo--portrait img{aspect-ratio:4/5}
.page-photo figcaption{background:var(--cream);color:var(--ink-2);font-size:.88rem;padding:.45rem .75rem}

/* Typographic "sign plate" for categories without a photo yet */
.sign-plate{justify-self:center;display:grid;place-items:center;align-content:center;gap:.35rem;text-align:center;width:min(100%,340px);aspect-ratio:1;
  background:var(--rust);color:var(--cream);border:6px solid var(--cream);box-shadow:inset 0 0 0 10px var(--rust),inset 0 0 0 13px var(--cream),0 12px 30px rgba(0,0,0,.45);
  padding:2rem 1.5rem;font-family:var(--display);text-transform:uppercase}
.sign-plate-top{letter-spacing:.32em;font-size:1rem;font-weight:600}
.sign-plate-main{font-size:clamp(2.4rem,11vw,3.6rem);font-weight:700;line-height:1;color:#fff;letter-spacing:.03em}
.sign-plate-bottom{font-size:.8rem;letter-spacing:.12em;font-weight:500;color:#f3e2c4;border-top:2px solid rgba(246,239,224,.6);padding-top:.45rem}
.sign-plate--round,.sign-plate--gauge{border-radius:50%}
.sign-plate--rect{aspect-ratio:5/4;border-radius:10px;background:var(--green);box-shadow:inset 0 0 0 10px var(--green),inset 0 0 0 13px var(--cream),0 12px 30px rgba(0,0,0,.45)}
.sign-plate--neon{aspect-ratio:5/4;border-radius:14px;background:#141110;border-color:#3a332c;box-shadow:0 12px 30px rgba(0,0,0,.45)}
.sign-plate--neon .sign-plate-main{color:#ffe9e4;text-shadow:0 0 6px #ff5a4a,0 0 16px #e0301e,0 0 30px #b3261e}
.sign-plate--neon .sign-plate-top,.sign-plate--neon .sign-plate-bottom{color:#f3c983;text-shadow:0 0 8px rgba(232,163,61,.7)}
.sign-plate--neon .sign-plate-bottom{border-top-color:rgba(232,163,61,.5)}
.sign-plate--pump{aspect-ratio:3/4;width:min(100%,280px);border-radius:24px 24px 8px 8px;background:var(--rust)}
.sign-plate--gauge{background:var(--cream);color:var(--ink);border-color:var(--ink-2);box-shadow:inset 0 0 0 10px var(--cream),inset 0 0 0 13px var(--ink),0 12px 30px rgba(0,0,0,.45)}
.sign-plate--gauge .sign-plate-main{color:var(--rust)}
.sign-plate--gauge .sign-plate-bottom{color:var(--ink-2);border-top-color:var(--ink-2)}

/* Lists, notes, tips */
.look-list{list-style:none;margin:0;padding:0;display:grid;gap:.55rem}
.look-list li{position:relative;padding:.7rem .9rem .7rem 2.6rem;background:#fff;border:2px solid var(--line);border-radius:var(--radius);font-weight:600}
.look-list li::before{content:"";position:absolute;left:.95rem;top:1.05rem;width:.8rem;height:.45rem;border-left:3px solid var(--rust);border-bottom:3px solid var(--rust);transform:rotate(-45deg)}
.note-card{background:var(--cream);border:2px solid var(--line);border-top:6px solid var(--green);border-radius:var(--radius);padding:1.3rem 1.3rem 1.1rem;align-self:start}
.note-card-title{font-size:1.4rem;text-transform:uppercase;margin:0 0 .6rem}
.note-card p{margin:0 0 .8rem}
.tip-grid{list-style:none;margin:0;padding:0;display:grid;gap:1rem}
.tip{background:#fff;border:2px solid var(--line);border-radius:var(--radius);padding:1.1rem 1.15rem;border-top:5px solid var(--rust)}
.tip h3{text-transform:uppercase;margin:0 0 .3rem}
.tip p{margin:0;color:var(--muted)}
.related-list{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.6rem}
.related-list a{display:inline-flex;align-items:center;min-height:44px;padding:.45rem 1rem;border:2px solid var(--ink);border-radius:999px;text-decoration:none;color:var(--ink);font-weight:700;font-size:.95rem}
.related-list a:hover{background:var(--ink);color:var(--cream)}

/* Photo shot list (guide + home teaser) */
.shot-list{list-style:none;counter-reset:shot;margin:0;padding:0;display:grid;gap:.8rem}
.shot-list li{counter-increment:shot;position:relative;background:#fff;border:2px solid var(--line);border-radius:var(--radius);padding:1rem 1rem 1rem 4rem}
.shot-list li::before{content:counter(shot);position:absolute;left:1rem;top:1rem;width:2.2rem;height:2.2rem;border-radius:6px;background:var(--ink);color:var(--cream);
  font-family:var(--display);font-weight:700;font-size:1.15rem;display:grid;place-items:center}
.shot-list h3{margin:0 0 .15rem;text-transform:uppercase}
.shot-list p{margin:0;color:var(--muted)}
.shot-list--compact li{padding:.8rem .9rem .8rem 3.6rem}
.shot-list--compact li::before{top:.8rem;width:2rem;height:2rem;font-size:1rem}
.shot-list--full li{padding:1.2rem 1.2rem 1.2rem 4.4rem}
.guide-teaser{display:grid;gap:1.75rem}
.center{text-align:center}
.section-title--center::after{margin-inline:auto}
.cta-row--center{justify-content:center}
.small-dark{font-size:.92rem;color:var(--muted)}

/* Call-to-action band */
.cta-band{background:var(--rust);color:#fff;padding:2.5rem 0;
  background-image:repeating-linear-gradient(135deg,rgba(0,0,0,.05) 0 2px,transparent 2px 16px)}
.cta-band-inner{display:grid;gap:1.25rem;align-items:center}
.cta-band-title{font-size:clamp(1.7rem,6vw,2.4rem);text-transform:uppercase;color:#fff;margin:0 0 .4rem}
.cta-band p{margin:0;color:#fbe9e5;font-size:1.08rem;max-width:40em}
.cta-band a:not(.btn){color:#fff}
.cta-band-actions{display:flex;flex-wrap:wrap;gap:.75rem;align-items:center}
.cta-band-actions .btn{flex:1 1 200px}
.cta-band .btn-primary{background:var(--ink);color:var(--cream)}
.cta-band .btn-primary:hover{background:#000}
.cta-band .btn-secondary{border-color:#fff;color:#fff}
.cta-band .btn-secondary:hover{background:#fff;color:var(--rust-d)}
.cta-band-link{flex-basis:100%;font-weight:700;padding:.35rem 0}

/* Footer (multi-column) */
.footer-grid{display:grid;gap:1.75rem}
.footer-heading{font-family:var(--display);text-transform:uppercase;letter-spacing:.08em;color:#fff;font-size:1.05rem;margin:0 0 .5rem}
.footer-nav ul{list-style:none;margin:0;padding:0;display:grid;gap:.1rem}
.footer-nav a{display:inline-flex;align-items:center;min-height:40px;text-decoration:none}
.footer-nav a:hover{text-decoration:underline}
.footer-about p{margin:.35rem 0}
.footer-phone{font-weight:700;color:#fff}
.footer-legal{border-top:1px solid rgba(246,239,224,.15);margin-top:1.75rem;padding-top:1rem}
.footer-legal p{margin:.3rem 0}
.mobile-bar a{gap:.5rem}
.simple-links{margin-top:1.5rem;font-weight:700}

@media (min-width:600px){
  .look-list{grid-template-columns:1fr 1fr}
  .tip-grid{grid-template-columns:repeat(2,1fr)}
  .footer-grid{grid-template-columns:1fr 1fr}
  .footer-about{grid-column:1 / -1}
}
@media (min-width:960px){
  .header-inner{flex-wrap:nowrap}
  .js .nav-toggle{display:none}
  .site-nav,.js .site-nav{display:flex;flex-direction:row;width:auto;padding:0;gap:1.4rem;margin-left:auto}
  .site-header .header-call{margin-left:1.25rem}
  .page-hero{padding:2rem 0 4rem}
  .page-hero--compact{padding-bottom:3.5rem}
  .page-hero-inner{grid-template-columns:1.15fr .85fr;gap:3.5rem}
  .two-col--wide{grid-template-columns:1.25fr .75fr}
  .tip-grid{grid-template-columns:repeat(3,1fr)}
  .guide-teaser{grid-template-columns:.8fr 1.2fr;gap:3rem;align-items:start}
  .shot-list--compact{grid-template-columns:1fr 1fr}
  .shot-list--compact li:last-child{grid-column:1 / -1}
  .shot-list--full{grid-template-columns:repeat(2,1fr)}
  .shot-list--full li:last-child{grid-column:1 / -1}
  .cta-band{padding:3rem 0}
  .cta-band-inner{grid-template-columns:1.2fr .8fr;gap:2.5rem}
  .footer-grid{grid-template-columns:1.4fr 1fr 1fr;gap:2.5rem}
  .footer-about{grid-column:auto}
}
@media (min-width:960px) and (max-width:1120px){
  .site-nav,.js .site-nav{gap:1rem}
  .site-nav a{font-size:.9rem}
}
@media (max-width:599px){
  .sign-plate{width:min(100%,250px);padding:1.5rem 1.1rem}
  .sign-plate--pump{width:min(100%,210px)}
  .sign-plate-main{font-size:2.4rem}
  .sign-plate-bottom{font-size:.7rem}
  .page-photo--portrait{max-width:320px}
  .eyebrow{letter-spacing:.1em}
}

/* Single photo in the gallery: let it use the full row until more photos are added */
.gallery > .gallery-item:only-of-type{grid-column:1 / -1}
.gallery > .gallery-item:only-of-type img{aspect-ratio:16/9;object-position:50% 45%}

/* Keep the sticky phone bar from covering the footer: pad the footer, not the page */
@media (max-width:959px){
  .site-footer{padding-bottom:calc(2.25rem + 64px + env(safe-area-inset-bottom))}
  .header-inner{align-content:flex-start;padding-block:.4rem}
}
.cta-band-actions .btn{white-space:nowrap}
@media (min-width:960px){
  .cta-band-inner{grid-template-columns:1fr auto}
  .cta-band-actions{max-width:470px}
  .cta-band-actions .btn{flex:1 1 auto}
}

/* Cut-outs must follow later .page-photo rules so the cream frame does not come back */
.hero-photo.hero-photo--cutout,
.page-photo.page-photo--cutout{border:0;border-radius:0;box-shadow:none;background:transparent;overflow:visible;max-width:460px;max-height:min(620px,70vh);justify-self:center;width:auto}
.hero-photo.hero-photo--cutout img,
.page-photo.page-photo--cutout img{aspect-ratio:auto;object-fit:contain;width:auto;max-width:100%;max-height:min(580px,66vh);height:auto;filter:drop-shadow(0 16px 32px rgba(0,0,0,.55))}
.page-photo.page-photo--cutout figcaption{background:transparent;color:#eadfc9;text-align:center;padding:.6rem 0 0}
@media (max-width:959px){
  .hero,.page-hero{padding-bottom:calc(2.5rem + 64px + env(safe-area-inset-bottom))}
  .hero-photo.hero-photo--cutout,
  .page-photo.page-photo--cutout{max-width:280px;max-height:420px}
  .hero-photo.hero-photo--cutout img,
  .page-photo.page-photo--cutout img{max-height:380px}
}

/* Brand examples Justin provided */
.brand-block{margin-top:1.75rem}
.brand-block h3{font-family:var(--display);font-size:1.05rem;text-transform:uppercase;letter-spacing:.06em;margin:0 0 .4rem}
.brand-block > p{color:var(--muted);margin:0 0 1rem;max-width:42em}
.brand-block dl{margin:0;display:grid;gap:.9rem}
.brand-block dt{font-family:var(--display);font-weight:700;text-transform:uppercase;font-size:.82rem;letter-spacing:.1em;color:var(--rust);margin:0 0 .15rem}
.brand-block dd{margin:0;line-height:1.5}

.brand-block--page{margin-top:0}
@media (min-width:800px){
  .brand-block--page dl{grid-template-columns:repeat(3,1fr);gap:1.5rem}
}

.example-row{display:grid;gap:1.25rem;justify-items:center}
.example-row .example-photo{margin:0;max-width:520px;width:100%}

.gallery-item.gallery-item--cutout{background:transparent;border:0;box-shadow:none}
.gallery-item.gallery-item--cutout .gallery-link{display:flex;align-items:center;justify-content:center;padding:1rem .85rem .35rem;background:transparent}
.gallery-item.gallery-item--cutout img{aspect-ratio:4/5;object-fit:contain;width:100%;height:auto;filter:drop-shadow(0 14px 24px rgba(0,0,0,.55));background:transparent}
.gallery-item.gallery-item--wide.gallery-item--cutout img{aspect-ratio:8/5}
.gallery-item.gallery-item--cutout figcaption{background:transparent;text-align:center}
.example-row .page-photo--cutout,.example-row .example-photo.page-photo--cutout{max-width:520px;background:transparent;border:0;box-shadow:none}