/*
Theme Name: Rock Salt & Nails — Project Analog
Theme URI: https://rocksaltnails.com
Author: Rock Salt & Nails
Description: Project Analog v1.2.5. Major visual update with editable homepage statements, magazine layout, Quotes and Journal.
Version: 1.2.5
License: GPLv2 or later
Text Domain: rock-salt-nails
*/

:root{
  --cream:#f7dfad;
  --paper:#fff0c6;
  --mustard:#f59a00;
  --rust:#c82517;
  --red:#9f241a;
  --brown:#4b1208;
  --dark:#20120b;
  --ink:#2b160d;
  --heading-font:Georgia,"Times New Roman",serif;
  --body-font:Georgia,"Times New Roman",serif;
  --shadow:0 18px 44px rgba(75,18,8,.22);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  color:var(--ink);
  font-family:var(--body-font);
  background:
    radial-gradient(circle at 12% 8%,rgba(255,255,255,.20),transparent 25%),
    repeating-linear-gradient(0deg,rgba(75,18,8,.035) 0 2px,transparent 2px 8px),
    var(--cream);
}
body:before{
  content:"";
  position:fixed;
  inset:0;
  z-index:999;
  pointer-events:none;
  opacity:.16;
  background-image:radial-gradient(rgba(75,18,8,.16) .8px,transparent .8px);
  background-size:7px 7px;
}
a{color:inherit}
img{max-width:100%;height:auto;background:transparent!important}
h1,h2,h3,h4{font-family:var(--heading-font)}
button,input,textarea,select{font:inherit}

