/* LucentStar lucentstar-blog.css, version 2026-10-14.e3eb79d8d1. Generated by build.py: do not edit here. */
/* Blog index and articles (blog.lucentstar.ai). They use the shared opening,
   type and colours. Reading column about 68 characters; body text 18px with
   a line height of 1.7. Motion is restrained: the article heading fades in
   once on load and index cards reveal once. Nothing is pinned or linked to
   scrolling. */

/* Index */
.blog-hero{padding-bottom:40px}
.blog-list{padding-block:24px 120px}
.blog-list-h{font-weight:600;font-size:15px;color:var(--muted);margin-bottom:20px}
.posts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.post-card{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:12px;padding:36px;border-radius:28px;background:var(--cloud);transition:transform var(--t-med) var(--ease),box-shadow var(--t-med) var(--ease)}
.post-card:hover{transform:translateY(-4px);box-shadow:0 26px 46px -32px rgba(11,15,26,.5)}
.post-cat{display:inline-flex;align-items:center;padding:6px 11px;border-radius:99px;background:var(--white);font:500 13px/1 var(--f);color:var(--navy)}
.post-title{font-weight:600;font-size:clamp(22px,1.9vw,28px);line-height:1.22;letter-spacing:-.02em;color:var(--navy);text-wrap:balance}
.post-title a{color:inherit;text-decoration:none}
/* The whole card is clickable; the title is the link's accessible name */
.post-title a::after{content:'';position:absolute;inset:0;border-radius:28px}
.post-title a:focus-visible{outline:none}
.post-title a:focus-visible::after{outline:3px solid var(--navy);outline-offset:3px}
.post-sum{font-size:16px;line-height:1.6;color:var(--text);max-width:34em}
.post-meta{font-size:14.5px;color:var(--muted)}
.post-go{margin-top:auto;padding-top:8px;display:inline-flex;align-items:center;gap:8px;font-weight:600;font-size:15px;color:var(--navy)}
.post-go .ic{width:18px;height:18px;transition:transform var(--t-med) var(--ease)}
.post-card:hover .post-go .ic{transform:translateX(4px)}
.post-card:hover .post-go .ul{text-decoration-thickness:3.5px}

