/* Heartwood Letters: one stylesheet for the public site, the family reply page and the hospice portal */
@import url('https://fonts.googleapis.com/css2?family=Newsreader:ital,opsz,wght@0,6..72,300;0,6..72,400;0,6..72,500;1,6..72,300;1,6..72,400&family=Figtree:wght@400;500;600;700&display=swap');
:root{--forest:#23402f;--moss:#3d5a48;--sage:#dfe7df;--amber:#b9773b;--amber-soft:#f3e2cf;--cream:#f8f4ec;--paper:#fffdf9;--ink:#24211e;--muted:#6f675e;--line:#e7dfd2;--serif:'Newsreader',Georgia,serif;--sans:'Figtree',system-ui,sans-serif;--r:18px;--shadow:0 30px 60px -38px rgba(35,40,30,.45),0 2px 6px -2px rgba(35,40,30,.08)}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;background:var(--cream);color:var(--ink);font:400 18px/1.62 var(--serif);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img{max-width:100%;display:block}a{color:var(--moss);text-decoration-thickness:1px;text-underline-offset:3px}a:hover{color:var(--forest)}
.wrap{max-width:1160px;margin:0 auto;padding:0 28px}
h1,h2,h3{font-family:var(--serif);font-weight:400;letter-spacing:-.015em;line-height:1.08;margin:0}
h1{font-size:clamp(44px,6.2vw,78px)}h2{font-size:clamp(34px,4.4vw,54px)}h3{font-size:25px;line-height:1.2}
h1 em,h2 em{font-style:italic;color:var(--moss)}
p{margin:0 0 16px}.lede{font-size:clamp(19px,1.7vw,22px);color:var(--muted);max-width:640px;line-height:1.55}
.eyebrow{font:600 13px var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--amber);margin-bottom:16px;display:block}
.btn{display:inline-flex;align-items:center;gap:10px;font:600 16px var(--sans);padding:15px 26px;border-radius:999px;background:var(--forest);color:#fff;text-decoration:none;border:0;cursor:pointer;transition:transform .18s,box-shadow .18s,background .18s;box-shadow:0 12px 26px -14px rgba(35,64,47,.8)}
.btn:hover{background:#1a3123;color:#fff;transform:translateY(-1px);box-shadow:0 16px 30px -14px rgba(35,64,47,.9)}
.btn.ghost{background:transparent;color:var(--forest);box-shadow:inset 0 0 0 1.5px rgba(35,64,47,.28)}.btn.ghost:hover{background:#fff;color:var(--forest)}
.btn.small{padding:10px 18px;font-size:14.5px}.btn:disabled{opacity:.55;cursor:default;transform:none}
.btn .arr{transition:transform .18s}.btn:hover .arr{transform:translateX(3px)}
/* header */
.top{position:sticky;top:0;z-index:20;background:rgba(248,244,236,.86);backdrop-filter:saturate(1.4) blur(12px);border-bottom:1px solid transparent;transition:border-color .2s}
.top.scrolled{border-color:var(--line)}
.top .wrap{display:flex;align-items:center;justify-content:space-between;height:76px;gap:20px}
.brand{display:flex;align-items:center;gap:11px;text-decoration:none;color:var(--ink);font:500 22px var(--serif);letter-spacing:-.01em;white-space:nowrap}.brand img{width:36px;height:36px}
.brand small{font:600 11px var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-left:2px}
.nav{display:flex;align-items:center;gap:28px}.nav a{font:500 15.5px var(--sans);color:var(--ink);text-decoration:none;opacity:.8}.nav a:hover{opacity:1}
.nav .btn{opacity:1;color:#fff}
.burger{display:none;background:none;border:0;padding:8px;cursor:pointer}.burger span{display:block;width:24px;height:2px;background:var(--ink);margin:5px 0;border-radius:2px}
/* hero */
.hero{padding:70px 0 40px;position:relative;overflow:hidden}
.hero .wrap{display:grid;grid-template-columns:1.05fr .95fr;gap:60px;align-items:center}
.hero h1{margin:6px 0 24px}.hero .row{display:flex;gap:14px;flex-wrap:wrap;margin-top:30px}
.hero .note{font:500 14.5px var(--sans);color:var(--muted);margin-top:18px;display:flex;align-items:center;gap:8px}
.stack{position:relative;height:560px}
.stack .sheet{position:absolute;width:76%;background:#fff;border-radius:6px;box-shadow:var(--shadow);overflow:hidden;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.stack .s1{right:2%;top:30px;transform:rotate(4deg)}.stack .s2{left:4%;top:0;transform:rotate(-3deg)}.stack .s3{left:14%;top:60px;transform:rotate(.6deg)}
.stack:hover .s1{transform:rotate(6deg) translateX(14px)}.stack:hover .s2{transform:rotate(-5deg) translateX(-12px)}
.stack .env{position:absolute;bottom:4px;right:0;width:58%;aspect-ratio:9.5/4.1;background:linear-gradient(180deg,#fbf7f0,#f2eadc);border-radius:6px;box-shadow:var(--shadow);transform:rotate(-2deg);display:flex;align-items:flex-end;padding:22px 24px;font:500 15px/1.45 var(--sans);color:#4b443d}
.stack .env:before{content:'';position:absolute;right:20px;top:18px;width:46px;height:54px;border:2px dashed #cdbfa9;border-radius:4px}
.stack .env b{display:block;font-weight:600;color:var(--ink)}
/* sections */
section{padding:96px 0}.alt{background:var(--paper)}.dark{background:var(--forest);color:#eef1ea}.dark .lede,.dark p{color:#c9d3c9}.dark h2 em{color:#e6b582}.dark .eyebrow{color:#e6b582}
.center{text-align:center}.center .lede{margin:14px auto 0}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}.grid2{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.card{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:30px;box-shadow:0 18px 40px -34px rgba(35,40,30,.4)}
.card h3{margin:14px 0 10px}.card p{color:var(--muted);font-size:17px;margin:0}
.ico{width:46px;height:46px;border-radius:13px;background:var(--sage);display:grid;place-items:center;color:var(--forest)}.ico svg{width:24px;height:24px}
.stat{font:400 56px/1 var(--serif);color:var(--forest)}.dark .stat{color:#fff}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;margin-top:50px}.stats div p{font:500 15.5px var(--sans);color:#c9d3c9;margin-top:10px}
/* timeline of the series */
.timeline{position:relative;margin-top:56px;display:grid;grid-template-columns:repeat(5,1fr);gap:18px}
.timeline:before{content:'';position:absolute;left:4%;right:4%;top:23px;height:2px;background:linear-gradient(90deg,var(--moss),var(--amber))}
.tl{position:relative;text-align:center;padding-top:0}.tl .dot{width:48px;height:48px;border-radius:50%;background:#fff;border:2px solid var(--moss);margin:0 auto 14px;display:grid;place-items:center;font:600 13px var(--sans);color:var(--forest);position:relative;z-index:1}
.tl:nth-child(n+6) .dot{border-color:var(--amber)}
.tl b{display:block;font:600 15px var(--sans);color:var(--ink)}.tl span{font-size:15.5px;color:var(--muted);line-height:1.4;display:block;margin-top:4px}
/* letters gallery */
.letters{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;margin-top:48px}
.letter{background:#fff;border-radius:6px;box-shadow:var(--shadow);overflow:hidden;transition:transform .25s}.letter:hover{transform:translateY(-4px)}
.letter img{aspect-ratio:8.5/11;object-fit:cover;object-position:top;width:100%}
.letter .cap{padding:16px 18px;border-top:1px solid var(--line);font:600 15px var(--sans)}.letter .cap span{display:block;font-weight:400;color:var(--muted);font-size:14px}
/* steps */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;margin-top:50px;counter-reset:s}
.step{counter-increment:s;position:relative;padding-top:64px}.step:before{content:counter(s);position:absolute;top:0;left:0;width:46px;height:46px;border-radius:50%;background:var(--amber-soft);color:var(--amber);font:600 19px/46px var(--sans);text-align:center}
.step h3{margin-bottom:10px}.step p{color:var(--muted)}
/* pricing */
.price{display:grid;grid-template-columns:1.1fr .9fr;gap:30px;align-items:stretch;margin-top:48px}
.price .big{font:400 92px/1 var(--serif);color:var(--forest)}.price .big sup{font-size:38px;vertical-align:top;margin-right:4px}.price .per{font:500 17px var(--sans);color:var(--muted);margin-left:8px}
.ticks{list-style:none;padding:0;margin:24px 0}.ticks li{padding:9px 0 9px 34px;position:relative;font-size:17.5px;border-bottom:1px solid var(--line)}.ticks li:last-child{border:0}
.ticks li:before{content:'';position:absolute;left:2px;top:15px;width:18px;height:10px;border-left:2.5px solid var(--moss);border-bottom:2.5px solid var(--moss);transform:rotate(-45deg)}
/* faq */
.faq{max-width:820px;margin:44px auto 0}.faq details{border-bottom:1px solid var(--line);padding:22px 0}.faq summary{cursor:pointer;font:600 18.5px var(--sans);list-style:none;display:flex;justify-content:space-between;gap:20px}
.faq summary::-webkit-details-marker{display:none}.faq summary:after{content:'+';font:300 28px/1 var(--sans);color:var(--moss);transition:transform .2s}.faq details[open] summary:after{transform:rotate(45deg)}
.faq p{color:var(--muted);margin:12px 0 0}
/* forms */
.form{display:grid;gap:16px}.form .two{display:grid;grid-template-columns:1fr 1fr;gap:16px}.form .three{display:grid;grid-template-columns:2fr 1fr 1fr;gap:16px}
label{display:block;font:600 14px var(--sans);color:var(--ink);margin-bottom:7px}label span{font-weight:400;color:var(--muted)}
input,select,textarea{width:100%;font:400 16.5px var(--sans);color:var(--ink);background:#fff;border:1.5px solid #dcd2c2;border-radius:12px;padding:13px 15px;transition:border-color .15s,box-shadow .15s}
input:focus,select:focus,textarea:focus{outline:0;border-color:var(--moss);box-shadow:0 0 0 4px rgba(61,90,72,.13)}
textarea{min-height:120px;resize:vertical;line-height:1.5}.hp{position:absolute;left:-9999px}
.msg{font:500 15px var(--sans);min-height:22px}.msg.err{color:#a3402e}.msg.ok{color:var(--moss)}
/* trust strip */
.trust{display:flex;gap:30px;flex-wrap:wrap;justify-content:center;margin-top:36px;font:500 15px var(--sans);color:var(--muted)}.trust span{display:flex;align-items:center;gap:8px}
.trust svg{width:18px;height:18px;color:var(--moss)}
/* footer */
footer{background:#1b3024;color:#c3cdc3;padding:70px 0 40px;font:400 15.5px/1.7 var(--sans)}
footer .cols{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:40px}footer h4{font:600 13px var(--sans);letter-spacing:.12em;text-transform:uppercase;color:#fff;margin:0 0 14px}
footer a{color:#c3cdc3;text-decoration:none;display:block}footer a:hover{color:#fff}footer .brand{color:#fff}footer .fine{border-top:1px solid rgba(255,255,255,.12);margin-top:50px;padding-top:24px;display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;font-size:14px;color:#94a294}
/* simple pages */
.page-head{padding:80px 0 30px}.page-head h1{font-size:clamp(40px,5vw,62px)}.prose{max-width:760px}.prose h2{font-size:30px;margin:44px 0 12px}.prose h3{font-size:22px;margin:30px 0 8px}.prose p,.prose li{color:#3d3832}.prose ul{padding-left:22px}
body.plain{background:var(--cream)}.narrow{max-width:640px;margin:0 auto;padding:60px 24px}
/* reveal on scroll */
.rv{opacity:0;transform:translateY(22px);transition:opacity .8s cubic-bezier(.2,.7,.2,1),transform .8s cubic-bezier(.2,.7,.2,1)}.rv.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.rv{opacity:1;transform:none;transition:none}.stack .sheet{transition:none}}
@media (max-width:980px){.hero .wrap,.grid2,.price{grid-template-columns:1fr}.stack{height:480px;max-width:520px;margin:0 auto;width:100%}.grid3,.letters,.steps{grid-template-columns:1fr 1fr}.timeline{grid-template-columns:repeat(3,1fr);row-gap:30px}.timeline:before{display:none}footer .cols{grid-template-columns:1fr 1fr}}
@media (max-width:760px){.nav{display:none;position:absolute;top:76px;left:0;right:0;background:var(--cream);flex-direction:column;padding:20px 28px 28px;gap:18px;align-items:flex-start;border-bottom:1px solid var(--line)}.nav.open{display:flex}.burger{display:block}
  section{padding:70px 0}.wrap{padding:0 20px}.grid3,.letters,.steps,.stats{grid-template-columns:1fr}.timeline{grid-template-columns:1fr 1fr}.form .two,.form .three{grid-template-columns:1fr}.stack{height:400px}.hero{padding-top:40px}footer .cols{grid-template-columns:1fr}.brand small{display:none}}
.zoom{position:fixed;inset:0;background:rgba(20,24,20,.82);display:grid;place-items:center;z-index:100;padding:30px;cursor:zoom-out;animation:fade .2s}.zoom img{max-height:94vh;width:auto;border-radius:6px;box-shadow:0 30px 80px rgba(0,0,0,.5)}
@keyframes fade{from{opacity:0}}
.done{padding:26px;border-radius:14px;background:var(--sage);font:500 17px/1.6 var(--sans);color:var(--forest)}.done h3{font-family:var(--serif);margin-bottom:8px}
.pill{display:inline-flex;align-items:center;gap:8px;font:600 13px var(--sans);padding:7px 14px;border-radius:999px;background:var(--amber-soft);color:#8a5321}
.split-list{display:grid;grid-template-columns:1fr 1fr;gap:14px 40px;margin-top:22px}.split-list div{font-size:17px;padding-left:28px;position:relative;color:#3d3832}.split-list div:before{content:'';position:absolute;left:0;top:11px;width:14px;height:8px;border-left:2px solid var(--amber);border-bottom:2px solid var(--amber);transform:rotate(-45deg)}
.quote{font:300 italic clamp(26px,3vw,36px)/1.35 var(--serif);color:var(--forest);max-width:860px;margin:0 auto}.quote cite{display:block;font:500 15px var(--sans);font-style:normal;color:var(--muted);margin-top:22px}
@media (max-width:760px){.split-list{grid-template-columns:1fr}}
.timeline:before{display:none}.tl:before{content:'';position:absolute;top:23px;left:-50%;right:50%;height:2px;background:var(--moss);opacity:.55}.tl:nth-child(5n+1):before{display:none}.tl:nth-child(n+6):before{background:var(--amber)}
@media (max-width:980px){.tl:before{display:none}}

/* grids fit their box; side-by-side fields stack on phones */
.form{grid-template-columns:minmax(0,1fr)}.two{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
@media (max-width:560px){.two{grid-template-columns:minmax(0,1fr)}}
.row>*{min-width:0;max-width:100%}input[type=file]{max-width:100%}