.rsn-topbar{
  padding:10px 18px;
  background:linear-gradient(180deg,#a72a1d,#7e1c14);
  color:var(--paper);
  text-align:center;
  font:800 13px/1.2 "Courier New",monospace;
  letter-spacing:.16em;
  text-transform:uppercase;
}

.rsn-header{
  position:sticky;
  top:0;
  z-index:30;
  display:grid;
  grid-template-columns:150px 1fr 150px;
  align-items:center;
  gap:20px;
  min-height:76px;
  padding:10px clamp(20px,4vw,58px);
  background:rgba(255,240,198,.95);
  border-bottom:2px solid rgba(75,18,8,.16);
  backdrop-filter:blur(9px);
  overflow:visible;
}

.rsn-logo{
  display:block;
  width:132px;
  height:132px;
  margin:-40px 0 -38px;
  position:relative;
  z-index:5;
  background:transparent!important;
}
.rsn-logo img{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
  background:transparent!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
}
.rsn-logo-fallback{
  width:126px;
  height:126px;
  margin:-36px 0;
  border-radius:50%;
  display:grid;
  place-items:center;
  text-align:center;
  text-decoration:none;
  color:#fff0c6;
  border:6px solid #fff0c6;
  outline:4px solid var(--brown);
  background:linear-gradient(to bottom,#f6c547 0 22%,var(--mustard) 22% 44%,var(--rust) 44% 67%,var(--brown) 67% 100%);
  box-shadow:var(--shadow);
  font-weight:900;
  line-height:.86;
  text-transform:uppercase;
  text-shadow:2px 2px 0 var(--brown);
}
.rsn-nav{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:30px;
  flex-wrap:wrap;
  font:900 13px/1 "Courier New",monospace;
  text-transform:uppercase;
  letter-spacing:.04em;
}
.rsn-nav a{
  text-decoration:none;
  padding:8px 0;
  border-bottom:2px solid transparent;
}
.rsn-nav a:hover{border-color:var(--rust)}
.rsn-social{display:flex;justify-content:flex-end;gap:10px}
.rsn-social a{
  width:30px;height:30px;
  display:grid;place-items:center;
  border:2px solid var(--brown);
  border-radius:50%;
  text-decoration:none;
  font:900 10px/1 system-ui,sans-serif;
}

.rsn-hero{
  min-height:690px;
  display:grid;
  align-items:end;
  padding:100px clamp(24px,6vw,94px) 72px;
  color:var(--paper);
  background:
    linear-gradient(90deg,rgba(32,18,11,.62),rgba(32,18,11,.12)),
    var(--hero-image,url("assets/images/hero.svg")) center/cover no-repeat;
}
.rsn-hero-inner{max-width:880px}
.rsn-hero .rsn-kicker{color:var(--paper);margin-bottom:14px}
.rsn-hero h1{
  margin:0;
  max-width:900px;
  font-size:clamp(76px,12vw,160px);
  line-height:.76;
  letter-spacing:-.055em;
  text-transform:uppercase;
  text-shadow:5px 5px 0 var(--brown),0 0 18px rgba(0,0,0,.2);
}
.rsn-hero p{
  max-width:680px;
  margin:26px 0 0;
  font:800 clamp(20px,2.3vw,29px)/1.25 "Courier New",monospace;
  text-shadow:2px 2px 0 var(--brown);
}
.rsn-scroll-note{
  margin-top:28px;
  font:800 12px/1 "Courier New",monospace;
  letter-spacing:.14em;
  text-transform:uppercase;
}

.rsn-statements{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:12px;
  padding:12px clamp(12px,2vw,24px);
}
.rsn-statement{
  min-height:370px;
  position:relative;
  overflow:hidden;
  display:flex;
  align-items:flex-start;
  padding:26px;
  background:var(--paper);
  border:2px solid rgba(75,18,8,.14);
}
.rsn-statement:before{
  content:"";
  position:absolute;inset:0;
  background:var(--bg) center/cover no-repeat;
  filter:saturate(.82) sepia(.22) contrast(.96);
  transform:scale(1.02);
}
.rsn-statement:after{
  content:"";
  position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(32,18,11,.18),rgba(32,18,11,.48));
}
.rsn-statement-copy{position:relative;z-index:1}
.rsn-statement h2{
  margin:0;
  color:var(--paper);
  font-size:clamp(31px,3.2vw,49px);
  line-height:.88;
  text-transform:uppercase;
  text-shadow:3px 3px 0 var(--brown);
}
.rsn-statement p{
  margin:10px 0 0;
  color:var(--paper);
  font:900 17px/1.1 "Courier New",monospace;
  text-shadow:2px 2px 0 var(--brown);
}

.rsn-section{padding:82px clamp(24px,5.4vw,86px)}
.rsn-kicker{
  margin:0 0 13px;
  color:var(--red);
  font:900 13px/1 "Courier New",monospace;
  letter-spacing:.16em;
  text-transform:uppercase;
}
.rsn-title{
  margin:0;
  color:var(--brown);
  font-size:clamp(44px,7vw,86px);
  line-height:.86;
  letter-spacing:-.045em;
  text-transform:uppercase;
}

.rsn-story{
  display:grid;
  grid-template-columns:.95fr 1.05fr;
  gap:58px;
  align-items:center;
  background:
    linear-gradient(rgba(255,240,198,.78),rgba(255,240,198,.78)),
    repeating-linear-gradient(90deg,rgba(75,18,8,.04) 0 2px,transparent 2px 9px);
  border-block:2px solid rgba(75,18,8,.14);
}
.rsn-polaroid{
  position:relative;
  transform:rotate(-3.5deg);
  padding:18px 18px 64px;
  background:#fff7dd;
  box-shadow:var(--shadow);
}
.rsn-polaroid:after{
  content:"SUMMER '82";
  position:absolute;
  left:28px;
  bottom:18px;
  color:rgba(75,18,8,.62);
  font:800 15px/1 "Courier New",monospace;
  letter-spacing:.08em;
}
.rsn-story-img{
  min-height:410px;
  background:var(--story-image,url("assets/images/story.svg")) center/cover no-repeat;
}
.rsn-story-copy{position:relative}
.rsn-story-copy h2{margin:0 0 22px}
.rsn-story-copy p{
  max-width:720px;
  font:700 19px/1.7 "Courier New",monospace;
}
.rsn-stamp{
  position:absolute;
  right:2%;
  bottom:-44px;
  width:150px;height:150px;
  border:5px solid rgba(75,18,8,.25);
  border-radius:50%;
  display:grid;place-items:center;
  text-align:center;
  color:rgba(75,18,8,.35);
  font:900 18px/.9 system-ui,sans-serif;
  transform:rotate(-16deg);
  text-transform:uppercase;
}

.rsn-magazine{
  background:var(--dark);
  color:var(--paper);
}
.rsn-magazine .rsn-kicker{color:var(--mustard)}
.rsn-magazine .rsn-title{color:var(--paper)}
.rsn-magazine-head{
  display:flex;
  justify-content:space-between;
  gap:30px;
  align-items:end;
  margin-bottom:30px;
}
.rsn-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:22px;
}
.rsn-card{
  position:relative;
  overflow:hidden;
  min-height:410px;
  padding:0;
  background:var(--paper);
  color:var(--ink);
  border:2px solid rgba(255,255,255,.08);
  box-shadow:0 14px 32px rgba(0,0,0,.18);
}
.rsn-card-media{
  aspect-ratio:4/3;
  overflow:hidden;
  background:linear-gradient(135deg,var(--mustard),var(--rust));
}
.rsn-card img{
  width:100%;height:100%;
  object-fit:cover;
  display:block;
}
.rsn-card-body{padding:22px}
.rsn-card h3{
  margin:0 0 10px;
  font-size:31px;
  line-height:.95;
  color:var(--brown);
}
.rsn-card p{margin:0;line-height:1.55}
.rsn-card a{text-decoration:none}
.rsn-card-meta{
  display:block;
  margin-bottom:9px;
  color:var(--red);
  font:900 11px/1 "Courier New",monospace;
  letter-spacing:.13em;
  text-transform:uppercase;
}
.rsn-card-placeholder{
  min-height:410px;
  display:grid;
  place-items:center;
  text-align:center;
  padding:28px;
  background:
    linear-gradient(rgba(75,18,8,.10),rgba(75,18,8,.10)),
    var(--paper);
}
.rsn-card-placeholder h3{font-size:38px}