/* Article */
.art-head{padding-bottom:40px}
.art-head .opening{--title-measure:20ch}
html.motion .art-head .opening{animation:artIn 700ms var(--ease) both}
@keyframes artIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.crumbs ol{display:flex;justify-content:center;flex-wrap:wrap;gap:6px 10px;margin-bottom:22px;font-size:15px;color:var(--muted)}
.crumbs li + li::before{content:'/';margin-right:10px;color:var(--field)}
.crumbs a{color:var(--navy);font-weight:600;text-decoration-line:underline;text-decoration-color:var(--link-line);text-decoration-thickness:2px;text-underline-offset:4px}
.art-meta{margin-top:24px;font-size:15.5px;color:var(--muted)}
.art-body{max-width:68ch;margin:0 auto;padding-bottom:96px;font-size:18px;line-height:1.7;color:var(--text)}
.art-body > p{margin-top:1.1em}
.art-body > h2{margin-top:2.2em;font-weight:600;font-size:clamp(26px,2.3vw,34px);line-height:1.18;letter-spacing:-.024em;color:var(--navy);text-wrap:balance}
.art-body > h3{margin-top:1.6em;font-weight:600;font-size:21px;line-height:1.35;letter-spacing:-.012em;color:var(--navy)}
.art-body > h2 + p,.art-body > h3 + p{margin-top:.6em}
.art-body b,.art-body strong{font-weight:600;color:var(--navy)}
.art-quick{margin:8px 0 1.6em;padding:24px 26px;border-radius:22px;background:var(--cloud)}
.art-quick-h{display:flex;align-items:center;gap:10px;font-weight:600;font-size:16px;color:var(--navy)}
.art-quick-h .ic{width:20px;height:20px}
.art-quick p{margin-top:10px;font-size:17px;line-height:1.65}
/* Tables: header row on grey, hairline rows, risk as a filled label */
/* Tables may run wider than the reading column, up to 960px */
.art-table{margin:1.6em calc(50% - min(480px, 50vw - 32px)) 0}
.art-table-scroll{overflow-x:auto;border-radius:18px;box-shadow:0 0 0 1px var(--line)}
.art-table-scroll:focus-visible{outline:3px solid var(--navy);outline-offset:3px}
.art-table table{width:100%;min-width:640px;border-collapse:collapse;font-size:15.5px;line-height:1.55}
.art-table thead th{padding:14px 18px;background:var(--cloud);text-align:left;font-weight:600;font-size:14px;color:var(--navy);white-space:nowrap}
.art-table tbody th,.art-table tbody td{padding:16px 18px;text-align:left;vertical-align:top;border-top:1px solid var(--line)}
.art-table tbody th{font-weight:600;color:var(--navy);white-space:nowrap}
.art-table figcaption{display:flex;gap:8px;align-items:flex-start;margin-top:12px;font-size:14.5px;line-height:1.55;color:var(--muted)}
.art-table figcaption .ic{width:17px;height:17px;margin-top:2px}
.risk{display:inline-flex;align-items:center;gap:6px;padding:5px 10px;border-radius:99px;font:600 13px/1 var(--f);white-space:nowrap}
.risk::before{content:'';width:7px;height:7px;border-radius:50%;background:currentColor}
.risk-none{background:var(--green-tint);color:#05603A}
.risk-low{background:var(--amber-tint);color:var(--amber-ink)}
.risk-high{background:var(--err-tint);color:var(--err)}
/* Numbered checklist */
.art-ol{margin-top:1.2em;display:flex;flex-direction:column;gap:14px;counter-reset:none}
.art-ol li{display:grid;grid-template-columns:36px minmax(0,1fr);gap:14px;align-items:start}
.art-n{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--navy);color:var(--white);font-weight:600;font-size:14px}
.art-ol p{font-size:17.5px;line-height:1.65;padding-top:4px}
.art-ul{margin-top:1em;padding-left:1.2em;list-style:disc}
.art-ul li + li{margin-top:.4em}
.art-qa h3{margin-top:1.4em;font-weight:600;font-size:19.5px;line-height:1.4;color:var(--navy)}
.art-qa p{margin-top:.5em}
.art-cta{margin-top:2.4em;padding:40px;border-radius:28px;background:var(--navy);color:#DCE2EA;text-align:center}
.art-cta h2{font-weight:600;font-size:clamp(24px,2.2vw,30px);line-height:1.2;letter-spacing:-.02em;color:var(--white);text-wrap:balance}
.art-cta p{margin-top:10px;font-size:16.5px;line-height:1.6}
.art-cta .cta-row{justify-content:center;margin-top:24px}
.art-cta .tlink{color:var(--white)}
.art-cta :focus-visible{outline-color:var(--white)}
.art-cta-note{font-size:14px;color:#AAB4C3}
/* Hero image under the article heading, and images in the text. Space is
   reserved by width and height; a tint shows while a photo loads. */
.art-hero{margin-top:36px}
.art-hero img{display:block;width:100%;height:auto;max-height:560px;object-fit:cover;border-radius:28px}
.art-hero figcaption,.art-fig figcaption{margin-top:12px;font-size:14px;line-height:1.55;color:var(--muted)}
.art-credit a{color:inherit;text-decoration:underline;text-decoration-color:var(--line);text-underline-offset:3px}
.art-fig{margin-top:1.6em}
.art-fig img{display:block;width:100%;height:auto;border-radius:20px}
.art-fig.is-inline{max-width:480px}
/* Callout: a labelled note on Cloud (the Quick answer is its own component) */
.art-callout{margin-top:1.6em;padding:22px 24px;border-radius:20px;background:var(--cloud)}
.art-callout-k{font-weight:600;font-size:14px;letter-spacing:.04em;text-transform:uppercase;color:var(--muted)}
.art-callout p + p{margin-top:8px;font-size:17px;line-height:1.65}
/* Quote: large text with a navy rule, and its source */
.art-quote{margin:1.8em 0 0;padding-left:24px;border-left:3px solid var(--navy)}
.art-quote blockquote p{font-weight:500;font-size:clamp(20px,1.7vw,23px);line-height:1.5;letter-spacing:-.01em;color:var(--navy)}
.art-quote figcaption{margin-top:10px;font-size:15px;color:var(--muted)}
/* Video: 16:9, loaded when it's near the screen */
.art-video{margin-top:1.6em}
.art-video-frame{position:relative;aspect-ratio:16/9;border-radius:20px;overflow:hidden;background:var(--navy)}
.art-video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.art-video figcaption{margin-top:10px;font-size:14px;color:var(--muted)}
/* Checklist on Cloud */
.art-check{margin-top:1.6em;padding:26px 28px;border-radius:22px;background:var(--cloud)}
.art-check h3{font-weight:600;font-size:19px;color:var(--navy)}
.art-check ol,.art-check ul{margin-top:12px;display:flex;flex-direction:column;gap:10px;font-size:17px;line-height:1.6}
.art-check ol{padding-left:1.3em;list-style:decimal}
/* Comparison cards: rank and name, what it's best for, pros and cons, price.
   Our own product is marked by its disclosure and a Cloud fill, never a coloured border. */
.art-tools{margin-top:1.4em;display:flex;flex-direction:column;gap:18px;list-style:none}
.art-tool{padding:28px 30px;border-radius:24px;background:var(--white);box-shadow:0 0 0 1px var(--line)}
.art-tool.is-ours{background:var(--cloud);box-shadow:none}
.art-tool-top{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:8px 16px}
.art-tool-top h3{font-weight:600;font-size:22px;line-height:1.3;letter-spacing:-.015em;color:var(--navy)}
.art-tool-n{margin-right:4px;color:var(--muted);font-weight:500}
.art-tool-best{display:inline-flex;padding:6px 12px;border-radius:99px;background:var(--navy);color:var(--white);font:600 13px/1.3 var(--f)}
.art-tool.is-ours .art-tool-best{background:var(--white);color:var(--navy)}
.art-tool-disc{display:flex;gap:8px;align-items:flex-start;margin-top:12px;font-size:14.5px;line-height:1.55;color:var(--muted)}
.art-tool-disc .ic{width:17px;height:17px;margin-top:3px;flex:0 0 auto}
.art-tool-p{margin-top:12px;font-size:17px;line-height:1.65}
.art-pc{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:18px}
.art-pc-h{font-weight:600;font-size:13px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.art-pc ul{margin-top:8px;display:flex;flex-direction:column;gap:8px}
.art-pc li{display:flex;gap:10px;align-items:flex-start;font-size:15.5px;line-height:1.5}
.art-pc li .ic{flex:0 0 auto;width:18px;height:18px;margin-top:2px}
.art-pros .ic{color:#05603A}
.art-cons .ic{color:var(--muted)}
.art-tool-price{margin-top:16px;padding-top:14px;border-top:1px solid var(--line);font-size:15.5px;line-height:1.55;color:var(--navy)}
.art-related{padding-block:24px 120px;border-top:1px solid var(--line)}
.art-related .blog-list-h{margin-top:56px}
.posts-related{grid-template-columns:repeat(2,minmax(0,1fr))}

@media (max-width:999px){
  .posts,.posts-related{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:640px){
  /* Tables become one card per row, each value labelled */
  .art-table-scroll{overflow:visible;box-shadow:none;border-radius:0}
  .art-table table{min-width:0}
  .art-table thead{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
  .art-table table,.art-table tbody,.art-table tr,.art-table tbody th,.art-table tbody td{display:block}
  .art-table tr{padding:16px 18px;border-radius:18px;box-shadow:0 0 0 1px var(--line);margin-bottom:12px}
  .art-table tbody th,.art-table tbody td{padding:6px 0;border:0;white-space:normal}
  .art-table tbody td::before{content:attr(data-label);display:block;margin-bottom:2px;font-weight:600;font-size:13px;color:var(--muted)}
  .art-table tbody th{font-size:17px}
}
@media (max-width:599px){
  .art-hero img{border-radius:20px}
  .art-pc{grid-template-columns:minmax(0,1fr);gap:14px}
  .art-tool{padding:22px 20px;border-radius:20px}
  .art-check{padding:22px 20px}
  .post-card{padding:28px 22px}
  .post-title a::after{border-radius:22px}
  .post-card{border-radius:22px}
  .art-body{font-size:17px;padding-bottom:72px}
  .art-quick{padding:20px}
  .art-cta{padding:32px 20px;border-radius:22px}
  .art-cta .cta-row{flex-direction:column;gap:6px}
  .art-cta .cta-row .btn{width:100%}
}