.service-landing, .service-directory { background: var(--paper); }
.service-breadcrumb { display: flex; flex-wrap: wrap; gap: 0.6rem; padding-top: 2rem; color: var(--muted); font-size: 0.8rem; }
.service-breadcrumb a { text-underline-offset: 0.25rem; }
.landing-grid { display: grid; grid-template-columns: minmax(0,1.25fr) minmax(0,0.75fr); align-items: center; gap: clamp(2rem,6vw,5rem); padding-block: 3rem 4.5rem; }
.landing-title { max-width: 17ch; margin-bottom: 1.7rem; color: var(--navy); font-size: clamp(2.6rem,4.7vw,4.8rem); line-height: 1.04; }
.landing-intro { max-width: 47ch; color: #536170; font-size: 1.12rem; line-height: 1.75; }
.landing-points { margin: 1.7rem 0 2rem; padding-left: 1.2rem; color: var(--navy); }
.landing-points li { margin-block: 0.65rem; padding-left: 0.2rem; }
.landing-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem; }
.landing-note { max-width: 58ch; margin-top: 1.3rem; color: var(--muted); font-size: 0.78rem; line-height: 1.7; }
.landing-poster { max-width: 370px; margin: 0 auto; padding: 0.8rem; border: 1px solid var(--line); border-radius: 0.8rem; background: #eae6dc; box-shadow: 0 16px 42px rgba(4,28,56,.09); }
.landing-poster img { width: 100%; height: auto; border-radius: 0.35rem; }
.landing-poster figcaption { margin: 0.7rem 0 0.15rem; color: var(--muted); font-size: 0.73rem; text-align: center; }
.service-start { padding-block: 3.5rem; border-block: 1px solid var(--line); background: var(--stone); }
.service-start h2 { max-width: 24ch; font-size: clamp(2rem,3vw,3.1rem); }
.service-start-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 2rem; margin-top: 2rem; }
.service-start-grid article { padding-top: 1.2rem; border-top: 2px solid #c97133; }
.service-start-grid h3 { margin-bottom: 0.8rem; font-size: 1.05rem; }
.service-start-grid p { margin-bottom: 0; color: #536170; font-size: 0.95rem; }
.service-share { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem; padding-block: 2rem; }
.service-share p { margin: 0; color: var(--muted); font-size: 0.85rem; }
.service-share nav { display: flex; flex-wrap: wrap; gap: 1rem; }
.service-share a { min-height: 44px; display: inline-flex; align-items: center; font-size: 0.83rem; font-weight: 650; text-underline-offset: 0.3rem; }
.service-directory-hero { padding-block: 3rem 3.5rem; }
.service-directory-hero h1 { max-width: 18ch; color: var(--navy); font-size: clamp(2.8rem,5vw,5rem); }
.service-directory-hero p:last-child { max-width: 66ch; color: #536170; font-size: 1.08rem; }
.service-catalog { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 1.3rem; padding-bottom: 4.5rem; }
.catalog-card { display: flex; flex-direction: column; overflow: hidden; border: 1px solid var(--line); border-radius: 0.65rem; background: #fff; }
.catalog-card > a { display: block; background: var(--stone); }
.catalog-card img { width: 100%; height: auto; aspect-ratio: 4/5; object-fit: contain; }
.catalog-copy { display: flex; flex: 1; flex-direction: column; padding: 1.4rem; }
.catalog-copy h2 { margin-bottom: 0.8rem; font: 700 1.1rem/1.3 var(--sans); letter-spacing: -0.01em; }
.catalog-copy p { margin-bottom: 1rem; color: #536170; font-size: 0.9rem; line-height: 1.65; }
.catalog-copy > a { margin-top: auto; font-size: 0.83rem; font-weight: 700; text-underline-offset: 0.3rem; }
.highlight-service-link { display: inline-block; margin: -0.5rem 0 1.4rem; font-size: 0.82rem; font-weight: 650; text-underline-offset: 0.3rem; }
@media (max-width:980px) { .service-catalog { grid-template-columns:repeat(2,minmax(0,1fr)); } .landing-grid { gap:2rem; } }
@media (max-width:760px) { .landing-grid { grid-template-columns:1fr; padding-block:2rem 3rem; } .landing-title { max-width:22ch; font-size:clamp(2.3rem,9vw,3.5rem); } .landing-poster { max-width:352px; } .service-start-grid { grid-template-columns:1fr; gap:1.5rem; } .service-start { padding-block:2.5rem; } .service-directory-hero { padding-top:2rem; } .service-share { align-items:flex-start; flex-direction:column; } }
@media (max-width:430px) { .service-catalog { grid-template-columns:1fr; } .catalog-card { max-width:352px; margin-inline:auto; } .landing-actions .button { width:100%; } }
