/* Pardos Sakura insight article — intentionally inherits the main site's brand tokens. */
.article-page { background: var(--color-bg); }
.article-page main { padding-top: 90px; }
.article-hero {
  border-bottom: 1px solid var(--color-border);
  background:
    radial-gradient(circle at 84% 14%, rgba(93,122,90,.17), transparent 27%),
    linear-gradient(118deg, #fff 0%, var(--color-bg) 56%, #e8ede5 100%);
}
.article-hero__grid {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(380px, .95fr);
  gap: clamp(38px, 6vw, 84px);
  align-items: center;
  min-height: calc(100svh - 78px);
  padding-top: clamp(60px, 7vw, 92px);
  padding-bottom: clamp(60px, 7vw, 92px);
}
.article-breadcrumb { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:30px; color:var(--color-muted); font-size:.78rem; font-weight:600; }
.article-breadcrumb a { color:var(--color-primary); }
.article-eyebrow,.article-kicker { margin:0 0 13px; color:var(--color-accent); font-size:.72rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase; }
.article-hero h1 { max-width:760px; margin:0; font-size:clamp(3rem,5.2vw,5.7rem); line-height:.98; letter-spacing:-.02em; color:var(--color-primary-dark); }
.article-hero__dek { max-width:760px; margin-top:22px; color:var(--color-body); font-size:clamp(1rem,1.4vw,1.18rem); line-height:1.78; }
.article-meta-row { display:flex; flex-wrap:wrap; gap:10px 22px; margin-top:24px; color:var(--color-muted); font-size:.78rem; font-weight:600; }
.article-hero__actions { display:flex; flex-wrap:wrap; align-items:center; gap:20px; margin-top:30px; }
.article-text-link { color:var(--color-primary); border-bottom:1px solid currentColor; font-weight:700; }
.article-hero__media { position:relative; overflow:hidden; border-radius:var(--radius-lg); box-shadow:var(--shadow-lg); background:#dfe5dc; }
.article-hero__media img { width:100%; aspect-ratio:1.05/1; object-fit:cover; }
.article-hero__media::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,transparent 58%,rgba(30,45,30,.72)); pointer-events:none; }
.article-hero__media figcaption { position:absolute; z-index:1; left:24px; right:24px; bottom:20px; color:#fff; font-size:.78rem; line-height:1.5; }
.article-layout { display:grid; grid-template-columns:220px minmax(0,820px); gap:clamp(48px,7vw,96px); justify-content:center; align-items:start; padding-top:clamp(64px,7vw,100px); padding-bottom:clamp(76px,8vw,118px); }
.article-toc { position:sticky; top:106px; padding:20px 0; border-top:1px solid var(--color-border); border-bottom:1px solid var(--color-border); }
.article-toc nav { display:grid; }
.article-toc a { padding:9px 0; color:var(--color-body); border-bottom:1px solid rgba(224,221,213,.75); font-size:.8rem; font-weight:600; line-height:1.4; }
.article-toc a:last-child { border-bottom:0; }
.article-toc a:hover,.article-toc a:focus-visible { color:var(--color-primary); }
.article-content { min-width:0; }
.article-content > section,.article-content > figure { margin-top:clamp(54px,6.5vw,82px); }
.article-content > :first-child { margin-top:0; }
.article-content h2 { margin:0 0 19px; color:var(--color-primary-dark); font-size:clamp(2rem,3.5vw,3rem); line-height:1.08; }
.article-content h3 { margin:32px 0 10px; color:var(--color-text); font-size:clamp(1.4rem,2vw,1.75rem); }
.article-content p { margin:0 0 18px; font-size:1rem; line-height:1.82; color:var(--color-body); }
.article-content strong { color:var(--color-text); }
.article-answer { position:relative; padding:clamp(28px,4vw,44px); border:1px solid var(--color-border); border-radius:var(--radius); background:#fff; box-shadow:var(--shadow-sm); }
.article-answer::before { content:""; position:absolute; inset:0 auto 0 0; width:4px; border-radius:var(--radius) 0 0 var(--radius); background:var(--color-primary); }
.article-table-wrap { overflow-x:auto; margin-top:26px; border:1px solid var(--color-border); border-radius:var(--radius); background:#fff; box-shadow:var(--shadow-sm); }
.article-table { width:100%; min-width:760px; border-collapse:collapse; }
.article-table th,.article-table td { padding:16px 18px; text-align:left; border-bottom:1px solid var(--color-border); vertical-align:top; }
.article-table th { color:#fff; background:var(--color-primary); font-size:.82rem; letter-spacing:.02em; }
.article-table td { color:var(--color-body); font-size:.92rem; line-height:1.55; }
.article-table tr:last-child td { border-bottom:0; }
.article-disclaimer { margin-top:13px!important; color:var(--color-muted)!important; font-size:.8rem!important; }
.article-wide-image { overflow:hidden; border-radius:var(--radius-lg); background:#fff; border:1px solid var(--color-border); box-shadow:var(--shadow); }
.article-wide-image img { width:100%; max-height:620px; object-fit:contain; background:#f4f2eb; }
.article-wide-image figcaption { padding:14px 18px; color:var(--color-muted); font-size:.8rem; line-height:1.55; }
.article-check-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; margin-top:28px; }
.article-check-card { padding:24px; border:1px solid var(--color-border); border-radius:var(--radius); background:#fff; }
.article-check-card h3 { margin:0 0 10px; color:var(--color-primary); font-size:1.25rem; }
.article-check-card p { margin:0; font-size:.92rem; line-height:1.7; }
.article-note { margin-top:28px; padding:20px 22px; border-left:4px solid var(--color-accent); background:var(--color-bg-alt); color:var(--color-body); line-height:1.7; }
.article-formula { display:grid; gap:6px; margin:28px 0; padding:26px; border-radius:var(--radius); background:var(--color-primary); color:#fff; }
.article-formula span { font-size:.76rem; text-transform:uppercase; letter-spacing:.12em; opacity:.75; }
.article-formula strong { color:#fff; font-family:var(--font-heading); font-size:clamp(1.6rem,3vw,2.4rem); }
.article-formula small { opacity:.82; line-height:1.6; }
.article-inline-cta { margin-top:2px; }
.article-list { display:grid; gap:12px; margin-top:24px; }
.article-list li { position:relative; padding:14px 18px 14px 48px; border:1px solid var(--color-border); border-radius:var(--radius-sm); background:#fff; color:var(--color-body); line-height:1.65; }
.article-list li::before { content:"✓"; position:absolute; left:17px; top:13px; display:grid; place-items:center; width:22px; height:22px; border-radius:50%; background:var(--color-accent-soft); color:var(--color-primary); font-weight:800; }
.article-cta-panel { display:flex; justify-content:space-between; align-items:center; gap:34px; padding:clamp(30px,5vw,50px); border-radius:var(--radius-lg); background:linear-gradient(135deg,var(--color-primary-dark),var(--color-primary)); box-shadow:var(--shadow-lg); }
.article-cta-panel h2,.article-cta-panel p,.article-cta-panel .article-kicker { color:#fff; }
.article-cta-panel p { max-width:590px; opacity:.9; }
.article-cta-panel .btn { flex:0 0 auto; }
.article-faqs details { border-bottom:1px solid var(--color-border); background:#fff; }
.article-faqs details:first-of-type { border-top:1px solid var(--color-border); }
.article-faqs summary { cursor:pointer; padding:19px 0; color:var(--color-text); font-weight:700; line-height:1.45; }
.article-faqs details p { padding:0 0 20px; margin:0; }
.article-final { padding-top:10px; }
.article-content a:not(.btn):hover { color:var(--color-primary-dark); }

@media (max-width: 980px) {
  .article-hero__grid { grid-template-columns:1fr; min-height:auto; }
  .article-hero__media { max-width:720px; }
  .article-layout { grid-template-columns:1fr; }
  .article-toc { position:static; top:auto; }
  .article-toc nav { grid-template-columns:repeat(2,minmax(0,1fr)); column-gap:22px; }
}
@media (max-width: 900px) {
  .article-page main { padding-top: 72px; }
}
@media (max-width: 700px) {
  .article-hero__grid { padding-top:44px; padding-bottom:52px; gap:34px; }
  .article-hero h1 { font-size:clamp(2.6rem,13vw,4.1rem); }
  .article-hero__media img { aspect-ratio:4/3; }
  .article-layout { padding-top:52px; padding-bottom:72px; }
  .article-toc nav { grid-template-columns:1fr; }
  .article-check-grid { grid-template-columns:1fr; }
  .article-cta-panel { align-items:flex-start; flex-direction:column; }
  .article-cta-panel .btn { width:100%; }
  .article-hero__actions { align-items:flex-start; flex-direction:column; gap:14px; }
  .article-content h2 { font-size:clamp(1.8rem,9vw,2.45rem); }
}