/*
Theme Name: Copper & Coast
Theme URI: https://copperandcoastco.com/
Author: Muse
Author URI: https://muse.ai/
Description: A minimal, mobile-first theme designed for Copper & Coast. Typography, whitespace, and hairline dividers — nothing else.
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: copper-coast
*/

:root{
  --paper:#FDFCF8; --cream:#F6F1E6; --ink:#2B2B28; --soft:#6F665A;
  --olive:#7A7E5E; --olive-deep:#5F6247; --hair:#E4DAC4;
}
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:'Jost',sans-serif;background:#DDD6C4;color:var(--ink);line-height:1.7;-webkit-font-smoothing:antialiased;font-weight:300}
.site{max-width:430px;margin:0 auto;background:var(--paper);min-height:100vh}
h1,h2{font-family:'Cormorant Garamond',serif;font-weight:400;line-height:1.16}
a{color:inherit;text-decoration:none}
img{max-width:100%;height:auto}
.label{font-size:11px;letter-spacing:.28em;text-transform:uppercase;color:var(--olive-deep)}
/* top bar */
.site-header{position:sticky;top:0;z-index:20}
.topbar{display:flex;align-items:center;justify-content:space-between;padding:20px 26px;border-bottom:1px solid var(--hair);background:rgba(253,252,248,.96)}
.wordmark{font-family:'Cormorant Garamond',serif;font-size:22px;letter-spacing:.04em}
button.menu-link{background:none;border:none;font:inherit;cursor:pointer;font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:var(--soft);padding:0}
.menu-panel{display:none;background:var(--paper);border-bottom:1px solid var(--hair);padding:6px 26px 18px}
.menu-panel.open{display:block}
.menu-panel ul{list-style:none;margin:0;padding:0}
.menu-panel a{display:block;padding:13px 0;border-top:1px solid var(--hair);font-size:12.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--soft)}
.menu-panel li:first-child a{border-top:none}
/* hero */
.hero{padding:72px 30px 64px}
.hero .label{margin-bottom:22px;display:block}
.hero h1{font-size:47px;margin-bottom:20px;letter-spacing:.01em}
.hero h1 em{font-style:italic;color:var(--olive-deep)}
.hero p{color:var(--soft);font-size:16.5px;max-width:300px;margin-bottom:34px}
.text-link{font-size:12.5px;letter-spacing:.22em;text-transform:uppercase;border-bottom:1px solid var(--ink);padding-bottom:5px}
/* hero photo (only rendered when set in the Customizer) */
.hero-photo{margin:8px 22px 0;border:1px solid var(--hair);border-radius:4px;padding:0;overflow:hidden;height:381px}
.hero-photo img{width:100%;height:100%;object-fit:cover;object-position:center 0%;display:block}
/* topic index */
.index{padding:10px 0 0}
.index-head{padding:0 30px 6px}
.topic{display:flex;align-items:baseline;gap:18px;padding:24px 30px;border-top:1px solid var(--hair)}
.topic:last-child{border-bottom:1px solid var(--hair)}
.topic .num{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:15px;color:var(--olive-deep);width:28px;flex:0 0 28px}
.topic .name{flex:1}
.topic .name h2{font-size:27px;letter-spacing:.06em}
.topic .name p{font-size:13.5px;color:var(--soft);margin-top:3px}
.topic .arrow{font-family:'Cormorant Garamond',serif;font-size:24px;color:var(--olive-deep)}
/* journal */
.journal{margin:56px 0 0;padding:56px 30px;background:var(--cream);border-top:1px solid var(--hair);border-bottom:1px solid var(--hair);text-align:center}
.journal .label{margin-bottom:20px;display:block}
.journal blockquote{font-family:'Cormorant Garamond',serif;font-style:italic;font-weight:300;font-size:26px;line-height:1.5;margin-bottom:12px}
.journal cite{font-style:normal;font-family:'Jost',sans-serif;font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--soft)}
.journal p{font-size:14.5px;color:var(--soft);margin:20px auto 26px;max-width:280px}
/* collab */
.collab{padding:60px 30px;text-align:center}
.collab .label{margin-bottom:18px;display:block}
.collab h2{font-size:34px;margin-bottom:12px}
.collab p{color:var(--soft);font-size:15px;margin-bottom:26px}
.collab .email{font-family:'Cormorant Garamond',serif;font-size:21px;font-style:italic;border-bottom:1px solid var(--olive-deep);padding-bottom:4px;color:var(--ink);word-break:break-all}
/* footer */
.site-footer{border-top:1px solid var(--hair);padding:34px 30px 40px;text-align:center}
.site-footer .wordmark{font-size:20px;margin-bottom:12px}
.site-footer nav{display:flex;gap:22px;justify-content:center;margin-bottom:18px}
.site-footer nav a{font-size:11.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--soft)}
.site-footer small{font-size:12px;color:var(--soft)}
/* fallback blog index */
.blog-index{padding:48px 30px}
.post-summary{padding:26px 0;border-top:1px solid var(--hair)}
.post-summary:first-child{border-top:none}
.post-summary .label{display:block;margin-bottom:10px}
.post-summary h2{font-size:30px;margin-bottom:8px}
.post-summary .entry{color:var(--soft);font-size:15px}
.posts-navigation{padding:26px 0}