.rsn-manifest-strip{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:16px;
  padding:18px clamp(18px,3vw,38px);
}
.rsn-manifest-strip div{
  padding:22px;
  text-align:center;
  background:var(--rust);
  color:var(--paper);
  font-size:clamp(20px,2.3vw,34px);
  font-weight:900;
  line-height:.92;
  text-transform:uppercase;
  box-shadow:5px 5px 0 rgba(75,18,8,.18);
}
.rsn-manifest-strip div:nth-child(2){background:var(--mustard);color:var(--brown)}
.rsn-manifest-strip div:nth-child(3){background:var(--brown)}

.rsn-button{
  display:inline-block;
  padding:14px 22px;
  background:var(--mustard);
  color:var(--brown);
  text-decoration:none;
  font:900 13px/1 "Courier New",monospace;
  text-transform:uppercase;
  letter-spacing:.06em;
  border:2px solid rgba(75,18,8,.16);
  box-shadow:4px 4px 0 rgba(75,18,8,.2);
}
.rsn-button.dark{background:var(--rust);color:var(--paper)}

.rsn-page-hero{
  padding:96px 24px 62px;
  text-align:center;
  background:
    linear-gradient(rgba(75,18,8,.08),rgba(75,18,8,.03)),
    var(--paper);
  border-bottom:2px solid rgba(75,18,8,.14);
}
.rsn-page-hero h1{
  margin:0;
  color:var(--brown);
  font-size:clamp(58px,9vw,118px);
  line-height:.78;
  letter-spacing:-.05em;
  text-transform:uppercase;
}
.rsn-content{
  max-width:980px;
  margin:0 auto;
  padding:64px 24px;
  font-size:20px;
  line-height:1.72;
}
.rsn-content>img,.rsn-content figure{margin-bottom:30px}

.rsn-club{
  display:grid;
  grid-template-columns:1fr 1.2fr;
  gap:34px;
  align-items:center;
  margin:44px clamp(24px,5.4vw,86px) 0;
  padding:38px;
  background:var(--red);
  color:var(--paper);
  box-shadow:var(--shadow);
}
.rsn-club h2{
  margin:0 0 8px;
  font-size:clamp(40px,5vw,68px);
  line-height:.88;
  text-transform:uppercase;
}
.rsn-club p{margin:0}
.rsn-form{display:flex;gap:10px}
.rsn-form input{
  flex:1;
  padding:15px 16px;
  border:0;
  background:var(--paper);
  color:var(--ink);
}
.rsn-form button{
  padding:15px 18px;
  border:0;
  background:var(--mustard);
  color:var(--brown);
  font:900 13px/1 "Courier New",monospace;
  text-transform:uppercase;
  cursor:pointer;
}

.rsn-footer{
  display:grid;
  grid-template-columns:1.25fr 1fr 1fr 1fr;
  gap:34px;
  padding:52px clamp(24px,5.4vw,86px);
  background:var(--dark);
  color:var(--paper);
}
.rsn-footer .rsn-logo{margin:0 0 18px;width:96px;height:96px}
.rsn-footer h3{margin:0 0 14px;text-transform:uppercase}
.rsn-footer a{display:block;margin:8px 0;text-decoration:none;color:var(--paper)}
.rsn-bottom{
  padding:12px;
  background:var(--red);
  color:var(--paper);
  text-align:center;
  font:800 12px/1 "Courier New",monospace;
  letter-spacing:.14em;
  text-transform:uppercase;
}

.rsn-admin-edit-note{
  margin-top:18px;
  color:rgba(255,240,198,.75);
  font:700 12px/1.4 "Courier New",monospace;
}

