/* Letterjoy: clean white stationery, black ink, EB Garamond headlines, Assistant body, a touch of envelope green. */
:root{
  --head-font:"EB Garamond",Garamond,serif; --body-font:Assistant,system-ui,sans-serif; --env-font:"EB Garamond",serif;
  --ink:#121212; --ink-2:#2f2f2f; --ink-3:#6b6b6b; --bg:#fff; --card:#fff; --soft:#f7f5ef; --input-bg:#fff;
  --line:#e3e0d8; --line-strong:#bdb8ad; --link:#0f6e62; --focus:#108474; --focus-soft:rgba(16,132,116,.18);
  --primary:#121212; --primary-ink:#fff; --primary-hover:#333; --accent:#108474; --accent-ink:#fff;
  --btn-bg:#fff; --btn-ink:#121212; --btn-border:#121212; --danger:#b42318; --ok:#108474; --warn:#a15c07;
  --info-bg:#eef7f5; --info-line:#108474; --info-ink:#0f6e62; --warn-bg:#fff7e8; --warn-line:#f59e0b; --err-bg:#fdf0ee;
  --env-bg:#fbf8f1; --env-line:#d6cfbf; --env-ink:#2a2a2a; --demo-bg:#fffaf0; --demo-line:#c27a00;
  --offer-bg:#f6f1e4; --offer-ink:#121212; --radius:4px; --radius-input:4px; --radius-btn:3px; --shadow:0 1px 2px rgba(0,0,0,.04),0 8px 24px rgba(0,0,0,.05);
}
body{background:#fff}
.proto-banner{background:#fff4d6;color:#5b3b00;text-align:center;font-size:.82rem;padding:6px 12px;font-weight:600}
.lj-header{background:#121212;color:#fff;position:sticky;top:0;z-index:20}
.lj-header-in{display:flex;align-items:center;justify-content:space-between;min-height:62px;gap:16px}
.lj-logo img{height:34px;width:auto}
.lj-header ul{display:flex;gap:22px;list-style:none;margin:0;padding:0}
.lj-header a{color:#fff;text-decoration:none;font-family:"EB Garamond",serif;font-size:1rem}
.lj-header a[aria-current]{text-decoration:underline;text-underline-offset:6px}
.btn{font-family:"EB Garamond",serif;font-size:1.05rem;letter-spacing:.01em}
.btn.small{font-size:.95rem}
.step h2,.lj-section-h{font-weight:700}

/* hero */
.lj-hero{background:linear-gradient(rgba(255,255,255,.86),rgba(255,255,255,.94)),url(assets/pen-bg.jpg) right center/cover no-repeat;border-bottom:1px solid var(--line);padding:30px 0 28px;text-align:center}
.lj-frames{display:flex;justify-content:center;margin-bottom:12px}
.lj-frames img{width:52px;height:52px;border-radius:50%;box-shadow:0 2px 6px rgba(0,0,0,.22);display:block}
.lj-frames img+img{margin-left:-6px}
.lj-hero h1{font-size:clamp(1.6rem,4.4vw,2.7rem);margin-bottom:.2em;font-weight:600;letter-spacing:-.01em}
.lj-hero-sub{color:var(--ink-2);margin:0 auto 18px;max-width:560px}
.lj-search{border:1.5px solid #121212;border-radius:4px}.lj-search:focus-within{box-shadow:0 0 0 3px var(--focus-soft)!important}

.lj-results{text-align:left;background:#fff;border:1px solid var(--line);padding:6px 16px 10px;box-shadow:var(--shadow)}
.sr-topics{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:10px 0}.sr-topics .mini{margin:0 6px 0 0}
.lj-member{max-width:620px;margin:16px auto 0}.lj-member .member-bar{margin:0;background:#fff}

/* topics */
.lj-topics{padding:30px 20px 20px}
.lj-section-h{text-align:center;font-size:clamp(1.7rem,3.5vw,2.3rem);margin-bottom:22px}
.lj-grid{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid #121212;border-left:1px solid #121212}
.lj-tile{position:relative;display:flex;flex-direction:column;gap:6px;padding:24px 22px 26px;border-right:1px solid #121212;border-bottom:1px solid #121212;color:var(--ink);text-decoration:none;background:#fff;transition:background .15s}
.lj-tile:hover{background:var(--soft)}
.lj-tile:focus-visible{outline-offset:-4px}
.lj-ico{color:var(--accent);margin-bottom:6px}
.lj-tile-t{font-family:"EB Garamond",serif;font-size:1.32rem;font-weight:600;line-height:1.2}
.lj-tile-d{color:var(--ink-3);font-size:.94rem}
.lj-tile.hot{background:#f7f5ef}
.lj-hot{position:absolute;top:14px;right:14px;font-size:.68rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;background:#F59E0B;color:#121212;padding:3px 8px;border-radius:2px}

/* season */
.lj-season{margin:44px 0;background:#f3ecd9 url(assets/pen-bg.jpg) left center/cover;background-blend-mode:multiply;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.lj-season-in{display:grid;grid-template-columns:1.3fr 1fr;gap:36px;align-items:center;padding:46px 20px}
.lj-season h2{font-size:clamp(1.6rem,3.2vw,2.3rem);font-weight:600}
.lj-kicker{font-weight:800;text-transform:uppercase;letter-spacing:.12em;font-size:.78rem;color:var(--accent);margin:0 0 8px}
.lj-season-art{display:flex;justify-content:center}

.lj-faq{padding:10px 20px 30px}
.lj-faq .faq summary{font-family:"EB Garamond",serif;font-size:1.15rem;font-weight:600}
.lj-contact{display:flex;align-items:center;justify-content:space-between;gap:24px;border:1px solid #121212;padding:28px;margin:20px auto 60px;max-width:1080px;flex-wrap:wrap}
.lj-contact h2{font-size:1.7rem;font-weight:600}.lj-contact p{margin:0;max-width:640px;color:var(--ink-2)}

.lj-footer{border-top:3px double #121212;padding:28px 0 90px;text-align:center;font-size:.9rem;color:var(--ink-2)}
.lj-foot-links a{color:var(--ink)}

/* flow polish */
body[data-view=flow] .lj-hero{display:none}
body[data-view=flow] main{background:linear-gradient(#faf8f3,#fff 380px)}
.card{border-color:#d8d3c6}
.step.success{border-top:4px solid var(--accent)}
.status-badge.transit{background:#e8f4f1;color:#0f6e62}
.choice{border-color:#d8d3c6}.choice-t{font-family:"EB Garamond",serif;font-size:1.18rem;font-weight:600}
.offer-card{background:#f6f1e4 url(assets/pen-bg.jpg) right/cover;background-blend-mode:multiply;border:1px solid #d8d3c6}
.offer-card h2{font-size:2rem}



@media (max-width:860px){
  .lj-grid{grid-template-columns:repeat(2,1fr)}
  .lj-season-in{grid-template-columns:1fr;gap:22px}.lj-season-art img{max-width:340px}
  .lj-header ul{gap:14px}.lj-header li:nth-child(-n+3){display:none}
}
@media (max-width:520px){
  .lj-grid{grid-template-columns:1fr}
  .lj-tile{padding:18px}
  
}

/* topic list (single column at every width) */
.lj-topics{max-width:820px;margin:0 auto}
.lj-list{list-style:none;margin:0;padding:0;border-top:1px solid #121212}
.lj-row{display:flex;align-items:center;gap:18px;padding:18px 16px;border-bottom:1px solid #121212;color:var(--ink);text-decoration:none;background:#fff;transition:background .15s}
.lj-row:hover{background:var(--soft)}
.lj-row:focus-visible{outline:3px solid var(--focus);outline-offset:-3px;background:var(--soft)}
.lj-row .lj-ico{flex:none;margin:0;width:44px;height:44px;display:grid;place-items:center;border:1px solid #d8d3c6;border-radius:50%}
.lj-row-text{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.lj-row-t{font-family:"EB Garamond",serif;font-size:1.28rem;font-weight:600;line-height:1.2}
.lj-row-d{color:var(--ink-3);font-size:.94rem}
.lj-row .lj-hot{position:static;display:inline-block;vertical-align:middle;margin-left:6px;font-family:Assistant,sans-serif}
.lj-chev{flex:none;font-size:1.8rem;line-height:1;color:var(--ink-3);transition:transform .15s}
.lj-row:hover .lj-chev,.lj-row:focus-visible .lj-chev{transform:translateX(3px);color:var(--ink)}
@media (max-width:520px){.lj-row{gap:12px;padding:14px 8px}.lj-row .lj-ico{width:38px;height:38px}.lj-row-t{font-size:1.15rem}}
:root{--sa-bg:#e7f4f1;--sa-bg-2:#f5faf9;--sa-line:#b9ddd5;--sa-bar:#108474;--sa-ink:#0f6e62;--sa-ico-ink:#fff}
.sa-text strong{font-family:"EB Garamond",serif;font-weight:700}
.smart-action.best .sa-go{font-family:"EB Garamond",serif;font-size:1.02rem}

@media (max-width:600px){
  .lj-hero{padding:16px 0 16px}
  .lj-frames{margin-bottom:8px}.lj-frames img{width:46px;height:46px}
  .lj-hero h1{font-size:1.55rem}
  .lj-hero-sub{display:none}
  .lj-hero h1{margin-bottom:12px}
  .lj-topics{padding:16px 16px 16px}
  .lj-section-h{font-size:1.45rem;margin-bottom:10px}
}

.lj-season-art img{width:100%;height:auto;max-width:400px;aspect-ratio:1/1;object-fit:cover;border-radius:18px;box-shadow:0 18px 40px rgba(0,0,0,.18);display:block}
:root{--ico-ink:#108474;--ico-line:#d8d3c6;--ico-bg:#fff}
