/* Shop pages: /kurse (kz-), Kursblatt /kurs/<slug> (kb-), Startpunkt (sp-). Swiss grid, 1px rules, accent only for numbers, rules and one button. */

@keyframes rise-in{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@keyframes bar-in{from{transform:scaleX(0)}to{transform:scaleX(1)}}

/* ---------- shared bits ---------- */
.kz small,.kb small,.sp small{font-size:.85rem}
.kz .price,.kb .price,.sp .price{font-size:1.7rem;line-height:1}
.kz .btn,.kb .btn,.sp .btn{text-decoration:none}

/* ======================= /kurse ======================= */
.kz-head{padding-top:clamp(28px,4vw,56px)}
.kz-head .g12{align-items:end;padding-bottom:clamp(24px,3vw,40px);border-bottom:2px solid var(--ink)}
.kz-title{grid-column:1/span 7}
.kz-title h1{margin:0;font-size:clamp(3.4rem,10vw,9rem);line-height:.86;letter-spacing:-.045em}
.kz-title .eyebrow{margin-bottom:1.4rem}
.kz-intro{grid-column:8/-1;margin:0 0 .4rem}
.kz-body{padding-top:0}
.kz-body>.g12{align-items:start}
.kz-side{grid-column:1/span 3;position:sticky;top:84px;padding:clamp(20px,2.4vw,32px) 0 0;display:grid;gap:2rem}
.kz-search label{margin-bottom:.5rem}
.kz-search-row{display:flex;gap:8px}
.kz-search-row input{min-width:0;flex:1}
.kz-search-row .btn{flex:none}
.kz-side h2{font:600 .8rem/1 var(--f-display);letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin:0 0 .6rem}
.kz-filter ul,.kz-type ul{list-style:none;margin:0;padding:0}
.kz-filter li{border-top:1px solid var(--rule)}
.kz-filter li:last-child{border-bottom:1px solid var(--rule)}
.kz-filter a{display:grid;grid-template-columns:1fr auto;column-gap:10px;align-items:baseline;padding:.7rem .6rem .7rem .8rem;border-left:4px solid transparent;text-decoration:none;min-height:44px;transition:background .2s,border-color .2s}
.kz-filter a:hover{background:var(--paper-2)}
.kz-filter a[aria-current]{background:var(--paper-2);border-left-color:var(--accent)}
.kz-f-name{font:700 .98rem/1.2 var(--f-display)}
.kz-f-sub{grid-column:1;font-size:.88rem;line-height:1.3;color:var(--muted)}
.kz-f-n{grid-row:1;grid-column:2;font:600 .85rem var(--f-display);color:var(--muted)}
.kz-type ul{display:flex;border:1.5px solid var(--ink);border-radius:var(--r)}
.kz-type li{flex:1}
.kz-type li+li{border-left:1.5px solid var(--ink)}
.kz-type a{display:flex;align-items:center;justify-content:center;min-height:44px;padding:0 .4rem;font:600 .9rem var(--f-display);text-decoration:none;transition:background .2s,color .2s}
.kz-type a:hover{background:var(--paper-2)}
.kz-type a[aria-current]{background:var(--ink);color:var(--paper)}
.kz-note{font-size:.88rem;line-height:1.45;color:var(--muted);margin:.8rem 0 0}

.kz-list{grid-column:5/-1;padding-top:clamp(20px,2.4vw,32px);min-height:60vh}
.kz-bar{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:8px 24px;padding-bottom:1rem;border-bottom:1px solid var(--ink)}
.kz-count{margin:0;font:500 1rem/1.3 var(--f-display)}
.kz-count b{font-weight:800;font-size:1.25rem}
.kz-reset{font:600 .92rem var(--f-display);color:var(--accent-ink)}
.kz-items{list-style:none;margin:0;padding:0}
.kz-item{border-bottom:1px solid var(--ink);padding:clamp(24px,2.6vw,40px) 0;animation:rise-in .6s ease both}
.kz-item:nth-child(2){animation-delay:.07s}.kz-item:nth-child(3){animation-delay:.14s}.kz-item:nth-child(4){animation-delay:.21s}.kz-item:nth-child(n+5){animation-delay:.28s}
.kz-item article{display:grid;grid-template-columns:clamp(70px,7vw,104px) minmax(0,1fr) auto;column-gap:clamp(14px,1.8vw,28px);row-gap:1.2rem}
.kz-item-top{display:contents}
.kz-idx{grid-column:1;grid-row:1;font:800 clamp(3rem,5.4vw,5rem)/.82 var(--f-display);letter-spacing:-.05em;color:var(--accent)}
.kz-item-head{grid-column:2/-1;grid-row:1}
.kz-kind{margin:0 0 .5rem;font:600 .8rem/1 var(--f-display);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.is-pfad .kz-kind{color:var(--accent-ink)}
.is-pfad .kz-kind::before{content:"";display:inline-block;width:.6rem;height:.6rem;background:var(--accent);margin-right:.55rem}
.kz-item-head h2{margin:0;font-size:clamp(1.6rem,2.7vw,2.5rem)}
.kz-item-head h2 a{text-decoration:none;background:linear-gradient(currentColor,currentColor) 0 100%/0 2px no-repeat;transition:background-size .35s ease}
.kz-item-head h2 a:hover{background-size:100% 2px}
.kz-photo{grid-column:2/-1;grid-row:2;display:block;overflow:hidden;aspect-ratio:8/3;background:var(--paper-3)}
.kz-photo img{width:100%;height:100%;object-fit:cover;transition:transform .8s ease}
.kz-item:hover .kz-photo img{transform:scale(1.035)}
.kz-item-main{grid-column:2;grid-row:3}
.kz-sum{margin:0 0 .8rem;font-size:1.08rem;line-height:1.5;color:var(--ink-2);max-width:56ch}
.kz-facts{margin:0;font:500 .92rem/1.4 var(--f-display);color:var(--ink)}
.kz-save{margin:.6rem 0 0;font:600 .92rem var(--f-display);color:var(--accent-ink)}
.kz-buy{grid-column:3;grid-row:3;display:flex;flex-direction:column;justify-content:space-between;gap:1rem;min-width:13.5rem}
.kz-price{margin:0;display:flex;align-items:baseline;gap:.5rem}
.kz-price .price{font-size:2rem}
.kz-price small{color:var(--muted)}
.kz-acts{display:flex;flex-wrap:wrap;gap:8px}
.kz-empty{padding:clamp(32px,5vw,72px) 0;max-width:46ch}
.kz-empty-h{font:700 clamp(1.6rem,2.8vw,2.4rem)/1.1 var(--f-display);letter-spacing:-.02em;margin:0 0 1rem}
.kz-empty-alt{margin-left:1rem;font:600 .95rem var(--f-display)}

/* ======================= Kursblatt ======================= */
.kb-crumb{margin:0;padding:clamp(20px,2.6vw,36px) 0 clamp(16px,2vw,24px);font:500 .92rem var(--f-display);color:var(--muted)}
.kb-crumb a{color:var(--ink)}
.kb-grid{align-items:start;border-top:2px solid var(--ink);padding-top:clamp(24px,3vw,44px)}
.kb-main{grid-column:1/span 8}
.kb-head h1{font-size:clamp(2.5rem,5.6vw,5rem);line-height:.96;margin-bottom:.35em;letter-spacing:-.035em}
.kb-outcome{margin:0 0 1rem;color:var(--ink);font-weight:500;max-width:34ch;font-size:clamp(1.3rem,2vw,1.8rem);line-height:1.35}
.kb-sum{margin:0;color:var(--muted);max-width:60ch}
.kb-photo{margin:clamp(24px,3vw,44px) 0 0;aspect-ratio:16/9;overflow:hidden;background:var(--paper-3)}
.kb-photo img{width:100%;height:100%;object-fit:cover;animation:zoomout 1.2s ease both}

.kb-sec{margin-top:clamp(44px,5.4vw,80px);border-top:1px solid var(--ink);padding-top:1.2rem}
.kb-sec h2{display:grid;grid-template-columns:clamp(60px,6vw,88px) 1fr;align-items:baseline;font-size:clamp(1.6rem,2.7vw,2.3rem);margin:0 0 1.4rem}
.kb-sn{font:800 clamp(2.2rem,4vw,3.4rem)/.9 var(--f-display);letter-spacing:-.05em;color:var(--accent)}
.kb-aside{margin:-.4rem 0 1.4rem clamp(60px,6vw,88px);font-size:1rem}
.kb-sec>*:not(h2){margin-left:0}

.kb-facts th,.kb-facts td{padding:1rem .4rem;vertical-align:baseline;border-top:1px solid var(--rule)}
.kb-facts tr:first-child th,.kb-facts tr:first-child td{border-top:0}
.kb-facts tbody{border-bottom:1px solid var(--ink)}
.kb-facts th{width:11rem;font-size:.82rem;white-space:nowrap}
.kb-facts td{font-size:1.1rem}

.kb-track{list-style:none;margin:0;padding:0}
.kb-track li{position:relative;padding:.85rem 0 .85rem clamp(64px,6vw,92px);min-height:3.6rem}
.kb-t-n{position:absolute;left:0;top:.85rem;font:800 1.8rem/1 var(--f-display);letter-spacing:-.04em;color:var(--ink)}
.kb-t-t{font:600 clamp(1.1rem,1.5vw,1.35rem)/1.3 var(--f-display);letter-spacing:-.01em}
.kb-track li::before{content:"";position:absolute;left:calc(clamp(64px,6vw,92px) - 24px);top:0;bottom:0;width:2px;background:var(--ink)}
.kb-track li::after{content:"";position:absolute;left:calc(clamp(64px,6vw,92px) - 29px);top:1.35rem;width:12px;height:12px;background:var(--accent)}
.kb-track li:first-child::before{top:1.35rem}
.kb-track li:last-child::before{bottom:auto;height:1.6rem}

.kb-inc th,.kb-inc td{padding:.95rem .4rem}
.kb-inc .r{text-align:right}
.kb-inc tbody td:first-child{font:700 1.1rem var(--f-display)}
.kb-inc tbody td:first-child a{color:var(--ink)}
.kb-inc tbody tr:last-child td{border-bottom:0}
.kb-inc tfoot th{font:600 .85rem var(--f-display);text-transform:none;letter-spacing:0;color:var(--ink)}
.kb-inc tfoot tr:first-child th,.kb-inc tfoot tr:first-child td{border-top:1px solid var(--ink)}
.kb-inc-price td,.kb-inc-price th{font-size:1.15rem}
.kb-inc-price td b{font-size:1.5rem;font-family:var(--f-display)}
.kb-inc-save th,.kb-inc-save td{color:var(--accent-ink)}

.kb-fit{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--ink);border-bottom:1px solid var(--ink)}
.kb-fit h3{font-size:1.3rem;margin:0 0 1rem}
.kb-yes,.kb-no{padding:1.4rem clamp(14px,2vw,28px) 1.6rem 0}
.kb-no{padding-left:clamp(14px,2vw,28px);padding-right:0;border-left:1px solid var(--ink)}
.kb-fit ul{list-style:none;margin:0;padding:0}
.kb-fit li{position:relative;padding:.35rem 0 .35rem 1.6rem;line-height:1.5}
.kb-fit li::before{position:absolute;left:0;top:.28rem;font:800 1.15rem/1.5 var(--f-display)}
.kb-yes li::before{content:"+";color:var(--ok)}
.kb-no li::before{content:"\2013";color:var(--err)}

.kb-pfade{list-style:none;margin:0;padding:0;border-bottom:1px solid var(--ink)}
.kb-pfade li{display:grid;grid-template-columns:1fr auto auto;gap:6px 24px;align-items:baseline;padding:1rem .4rem;border-top:1px solid var(--rule)}
.kb-pfade li:first-child{border-top:1px solid var(--ink)}
.kb-pf-name{font:700 1.2rem var(--f-display);color:var(--ink)}
.kb-pf-meta{font:500 .92rem var(--f-display);color:var(--muted)}
.kb-pf-price{font:700 1.2rem var(--f-display);text-align:right}
.kb-pf-price small{display:block;font-weight:500;color:var(--muted);font-size:.85rem}

.kb-know ul{list-style:none;margin:0;padding:0}
.kb-know li{padding:1rem 0 1rem clamp(60px,6vw,88px);border-top:1px solid var(--rule);max-width:none}
.kb-know li:first-child{border-top:1px solid var(--ink)}
.kb-know li:last-child{border-bottom:1px solid var(--ink)}
.kb-know b{font-family:var(--f-display);font-weight:700;margin-right:.25em}
.kb-know a{color:var(--accent-ink)}

/* sticky buy panel */
.kb-buy{grid-column:9/-1;position:sticky;top:88px;align-self:start;background:var(--paper-2);border:1px solid var(--ink);border-top:4px solid var(--accent);padding:clamp(18px,2vw,28px)}
.kb-b-kind{margin:0 0 .6rem;font:600 .8rem/1 var(--f-display);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.kb-b-price{margin:0 0 .4rem;display:flex;align-items:baseline;gap:.6rem}
.kb-b-price .price{font-size:clamp(2.4rem,3.8vw,3.4rem);letter-spacing:-.03em}
.kb-b-price small{color:var(--muted)}
.kb-b-save{margin:0 0 .8rem;font-size:.98rem;color:var(--accent-ink);line-height:1.4}
.kb-b-facts{margin:0 0 1.2rem;padding:.8rem 0;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);font:500 .92rem/1.4 var(--f-display)}
.kb-buy .add{display:block}
.kb-buy .btn{width:100%;justify-content:center}
.kb-b-cart{display:inline-block;margin:.9rem 0 1rem;font:600 .95rem var(--f-display);min-height:24px}
.kb-b-trust{margin:0 0 .5rem;font-size:.9rem;line-height:1.45;color:var(--ink-2)}
.kb-b-edu{margin:0;font:600 .85rem var(--f-display);color:var(--muted)}

.kb-more{margin-top:clamp(56px,7vw,110px);background:var(--paper-2);border-top:1px solid var(--ink);padding:clamp(40px,5vw,72px) 0}
.kb-more-head{grid-column:1/span 8}
.kb-more-head h2{margin:0 0 clamp(24px,3vw,44px)}
.kb-more-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(20px,2.4vw,40px)}
.kb-more-list li{position:relative;border-top:2px solid var(--ink);padding-top:1rem}
.kb-m-photo{display:block;aspect-ratio:3/2;overflow:hidden;background:var(--paper-3);margin-bottom:1rem}
.kb-m-photo img{width:100%;height:100%;object-fit:cover;transition:transform .7s ease}
.kb-more-list li:hover .kb-m-photo img{transform:scale(1.04)}
.kb-m-n{position:absolute;right:0;top:.8rem;font:800 2.2rem/1 var(--f-display);color:var(--accent);letter-spacing:-.04em;background:var(--paper-2);padding-left:.4rem}
.kb-more-list h3{margin:0 0 .5rem}
.kb-more-list h3 a{color:var(--ink)}
.kb-m-sum{font-size:1rem;line-height:1.5;color:var(--ink-2);margin:0 0 .8rem;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.kb-m-meta{margin:0;display:flex;align-items:baseline;gap:.6rem}
.kb-m-meta .price{font-size:1.4rem}
.kb-m-meta small{color:var(--muted)}

/* ======================= /startpunkt ======================= */
.sp{padding-top:clamp(28px,4vw,56px)}
.sp>.wrap>.g12{align-items:start}
.sp-title{grid-column:1/span 4;position:sticky;top:88px;padding-bottom:2rem}
.sp-title h1{font-size:clamp(2.4rem,4.3vw,4.1rem);line-height:.94;margin-bottom:.5em}
.sp-title .lead{margin-bottom:1.2rem}
.sp-orient{border-left:4px solid var(--accent);padding:.2rem 0 .2rem 1rem;margin:0 0 1.2rem;font-size:1.02rem;line-height:1.5;color:var(--ink)}
.sp-jump{font-size:1rem}
.sp-main{grid-column:5/-1}
.sp-qs{list-style:none;margin:0;padding:0;border-top:2px solid var(--ink)}
.sp-qs>li{border-bottom:1px solid var(--ink);padding:clamp(20px,2.4vw,34px) 0}
.sp-qs fieldset{border:0;margin:0;padding:0;min-width:0}
.sp-qs legend{display:flex;align-items:baseline;gap:clamp(12px,1.6vw,24px);width:100%;padding:0;margin:0 0 1.2rem;float:left}
.sp-qs legend+*{clear:both}
.sp-qn{flex:none;width:clamp(56px,5.4vw,84px);font:800 clamp(2.4rem,4.2vw,3.6rem)/.85 var(--f-display);letter-spacing:-.05em;color:var(--accent)}
.sp-ql{font:700 clamp(1.25rem,1.9vw,1.7rem)/1.15 var(--f-display);letter-spacing:-.015em}
.sp-opts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-left:calc(clamp(56px,5.4vw,84px) + clamp(12px,1.6vw,24px))}
.sp-opts-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.sp-opt{position:relative;display:block;margin:0;font:inherit}
.sp-opt input{position:absolute;opacity:0;width:100%;height:100%;left:0;top:0;margin:0;cursor:pointer;z-index:1}
.sp-opt-b{display:block;height:100%;min-height:52px;padding:.8rem 1rem .8rem 2.5rem;position:relative;border:1.5px solid var(--ink-2);border-radius:var(--r);background:transparent;transition:background .2s,color .2s,border-color .2s}
.sp-opt-b b{display:block;font:600 1rem/1.3 var(--f-display)}
.sp-opt-b small{display:block;margin-top:.2rem;font:400 .88rem/1.35 var(--f-text);color:var(--muted)}
.sp-opt-b::before{content:"";position:absolute;left:.95rem;top:1.05rem;width:.8rem;height:.8rem;border:1.5px solid var(--ink);background:transparent;transition:background .2s,border-color .2s}
.sp-opt:hover .sp-opt-b{background:var(--paper-2)}
.sp-opt input:checked+.sp-opt-b{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.sp-opt input:checked+.sp-opt-b::before{background:var(--accent);border-color:var(--accent)}
.sp-opt input:checked+.sp-opt-b small{color:#D5D2CA}
.sp-opt input:focus-visible+.sp-opt-b{outline:3px solid var(--accent);outline-offset:2px}
.sp-submit{display:flex;flex-wrap:wrap;align-items:center;gap:16px 28px;padding:clamp(24px,3vw,40px) 0 0;margin-left:calc(clamp(56px,5.4vw,84px) + clamp(12px,1.6vw,24px))}
.sp-submit .ul{font:600 .95rem var(--f-display)}

.sp-msg{margin:0 0 clamp(24px,3vw,40px);padding:clamp(18px,2.4vw,30px);background:var(--paper-2);border-left:4px solid var(--accent);animation:rise-in .5s ease both}
.sp-msg h2{font-size:clamp(1.4rem,2.2vw,1.9rem);margin:0 0 .6rem}
.sp-msg p{margin:0 0 .6rem}
.sp-msg-links a{margin-right:1.2rem;font:600 .95rem var(--f-display);color:var(--accent-ink)}

.sp-result{margin:0 0 clamp(36px,4.4vw,64px);padding:clamp(20px,2.8vw,40px);background:var(--paper-2);border-top:4px solid var(--accent);animation:rise-in .7s ease both;scroll-margin-top:90px}
.sp-result:focus{outline:none}
.sp-result .eyebrow{margin-bottom:1.4rem}
.sp-r-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(18px,2.4vw,36px);align-items:start}
.sp-r-photo{aspect-ratio:4/5;overflow:hidden;background:var(--paper-3)}
.sp-r-photo img{width:100%;height:100%;object-fit:cover}
.sp-r-kind{margin:0 0 .6rem;font:600 .8rem/1 var(--f-display);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.sp-r-name{margin:0 0 .8rem;font:800 clamp(1.8rem,3vw,2.8rem)/1 var(--f-display);letter-spacing:-.03em}
.sp-r-name-s{font-size:clamp(1.4rem,2vw,1.9rem)}
.sp-r-name a{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:.18em;text-decoration-color:var(--accent)}
.sp-r-sum{margin:0 0 .8rem;color:var(--ink-2);line-height:1.5}
.sp-r-facts{margin:0 0 1rem;font:500 .92rem/1.4 var(--f-display)}
.sp-r-price{margin:0 0 1rem;display:flex;align-items:baseline;gap:.5rem}
.sp-r-price .price{font-size:2rem}
.sp-r-price small{color:var(--muted)}
.sp-r-acts{display:flex;flex-wrap:wrap;gap:8px}
.sp-why-h{font-size:1.3rem;margin:clamp(22px,2.6vw,36px) 0 .8rem;padding-top:1.2rem;border-top:1px solid var(--ink)}
.sp-why{list-style:none;margin:0;padding:0}
.sp-why li{position:relative;padding:.4rem 0 .4rem 1.5rem;line-height:1.55;max-width:62ch}
.sp-why li::before{content:"";position:absolute;left:0;top:1rem;width:.6rem;height:.6rem;background:var(--accent)}
.sp-pfad{margin-top:clamp(22px,2.6vw,36px);padding-top:1.4rem;border-top:1px solid var(--ink)}
.sp-pfad-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:20px 32px;align-items:end}
.sp-pfad-why{margin:0;max-width:56ch;line-height:1.5}
.sp-nopfad{margin:1.4rem 0 0;font-size:1rem}
.sp-fine{margin:1.4rem 0 0;font-size:.9rem}

/* hover/focus underline and photo motion respect the reduced-motion setting */
@media (prefers-reduced-motion:reduce){
  .kz-item,.sp-result,.sp-msg,.kb-photo img{animation:none}
  .kz-photo img,.kb-m-photo img{transition:none}
  .kz-item:hover .kz-photo img,.kb-more-list li:hover .kb-m-photo img{transform:none}
}

/* narrower screens: the grid collapses to one column (desktop is the design target) */
@media (max-width:1100px){
  .kz-side{grid-column:1/span 4}.kz-list{grid-column:5/-1}
  .kz-item article{grid-template-columns:clamp(56px,7vw,80px) minmax(0,1fr)}
  .kz-buy{grid-column:2;grid-row:4;flex-direction:row;align-items:center;flex-wrap:wrap}
  .kb-main{grid-column:1/span 7}.kb-buy{grid-column:8/-1}
  .sp-title{grid-column:1/span 4}
  .sp-opts-3{grid-template-columns:1fr}
}
@media (max-width:860px){
  .kz-title,.kz-intro,.kz-side,.kz-list,.kb-main,.kb-buy,.kb-more-head,.sp-title,.sp-main{grid-column:1/-1}
  .kz-side,.kb-buy,.sp-title{position:static}
  .kz-intro{margin-top:1.2rem}
  .kb-buy{order:-1;margin-bottom:2rem}
  .kb-fit{grid-template-columns:1fr}.kb-no{border-left:0;border-top:1px solid var(--ink);padding-left:0}
  .kb-more-list{grid-template-columns:1fr}
  .sp-opts,.sp-submit{margin-left:0}.sp-opts,.sp-opts-3{grid-template-columns:1fr}
  .sp-r-grid,.sp-pfad-row{grid-template-columns:1fr}
}
.kz-search-row .btn{padding:.7rem .9rem}
.kb-track+.kb-aside{margin-top:1.4rem}