/* コラム詳細｜NY市と生成AI: responsive layout on fluid.css. Figma 15:97 is the visual reference. */
.ny-hero .f-hero-copy{gap:clamp(14px,1.6vw,20px)}
.ny-hero h1{font:400 var(--fs-h2)/1.5 "Noto Serif JP",serif;color:var(--navy)}
@media(min-width:1024px){
 .ny-hero .f-hero-copy{max-width:760px}
}
.ny-meta{font:400 13px/1.6 "Noto Sans JP",sans-serif;color:var(--navy)}

.ny-body{padding-block:var(--section-y)}
/* The article+sidebar pair reads as one centred unit, capped well short of the
   container so the pair doesn't stretch into a lopsided full-width grid. */
.ny-body-inner{max-width:1180px;margin-inline:auto;display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:clamp(40px,4vw,72px);align-items:start}

.ny-article{max-width:40em;display:flex;flex-direction:column;gap:clamp(32px,3.5vw,56px)}
.ny-block{display:flex;flex-direction:column;gap:16px}
.ny-block h2{font:400 clamp(21px,1.05rem + .5vw,27px)/1.5 "Noto Serif JP",serif;color:var(--navy)}
.ny-block p{font:400 16px/1.9 "Noto Serif JP",serif;color:var(--ink)}
.ny-points{display:flex;flex-direction:column;gap:12px;padding:clamp(20px,2.2vw,28px);background:#f4fafd}
.ny-points h3{font:400 clamp(18px,.9rem + .4vw,22px)/1.5 "Noto Serif JP",serif;color:var(--navy)}
.ny-points ul,.ny-aside ul,.ny-related ul{list-style:none;margin:0;padding:0}
.ny-points li{font:400 15px/1.8 "Noto Serif JP",serif;color:var(--ink);padding-left:1.4em;text-indent:-1.4em}

.ny-aside{display:flex;flex-direction:column;gap:clamp(28px,3vw,40px)}
.ny-summary,.ny-author{background:var(--surface);border-radius:6px;padding:clamp(20px,2vw,26px)}
.ny-side-title,.ny-tags-title{font:400 clamp(17px,.9rem + .3vw,19px)/1.5 "Noto Serif JP",serif;color:var(--navy);margin-bottom:14px!important}
.ny-tags-title{font:700 15px/1.5 "Noto Sans JP",sans-serif}
.ny-summary-list{display:flex;flex-direction:column;gap:10px}
.ny-summary-list li{font:400 13px/1.7 "Noto Sans JP",sans-serif;color:var(--navy)}

.ny-related-side ul{display:grid;gap:14px}
.ny-related-item{display:grid;grid-template-columns:96px 1fr;grid-template-rows:auto auto;column-gap:12px;row-gap:4px;align-content:start;color:var(--navy)}
.ny-thumb{width:96px;aspect-ratio:85/50;overflow:hidden;border-radius:4px;grid-row:1/3}
.ny-thumb img{width:100%;height:100%;object-fit:cover}
.ny-thumb-title{font:700 var(--fs-xs)/1.5 "Noto Sans JP",sans-serif}
.ny-related-side time{font:400 var(--fs-xs)/1.5 "Noto Sans JP",sans-serif;color:var(--muted)}
.ny-more{margin-top:10px!important;text-align:right}
.ny-more .f-link{font-size:13px}

.ny-service-card{display:flex;flex-direction:column;gap:6px;padding:16px 18px;background:#fff;border:1px solid var(--border);border-radius:6px;font:400 15px/1.8 "Noto Sans JP",sans-serif;color:var(--navy)}
.ny-service-card:hover{background:var(--surface)}
.ny-service-name{font-weight:700}

.ny-tags ul{display:flex;flex-wrap:wrap;gap:8px}
.ny-tags li{padding:5px 14px;border-radius:14px;background:var(--surface);font:400 13px/1.5 "Noto Sans JP",sans-serif;color:var(--navy)}

.ny-author{display:grid;grid-template-columns:80px 1fr;column-gap:16px;align-items:center}
.ny-author-label{grid-column:1/-1;font:700 13px/1.5 "Noto Sans JP",sans-serif;color:var(--navy);margin-bottom:14px!important}
.ny-author-photo{position:relative;width:80px;height:80px;border-radius:50%;overflow:hidden;grid-row:2/4}
.ny-author-photo img{width:100%;height:100%;object-fit:cover}
.ny-author-name{font:700 19px/1.5 "Noto Serif JP",serif;color:var(--navy);align-self:end}
.ny-author-role{font:400 var(--fs-xs)/1.6 "Noto Sans JP",sans-serif;color:var(--navy);align-self:start}
.ny-author-bio{grid-column:1/-1;font:400 14px/1.8 "Noto Sans JP",sans-serif;color:var(--ink);margin-top:14px!important}
.ny-author-cta{grid-column:1/-1;margin-top:16px!important}
.ny-author-cta .f-button{width:100%}

.ny-related{padding-block:var(--section-y)}
.ny-related h2{margin-bottom:clamp(20px,2vw,28px)!important}
.ny-related ul{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(20px,2.5vw,32px)}
.ny-card{background:#fff;border:1px solid var(--border);border-radius:4px;overflow:hidden}
.ny-card-inner{display:flex;height:100%;color:var(--navy)}
.ny-card-photo{flex:0 0 38%;overflow:hidden}
.ny-card-photo img{width:100%;height:100%;object-fit:cover}
.ny-card-body{display:flex;flex-direction:column;justify-content:center;gap:16px;padding:20px 20px 20px 18px;font:700 16px/1.6 "Noto Serif JP",serif}

@media(max-width:1023px){
 .ny-hero .f-hero-copy{max-width:75%}
 .ny-body-inner{grid-template-columns:1fr}
 .ny-aside{margin-top:8px}
}
@media(max-width:767px){
 .ny-hero h1{font-size:25px;line-height:1.55}
 .ny-hero h1 br,.ny-hero .f-body br{display:none}
 .ny-meta{font-size:13px;margin-top:14px!important}
 .ny-body{padding-block:32px}
 .ny-body-inner{gap:40px}
 .ny-article{gap:32px}
 .ny-block{gap:12px}
 .ny-block h2{font-size:22px;line-height:1.5}
 .ny-block p{font-size:15px;line-height:1.9}
 .ny-points{padding:20px}
 .ny-points h3{font-size:18px;line-height:1.5}
 .ny-points li{font-size:15px;line-height:1.8}
 .ny-aside{gap:32px}
 .ny-side-title,.ny-tags-title{font-size:19px;line-height:1.5}
 .ny-summary-list li{font-size:14px;line-height:1.7}
 .ny-service-card{font-size:15px;line-height:1.9}
 .ny-tags li{font-size:13px;line-height:1.4}
 .ny-author-bio{font-size:14px;line-height:1.8}
 .ny-author-cta .f-button{font-size:13px}
 .ny-related{padding-block:32px}
 .ny-related ul{grid-template-columns:1fr;gap:16px}
 .ny-card-inner{flex-direction:column}
 .ny-card-photo{flex:none;width:100%;aspect-ratio:16/9}
 .ny-card-body{padding:16px 18px 18px;gap:10px;font-size:16px}
 .ny-card-title br{display:none}
}