:root{--blue:#5b7bb5;--blue-d:#2f4a7a;--blue-l:#dfe7f4;--cream:#faf6ec;--cream-d:#efe6d2;--ink:#2b2a33;--muted:#6b6878;--green:#7a8f6a}
*{box-sizing:border-box}body{margin:0;font-family:Georgia,'Iowan Old Style',serif;background:var(--cream);color:var(--ink);line-height:1.65}
h1,h2,h3,.brand{font-family:'Playfair Display','Cormorant Garamond',Georgia,serif;color:var(--blue-d);font-weight:600;line-height:1.2}
a{color:var(--blue-d)}.wrap{max-width:1040px;margin:0 auto;padding:0 1.25rem}
header{background:#fff;border-bottom:3px solid var(--blue-l)}
.nav{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.75rem;padding:1rem 0}
.brand{font-size:1.6rem;text-decoration:none}nav ul{list-style:none;display:flex;flex-wrap:wrap;gap:1.2rem;margin:0;padding:0}
nav a{text-decoration:none;font-size:.95rem;letter-spacing:.06em;text-transform:uppercase}nav a:hover,nav a[aria-current]{border-bottom:2px solid var(--blue)}
.hero{background:linear-gradient(135deg,var(--blue-l),var(--cream) 70%);padding:4rem 0}
.hero-grid{display:grid;grid-template-columns:1.3fr 1fr;gap:3rem;align-items:center}
.eyebrow{text-transform:uppercase;letter-spacing:.15em;font-size:.8rem;color:var(--green)}
h1{font-size:clamp(2rem,5vw,3.2rem);margin:.3rem 0 1rem}
.slot{display:inline-block;background:#fff8e1;border:1px dashed #c9a94a;color:#7a5d12;padding:.15rem .5rem;border-radius:4px;font-family:monospace;font-size:.9rem}
.slot.block{display:block;padding:1rem}
.btn{display:inline-block;background:var(--blue-d);color:#fff;padding:.75rem 1.4rem;border-radius:999px;text-decoration:none;border:0;font:inherit;cursor:pointer}
.btn.alt{background:transparent;color:var(--blue-d);border:2px solid var(--blue-d)}
.cover{aspect-ratio:2/3;max-width:280px;width:100%;margin:auto;border-radius:4px 10px 10px 4px;box-shadow:0 18px 40px rgba(47,74,122,.3);
background:radial-gradient(circle at 25% 80%,#6f8fd0 0 8%,transparent 9%),radial-gradient(circle at 75% 85%,#4f6fb0 0 7%,transparent 8%),radial-gradient(circle at 70% 25%,#fffdf5 0 14%,transparent 15%),linear-gradient(170deg,var(--cream-d),#c9d6ee);
display:flex;flex-direction:column;justify-content:space-between;text-align:center;padding:2rem 1rem;border-left:10px solid var(--blue-d)}
.cover .t{font-family:Georgia,serif;font-size:1.5rem;color:var(--blue-d);line-height:1.2}.cover .a{letter-spacing:.15em;text-transform:uppercase;font-size:.8rem;color:var(--ink)}
section{padding:3rem 0}.card{background:#fff;border:1px solid var(--cream-d);border-radius:10px;padding:1.5rem}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:2rem}.book{display:grid;grid-template-columns:220px 1fr;gap:2rem;align-items:start}
form{display:grid;gap:1rem;max-width:520px}label{font-weight:600;font-size:.95rem}input,textarea{width:100%;padding:.7rem;border:1px solid #cfc6b0;border-radius:6px;font:inherit;background:#fff}
.note{font-size:.85rem;color:var(--muted)}
footer{background:var(--blue-d);color:var(--cream);padding:2rem 0;margin-top:2rem;text-align:center}footer a{color:var(--cream)}
.divider{text-align:center;color:var(--blue);letter-spacing:.5em}
@media(max-width:760px){.hero-grid,.grid2,.book{grid-template-columns:1fr}.hero{padding:2.5rem 0}.nav{flex-direction:column}nav ul{justify-content:center;gap:.8rem}}
.genre{color:var(--green);margin:.2rem 0}

.posts{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1.5rem;margin-top:1.5rem}.posts h2{margin-top:.3rem}.post{max-width:720px}
/* Journal scrapbook (scoped) */
.scrapbook main{background:#efe3cc radial-gradient(rgba(120,90,50,.08) 1px,transparent 1px) 0 0/6px 6px}
.scrapbook .hand{font-family:'Caveat',cursive;font-size:1.45rem;color:var(--blue,#2f4b7c);letter-spacing:0;text-transform:none;margin:.2rem 0}
.scrapbook .doodles{font-size:1.6rem;color:#6d8fd6;margin:0;letter-spacing:.5rem}
.scrap{position:relative;background:#fffdf6 repeating-linear-gradient(0deg,transparent 0 27px,rgba(47,75,124,.06) 27px 28px);box-shadow:0 6px 14px rgba(80,60,30,.18);border:none;transform:rotate(-1.5deg);padding-top:2rem}
.posts .scrap:nth-child(2n){transform:rotate(1.5deg)}
.posts .scrap:nth-child(3n){transform:rotate(-.6deg)}
.tape{position:absolute;top:-12px;left:50%;width:110px;height:26px;transform:translateX(-50%) rotate(-3deg);background:rgba(126,155,214,.55);background-image:repeating-linear-gradient(45deg,rgba(255,255,255,.35) 0 6px,transparent 6px 12px)}
.posts .scrap:nth-child(2n) .tape{background-color:rgba(232,217,181,.85);transform:translateX(-50%) rotate(4deg)}
.polaroid{background:#fff;padding:.6rem .6rem 1.6rem;box-shadow:0 3px 8px rgba(0,0,0,.15);transform:rotate(2deg);margin:.5rem auto 1rem;max-width:280px;text-align:center}
.polaroid .photo{aspect-ratio:4/3;background:#dfe7f5;display:flex;align-items:center;justify-content:center}
.post .scrap{margin:1.5rem 0}
@media (max-width:760px){.scrap,.posts .scrap:nth-child(n){transform:rotate(-.4deg)}.posts .scrap:nth-child(2n){transform:rotate(.4deg)}.polaroid{transform:rotate(.8deg)}}
.scrapbook footer{margin-top:0}
.scrapbook .sketch path,.scrapbook .sketch circle{stroke-dasharray:1;stroke-dashoffset:1;animation:draw 1.6s ease-out forwards}
.scrapbook .sketch g:nth-child(2) *{animation-delay:.3s}.scrapbook .sketch g:nth-child(3) *{animation-delay:.5s}
.scrapbook .underline{display:block;margin:-.6rem 0 1rem;max-width:100%}
.scrapbook .doodles{display:block;margin:.2rem 0;max-width:100%;height:auto}
.pencil{position:absolute;inset:-4px;width:calc(100% + 8px);height:calc(100% + 8px);pointer-events:none;overflow:visible}
.pencil rect{fill:none;stroke:rgba(47,75,124,.35);stroke-width:1.2;stroke-dasharray:1;stroke-dashoffset:1}
.drawn .pencil rect{animation:draw 1.4s ease-out forwards}
@keyframes draw{to{stroke-dashoffset:0}}
@media (prefers-reduced-motion:reduce){.scrapbook .sketch *,.pencil rect{animation:none!important;stroke-dashoffset:0!important}}
/* polish */
body{min-height:100vh;display:flex;flex-direction:column}main{flex:1}
.slot{overflow-wrap:anywhere;max-width:100%}
@media (max-width:760px){.nav ul{flex-wrap:wrap;justify-content:center;row-gap:.3rem}}
.card>div[style*="border-radius:50%"]{padding:2rem;box-sizing:border-box;text-align:center}
.post .scrap{transform:rotate(-.3deg)}
.credential{font-style:italic;border-left:3px solid var(--blue-l);padding:.2rem 0 .2rem .9rem;margin:1rem 0;color:inherit}
.credential em{font-style:normal}.pullquote{margin:1.5rem 0;padding:1rem 1.25rem;background:var(--blue-l);border-left:4px solid var(--blue-d);border-radius:6px;font-family:"Playfair Display",Georgia,serif;font-size:1.15rem;color:var(--blue-d)}.pullquote p{margin:0}
.credential{font-style:normal}.credential em{font-style:italic}
.blurb p{margin:.6rem 0}.tagline{font-size:1.15rem;font-style:italic}.hook{font-style:italic}.subhead{font-size:1.1rem}
.hook{font-style:normal}.hook em{font-style:italic}
.card>div[style*="border-radius:50%"]:has(.author-photo){padding:0;overflow:hidden}
.author-photo{width:100%;height:100%;object-fit:cover;object-position:center 30%;display:block;border-radius:50%}
.grid2>.card:has(.author-photo){align-self:start}
/* About: scrapbook snapshot */
.snapshot-card{align-self:start;display:flex;justify-content:center}
.snapshot-wrap{padding:2.5rem 1.5rem 1.5rem;max-width:340px;width:100%;box-sizing:border-box}
.snapshot{position:relative;margin:0;background:#fffdf6;padding:12px 12px 44px;box-shadow:0 10px 22px rgba(70,50,20,.22),0 2px 4px rgba(70,50,20,.12);transform:rotate(-2.5deg)}
.snapshot img{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover}
.snapshot .tape{position:absolute;width:96px;height:26px;background:rgba(126,155,214,.5);background-image:repeating-linear-gradient(45deg,rgba(255,255,255,.35) 0 6px,transparent 6px 12px);box-shadow:0 1px 2px rgba(0,0,0,.08);left:auto;top:auto}
.snapshot .tape.tl{top:6px;left:-30px;transform:rotate(-40deg)}
.snapshot .tape.br{bottom:12px;right:-30px;transform:rotate(-40deg);background-color:rgba(232,217,181,.85)}
.snapshot .clip{position:absolute;top:-30px;right:40px;width:22px;height:62px;transform:rotate(6deg);filter:drop-shadow(0 1px 1px rgba(0,0,0,.25));z-index:3}
.snapshot .sprig{position:absolute;top:-46px;right:12px;width:64px;height:108px;transform:rotate(18deg);z-index:2;opacity:.95}
@media (max-width:760px){.snapshot{transform:rotate(-1deg)}.snapshot-wrap{max-width:290px;margin:0 auto}}
.snapshot-wrap{padding-top:6rem}
.snapshot .sprig{top:-118px;right:6px;width:92px;height:154px;transform:rotate(14deg);z-index:2}
.snapshot .sprig path{stroke-width:2}
.snapshot .clip{top:-26px;right:44px;width:24px;height:66px}
.snapshot .sketch path{stroke-dasharray:1;stroke-dashoffset:1;animation:draw 1.8s ease-out forwards}
.snapshot .sketch g:nth-child(2) path{animation-delay:.4s}
@media (prefers-reduced-motion:reduce){.snapshot .sketch path{animation:none!important;stroke-dashoffset:0!important}}
@media (max-width:760px){.snapshot-wrap{padding-top:5.5rem}.snapshot .sprig{width:80px;height:134px;top:-104px}}
.snapshot .clip{top:-44px;right:38px;width:40px;height:106px;transform:rotate(6deg);filter:drop-shadow(0 1.5px 1.5px rgba(0,0,0,.3))}
@media (max-width:760px){.snapshot .clip{top:-38px;right:34px;width:34px;height:90px}}
/* realistic bluebonnet sprig */
.snapshot .sprig{top:-150px;right:-10px;width:120px;height:182px;transform:rotate(10deg);opacity:.92;filter:saturate(.85)}
.snapshot .sprig path{stroke-width:inherit}
.snapshot .sprig .lines path{stroke-dasharray:1;stroke-dashoffset:1;animation:draw 1.2s ease-out forwards;animation-delay:0s}
.snapshot .sprig .fills>*{opacity:0;animation:fadein .7s ease-out 1s forwards}
@keyframes fadein{to{opacity:.88}}
.snapshot-wrap{padding-top:8.5rem}
@media (max-width:760px){.snapshot-wrap{padding-top:7.5rem}.snapshot .sprig{width:104px;height:158px;top:-130px;right:-4px}}
@media (prefers-reduced-motion:reduce){.snapshot .sprig .lines path{animation:none!important;stroke-dashoffset:0!important}.snapshot .sprig .fills>*{animation:none!important;opacity:.88}}
.snapshot .sprig{top:-170px;right:-14px;width:130px;height:186px;transform:rotate(8deg);opacity:.9;filter:saturate(.7) sepia(.12)}
.snapshot .sprig .fills>*{animation-delay:1s}
@keyframes fadein{to{opacity:1}}
.snapshot-wrap{padding-top:10rem}
@media (max-width:760px){.snapshot-wrap{padding-top:8.5rem}.snapshot .sprig{width:110px;height:158px;top:-144px;right:-6px}}
@media (prefers-reduced-motion:reduce){.snapshot .sprig .fills>*{opacity:1}}
.snapshot .sprig{top:-205px;right:-40px;width:170px;height:244px;filter:saturate(.8) sepia(.08)}
.snapshot-wrap{padding-top:12rem;max-width:360px}
@media (max-width:760px){.snapshot-wrap{padding-top:10rem;max-width:300px}.snapshot .sprig{width:140px;height:200px;top:-170px;right:-22px}}
/* handwritten signature */
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.brand-sig{display:inline-flex;align-items:center;line-height:0}
.sig .ink{fill:var(--blue-d,#2f4b7c)}
.sig-header{height:46px;width:auto;aspect-ratio:3860/760}
.about-sig{margin:.4rem 0 1.2rem}
.sig-about{height:54px;width:auto;aspect-ratio:3860/760}
.sig-about .ink{fill:#4a68b0}
.sig .wipe{stroke-dasharray:1;stroke-dashoffset:0}
.sig-play .sig-header .wipe{stroke-dashoffset:1;animation:sigwrite 2s cubic-bezier(.45,.1,.4,1) .15s forwards}
.sig-about .wipe{stroke-dashoffset:1;animation:sigwrite 2.2s cubic-bezier(.45,.1,.4,1) .6s forwards}
@keyframes sigwrite{to{stroke-dashoffset:0}}
@media (prefers-reduced-motion:reduce){.sig .wipe{animation:none!important;stroke-dashoffset:0!important}}
@media (max-width:760px){.sig-header{height:40px}}
.sig-about{height:44px}
/* blank polaroid: soft paper with a faint pressed bluebonnet */
.polaroid .photo{background:#f4efe2 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 60'%3E%3Cpath d='M20 58V14' stroke='%23a59c74' stroke-width='.8' fill='none'/%3E%3Cg fill='%237f90c4' opacity='.45'%3E%3Cellipse cx='17' cy='40' rx='2.6' ry='2'/%3E%3Cellipse cx='23' cy='38' rx='2.6' ry='2'/%3E%3Cellipse cx='17.5' cy='33' rx='2.3' ry='1.8'/%3E%3Cellipse cx='22.5' cy='31' rx='2.3' ry='1.8'/%3E%3Cellipse cx='18' cy='26' rx='2' ry='1.6'/%3E%3Cellipse cx='22' cy='24' rx='2' ry='1.6'/%3E%3C/g%3E%3Cg fill='%23f2ede0' stroke='%23c9bf9f' stroke-width='.3'%3E%3Cellipse cx='19' cy='19' rx='1.6' ry='1.3'/%3E%3Cellipse cx='21' cy='16' rx='1.3' ry='1.1'/%3E%3C/g%3E%3C/svg%3E") center/38% no-repeat;box-shadow:inset 0 0 18px rgba(120,100,60,.12)}

/* per-post doodles: hand-drawn line art inside the polaroid (falls back to the pressed bluebonnet) */
.polaroid .photo.has-doodle{background-image:none}
.polaroid .photo .doodle{display:block;width:70%;height:auto;max-height:92%}
