@layer reset, tokens, base, layout, components, motion;

@layer reset {
  *,*::before,*::after{box-sizing:border-box}
  *{margin:0}
  img,picture,svg{display:block;max-width:100%}
  img{height:auto}
  button,input,select,textarea{font:inherit;color:inherit}
  ol{list-style:none;padding:0}
}

@layer tokens {
  :root{
    color-scheme:light dark;
    --bg:light-dark(#f7f2e9,#0e1813);
    --bg-2:light-dark(#efe7d8,#14221b);
    --surface:light-dark(#fffdf8,#182a21);
    --ink:light-dark(#1b1a17,#f3ede1);
    --muted:light-dark(#5f574d,#b5ad9f);
    --line:light-dark(#ddd2bd,#28392f);
    --forest:#13271e;
    --accent:light-dark(#c9531a,#f0894a);
    --accent-ink:light-dark(#fff,#1a0d05);
    --sand:#f0a36b;
    --serif:ui-serif,Georgia,"Iowan Old Style","Palatino Linotype",serif;
    --sans:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
    --r:clamp(18px,2.4vw,28px);
    --gutter:clamp(1rem,4vw,3rem);
    --max:1240px;
    --shadow:0 1px 2px rgb(0 0 0/.06),0 12px 32px -14px rgb(20 20 10/.28);
    --ease:cubic-bezier(.22,1,.36,1);
  }
  :root[data-theme=light]{color-scheme:light}
  :root[data-theme=dark]{color-scheme:dark}
}

@layer base {
  @view-transition{navigation:auto}
  html{overflow-x:clip;scroll-behavior:smooth;scroll-padding-top:6rem;interpolate-size:allow-keywords}
  body{background:var(--bg);color:var(--ink);font:1.0625rem/1.65 var(--sans);-webkit-font-smoothing:antialiased;min-height:100dvh;overflow-x:clip;text-rendering:optimizeLegibility}
  h1,h2,h3{font-family:var(--serif);font-weight:700;line-height:1.05;letter-spacing:-.02em;text-wrap:balance}
  h1{font-size:clamp(2.6rem,7.5vw,6rem)}
  h2{font-size:clamp(1.9rem,4.4vw,3.4rem)}
  h3{font-size:1.35rem;line-height:1.2}
  p{text-wrap:pretty}
  a{color:inherit;text-underline-offset:.22em;text-decoration-thickness:1.5px}
  ::selection{background:var(--accent);color:var(--accent-ink)}
  :focus-visible{outline:3px solid var(--accent);outline-offset:3px;border-radius:6px}
  .skip{position:fixed;left:1rem;top:-4rem;z-index:100;background:var(--accent);color:var(--accent-ink);padding:.7rem 1.1rem;border-radius:999px;transition:top .2s}
  .skip:focus{top:1rem}
  .eyebrow{font:700 .78rem/1 var(--sans);letter-spacing:.18em;text-transform:uppercase;color:var(--accent);margin-bottom:1rem}
  .lead{font-size:clamp(1.1rem,2vw,1.35rem);color:var(--muted);max-width:40ch}
  .small{font-size:.88rem;color:var(--muted)}
  .progress{position:fixed;inset:auto 0 auto 0;top:0;height:3px;background:var(--accent);transform-origin:0 50%;transform:scaleX(0);z-index:95}
}

@layer layout {
  main{display:block}
  .sec{width:min(var(--max),100% - 2*var(--gutter));margin-inline:auto;padding-block:clamp(3.5rem,9vw,7rem)}
  .sec-h{max-width:46rem;margin-bottom:clamp(1.8rem,4vw,3rem)}
  .sec-h p:not(.eyebrow){color:var(--muted);margin-top:1rem}
  .sec-h.row{max-width:none;display:flex;justify-content:space-between;align-items:end;gap:1rem}
  .phead{width:min(var(--max),100% - 2*var(--gutter));margin-inline:auto;padding:clamp(7rem,14vw,10rem) 0 clamp(1rem,3vw,2rem)}
  .phead h1{font-size:clamp(2.4rem,6vw,4.6rem);max-width:18ch}
  .phead .lead{margin-top:1.2rem}
  .btns{display:flex;flex-wrap:wrap;gap:.8rem;margin-top:2rem}
}

@layer components {
  /* Top bar (schwebende Pille) */
  .topbar{position:fixed;z-index:80;top:.8rem;left:50%;translate:-50% 0;width:min(1100px,100% - 1.4rem);color-scheme:light;background:#fff;color:#1b1a17;display:flex;align-items:center;justify-content:space-between;gap:1rem;
    padding:.4rem .55rem .4rem 1rem;border-radius:999px;border:1px solid #e6dfd0;box-shadow:0 1px 2px rgb(0 0 0/.06),0 12px 32px -14px rgb(20 20 10/.35);view-transition-name:topbar}
  .brand{display:block;line-height:0}
  .brand img{height:46px;width:auto}
  .dnav{display:flex;gap:.2rem}
  .dnav a{text-decoration:none;font-weight:600;font-size:.97rem;padding:.55rem 1rem;border-radius:999px;transition:background .2s,color .2s}
  .dnav a:hover{background:var(--bg-2)}
  .dnav a[aria-current=page]{background:var(--ink);color:var(--bg)}
  .tools{display:flex;align-items:center;gap:.4rem}
  .icon-btn{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;border:1px solid var(--line);background:transparent;cursor:pointer;transition:.2s}
  .icon-btn:hover{background:var(--bg-2);border-color:var(--accent)}
  .burger{display:none}
  @media (max-width:860px){.dnav,.tools .pill{display:none}.burger{display:grid}}
  #menu{inset:0;width:100%;height:100dvh;max-width:none;max-height:none;border:0;background:var(--forest);color:#f6efe2;display:none;flex-direction:column;justify-content:center;gap:.4rem;padding:2rem var(--gutter);
    opacity:0;transition:opacity .35s var(--ease),display .35s allow-discrete,overlay .35s allow-discrete}
  #menu:popover-open{display:flex;opacity:1}
  @starting-style{#menu:popover-open{opacity:0}}
  #menu a:not(.pill){font:700 clamp(2.2rem,9vw,3.4rem) var(--serif);text-decoration:none;padding:.3rem 0}
  #menu a[aria-current=page]{color:var(--sand)}
  #menu .pill{align-self:flex-start;margin-top:1.5rem}
  #menu .close{position:absolute;top:1rem;right:1rem;color:#fff;border-color:#ffffff40}

  .pill{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;text-decoration:none;font-weight:700;font-size:.95rem;padding:.65rem 1.25rem;border-radius:999px;background:var(--accent);color:var(--accent-ink);border:2px solid var(--accent);cursor:pointer;transition:transform .25s var(--ease),background .2s,color .2s}
  .pill:hover{transform:translateY(-2px) scale(1.03)}
  .pill.big{font-size:1.05rem;padding:1rem 1.7rem}
  .pill.ghost{background:transparent;color:var(--ink);border-color:var(--ink)}
  .pill.ghost:hover{background:var(--ink);color:var(--bg)}
  .link{background:none;border:0;padding:0;font-weight:700;color:var(--accent);cursor:pointer;text-align:left}
  .link:hover{text-decoration:underline}

  /* Hero */
  .hero{position:relative;min-height:100dvh;display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(1.5rem,5vw,4rem);align-items:center;
    width:min(var(--max),100% - 2*var(--gutter));margin-inline:auto;padding:7.5rem 0 3rem}
  .hero h1 .w{display:inline-block}
  .hero .lead{margin-top:1.6rem}
  .hero-photo{position:relative}
  .arch{border-radius:var(--r);overflow:hidden;aspect-ratio:2000/1426;box-shadow:var(--shadow);background:var(--bg-2)}
  .arch picture{display:block;height:100%}
  .arch img{width:100%;height:100%;object-fit:cover}
  .badge{position:absolute;left:-1.6rem;bottom:-1.6rem;width:clamp(104px,13vw,150px);overflow:visible}
  .badge-bg{fill:var(--forest)}
  .badge text{font:700 12.5px var(--sans);letter-spacing:2.3px;fill:var(--sand)}
  .badge .badge-star{fill:var(--sand);letter-spacing:0}
  .badge{animation:none}
  @media (max-width:900px){.hero{grid-template-columns:1fr;padding-top:6.5rem}.hero-photo{order:-1;width:100%}.badge{left:.5rem;bottom:-1.2rem}}

  /* Ticker */
  .ticker{overflow:hidden;background:var(--forest);color:#f6efe2;padding:1rem 0;border-block:1px solid #ffffff18;font:700 clamp(1.1rem,2.6vw,1.7rem) var(--serif)}
  .ticker-in{display:flex;gap:1.6rem;width:max-content;animation:tick 40s linear infinite}
  .ticker-in span{white-space:nowrap}.ticker-in i{color:var(--sand);font-style:normal}
  @keyframes tick{to{transform:translateX(-50%)}}

  /* Bento */
  .bento{display:grid;grid-template-columns:repeat(12,1fr);grid-auto-rows:minmax(240px,26vw);gap:clamp(.7rem,1.6vw,1.2rem)}
  .tile{position:relative;overflow:hidden;border-radius:var(--r);text-decoration:none;color:#fff;isolation:isolate;box-shadow:var(--shadow)}
  .tile picture,.tile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}
  .tile::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgb(8 20 14/.85),transparent 60%);z-index:0;transition:opacity .4s}
  .tile:hover img{transform:scale(1.07)}
  .tile-t{position:absolute;left:1.3rem;right:4rem;bottom:1.2rem;z-index:1;display:grid;gap:.25rem}
  .tile-t b{font:700 clamp(1.3rem,2.4vw,1.9rem)/1.1 var(--serif)}
  .tile-t small{font-size:.95rem;opacity:.88;line-height:1.35}
  .arrow{position:absolute;right:1.1rem;bottom:1.1rem;z-index:1;width:2.6rem;height:2.6rem;border-radius:50%;background:#fff;color:#111;display:grid;place-items:center;font-size:1.2rem;transition:transform .35s var(--ease),background .2s}
  .tile:hover .arrow{transform:rotate(45deg);background:var(--sand)}
  .t1{grid-column:span 7;grid-row:span 2}.t2{grid-column:span 5}.t3{grid-column:span 5}.t4{grid-column:span 12}
  @media (max-width:760px){.bento{grid-template-columns:1fr;grid-auto-rows:62vw}.t1,.t2,.t3,.t4{grid-column:auto;grid-row:auto}}

  /* Schritte (sticky) */
  .steps-sec{display:grid;grid-template-columns:1fr 1.2fr;gap:clamp(2rem,6vw,5rem);align-items:start}
  .sticky{position:sticky;top:7rem}
  .steps{display:grid;gap:1.2rem;counter-reset:x}
  .steps li{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:clamp(1.4rem,3vw,2.2rem);box-shadow:var(--shadow);min-height:14rem;display:flex;flex-direction:column;justify-content:flex-end}
  .steps .num{font:700 clamp(3rem,7vw,5rem)/1 var(--serif);color:var(--accent);opacity:.9;margin-bottom:auto}
  .steps p{color:var(--muted);margin-top:.5rem}
  @media (max-width:860px){.steps-sec{grid-template-columns:1fr}.sticky{position:static}}

  /* Großes Zitat */
  .bigq{background:var(--forest);color:#f6efe2;padding:clamp(4rem,11vw,9rem) var(--gutter);text-align:center}
  .bigq blockquote{max-width:60rem;margin-inline:auto}
  .bigq p{font:italic clamp(1.5rem,3.8vw,2.7rem)/1.28 var(--serif);text-wrap:balance}
  .bigq p::before{content:"";display:block;width:3.5rem;height:3px;background:var(--sand);margin:0 auto 2rem}
  .bigq footer{margin-top:1.8rem;color:var(--sand);font-weight:700;letter-spacing:.12em;text-transform:uppercase;font-size:.85rem}

  /* Karussell */
  .rail{display:flex;gap:1.1rem;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding:.4rem var(--gutter) 1.4rem;margin-inline:calc(-1*var(--gutter));scroll-padding-inline:var(--gutter);overscroll-behavior-x:contain}
  .rail::-webkit-scrollbar{display:none}
  .rail-btns{display:flex;gap:.5rem}
  .tcard{flex:0 0 min(340px,82vw);scroll-snap-align:start;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;display:flex;flex-direction:column;box-shadow:var(--shadow)}
  .tcard-img img{width:100%;aspect-ratio:4/3;object-fit:cover;object-position:center 25%}
  .tcard-b{padding:1.2rem 1.3rem 1.4rem;display:flex;flex-direction:column;gap:.8rem;flex:1}
  .tcard-b p{font:1.05rem/1.5 var(--serif);flex:1}
  .tcard.all{justify-content:center;align-items:center;text-align:center;background:var(--accent);color:var(--accent-ink);text-decoration:none;font:700 1.5rem var(--serif);gap:1rem;padding:2rem}
  .tcard.all i{font-style:normal;font-size:2.4rem;transition:transform .3s var(--ease)}
  .tcard.all:hover i{transform:translateX(8px)}

  /* Presse */
  .press{display:grid;grid-template-columns:minmax(0,340px) 1fr;gap:clamp(1.5rem,5vw,4rem);align-items:center}
  .press h2{font-size:clamp(1.6rem,3.4vw,2.6rem);margin-bottom:1rem}
  .press p+.pill{margin-top:1.4rem}
  .press-img img{border-radius:var(--r);box-shadow:var(--shadow);transition:transform .5s var(--ease)}
  .press-img:hover img{transform:rotate(-2deg) scale(1.03)}
  @media (max-width:700px){.press{grid-template-columns:1fr}}

  /* CTA */
  .cta{background:var(--accent);color:var(--accent-ink);text-align:center;padding:clamp(4rem,10vw,8rem) var(--gutter)}
  .cta .eyebrow{color:inherit;opacity:.8}
  .cta h2{font-size:clamp(2.2rem,6vw,4.5rem);margin-bottom:1.5rem}
  .mega{display:inline-block;font:700 clamp(1.3rem,4.6vw,3.2rem) var(--serif);text-decoration-thickness:3px;word-break:break-word;transition:letter-spacing .4s var(--ease)}
  .mega:hover{letter-spacing:.02em}
  .cta-sub{margin-top:1.2rem;font-size:1.1rem}

  /* Trainings-Seite */
  .jump{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:2rem}
  .jump a{padding:.55rem 1.1rem;border:1.5px solid var(--line);border-radius:999px;text-decoration:none;font-weight:600;transition:.2s}
  .jump a:hover,.jump a[aria-current]{background:var(--ink);color:var(--bg);border-color:var(--ink)}
  .tblock{position:relative;width:min(var(--max),100% - 2*var(--gutter));margin-inline:auto;padding-block:clamp(3rem,8vw,6rem);display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.5rem,5vw,4.5rem);align-items:center;border-top:1px solid var(--line)}
  .tblock:nth-of-type(even) .tb-text{order:2}
  .tnum{position:absolute;top:1rem;right:0;font:700 clamp(5rem,16vw,12rem)/1 var(--serif);color:transparent;-webkit-text-stroke:1.5px var(--line);pointer-events:none;user-select:none}
  .tb-text{position:relative}
  .tb-text h2{margin-bottom:1.2rem}
  .tb-text p{margin-bottom:1rem;max-width:56ch}
  .tb-text .pill{margin-top:.8rem}
  .tb-media{display:grid;gap:1rem}
  .tb-media img{width:100%;border-radius:var(--r);box-shadow:var(--shadow)}
  .tb-media .diagram{background:#fff;border:1px solid var(--line);box-shadow:none}
  @media (max-width:860px){.tblock{grid-template-columns:1fr}.tblock:nth-of-type(even) .tb-text{order:0}}

  /* Erfahrungen-Seite (CSS-Filter via :has) */
  .fr{position:absolute;opacity:0;pointer-events:none}
  .filters{display:flex;flex-wrap:wrap;gap:.6rem;margin-bottom:2rem;position:sticky;top:5rem;z-index:5;padding-block:.6rem}
  .chip{padding:.55rem 1.15rem;border:1.5px solid var(--line);border-radius:999px;font-weight:600;cursor:pointer;background:var(--surface);transition:.2s}
  .chip:hover{border-color:var(--accent)}
  .tl:has(#f-all:checked) [for=f-all],.tl:has(#f-vertrauen:checked) [for=f-vertrauen],.tl:has(#f-verladen:checked) [for=f-verladen],
  .tl:has(#f-boden:checked) [for=f-boden],.tl:has(#f-reiten:checked) [for=f-reiten]{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}
  .tl:has(.fr:focus-visible) .chip{outline:0}
  .tl:has(#f-vertrauen:checked) .tc:not([data-tags~=vertrauen]),.tl:has(#f-verladen:checked) .tc:not([data-tags~=verladen]),
  .tl:has(#f-boden:checked) .tc:not([data-tags~=boden]),.tl:has(#f-reiten:checked) .tc:not([data-tags~=reiten]){display:none}
  .masonry{columns:3 300px;column-gap:1.2rem}
  .tc{break-inside:avoid;margin-bottom:1.2rem;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;box-shadow:var(--shadow)}
  .tc-img img{width:100%;aspect-ratio:auto;max-height:420px;object-fit:cover;object-position:center 25%}
  .tc-b{padding:1.2rem 1.3rem 1.4rem}
  .tc-b p{margin-bottom:.8rem;font-size:1rem}
  .sig{font-weight:700;color:var(--accent);margin:0!important}.sig small{display:block;font-weight:400;color:var(--muted)}
  details summary{cursor:pointer;font-weight:700;color:var(--accent);margin-bottom:.8rem;list-style:none}
  details summary::after{content:" ↓"}details[open] summary::after{content:" ↑"}
  details::details-content{block-size:0;overflow:hidden;transition:block-size .5s var(--ease),content-visibility .5s allow-discrete}
  details[open]::details-content{block-size:auto}

  /* Kontakt */
  .cgrid{display:grid;grid-template-columns:1.2fr 1fr;gap:1.2rem}
  .panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:clamp(1.4rem,3vw,2.4rem);box-shadow:var(--shadow)}
  .panel h2{font-size:clamp(1.5rem,3vw,2.1rem);margin-bottom:1.2rem}
  .panel p{margin-bottom:.9rem}
  #impressum{grid-column:1/-1}
  .big-link{display:grid;border-bottom:1px solid var(--line);padding-bottom:.8rem}
  .big-link span{font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);font-weight:700}
  .big-link a{font:700 clamp(1.15rem,2.4vw,1.5rem) var(--serif);word-break:break-word}
  .form{display:grid;gap:1.1rem;align-content:start}
  .form h2{margin-bottom:.2rem}
  .field{position:relative}
  .field input,.field select,.field textarea{width:100%;padding:1.5rem 1rem .6rem;border:1.5px solid var(--line);border-radius:14px;background:var(--bg);accent-color:var(--accent);transition:border-color .2s,box-shadow .2s}
  .field textarea{field-sizing:content;min-height:7.5rem;resize:vertical}
  .field label{position:absolute;left:1rem;top:1.05rem;color:var(--muted);pointer-events:none;transition:.2s var(--ease);transform-origin:0 0}
  .field input:focus+label,.field textarea:focus+label,.field input:not(:placeholder-shown)+label,.field textarea:not(:placeholder-shown)+label,.field label.up{transform:translateY(-.7rem) scale(.75)}
  .field :is(input,textarea,select):focus{outline:0;border-color:var(--accent);box-shadow:0 0 0 4px color-mix(in srgb,var(--accent) 25%,transparent)}
  .field :is(input,textarea):user-invalid{border-color:#d33}
  @media (max-width:860px){.cgrid{grid-template-columns:1fr}}

  /* Rechtstexte */
  .legal{max-width:52rem}
  .legal h3{font-size:1.25rem;margin:2rem 0 .5rem}.legal h4{font:700 1rem var(--sans);margin:1.4rem 0 .3rem}
  .legal p{margin-bottom:.8rem;font-size:1rem}.legal .meta,.legal .form-line{color:var(--muted)}

  /* Footer */
  .foot{background:#0b130f;color:#d9d1c2;padding:clamp(3rem,7vw,5rem) var(--gutter) 1.5rem;overflow:hidden}
  .foot-grid{width:min(var(--max),100%);margin-inline:auto;display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:2rem}
  .foot a{color:#f3e6d0}
  .foot-h{font:700 1.1rem var(--serif);color:#fff;margin-bottom:.6rem}
  .wordmark{font:700 clamp(3rem,14.5vw,13rem)/.9 var(--serif);letter-spacing:-.04em;text-align:center;margin:clamp(2rem,6vw,4rem) 0 1rem;background:linear-gradient(180deg,#2c4a3b,#0b130f 90%);-webkit-background-clip:text;background-clip:text;color:transparent;user-select:none}
  .copy{text-align:center;font-size:.85rem;color:#8d8577}

  dialog{margin:auto;border:0;border-radius:var(--r);padding:clamp(1.4rem,4vw,2.6rem);width:min(680px,92vw);max-height:88dvh;background:var(--surface);color:var(--ink);box-shadow:0 30px 80px -20px #000a;
    opacity:0;translate:0 24px;transition:opacity .35s var(--ease),translate .35s var(--ease),overlay .35s allow-discrete,display .35s allow-discrete}
  dialog[open]{opacity:1;translate:0 0}
  @starting-style{dialog[open]{opacity:0;translate:0 24px}}
  dialog::backdrop{background:rgb(6 14 10/.65);backdrop-filter:blur(6px)}
  dialog .close{position:sticky;top:0;float:right}
  .dlg-body h3{font-size:1.8rem;margin-bottom:1rem}.dlg-body p{margin-bottom:.9rem}
}

@layer motion {
  @media (prefers-reduced-motion:no-preference){
    .hero h1 .w{animation:rise .9s var(--ease) both;animation-delay:calc(var(--i)*90ms + 150ms)}
    @keyframes rise{from{opacity:0;transform:translateY(.6em) rotate(2deg)}}
    .badge{animation:spin 24s linear infinite}
    @keyframes spin{to{transform:rotate(360deg)}}
    @supports (animation-timeline:view()){
      .progress{animation:grow linear both;animation-timeline:scroll(root)}
      @keyframes grow{to{transform:scaleX(1)}}
      .tile,.steps li,.tc,.tcard,.panel,.tb-media img,.press>*{animation:reveal linear both;animation-timeline:view();animation-range:entry 0% entry 45%}
      @keyframes reveal{from{opacity:0;translate:0 40px;scale:.97}}
      .bigq p{animation:reveal linear both;animation-timeline:view();animation-range:entry 0% entry 60%}
    }
  }
  ::view-transition-old(root){animation:.25s ease both fade-out}
  ::view-transition-new(root){animation:.4s ease both fade-in}
  @keyframes fade-out{to{opacity:0}}@keyframes fade-in{from{opacity:0}}
  @media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}.ticker-in{animation:none!important}}
  @media print{.topbar,.cta,.filters,.ticker,.foot-grid,.wordmark,.progress{display:none!important}body{background:#fff;color:#000}}
}

@layer components {
  .sec-h.center{margin-inline:auto;text-align:center}
  .weg-fig{margin:0}
  .weg-scroll{overflow-x:auto;border-radius:var(--r);box-shadow:var(--shadow);scrollbar-width:thin}
  .weg-img{width:100%;min-width:760px;height:auto}
  .weg-list{display:flex;flex-wrap:wrap;justify-content:center;gap:.6rem;margin-top:1.4rem;counter-reset:w}
  .weg-list li{counter-increment:w;padding:.5rem 1rem;border:1.5px solid var(--line);border-radius:999px;font-weight:600;font-size:.95rem;background:var(--surface)}
  .weg-list li::before{content:counter(w) "  ";color:var(--accent);font-weight:700}
  .tb-media .diagram{background:none;border:0;box-shadow:var(--shadow)}
}