/* Landing page. Shares tokens with site.css; only loaded on / and /thanks/. */
.landing { --oxblood:#6a2417; --rule:#cfcabd; --soft:#4a4841 }
.landing .masthead .mast-cta { color:var(--oxblood) }
.land { max-width:760px; margin:0 auto; padding:64px 24px 80px }
.land section { margin-top:88px } .land section:first-child { margin-top:0 }

/* Section labels: small caps with a rule, echoing the card's "THE STORY ———" line */
.label { display:flex; align-items:center; gap:16px; margin:0 0 26px; font-size:11.5px; letter-spacing:.18em; text-transform:uppercase; color:var(--oxblood) }
.label::after { content:""; flex:1; height:1px; background:var(--rule) }

.hero .eyebrow { color:var(--oxblood); letter-spacing:.18em; font-size:11.5px }
.hero h1 { font-size:clamp(40px,7.5vw,64px); line-height:1; letter-spacing:-.015em; margin:14px 0 22px; max-width:14ch; font-weight:400 }
.hero .deck { font-family:var(--serif); font-size:clamp(22px,3.2vw,27px); line-height:1.3; color:var(--ink); margin:0 0 14px; max-width:24em }
.hero .lede { font-size:17px; line-height:1.6; color:var(--soft); max-width:36em; margin:0 0 22px }
.hero .tag { font-family:var(--serif); font-size:20px; line-height:1.4; color:var(--ink); margin:0 0 40px; max-width:30em }
.hero .tag span { display:block; font-family:var(--sans); font-size:15px; color:var(--soft); margin-top:6px }

.signup { max-width:540px }
.signup label { display:block; font-family:var(--serif); font-size:19px; margin-bottom:12px }
.signup .row { display:flex }
.signup input[type=email] { flex:1; min-width:0; font:inherit; font-size:16px; height:48px; padding:0 14px; border:1px solid var(--ink); border-right:0; background:#fff; color:var(--ink); border-radius:0; -webkit-appearance:none }
.signup input[type=email]:focus { outline:none; box-shadow:inset 0 0 0 1px var(--ink) }
.signup button { font:inherit; font-size:12.5px; letter-spacing:.14em; text-transform:uppercase; height:48px; padding:0 22px; border:1px solid var(--ink); background:var(--ink); color:var(--paper); cursor:pointer; white-space:nowrap }
.signup button:hover { background:var(--oxblood); border-color:var(--oxblood) } .signup button[disabled] { opacity:.6; cursor:default }
.signup .fine { font-size:12.5px; color:var(--muted); margin:12px 0 0; line-height:1.5 }
.signup .msg { font-family:var(--serif); font-size:17px; margin:12px 0 0; min-height:1.2em } .signup .msg.ok { color:#2f5a3a } .signup .msg.err { color:var(--oxblood) }
.signup.done .row, .signup.done .fine { display:none } .signup.done label { font-style:italic }
.hp { position:absolute; left:-9999px; width:1px; height:1px; opacity:0 }
@media (max-width:480px) { .signup .row { flex-direction:column } .signup input[type=email] { flex:none; border-right:1px solid var(--ink); border-bottom:0 } .signup button { width:100% } }

/* Card one, front and back */
.card-pair { display:grid; grid-template-columns:1fr 1fr; gap:28px; margin:0 }
.card-pair figure { margin:0 } .card-pair img { display:block; width:100%; height:auto; border-radius:10px; box-shadow:0 1px 2px rgba(29,28,25,.18), 0 14px 32px -12px rgba(29,28,25,.35) }
.cards .caption { font-size:13.5px; color:var(--muted); margin:18px 0 0; line-height:1.5 }
@media (max-width:560px) { .card-pair { grid-template-columns:1fr; max-width:360px; gap:24px } }

/* Teasers */
.teaser-list { list-style:none; padding:0; margin:0; border-top:1px solid var(--rule) }
.teaser-list li { display:grid; grid-template-columns:minmax(220px,1fr) 1.6fr; gap:6px 28px; padding:18px 0; border-bottom:1px solid var(--rule); align-items:baseline }
.teaser-list strong { font-family:var(--serif); font-weight:400; font-size:23px; line-height:1.15; letter-spacing:-.005em }
.teaser-list span { font-size:15px; color:var(--soft); line-height:1.5 }
.more { font-family:var(--serif); font-style:italic; font-size:18px; color:var(--soft); margin:22px 0 0 }
@media (max-width:560px) { .teaser-list li { grid-template-columns:1fr } }

/* Categories */
.kind-list { margin:0; display:grid; grid-template-columns:1fr 1fr; gap:22px 40px }
.kind-list dt { font-family:var(--serif); font-size:19px; margin:0 0 4px; line-height:1.25 } .kind-list dd { margin:0; font-size:14.5px; color:var(--soft); line-height:1.5 }
@media (max-width:560px) { .kind-list { grid-template-columns:1fr } }

/* How it works */
.steps { list-style:none; padding:0; margin:0; display:grid; grid-template-columns:repeat(3,1fr); gap:28px }
.steps .n { display:block; font-family:var(--serif); font-size:34px; line-height:1; color:var(--oxblood); margin-bottom:10px }
.steps strong { display:block; font-family:var(--serif); font-weight:400; font-size:20px; margin-bottom:6px }
.steps p { margin:0; font-size:14.5px; color:var(--soft); line-height:1.5 }
.specs { margin:40px 0 0; padding-top:16px; border-top:1px solid var(--rule); font-size:11.5px; letter-spacing:.16em; text-transform:uppercase; color:var(--muted) }
@media (max-width:560px) { .steps { grid-template-columns:1fr; gap:22px } }

.signup-again { border-top:1px solid var(--rule); padding-top:56px }
.back a { color:var(--oxblood) }

.land-foot { max-width:760px; padding:0 24px 48px } .land-foot p { display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; margin:0; padding-top:14px; border-top:1px solid var(--rule); font-size:11.5px; letter-spacing:.14em; text-transform:uppercase } .land-foot a { color:var(--ink); text-decoration:none }
