/* Page-specific styles for news-list.html. */

:root{
  --ink:    #0C1220;
  --ink2:   #111827;
  --white:  #ffffff;
  --g50:    #F7F8FC;
  --g100:   #EEF1F8;
  --blue:   #2563EB;
  --blue2:  #3B82F6;
  --cyan:   #06B6D4;
  --text:   #111827;
  --muted:  #6B7280;
  --lt-ln:  #E5E9F2;
  --dk-ln:  rgba(255,255,255,0.1);
  
  --n-update:  #2563EB;  
  --n-maint:   #F59E0B;  
  --n-important: #DC2626;
  --n-campaign:#06B6D4;  
  --n-media:   #6B7280;  
}

.news-header{
  background:var(--white);
  padding:96px 20px 28px;
  border-bottom:1px solid var(--lt-ln);
}

.news-header-inner{max-width:var(--contents-width, var(--contents-medium-width));margin:0 auto;}

.breadcrumb-nav{
  display:flex;align-items:center;gap:6px;flex-wrap:wrap;
  font-family:"DM Mono",monospace;font-size:.6562rem;letter-spacing:.03em;
  color:var(--muted);margin-bottom:16px;
}

.news-eyebrow{
  font-family:"DM Mono",monospace;font-size:.625rem;
  letter-spacing:.14em;text-transform:uppercase;color:var(--blue);margin-bottom:10px;
  display:flex;align-items:center;gap:8px;
}

.news-header h1{
  font-size:clamp(1.625rem,6vw,2.375rem);font-weight:700;
  letter-spacing:-.02em;line-height:1.25;color:var(--text);margin-bottom:10px;
}

.news-header p{font-size:.8438rem;color:var(--muted);line-height:1.75;}

.nf-sec{
  background:var(--white);position:sticky;top:62px;z-index:120;
  border-bottom:1px solid var(--lt-ln);
}

.nf-track{
  display:flex;gap:6px;overflow-x:auto;-webkit-overflow-scrolling:touch;
  padding:12px 20px;scrollbar-width:none;max-width:var(--contents-width, var(--contents-medium-width));margin:0 auto;
}

.nf-track::-webkit-scrollbar{display:none;}

.nf-chip{
  flex-shrink:0;
  font-family:"DM Mono",monospace;font-size:.6875rem;font-weight:500;
  letter-spacing:.03em;white-space:nowrap;
  padding:8px 15px;border-radius:8px;
  border:1px solid var(--lt-ln);
  background:var(--white);color:var(--muted);
  cursor:pointer;text-decoration:none;
  transition:border-color .2s,background .2s,color .2s;
  display:inline-flex;align-items:center;gap:7px;
}

.nf-chip .dot{display:none;}

