/* I Hate Stencil — ghost-ish theme "rottern" v2.1 (heh) */
:root{--pink:#e5679a;--pink-d:#c34a7b;--cream:#fdf6ee;--cream-d:#f6e8d8;--ink:#3a2a2e;--accent:#7a4b8f;}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:'Crimson Pro',Georgia,serif;background:var(--cream);color:var(--ink);font-size:19px;line-height:1.75}
h1,h2,h3{font-family:'Playfair Display',Georgia,serif;line-height:1.12;font-weight:900}
a{color:var(--pink-d);text-decoration:underline;text-decoration-thickness:2px;text-decoration-color:var(--pink)}
a:hover{color:var(--accent)}
img{max-width:100%;display:block;border-radius:6px}
.wrap{max-width:1080px;margin:0 auto;padding:0 22px}
/* header */
.masthead{background:var(--cream-d);border-bottom:4px dashed var(--pink);padding:56px 0 40px;text-align:center;position:relative}
.masthead h1{font-size:clamp(44px,8vw,88px);letter-spacing:-.02em}
.masthead h1 .x{color:var(--pink)}
.tagline{font-size:22px;font-style:italic;margin-top:8px;color:#7a5a63}
.sticker{display:inline-block;font-family:'Space Grotesk',Arial,sans-serif;font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.09em;background:var(--pink);color:#fff;padding:6px 14px;border-radius:20px;transform:rotate(-2deg);box-shadow:2px 3px 0 rgba(58,42,46,.25)}
nav.main-nav{background:var(--cream);border-bottom:2px solid var(--pink);position:sticky;top:0;z-index:40}
nav.main-nav ul{list-style:none;display:flex;gap:6px;justify-content:center;flex-wrap:wrap;padding:10px 0}
nav.main-nav a{font-family:'Space Grotesk',Arial,sans-serif;font-size:14px;font-weight:600;text-transform:uppercase;letter-spacing:.08em;text-decoration:none;padding:8px 16px;border-radius:20px;color:var(--ink)}
nav.main-nav a:hover{background:var(--pink);color:#fff}
nav.main-nav a.active{background:var(--pink);color:#fff}
/* posts */
.post-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:34px;padding:60px 0}
.post-card{background:#fff;border:2px solid var(--ink);border-radius:8px;overflow:hidden;box-shadow:6px 6px 0 var(--cream-d);transition:transform .15s;display:flex;flex-direction:column}
.post-card:hover{transform:rotate(-.6deg)}
.post-card img{aspect-ratio:3/2;object-fit:cover;border-bottom:2px solid var(--ink);width:100%}
.post-card .body{padding:22px;display:flex;flex-direction:column;flex:1}
.post-card h2{font-size:26px;margin-bottom:10px}
.post-card h2 a{text-decoration:none;color:var(--ink)}
.post-card h2 a:hover{color:var(--pink-d)}
.post-card p{font-size:16.5px;color:#5c464c;flex:1}
.meta{font-family:'Space Grotesk',Arial,sans-serif;font-size:12.5px;text-transform:uppercase;letter-spacing:.1em;color:var(--pink-d);font-weight:600;margin-bottom:12px}
.tag{display:inline-block;font-family:'Space Grotesk',Arial,sans-serif;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;background:var(--cream-d);border:1px solid var(--pink);color:var(--pink-d);padding:3px 10px;border-radius:14px;margin-top:14px;align-self:flex-start}
/* manifesto */
.manifesto{background:var(--ink);color:var(--cream);padding:64px 0;border-top:4px solid var(--pink);border-bottom:4px solid var(--pink)}
.manifesto h2{color:var(--pink);font-size:34px;margin-bottom:18px}
.manifesto ol{padding-left:22px}
.manifesto li{margin-bottom:10px}
/* generic sections */
.section{padding:56px 0}
.section.alt{background:var(--cream-d)}
.section h2{font-size:32px;margin-bottom:16px}
.section p+p{margin-top:14px}
.footer{background:var(--ink);color:#c9b3ba;padding:44px 0 28px;font-size:15.5px}
.footer a{color:var(--pink)}
.footer .cols{display:grid;grid-template-columns:2fr 1fr 1fr;gap:34px}
.footer .bottom{border-top:1px solid #563f46;margin-top:30px;padding-top:16px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;font-size:13.5px;font-family:'Space Grotesk',Arial,sans-serif}
/* archive list */
.arch{list-style:none}
.arch li{display:flex;justify-content:space-between;gap:14px;padding:12px 4px;border-bottom:1px dashed var(--pink);flex-wrap:wrap}
.arch time{font-family:'Space Grotesk',Arial,sans-serif;font-size:13px;color:#8a6b73;white-space:nowrap}
.arch .year-head{font-family:'Playfair Display',serif;font-weight:900;font-size:26px;border:none;color:var(--pink-d)}
/* forms */
.form-box{background:#fff;border:2px solid var(--ink);border-radius:8px;padding:30px;box-shadow:6px 6px 0 var(--cream-d);max-width:560px}
.form-box label{display:block;font-family:'Space Grotesk',Arial,sans-serif;font-size:13px;font-weight:600;text-transform:uppercase;letter-spacing:.07em;margin:16px 0 4px}
.form-box input,.form-box textarea,.form-box select{width:100%;padding:10px 12px;border:2px solid var(--ink);border-radius:6px;font-family:'Crimson Pro',Georgia,serif;font-size:17px;background:var(--cream)}
.form-box button{margin-top:20px;background:var(--pink);color:#fff;border:2px solid var(--ink);border-radius:24px;padding:10px 28px;font-family:'Space Grotesk',Arial,sans-serif;font-weight:700;font-size:15px;text-transform:uppercase;letter-spacing:.07em;cursor:pointer}
.form-box button:hover{background:var(--pink-d)}
.washi{background:repeating-linear-gradient(45deg,var(--pink),var(--pink) 14px,var(--pink-d) 14px,var(--pink-d) 28px);height:12px}
/* full posts */
.post-body{max-width:740px}
.post-body h2{font-size:28px;margin-top:34px}
.post-body p{margin-top:16px}
.tag-row{margin-top:28px}
.tag-row .tag{margin-right:6px}
/* reader mail (comments, printed with permission) */
.comment{background:#fff;border:2px solid var(--ink);border-radius:8px;padding:18px 20px;box-shadow:4px 4px 0 var(--cream-d);margin-top:18px}
.comment .meta{margin-bottom:6px}
.comment p{font-size:17px;color:#5c464c}
/* shop */
.shop-btn{display:inline-block;font-family:'Space Grotesk',Arial,sans-serif;font-weight:700;font-size:14px;text-transform:uppercase;letter-spacing:.07em;background:var(--pink);color:#fff;border:2px solid var(--ink);border-radius:24px;padding:8px 22px;text-decoration:none;cursor:pointer;margin-top:14px}
.shop-btn:hover{background:var(--pink-d);color:#fff}
.price-tag{font-family:'Space Grotesk',Arial,sans-serif;font-size:20px;font-weight:700;color:var(--pink-d)}
