/* Letter, letters list and page templates: built only from the approved homepage's colours, fonts and parts. */
.letter{padding:clamp(48px,8vw,96px) clamp(20px,5vw,40px) clamp(40px,6vw,72px)}
.letters{padding:clamp(56px,9vw,110px) clamp(20px,5vw,40px) clamp(48px,7vw,90px)}
.lwrap{max-width:680px;margin:0 auto}
.lhead{margin:0 0 clamp(28px,4vw,44px)}
.lhead .eyebrow{color:var(--teal)}
.lhead h1{font-family:"Cormorant Garamond",Georgia,serif;font-weight:500;font-size:clamp(2.3rem,5.4vw,3.5rem);line-height:1.08;color:var(--ink);margin:.2rem 0 .9rem;text-wrap:balance}
.lhead-c{text-align:center;max-width:720px;margin:0 auto clamp(32px,5vw,56px)}
.lhead-c .body{margin:0 auto;color:var(--ink-soft)}
.lmeta{font-size:.9rem;color:var(--ink-soft);letter-spacing:.02em;margin:0}
.lfeat{margin:0 0 clamp(28px,4vw,40px)}
.lfeat img{width:100%;height:auto;display:block;border-radius:14px}
.lfeat figcaption,.lbody figcaption{font-size:.85rem;color:var(--ink-soft);text-align:center;margin-top:8px}
.lbody{font-size:1.125rem;line-height:1.75;color:var(--ink)}
.lbody>*{margin:0 0 1.3em}
.lbody h2{font-family:"Cormorant Garamond",Georgia,serif;font-weight:500;font-size:clamp(1.7rem,3.4vw,2.2rem);line-height:1.15;color:var(--teal2);margin:1.8em 0 .5em}
.lbody h3{font-family:"Cormorant Garamond",Georgia,serif;font-weight:600;font-size:1.45rem;line-height:1.2;color:var(--teal2);margin:1.6em 0 .4em}
.lbody a{color:var(--teal2);text-decoration:underline;text-underline-offset:3px;text-decoration-color:rgba(63,110,102,.45)}
.lbody blockquote{font-family:"Cormorant Garamond",Georgia,serif;font-style:italic;font-size:1.5rem;line-height:1.35;color:var(--teal2);border-left:2px solid #c9a227;margin:1.6em 0;padding:.2em 0 .2em 1.1em}
.lbody ul,.lbody ol{padding-left:1.3em}.lbody li{margin:.4em 0}
.lbody hr{border:0;height:1px;background:rgba(63,110,102,.22);margin:2.4em auto;width:120px}
.lbody img{max-width:100%;height:auto;border-radius:10px}
.lbody .kg-width-wide{width:min(960px,92vw);max-width:none;margin-left:50%;transform:translateX(-50%)}
.lbody .kg-width-full{width:100vw;max-width:none;margin-left:50%;transform:translateX(-50%)}
.lbody .kg-width-full img{border-radius:0}
.lend{margin-top:clamp(40px,6vw,64px);text-align:center}
.endpoppy{width:40px;height:auto;display:block;margin:0 auto 16px}
.endpoppy path{fill:none;stroke:#c9a227;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.lmore{padding:clamp(44px,6vw,72px) clamp(20px,5vw,40px);background:var(--cream2)}
.lmore .eyebrow{color:var(--teal);text-align:center}
.lgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:22px;margin-top:18px}
.lcard{display:block;text-decoration:none;color:inherit;background:var(--cream2);border:1px solid rgba(63,110,102,.14);border-radius:16px;padding:28px 26px;transition:transform .3s ease,box-shadow .3s ease}
.lmore .lcard{background:var(--cream)}
.lcard .k{font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;color:var(--teal);font-weight:700;margin:0 0 10px}
.lcard h2{font-family:"Cormorant Garamond",Georgia,serif;font-weight:500;font-size:1.7rem;line-height:1.15;margin:0 0 .5rem;color:var(--ink)}
.lcard p{color:var(--ink-soft);margin:0;line-height:1.6}
.lcard:hover,.lcard:focus-visible{transform:translateY(-3px);box-shadow:0 14px 30px rgba(63,110,102,.12)}
.lpager{display:flex;justify-content:space-between;gap:16px;margin-top:32px}
.lpager a{color:var(--teal2);font-weight:700}
.join-error{display:none;color:#9b3b2e;font-size:.95rem;margin:.6rem 0 0}
.read .issue h3 a{color:inherit;text-decoration:none}
.read .issue h3 a:hover{text-decoration:underline;text-underline-offset:4px}
@media(prefers-reduced-motion:reduce){.lcard{transition:none}.lcard:hover{transform:none}}

/* 29 Sep: the site footer rule was styling the letter sign-off <footer> (dark on teal) */
footer.lend{background:none !important;color:inherit !important;padding:0 !important;border:0 !important}
footer.lend .ap-sign{color:var(--teal2)}

/* 29 Sep: centre the letter cards under the centred heading, whatever the count */
.letters .lgrid{grid-template-columns:repeat(auto-fit,minmax(280px,340px));justify-content:center}
.lhead-c h1{margin-left:auto;margin-right:auto}

/* Letter sign-up box + pop-up for non-subscribers (10 Oct 2026) */
.ljoin-inline{padding:0 20px 56px}
.ljoin-card{max-width:680px;margin:0 auto;background:var(--blush-soft);border-radius:22px;padding:40px 36px;text-align:center}
.ljoin-card h2,.ljoin-sheet h2{font-family:"Cormorant Garamond",Georgia,serif;font-weight:500;color:var(--teal2);font-size:2rem;line-height:1.15;margin:.3rem 0 .6rem}
.ljoin-card .eyebrow,.ljoin-sheet .eyebrow{font-family:"Cormorant Garamond",Georgia,serif;font-style:italic;color:var(--teal);margin:0}
.ljoin-body{color:var(--ink-soft);margin:0 0 1.2rem}
#ljoin form.join{margin:0 auto;text-align:left}
#ljoin .micro{font-size:.85rem;color:var(--ink-soft);margin:.9rem 0 0}
#ljoin .thanks{margin:.6rem 0 0}
.ljoin-pop{position:fixed;inset:0;z-index:1000;background:rgba(42,38,34,.38);display:flex;align-items:center;justify-content:center;padding:20px}
.ljoin-pop[hidden]{display:none}
.ljoin-sheet{position:relative;background:var(--cream2);border-radius:22px;max-width:560px;width:100%;padding:44px 36px 34px;text-align:center;box-shadow:0 24px 60px rgba(42,38,34,.22);max-height:calc(100vh - 40px);overflow:auto}
.ljoin-x{position:absolute;top:10px;right:14px;background:none;border:0;font-size:2rem;line-height:1;color:var(--ink-soft);cursor:pointer;padding:6px 10px}
.ljoin-x:focus-visible{outline:2px solid var(--teal);border-radius:8px}
body.ljoin-open{overflow:hidden}
@media(max-width:600px){
  .ljoin-pop{align-items:flex-end;padding:0}
  .ljoin-sheet{border-radius:22px 22px 0 0;padding:40px 20px 26px;max-height:88vh}
  .ljoin-card{padding:32px 20px}
  .ljoin-card h2,.ljoin-sheet h2{font-size:1.7rem}
}
@media(prefers-reduced-motion:no-preference){.ljoin-sheet{animation:ljup .35s ease-out}@keyframes ljup{from{transform:translateY(16px);opacity:0}to{transform:none;opacity:1}}}
