/* ==========================================================================
   Anwendungen page: plain page hero, application cards (7/5 staggered grid)
   Tokens: foreground #1A232D, muted #555F6D, border #CFD5DE, primary #1B4B36
   ========================================================================== */

/* --- plain hero (eyebrow, h1, lead) ------------------------------------- */
.snm-zs-hero-plain{background:rgba(255,255,255,.4)!important;border-bottom:1px solid #CFD5DE;min-height:0!important;height:auto!important}
.snm-zs-hero-plain .fl-row-content-wrap{min-height:0!important}
.snm-zs-hero-plain .fl-row-content{padding:48px 24px!important}
.snm-zs-hero-plain .fl-row-content>.fl-col-group{margin:0!important;display:block!important}
.snm-zs-hero-plain .fl-col,.snm-zs-hero-plain .fl-col-content{width:100%;max-width:none}
.snm-zs-hero-plain h1.fl-module-heading,.snm-zs-hero-plain .snm-zs-h1{font-size:48px!important;line-height:48px!important;max-width:896px}
.snm-zs-hero-plain .snm-zs-lead{max-width:672px;margin:16px 0 0!important;font-size:18px;line-height:28px}

/* --- section header + card grid rows ------------------------------------ */
.snm-zs-apps .fl-row-content{padding-top:96px!important;padding-bottom:0!important}
.snm-zs-apps .fl-row-content>.fl-col-group{margin:0!important}
.snm-zs-appgrid .fl-row-content{padding-top:0!important;padding-bottom:96px!important}
.snm-zs-appgrid .fl-row-content>.fl-col-group{margin:55px 0 0!important;display:grid!important;grid-template-columns:1fr;gap:32px;align-items:start}
.snm-zs-appgrid .fl-col{width:auto!important;float:none!important;max-width:none;min-width:0;clear:none!important}
.snm-zs-appgrid .fl-col-content{display:block}
@media(min-width:1024px){
  .snm-zs-appgrid .fl-row-content>.fl-col-group{grid-template-columns:repeat(12,minmax(0,1fr))}
  .snm-zs-appgrid .snm-app-c1,.snm-zs-appgrid .snm-app-c4{grid-column:span 7}
  .snm-zs-appgrid .snm-app-c2,.snm-zs-appgrid .snm-app-c3{grid-column:span 5}
  .snm-zs-appgrid .snm-app-c2{margin-top:80px}
  .snm-zs-appgrid .snm-app-c4{margin-top:-80px}
}

/* --- card parts ----------------------------------------------------------- */
.snm-zs-appgrid .snm-app-photo,.snm-zs-appgrid .snm-app-photo .fl-photo-content{display:block}
.snm-zs-appgrid .snm-app-photo .fl-photo-content{border:2px solid #1A232D;box-shadow:4px 4px 0 0 #1B4B36;line-height:0;overflow:hidden}
.snm-zs-appgrid .snm-app-photo img{width:100%;aspect-ratio:3/2;object-fit:cover;display:block;max-width:100%;height:auto}
.snm-zs-appgrid .snm-app-body{margin:0}
.snm-zs-appgrid .snm-app-cap{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:12px;font-size:11px;line-height:16.5px;letter-spacing:.18em;text-transform:uppercase;font-weight:600;color:#555F6D}
.snm-zs-appgrid .snm-app-num{font-family:"Barlow Condensed","Arial Narrow",sans-serif;font-size:18px;line-height:28px;letter-spacing:normal;color:#1B4B36;font-weight:600}
.snm-zs-appgrid .snm-app-title{margin:16px 0 0;font-family:"Barlow Condensed","Arial Narrow",sans-serif;font-size:30px;line-height:36px;font-weight:600;letter-spacing:.025em;text-transform:uppercase;color:#1A232D}
.snm-zs-appgrid .snm-app-desc{margin:12px 0 0;font-size:16px;line-height:26px;color:#555F6D}
.snm-zs-appgrid .snm-app-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.snm-zs-appgrid .snm-app-chips span{padding:6px 10px;border:1px solid #CFD5DE;background:#fff;font-size:11px;line-height:16.5px;letter-spacing:.18em;text-transform:uppercase;font-weight:600;color:#555F6D}
.snm-zs-appgrid .snm-app-links{display:flex;flex-wrap:wrap;gap:8px 20px;margin:16px 0 0;font-size:13px;line-height:20px}
.snm-zs-appgrid .snm-app-links a{font-size:13px;line-height:20px;letter-spacing:.14em;text-transform:uppercase;font-weight:600;color:#555F6D;text-decoration:none}
.snm-zs-appgrid .snm-app-links a.is-primary{color:#1B4B36;display:inline-flex;align-items:center;gap:8px}
.snm-zs-appgrid .snm-app-links a.is-primary::after{content:"";width:14px;height:14px;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M12 5l7 7-7 7'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M12 5l7 7-7 7'/%3E%3C/svg%3E") center/contain no-repeat}
.snm-zs-appgrid .snm-app-links a:hover{color:#1A232D}
.snm-zs-appgrid .snm-app-links a.is-primary:hover{color:#1B4B36}

/* --- corrections after measuring against the reference ------------------- */
.snm-zs-hero-plain h1.fl-module-heading,.snm-zs-hero-plain .snm-zs-h1{margin-top:12px!important}
.snm-zs-hero-plain .snm-zs-lead{max-width:672px!important;width:672px!important;margin:16px 0 0!important}
.snm-zs-apps h2.fl-module-heading{line-height:48px!important}
.snm-zs-appgrid .fl-col-content{padding:0!important}
@media(min-width:1024px){
  .snm-zs-appgrid .fl-col.snm-app-c2{margin-top:80px!important}
  .snm-zs-appgrid .fl-col.snm-app-c4{margin-top:-80px!important}
}
.snm-zs-appgrid .snm-app-desc{margin-top:12px!important}
.snm-zs-appgrid .snm-app-links{margin-top:20px!important}
.snm-zs-hero-plain .snm-zs-lead,.snm-zs-hero-plain .snm-zs-lead p{line-height:28px!important}
.snm-zs-appgrid .fl-row-content>.fl-col-group{align-items:stretch!important}
/* body font: Source Sans 3 (theme default for paragraphs was the system stack) */
.snm-zs p,.snm-zs-appgrid .snm-app-body,.snm-zs-appgrid .snm-app-cap,.snm-zs-appgrid .snm-app-chips span,.snm-zs-appgrid .snm-app-links a{font-family:"Source Sans 3","Helvetica Neue",Arial,sans-serif}

/* --- apps header sub width ---------------------------------------------- */
.snm-zs-apps .snm-zs-sub,.snm-zs-apps .snm-zs-sub p{max-width:768px}
.snm-zs-hero-plain .fl-module{margin-bottom:0!important}

/* --- compact "Weiterführende Seiten" block (row class snm-zs-more-compact) -- */
.snm-zs-more-compact .fl-row-content{padding:64px 24px!important}
.snm-zs-more-compact .fl-row-content>.fl-col-group:first-child{margin-top:0!important}
.snm-zs-more-compact .fl-row-content>.fl-col-group:last-child{margin-bottom:0!important}
.snm-zs-more-compact h2.fl-module-heading{font-size:36px!important;line-height:40px!important}
.snm-zs-more-compact .snm-zs-sub,.snm-zs-more-compact .snm-zs-sub p{max-width:672px;margin-top:12px!important;font-size:18px;line-height:26px}
.snm-zs-more-compact .snm-zs-sub a{font-weight:600;color:#1B4B36}

/* compact block: higher specificity so it wins over zuschnitt.css */
.snm-zs.snm-zs-more-compact h2.fl-module-heading{font-size:36px!important;line-height:40px!important}
.snm-zs.snm-zs-more-compact .snm-zs-sub,.snm-zs.snm-zs-more-compact .snm-zs-sub p{line-height:26px!important;max-width:672px!important}
.snm-zs.snm-zs-more-compact .fl-col-group .fl-col-group{gap:11.5px}
.snm-zs.snm-zs-more-compact .fl-row-content>.fl-col-group{gap:11.5px!important}
.snm-zs.snm-zs-more-compact .snm-zs-more-links{margin-top:27px!important;line-height:20px!important}
.snm-zs.snm-zs-more-compact .snm-zs-more-links a{line-height:20px}
.snm-zs.snm-zs-more-compact .fl-module.snm-zs-sub{margin-top:12px!important}
.snm-zs.snm-zs-more-compact .snm-zs-sub p{margin:0!important}
.snm-zs.snm-zs-more-compact .fl-row-content>.fl-col-group:nth-child(2){margin-top:-8px!important}
/* card 4 must never overlap card 1: no negative offset */
@media(min-width:1024px){.snm-zs-appgrid .fl-col.snm-app-c4{margin-top:0!important}}

/* plain hero: neutralise the two-column hero spacing rules from zuschnitt.css */
.snm-zs-hero.snm-zs-hero-plain .snm-zs-hero-l>.fl-col-content>.fl-module.snm-zs-lead{margin:16px 0 0!important}
.snm-zs-hero.snm-zs-hero-plain .snm-zs-hero-l>.fl-col-content>.fl-module{margin-bottom:0!important}
.snm-zs-hero.snm-zs-hero-plain .snm-zs-hero-l>.fl-col-content>.fl-module.snm-zs-lead p{margin:0!important}

/* plain hero: responsive sizes (30/36/48 px headline, 40/40/48 px padding) */
.snm-zs-hero.snm-zs-hero-plain .fl-row-content{padding:40px 16px!important}
.snm-zs-hero.snm-zs-hero-plain h1.fl-module-heading,.snm-zs-hero.snm-zs-hero-plain .snm-zs-h1{font-size:30px!important;line-height:28.5px!important}
.snm-zs-hero.snm-zs-hero-plain .snm-zs-lead,.snm-zs-hero.snm-zs-hero-plain .snm-zs-lead p{font-size:16px!important;line-height:26px!important}
@media(min-width:640px){
  .snm-zs-hero.snm-zs-hero-plain .fl-row-content{padding:40px 24px!important}
  .snm-zs-hero.snm-zs-hero-plain h1.fl-module-heading,.snm-zs-hero.snm-zs-hero-plain .snm-zs-h1{font-size:36px!important;line-height:40px!important}
  .snm-zs-hero.snm-zs-hero-plain .snm-zs-lead,.snm-zs-hero.snm-zs-hero-plain .snm-zs-lead p{font-size:18px!important;line-height:28px!important}
}
@media(min-width:1024px){
  .snm-zs-hero.snm-zs-hero-plain .fl-row-content{padding:48px 24px!important}
  .snm-zs-hero.snm-zs-hero-plain h1.fl-module-heading,.snm-zs-hero.snm-zs-hero-plain .snm-zs-h1{font-size:48px!important;line-height:48px!important}
}

/* compact block: cards sit 32px below the sub text; links row 32px below the cards */
.snm-zs.snm-zs-more-compact .fl-row-content>.fl-col-group:nth-child(2){margin-top:32px!important}
.snm-zs.snm-zs-more-compact .snm-zs-more-links{margin-top:31px!important}
/* spaces around the inline link in the sub text (editor trims them) */
.snm-zs-more-compact .snm-zs-sub a::before,.snm-zs-more-compact .snm-zs-sub a::after{content:" "}

/* FAQ page: the FAQ block follows the plain hero directly (no extra offset, help box 32px below intro on tablet/mobile) */
@media(max-width:1023px){
  body.page-id-173 .snm-zs-faq .fl-row-content>.fl-col-group:first-child{margin-top:0!important}
  body.page-id-173 .snm-zs .snm-zs-help{margin-top:32px!important}
  body.page-id-173 .snm-zs-faq .fl-row-content{padding-bottom:56px!important}
}

/* compact "Weiterführende Seiten" block below lg: 56px vertical padding, 16px side padding on phones, 30px headline */
@media(max-width:1023px){.snm-zs.snm-zs-more-compact .fl-row-content{padding-top:56px!important;padding-bottom:56px!important}}
@media(max-width:639px){
  .snm-zs.snm-zs-more-compact .fl-row-content{padding-left:16px!important;padding-right:16px!important}
  .snm-zs.snm-zs-more-compact h2.fl-module-heading{font-size:30px!important;line-height:37.5px!important}
}