@media(max-width:1050px){
  .rsn-header{grid-template-columns:120px 1fr}
  .rsn-social{grid-column:2}
  .rsn-statements{grid-template-columns:1fr 1fr}
  .rsn-story{grid-template-columns:1fr}
  .rsn-grid{grid-template-columns:1fr 1fr}
  .rsn-footer{grid-template-columns:1fr 1fr}
}
@media(max-width:700px){
  .rsn-header{display:block;text-align:center;padding-top:14px}
  .rsn-logo{width:108px;height:108px;margin:-28px auto 10px}
  .rsn-nav{gap:14px}
  .rsn-social{justify-content:center;margin-top:8px}
  .rsn-hero{min-height:590px;padding:90px 22px 54px}
  .rsn-statements,.rsn-grid,.rsn-manifest-strip,.rsn-club,.rsn-footer{grid-template-columns:1fr}
  .rsn-magazine-head{display:block}
  .rsn-form{display:block}
  .rsn-form input,.rsn-form button{width:100%;margin-top:8px}
  .rsn-stamp{display:none}
}


/* v0.6 content pages */
.rsn-prose-lead{
  font-size:clamp(24px,3vw,34px);
  line-height:1.35;
  color:var(--brown);
  font-weight:700;
}
.rsn-prose-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:28px;
  margin:36px 0;
}
.rsn-prose-card{
  padding:26px;
  background:var(--paper);
  border:2px solid rgba(75,18,8,.14);
  box-shadow:5px 5px 0 rgba(75,18,8,.10);
}
.rsn-prose-card h2{
  margin-top:0;
  color:var(--brown);
  font-size:34px;
  line-height:.95;
  text-transform:uppercase;
}
.rsn-quote-wall{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:18px;
  margin-top:30px;
}
.rsn-quote-wall blockquote{
  margin:0;
  padding:26px;
  background:var(--paper);
  color:var(--brown);
  border:2px solid rgba(75,18,8,.14);
  font-size:clamp(28px,4vw,48px);
  line-height:.92;
  font-weight:900;
  text-transform:uppercase;
}
.rsn-contact-box{
  padding:30px;
  background:var(--paper);
  border:2px solid rgba(75,18,8,.14);
  box-shadow:6px 6px 0 rgba(75,18,8,.12);
}
.rsn-contact-box a{font-weight:900;color:var(--red)}
.rsn-newsletter-note{
  margin-top:10px;
  color:rgba(255,240,198,.78);
  font:700 12px/1.5 "Courier New",monospace;
}
.rsn-empty-state{
  padding:28px;
  background:var(--paper);
  border:2px dashed rgba(75,18,8,.25);
}
@media(max-width:700px){
  .rsn-prose-grid,.rsn-quote-wall{grid-template-columns:1fr}
}

/* v0.7 */
.rsn-wall{display:grid;gap:18px;max-width:1100px;margin:0 auto;padding:64px 24px}.rsn-wall-item{padding:30px;background:var(--paper);color:var(--brown);border:2px solid rgba(75,18,8,.14);box-shadow:7px 7px 0 rgba(75,18,8,.12)}.rsn-wall-item:nth-child(3n+2){background:var(--mustard)}.rsn-wall-item:nth-child(3n){background:var(--rust);color:var(--paper)}.rsn-wall-item h2{margin:0;font-size:clamp(34px,6vw,78px);line-height:.88;text-transform:uppercase}.rsn-wall-item p{margin:12px 0 0;font:800 17px/1.3 "Courier New",monospace}.rsn-404{min-height:68vh;display:grid;place-items:center;text-align:center;padding:70px 24px}.rsn-404 h1{margin:0;font-size:clamp(84px,18vw,220px);line-height:.75;color:var(--brown)}.rsn-404 p{max-width:620px;font-size:22px;line-height:1.5}.rsn-search-form{display:flex;max-width:640px;margin:24px auto 0}.rsn-search-form input{flex:1;padding:15px;border:2px solid rgba(75,18,8,.18);background:var(--paper)}.rsn-search-form button{border:0;padding:15px 20px;background:var(--rust);color:var(--paper);font-weight:900;text-transform:uppercase}.rsn-remember{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;margin-top:34px}.rsn-remember div{min-height:190px;display:grid;place-items:center;padding:24px;text-align:center;background:var(--paper);border:2px solid rgba(75,18,8,.14);font-size:clamp(26px,4vw,48px);line-height:.95;font-weight:900}@media(max-width:700px){.rsn-remember{grid-template-columns:1fr}.rsn-search-form{display:block}.rsn-search-form input,.rsn-search-form button{width:100%}}


