/* rcsanchezbooks.com — The Oathless */
@font-face{font-family:"Cinzel";src:url(/assets/fonts/cinzel-latin-400-normal.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Cinzel";src:url(/assets/fonts/cinzel-latin-700-normal.woff2) format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:"IM Fell English";src:url(/assets/fonts/im-fell-english-latin-400-normal.woff2) format("woff2");font-display:swap}
@font-face{font-family:"IM Fell English";src:url(/assets/fonts/im-fell-english-latin-400-italic.woff2) format("woff2");font-style:italic;font-display:swap}
@font-face{font-family:"IM Fell English SC";src:url(/assets/fonts/im-fell-english-sc-latin-400-normal.woff2) format("woff2");font-display:swap}

:root{
  --salt:#F2EFE6; --bone:#D9CDB3; --bone-2:#E7DFCC; --ink:#2A1D12; --leather:#6B5236; --grey:#8F8A80;
  --night:#1A1A1D; --night-2:#24242A; --red:#B0261C; --red-2:#8F1C14; --dusk:#4B3F5C;
  --display:"Cinzel",Georgia,serif; --body:"IM Fell English",Georgia,serif; --sc:"IM Fell English SC",Georgia,serif;
  --wrap:1120px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--salt);color:var(--ink);font:400 19px/1.6 var(--body)}
img{max-width:100%;height:auto;display:block}
a{color:var(--red);text-underline-offset:3px}
a:hover{color:var(--red-2)}
h1,h2,h3{font-family:var(--display);font-weight:700;line-height:1.12;margin:0;letter-spacing:.04em}
h1{font-size:clamp(38px,6vw,68px)}
h2{font-size:clamp(26px,3.4vw,38px)}
h3{font-size:21px}
p{margin:0}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 24px}
.skip{position:absolute;left:-9999px}.skip:focus{left:16px;top:16px;background:#fff;color:#000;padding:8px 12px;z-index:10}
.kicker{font:400 12.5px/1.4 var(--display);letter-spacing:.32em;text-transform:uppercase;color:var(--red)}
.note{font-size:15px;color:var(--leather)}
.mark{width:34px;margin:0 auto 14px}
.brk{display:flex;justify-content:center;margin:34px 0}
.brk img{width:26px;opacity:.85}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;padding:14px 24px;border-radius:2px;font:400 13px/1 var(--display);letter-spacing:.2em;text-transform:uppercase;text-decoration:none;border:1px solid transparent;cursor:pointer;transition:background .2s,color .2s,border-color .2s}
.btn-primary{background:var(--red);color:#fff;border-color:var(--red)}
.btn-primary:hover{background:var(--red-2);border-color:var(--red-2);color:#fff}
.btn-ghost{background:transparent;color:var(--salt);border-color:rgba(242,239,230,.55)}
.btn-ghost:hover{border-color:var(--salt);color:#fff}
.btn-ghost.on-light{color:var(--ink);border-color:var(--leather)}
.btn-ghost.on-light:hover{border-color:var(--ink)}
.btn:disabled{opacity:.6;cursor:wait}
.actions{display:flex;flex-wrap:wrap;gap:12px}

/* header */
.site-header{position:absolute;top:0;left:0;right:0;z-index:5}
.site-header.solid{position:sticky;background:var(--night)}
.nav{display:flex;align-items:center;justify-content:space-between;height:72px}
.brand{display:flex;align-items:center;gap:12px;font:400 17px var(--display);letter-spacing:.26em;color:var(--salt);text-decoration:none;white-space:nowrap}
.brand img{width:24px}
.nav ul{list-style:none;display:flex;align-items:center;gap:26px;margin:0;padding:0}
.nav a:not(.btn):not(.brand){color:rgba(242,239,230,.85);text-decoration:none;font:400 12.5px var(--display);letter-spacing:.2em;text-transform:uppercase}
.nav a:not(.btn):not(.brand):hover{color:#fff}
.nav .btn{padding:11px 16px;font-size:11.5px}

/* hero */
.hero{position:relative;min-height:min(92vh,820px);display:flex;align-items:flex-end;color:var(--salt);background:var(--night) url(/assets/img/salt-road.jpg) center/cover no-repeat}
@supports (background-image:image-set(url(a.webp) type("image/webp"))){
  .hero{background-image:image-set(url(/assets/img/salt-road.webp) type("image/webp"),url(/assets/img/salt-road.jpg) type("image/jpeg"))}}
.hero::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(14,10,12,.86) 0%,rgba(14,10,12,.55) 42%,rgba(14,10,12,0) 70%),linear-gradient(0deg,rgba(14,10,12,.55),rgba(14,10,12,0) 40%)}
.hero .wrap{position:relative;padding-bottom:84px;padding-top:140px;width:100%}
.hero-copy{max-width:560px}
.hero h1{margin:16px 0 6px}
.hero .by{font:400 16px var(--display);letter-spacing:.3em;color:var(--bone)}
.hero .rule{width:110px;height:3px;background:var(--red);margin:24px 0}
.hero .pitch{font:italic 24px/1.4 var(--body);margin-bottom:12px}
.hero .lede{color:rgba(242,239,230,.82);margin-bottom:30px}
.hero .kicker{color:var(--bone)}
.status{display:inline-block;margin-bottom:20px;padding:6px 13px;border:1px solid rgba(242,239,230,.5);font:400 11px var(--display);letter-spacing:.28em;color:var(--salt);text-transform:uppercase}

/* sections */
section{padding:96px 0}
.band{background:var(--bone-2);border-top:1px solid var(--bone);border-bottom:1px solid var(--bone)}
.dark{background:var(--night);color:var(--salt)}
.dark .kicker{color:#d4573f}
.center{text-align:center}
.narrow{max-width:760px;margin:0 auto}
.lead{font-size:21px}
.prose p+p{margin-top:16px}

/* series promises */
.promises{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:44px}
.promise{padding:24px 22px;background:var(--salt);border:1px solid var(--bone)}
.promise h3{font-size:16px;letter-spacing:.12em;text-transform:uppercase;margin-bottom:10px}
.promise p{font-size:16.5px;color:var(--leather)}

/* road */
.road{list-style:none;margin:48px 0 0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);border-top:2px dashed rgba(176,38,28,.45)}
.road li{position:relative;padding:26px 18px 0 0}
.road li::before{content:"";position:absolute;top:-8px;left:0;width:14px;height:14px;border-radius:50%;background:var(--salt);border:2px solid var(--ink)}
.road li.now::before{background:var(--red);border-color:var(--red)}
.road .n{font:400 11.5px var(--display);letter-spacing:.24em;color:var(--leather);text-transform:uppercase}
.road .t{display:block;font:700 19px var(--display);letter-spacing:.04em;margin:8px 0 4px}
.road .d{font-size:16px;color:var(--leather)}
.road .s{display:block;margin-top:8px;font:italic 15px var(--body);color:var(--red)}

/* book */
.book{display:grid;grid-template-columns:.8fr 1.2fr;gap:64px;align-items:start}
.book-cover img{width:100%;max-width:380px;box-shadow:0 26px 60px rgba(42,29,18,.35)}
.blurb p{margin-bottom:16px}
.blurb .open{font-size:22px;font-style:italic}
.blurb .punch{font-family:var(--display);font-weight:700;letter-spacing:.03em;font-size:18px}
.why{margin-top:28px;padding:22px 24px;background:var(--salt);border-left:3px solid var(--red)}
.why h3{font-size:14px;letter-spacing:.24em;text-transform:uppercase;margin-bottom:10px}
.why ul{margin:0;padding-left:20px}
.why li{margin:4px 0;font-size:17.5px}
.meta{margin-top:18px;font-size:15.5px;color:var(--leather)}

/* excerpt */
.excerpt blockquote{margin:28px 0 0;padding:0;font-size:21px;line-height:1.65}
.excerpt blockquote p+p{margin-top:16px}
.excerpt .hook{font-style:italic}
.excerpt .tail{margin-top:26px;color:var(--bone)}
.excerpt .tail a{color:#e0806f}

/* hero character */
.conall{display:grid;grid-template-columns:1.1fr .9fr;gap:56px;align-items:center}
.conall .portrait{background:var(--night) url(/assets/img/conall-road.jpg) center 60%/cover;min-height:520px}
.conall dl{display:grid;grid-template-columns:auto 1fr;gap:6px 18px;margin:22px 0;font-size:17px}
.conall dt{font:400 12px/2 var(--display);letter-spacing:.2em;text-transform:uppercase;color:var(--red)}
.conall dd{margin:0}
.quotes{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px}
.quotes span{padding:7px 14px;border:1px solid var(--bone);background:var(--salt);font-style:italic;font-size:17px}

/* signup */
.signup-wrap{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.signup{background:var(--night-2);border:1px solid #3a3a42;padding:34px}
.signup h3{color:var(--salt);margin-bottom:10px}
.signup p{color:rgba(242,239,230,.8);font-size:17px}
form{margin-top:22px;display:flex;flex-direction:column;gap:12px}
label{font:400 11.5px var(--display);letter-spacing:.22em;text-transform:uppercase;color:var(--bone)}
input[type=email]{width:100%;padding:14px 15px;border-radius:2px;border:1px solid #4a4a52;background:#121215;color:var(--salt);font:17px var(--body)}
input[type=email]:focus{outline:2px solid var(--red);outline-offset:1px;border-color:transparent}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.form-msg{min-height:1.5em;font-size:16px}
.form-msg.ok{color:#a8dcb4}.form-msg.err{color:#f2a1a1}
.gift{display:flex;gap:22px;align-items:center;margin-top:26px}
.gift img{width:140px;box-shadow:0 18px 40px rgba(0,0,0,.5)}

/* author */
.author .wrap{max-width:760px;text-align:center}
.author p{margin-top:18px}
.author .pull{font:italic 21px/1.5 var(--body);color:var(--leather)}

/* world page */
.page-head{padding:140px 0 70px;text-align:center;color:var(--salt);background:linear-gradient(rgba(14,10,12,.72),rgba(14,10,12,.86)),url(/assets/img/salt-road-960.webp) center/cover}
.page-head p{max-width:640px;margin:18px auto 0;font:italic 21px/1.5 var(--body);color:var(--bone)}
.mapfig{margin:0}
.mapfig img{width:100%;border:1px solid var(--bone);box-shadow:0 20px 50px rgba(42,29,18,.2)}
.mapfig figcaption{text-align:center;font-style:italic;color:var(--leather);margin-top:12px}
.rows{display:grid;gap:22px;margin:30px 0 0}
.rows>div{display:grid;grid-template-columns:200px 1fr;gap:24px;align-items:baseline;padding-bottom:22px;border-bottom:1px solid var(--bone)}
.rows dt{font:700 14.5px var(--display);letter-spacing:.12em;text-transform:uppercase}
.rows dd{margin:0;color:#3d2d1e}
.cast{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:30px}
.person{padding:22px 24px;background:var(--salt);border:1px solid var(--bone)}
.person h3{font-size:18px;margin-bottom:6px}
.person p{font-size:17px;color:#3d2d1e}

/* footer */
.site-footer{background:var(--night);color:rgba(242,239,230,.7);padding:34px 0;font-size:15px}
.site-footer .wrap{display:flex;flex-wrap:wrap;gap:14px 28px;justify-content:space-between;align-items:center}
.site-footer ul{list-style:none;display:flex;flex-wrap:wrap;gap:22px;margin:0;padding:0}
.site-footer a{color:rgba(242,239,230,.85);text-decoration:none}.site-footer a:hover{color:#fff}

/* simple pages */
main.simple{padding:80px 24px 110px;min-height:60vh}
.prose-page{max-width:720px}
.prose-page h1{font-size:clamp(30px,4.5vw,46px);margin:10px 0 8px}
.prose-page h2{font-size:21px;margin:34px 0 10px}
.prose-page ul{padding-left:20px}.prose-page li{margin:8px 0}
.stack{display:flex;flex-direction:column;gap:18px}

@media (max-width:900px){
  .book,.conall,.signup-wrap{grid-template-columns:1fr;gap:40px}
  .promises{grid-template-columns:1fr 1fr}
  .road{grid-template-columns:1fr 1fr;row-gap:30px;border-top:0}
  .road li{border-top:2px dashed rgba(176,38,28,.45)}
  .book-cover img{max-width:260px}
  .conall .portrait{min-height:300px}
  .cast{grid-template-columns:1fr}
  section{padding:70px 0}
}
@media (max-width:560px){
  body{font-size:18px}
  .wrap{padding:0 16px}
  .hide-sm{display:none}
  .nav ul{gap:14px}
  .brand{font-size:14px;letter-spacing:.18em}
  .hero{background-position:72% center;min-height:88vh}
  .hero::before{background:linear-gradient(0deg,rgba(14,10,12,.9) 10%,rgba(14,10,12,.35) 65%,rgba(14,10,12,.2))}
  .promises,.road{grid-template-columns:1fr}
  .rows>div{grid-template-columns:1fr;gap:4px}
  .signup{padding:24px}
  .gift img{width:100px}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
.page-head p.kicker{font:400 12.5px/1.4 var(--display);font-style:normal;letter-spacing:.32em;margin:0 auto}