.nf-chip:hover{border-color:#C7CEDB;color:var(--text);}

.nf-chip.active{background:var(--ink);color:#fff;border-color:var(--ink);}

.nf-chip.active .dot{background:#fff !important;}

.pinned-sec{background:var(--white);padding:24px 20px 0;}

.pinned-inner{max-width:var(--contents-width, var(--contents-medium-width));margin:0 auto;}

.pinned-card{
  display:flex;gap:14px;align-items:flex-start;
  background:#FEF2F2;border:1px solid #FECACA;border-radius:12px;
  padding:16px 18px;text-decoration:none;color:inherit;
  transition:border-color .2s,background .2s;
}

.pinned-card:hover{border-color:#FCA5A5;background:#FEE9E9;}

.pinned-pin{font-size:1rem;flex-shrink:0;margin-top:1px;}

.pinned-body{flex:1;min-width:0;}

.pinned-tag{
  font-family:"DM Mono",monospace;font-size:.5938rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;
  color:var(--n-important);margin-bottom:5px;display:block;
}

.pinned-ttl{font-size:.8438rem;font-weight:600;color:var(--text);line-height:1.55;}

.pinned-date{
  font-family:"DM Mono",monospace;font-size:.6875rem;color:#B91C1C;opacity:.7;
  flex-shrink:0;white-space:nowrap;margin-top:2px;
}

.list-sec{background:var(--white);padding:32px 20px 64px;}

.list-inner{max-width:var(--contents-width, var(--contents-medium-width));margin:0 auto;}

.year-group{margin-bottom:8px;}

.year-label{
  font-family:"DM Mono",monospace;font-size:.75rem;font-weight:600;letter-spacing:.06em;
  color:var(--muted);padding:18px 0 10px;
  position:sticky;top:106px;background:var(--white);z-index:10;
}

.news-item{
  display:flex;flex-direction:column;gap:8px;
  padding:18px 0;border-bottom:1px solid var(--lt-ln);
  text-decoration:none;color:inherit;
  transition:padding-left .2s;
}

.news-item:hover{padding-left:6px;}

.news-item:first-child{border-top:1px solid var(--lt-ln);}

.news-top-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;}

.news-date{
  font-family:"DM Mono",monospace;font-size:.7188rem;color:var(--muted);flex-shrink:0;
}

.news-cat{
  font-family:"DM Mono",monospace;font-size:.5938rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;
  padding:3px 9px;border-radius:5px;display:inline-flex;align-items:center;gap:5px;
  flex-shrink:0;white-space:nowrap;
}

.news-new-badge{
  font-family:"DM Mono",monospace;font-size:.5625rem;font-weight:600;letter-spacing:.06em;
  color:#fff;background:var(--cyan);padding:2px 7px;border-radius:4px;
  flex-shrink:0;white-space:nowrap;
}

.news-ttl{
  font-size:.9062rem;font-weight:500;color:var(--text);line-height:1.6;
  transition:color .2s;
}

.news-item:hover .news-ttl{color:var(--blue);}

.news-desc{font-size:.7812rem;color:var(--muted);line-height:1.65;}

.sub-sec{background:var(--g50);padding:40px 20px;border-top:1px solid var(--lt-ln);}

.sub-card{
  max-width:var(--contents-width, var(--contents-medium-width));margin:0 auto;
  display:flex;flex-direction:column;gap:16px;
  background:var(--white);border:1px solid var(--lt-ln);border-radius:14px;
  padding:26px 22px;
}

@media(min-width:681px){
  .news-header{padding:120px 32px 32px;}
  .news-item{flex-direction:row;align-items:baseline;gap:20px;}
  .news-top-row{flex-shrink:0;width:220px;flex-wrap:nowrap;}
  .news-item-body{flex:1;min-width:0;}
  .pinned-card{align-items:center;}
  .sub-card{flex-direction:row;align-items:center;justify-content:space-between;}
}

@media(min-width:1081px){
  body{font-size:1rem;}

  #siteNav{padding:18px 48px;}
  #siteNav .nav-toggle{display:none;}
  #siteNav ~ .nav-overlay{display:none;}
  #siteNav .nav-r{
    position:static;width:auto;height:auto;
    background:none;border-left:none;backdrop-filter:none;
    flex-direction:row;align-items:center;gap:28px;
    padding:0;transform:none;overflow:visible;
  }
  #siteNav .nav-link{font-size:.8125rem;padding:0;border-bottom:none;color:rgba(255,255,255,.5);}
  #siteNav .nav-link:hover{color:#fff;}
  #siteNav .nav-back{font-size:.6875rem;padding:0;order:0;}
  #siteNav .nav-btn{font-size:.6875rem;padding:9px 20px;margin-top:0;}

  .news-header{padding:150px 48px 40px;}
  .news-header h1{font-size:clamp(2rem,3.5vw,2.75rem);}
  .news-header p{font-size:.9062rem;}

  .nf-sec{top:74px;}
  .nf-track{padding:14px 48px;}

  .pinned-sec{padding:28px 48px 0;}
  .pinned-card{padding:18px 24px;}

  .list-sec{padding:40px 48px 96px;}
  .year-label{top:118px;font-size:.8125rem;}
  .news-item{padding:20px 0;}
  .news-top-row{width:220px;}
  .news-ttl{font-size:.9375rem;}
  .news-desc{font-size:.8125rem;}

  .sub-sec{padding:64px 48px;}
  .sub-card{padding:34px 36px;}
  .sub-txt h3{font-size:1.0625rem;}
}


/*******************/
/* Page-specific styles for news-detail.html. */
/*******************/
.news-art-header{
  background:var(--white);
  padding:96px 20px 28px;
  border-bottom:1px solid var(--lt-ln);
}

.news-art-header-inner{max-width:var(--contents-width, var(--contents-article-width));margin:0 auto;}

.breadcrumb-nav{
  display:flex;align-items:center;gap:6px;flex-wrap:wrap;
  font-family:"DM Mono",monospace;font-size:.6562rem;letter-spacing:.03em;
  color:var(--muted);margin-bottom:18px;
}

.breadcrumb-nav .current{color:var(--text);}

.news-art-top-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:14px;}

.news-cat{
  font-family:"DM Mono",monospace;font-size:.5938rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;
  padding:4px 10px;border-radius:5px;display:inline-flex;align-items:center;gap:5px;
}

.news-art-date{font-family:"DM Mono",monospace;font-size:.75rem;color:var(--muted);}

.news-art-header h1{
  font-size:clamp(1.5rem,6vw,2.25rem);font-weight:700;
  letter-spacing:-.02em;line-height:1.4;color:var(--text);margin-bottom:16px;
}

.news-meta-strip{
  display:flex;flex-wrap:wrap;gap:18px;
  padding-top:18px;border-top:1px solid var(--lt-ln);
  font-family:"DM Mono",monospace;font-size:.7188rem;color:var(--muted);
}

.news-meta-strip strong{color:var(--text);font-weight:600;}

.art-body-sec{background:var(--white);padding:36px 20px 0;}

.art-body-layout{max-width:var(--contents-width, var(--contents-article-width));margin:0 auto;display:flex;flex-direction:column;gap:32px;}

.toc-card{
  background:var(--g50);border:1px solid var(--lt-ln);border-radius:12px;
  padding:16px 18px;
}

.toc-list{display:flex;flex-direction:column;gap:8px;margin-top:14px;padding-top:12px;border-top:1px solid var(--lt-ln);}

.toc-list .toc-n{font-family:"DM Mono",monospace;font-size:.6875rem;color:var(--blue);flex-shrink:0;}

.art-prose{font-size:.9375rem;line-height:1.9;color:var(--text);}

.art-prose > * + *{margin-top:20px;}

.art-prose p.lead-p{font-size:1rem;color:var(--ink2);font-weight:500;line-height:1.75;}

.art-prose a{color:var(--blue);text-decoration:underline;text-decoration-color:rgba(37,99,235,.3);text-underline-offset:2px;}

.art-prose a:hover{text-decoration-color:var(--blue);}

.art-prose h2{
  font-size:clamp(1.1875rem,4.5vw,1.5rem);font-weight:700;letter-spacing:-.01em;
  color:var(--text);line-height:1.45;margin-top:44px;padding-bottom:12px;
  border-bottom:2px solid var(--ink);scroll-margin-top:90px;
}

.art-prose h3{
  font-size:1.0625rem;font-weight:700;color:var(--text);letter-spacing:-.005em;
  margin-top:32px;padding-left:12px;border-left:3px solid var(--blue);
  scroll-margin-top:90px;
}

.art-prose h4{
  font-size:.9375rem;font-weight:700;color:var(--text);margin-top:24px;
  display:flex;align-items:center;gap:8px;
}

.art-prose h4::before{
  content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--cyan);flex-shrink:0;
}