/* v1.0 article presentation */
.rsn-article-meta{
  display:flex;
  justify-content:center;
  flex-wrap:wrap;
  gap:10px;
  margin:18px auto 0;
  font:800 12px/1 "Courier New",monospace;
  text-transform:uppercase;
  letter-spacing:.10em;
}
.rsn-article-meta span{
  padding:8px 11px;
  background:var(--mustard);
  color:var(--brown);
}
.rsn-article-hero{
  width:100%;
  max-height:720px;
  object-fit:cover;
  display:block;
  margin:0 0 42px;
}
.rsn-quote-single{
  max-width:1050px;
  margin:0 auto;
  padding:70px 24px;
  text-align:center;
}
.rsn-quote-single h1{
  margin:0;
  color:var(--brown);
  font-size:clamp(54px,10vw,126px);
  line-height:.82;
  text-transform:uppercase;
  letter-spacing:-.05em;
}
.rsn-quote-single .rsn-prose-lead{max-width:850px;margin:24px auto}


/* v1.1 Journal presentation */
.rsn-reading-time{
  display:inline-flex;
  align-items:center;
  gap:7px;
}
.rsn-related{
  margin-top:70px;
  padding-top:36px;
  border-top:2px solid rgba(75,18,8,.14);
}
.rsn-related h2{
  margin:0 0 24px;
  color:var(--brown);
  font-size:clamp(36px,5vw,62px);
  line-height:.9;
  text-transform:uppercase;
}
.rsn-prev-next{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px;
  margin-top:42px;
}
.rsn-prev-next a{
  display:block;
  padding:22px;
  background:var(--paper);
  border:2px solid rgba(75,18,8,.14);
  text-decoration:none;
  font-weight:900;
}
.rsn-prev-next a:last-child{text-align:right}
@media(max-width:700px){.rsn-prev-next{grid-template-columns:1fr}}


/* v1.2 focused site structure */
.rsn-wall-intro{
  max-width:820px;
  margin:0 auto;
  padding:32px 24px 0;
  text-align:center;
}
.rsn-wall-intro p{
  margin:0;
  font:800 18px/1.45 "Courier New",monospace;
  color:var(--brown);
}
.rsn-contact-clean{
  max-width:760px;
  margin:0 auto;
  padding:64px 24px;
}
.rsn-contact-clean h2{
  margin:0 0 18px;
  color:var(--brown);
  font-size:clamp(42px,7vw,82px);
  line-height:.88;
  text-transform:uppercase;
}
.rsn-contact-clean p{
  font-size:20px;
  line-height:1.7;
}
.rsn-home-wall-preview{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:16px;
}
.rsn-home-wall-preview article{
  padding:28px;
  min-height:220px;
  display:grid;
  place-items:center;
  text-align:center;
  background:var(--paper);
  color:var(--brown);
  border:2px solid rgba(75,18,8,.14);
  box-shadow:5px 5px 0 rgba(75,18,8,.12);
}
.rsn-home-wall-preview article:nth-child(2){background:var(--mustard)}
.rsn-home-wall-preview article:nth-child(3){background:var(--rust);color:var(--paper)}
.rsn-home-wall-preview h3{
  margin:0;
  font-size:clamp(30px,4vw,54px);
  line-height:.9;
  text-transform:uppercase;
}
@media(max-width:800px){
  .rsn-home-wall-preview{grid-template-columns:1fr}
}


/* v1.2.3 clickable Wall previews */
.rsn-wall-link{
  display:block;
  text-decoration:none;
  color:inherit;
}
.rsn-wall-item{
  transition:transform .18s ease, box-shadow .18s ease;
}
.rsn-wall-link:hover .rsn-wall-item,
.rsn-wall-link:focus .rsn-wall-item{
  transform:translateY(-3px);
  box-shadow:10px 10px 0 rgba(75,18,8,.16);
}
.rsn-wall-preview{
  display:grid;
  grid-template-columns:120px 1fr;
  gap:20px;
  align-items:center;
}
.rsn-wall-thumb{
  width:120px;
  aspect-ratio:1/1;
  object-fit:cover;
  display:block;
  background:transparent!important;
}
.rsn-wall-copy h2{margin:0}
.rsn-wall-copy p{margin:10px 0 0}
.rsn-wall-readmore{
  display:inline-block;
  margin-top:12px;
  font:900 11px/1 "Courier New",monospace;
  letter-spacing:.12em;
  text-transform:uppercase;
}
@media(max-width:620px){
  .rsn-wall-preview{grid-template-columns:1fr}
  .rsn-wall-thumb{width:100%;max-height:320px;aspect-ratio:4/3}
}
