/* サービス一覧: responsive layout on fluid.css. Figma 15:127 is the visual reference. */

.sv-services-head{display:grid;grid-template-columns:1fr minmax(220px,340px);align-items:start;gap:clamp(24px,4vw,64px);margin-bottom:clamp(28px,3.5vw,48px)}
.sv-services-note{color:var(--muted);font-size:var(--fs-sm);font-family:"Noto Sans JP",sans-serif}

.sv-card-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(16px,2vw,24px)}
.sv-card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--border);border-radius:4px;overflow:hidden}
.sv-card-photo{position:relative;overflow:hidden;aspect-ratio:231/131}
.sv-card-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
/* Sprite crop: keep this aspect-ratio + percentage box so the sheet's offsets stay correct. */
.sv-card-photo img.sv-sprite{position:absolute;inset:auto;top:-357.25%;width:443.29%;height:1172.52%;max-width:none;object-fit:fill}
.sv-card-body{display:flex;flex-direction:column;align-items:flex-start;gap:12px;padding:20px clamp(16px,1.6vw,22px) 22px;flex:1}
.sv-card-icon{position:relative;width:clamp(28px,2.2vw,32px);aspect-ratio:1/1}
.sv-card-icon img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
.sv-card-icon img.sv-glyph{inset:auto;object-fit:fill}
/* 「企業・自治体向けAI活用支援」だけ2行になり、4枚の下端がずれていた。
   見出しの高さを2行分で固定して、1行の見出しでも同じ場所から本文が始まるようにする。 */
.sv-card h3{font:400 var(--fs-h3)/1.5 "Noto Serif JP",serif;color:var(--navy);min-height:calc(var(--fs-h3) * 1.5 * 2);text-wrap:balance}
.sv-card-body .f-body{font-size:var(--fs-sm);font-family:"Noto Sans JP",sans-serif}
.sv-card-body .f-button{margin-top:auto}

.sv-product-card{background:#fff;border-radius:12px;padding:clamp(28px,3.5vw,56px)}
.sv-product-card{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr) minmax(0,.5fr);gap:clamp(24px,3vw,48px);align-items:center}
.sv-product-eyebrow{display:flex;align-items:center;gap:clamp(16px,2vw,24px)}
.sv-product-eyebrow span:last-child{display:inline-block;background:#eeeff1;border-radius:99px;padding:3px 16px;font:400 var(--fs-xs)/1.9 "Noto Sans JP",sans-serif;letter-spacing:normal;color:var(--navy)}
.sv-product-photo{aspect-ratio:385/217}
.sv-product-features{display:flex;flex-direction:column;gap:clamp(10px,1.3vw,16px)}
.sv-product-features li{font:400 var(--fs-sm)/1.6 "Noto Sans JP",sans-serif;color:var(--navy)}
.sv-product-features li:before{content:"✓ "}

@media(max-width:1023px){
 .sv-services-head{grid-template-columns:1fr;gap:16px}
 .sv-card-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .sv-product-card{grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr)}
 .sv-product-copy{grid-column:1/-1}
}
@media(max-width:767px){
 .sv-card-grid{grid-template-columns:1fr}
 .sv-product-card{grid-template-columns:1fr;padding:28px 20px}
 .sv-product-features{gap:8px}
}