.art-prose h5{
  font-size:.8438rem;font-weight:600;color:var(--ink2);margin-top:20px;
  font-family:"DM Mono",monospace;letter-spacing:.02em;text-transform:uppercase;
}

.art-prose h6{
  font-size:.75rem;font-weight:600;color:var(--muted);margin-top:16px;
  font-family:"DM Mono",monospace;letter-spacing:.04em;text-transform:uppercase;
}

.art-prose ul,.art-prose ol{padding-left:1.4em;display:flex;flex-direction:column;gap:9px;}

.art-prose li{padding-left:4px;font-size:.9062rem;}

.art-prose ul li::marker{color:var(--blue);}

.art-prose ul ul,.art-prose ol ol,.art-prose ul ol,.art-prose ol ul{margin-top:9px;padding-left:1.3em;}

.art-prose li > p{margin-top:6px;}

.check-list{list-style:none;padding-left:0;}

.check-list li{
  display:flex;align-items:flex-start;gap:10px;padding-left:0;
  font-size:.9062rem;color:var(--text);
}

.check-list li::before{
  content:"✓";flex-shrink:0;width:20px;height:20px;border-radius:5px;
  background:rgba(37,99,235,.1);color:var(--blue);font-weight:700;font-size:.75rem;
  display:flex;align-items:center;justify-content:center;margin-top:1px;
}

.tbl-wrap{width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid var(--lt-ln);border-radius:10px;}

.tbl-hint{
  display:flex;align-items:center;gap:6px;
  font-family:"DM Mono",monospace;font-size:.6562rem;color:var(--muted);
  margin-top:8px;
}

.tbl-hint::before{content:"↔";color:var(--blue);}

.art-prose table{width:100%;min-width:480px;border-collapse:collapse;font-size:.8125rem;}

.art-prose thead th{
  font-family:"DM Mono",monospace;font-size:.6562rem;letter-spacing:.05em;text-transform:uppercase;
  background:var(--g50);color:var(--muted);font-weight:600;
  padding:11px 14px;text-align:left;white-space:nowrap;
  border-bottom:1px solid var(--lt-ln);
}

.art-prose tbody td{
  padding:12px 14px;border-bottom:1px solid var(--lt-ln);color:var(--text);vertical-align:top;
}

.art-prose tbody tr:last-child td{border-bottom:none;}

.art-prose tbody tr:hover{background:var(--g50);}

.tbl-ok{color:var(--n-update);font-family:"DM Mono",monospace;font-size:.75rem;font-weight:600;}

.tbl-ng{color:var(--muted);font-family:"DM Mono",monospace;font-size:.75rem;}

.art-prose blockquote{
  border-left:3px solid var(--lt-ln);background:var(--g50);
  padding:14px 18px;border-radius:0 8px 8px 0;
  font-size:.875rem;color:var(--ink2);
}

.art-prose blockquote p{margin:0;}

.art-prose blockquote cite{
  display:block;margin-top:8px;font-style:normal;
  font-family:"DM Mono",monospace;font-size:.6875rem;color:var(--muted);
}

.art-prose code{
  font-family:"DM Mono",monospace;font-size:.88em;
  background:var(--g100);color:#1E40AF;
  padding:2px 6px;border-radius:4px;
}

.art-code-wrap{width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;}

.art-code{
  background:var(--ink);border-radius:10px;padding:16px 18px;
  font-family:"DM Mono",monospace;font-size:.7812rem;color:#E2E8F0;
  line-height:1.7;white-space:pre;
}

.art-prose hr{border:none;border-top:1px solid var(--lt-ln);margin:8px 0;}

.callout{
  background:rgba(37,99,235,.06);border:1px solid rgba(37,99,235,.18);
  border-radius:12px;padding:16px 18px;display:flex;gap:13px;align-items:flex-start;
}

.callout-icon{font-size:1.0625rem;flex-shrink:0;}

.changelog-item{display:flex;gap:10px;align-items:flex-start;}

.cl-badge{
  flex-shrink:0;font-family:"DM Mono",monospace;font-size:.5938rem;font-weight:700;letter-spacing:.04em;
  padding:3px 8px;border-radius:5px;margin-top:2px;white-space:nowrap;
}

.cl-badge.add{background:rgba(37,99,235,.1);color:var(--blue);}

.cl-badge.fix{background:rgba(245,158,11,.12);color:#B45309;}

.cl-badge.improve{background:rgba(6,182,212,.12);color:#0E7490;}

.art-tags{display:flex;flex-wrap:wrap;gap:8px;}

.adj-nav-sec{background:var(--g50);padding:32px 20px;margin-top:16px;}

.back-list-wrap{max-width:var(--contents-width, var(--contents-article-width));margin:0 auto;padding:28px 20px 0;}

.back-list-link{
  display:inline-flex;align-items:center;gap:8px;
  font-family:"DM Mono",monospace;font-size:.75rem;color:var(--muted);text-decoration:none;
  transition:color .2s;
}

.back-list-link:hover{color:var(--blue);}

.related-sec{background:var(--white);padding:40px 20px 64px;border-top:1px solid var(--lt-ln);}

.related-inner{max-width:var(--contents-width, var(--contents-article-width));margin:0 auto;}

.related-head{
  font-size:.8125rem;font-weight:600;color:var(--text);margin-bottom:16px;
}

.related-list{display:flex;flex-direction:column;}

.rel-news-item{
  display:flex;flex-direction:column;gap:6px;
  padding:14px 0;border-bottom:1px solid var(--lt-ln);
  text-decoration:none;color:inherit;
}

.rel-news-item:first-child{border-top:1px solid var(--lt-ln);}

.rel-news-top{display:flex;align-items:center;gap:10px;}

.rel-news-date{font-family:"DM Mono",monospace;font-size:.6875rem;color:var(--muted);}

.rel-news-ttl{font-size:.8438rem;font-weight:500;color:var(--text);transition:color .2s;}

.rel-news-item:hover .rel-news-ttl{color:var(--blue);}

.sub-sec{background:var(--g50);padding:0 20px 56px;}

.sub-card{
  max-width:var(--contents-width, var(--contents-article-width));margin:0 auto;
  display:flex;flex-direction:column;gap:16px;
  background:var(--white);border:1px solid var(--lt-ln);border-radius:14px;
  padding:24px 22px;
}

@media(min-width:681px){
  .news-art-header{padding:120px 32px 32px;}
  .stat-row,.adj-nav{flex-direction:row;}
  .adj-link{flex:1;}
  .sub-card{flex-direction:row;align-items:center;justify-content:space-between;}
}

@media(min-width:1081px){
  body{font-size:1rem;}

  #siteNav{padding:18px 48px;}
  #siteNav .nav-toggle{display:none;}
  #siteNav ~ .nav-overlay{display:none;}
  #siteNav .nav-r{
    position:static;width:auto;height:auto;
    background:none;border-left:none;backdrop-filter:none;
    flex-direction:row;align-items:center;gap:28px;
    padding:0;transform:none;overflow:visible;
  }
  #siteNav .nav-link{font-size:.8125rem;padding:0;border-bottom:none;color:rgba(255,255,255,.5);}
  #siteNav .nav-link:hover{color:#fff;}
  #siteNav .nav-back{font-size:.6875rem;padding:0;order:0;}
  #siteNav .nav-btn{font-size:.6875rem;padding:9px 20px;margin-top:0;}

  .news-art-header{padding:152px 48px 40px;}
  .news-art-header h1{font-size:clamp(1.75rem,3.2vw,2.375rem);}

  .art-body-sec{padding:48px 48px 0;}
  .art-body-layout{gap:40px;}
  .toc-card{padding:20px 24px;}

  .art-prose{font-size:1rem;}
  .art-prose h2{font-size:1.625rem;margin-top:56px;}
  .art-prose h3{font-size:1.125rem;}
  .art-prose p.lead-p{font-size:1.0938rem;}
  .art-prose li{font-size:.9688rem;}

  .back-list-wrap{padding:36px 48px 0;}
  .adj-nav-sec{padding:40px 48px;}
  .related-sec{padding:56px 48px 88px;}
  .sub-sec{padding:0 48px 88px;}
  .sub-card{padding:30px 32px;}
  .sub-txt h3{font-size:1.0625rem;}
  .tbl-hint{display:none;}
}

/* News archive/detail CTA: restore top spacing overridden by the detail-page sub-sec rule. */
body.category .sub-sec,
body.single-post .sub-sec{
  padding-top:56px;
}

@media(min-width:1081px){
  body.category .sub-sec,
  body.single-post .sub-sec{
    padding-top:88px;
  }
}