.expert-page{
  display:flex;
  flex-direction:column;
  gap:18px;
}

.expert-hero{
  position:relative;
  min-height:245px;
  overflow:hidden;
  border-radius:18px;
  background:
    url("/pferderennen/assets/img/header/race-scene.webp") center 43% / cover no-repeat;
  box-shadow:0 12px 30px rgba(19,52,39,.12);
}

.expert-hero__shade{
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,rgba(7,48,35,.95) 0%,rgba(7,48,35,.84) 38%,rgba(7,48,35,.32) 67%,rgba(7,48,35,.05) 100%);
}

.expert-hero__content{
  position:relative;
  z-index:1;
  max-width:590px;
  padding:42px 44px;
  color:#fff;
}

.expert-hero__eyebrow{
  margin:0 0 8px;
  color:#d7b866;
  font-size:.78rem;
  font-weight:800;
  letter-spacing:.16em;
  text-transform:uppercase;
}

.expert-hero h1{
  margin:0;
  font-size:clamp(2.35rem,4vw,4rem);
  line-height:.98;
  color:#fff;
  letter-spacing:-.025em;
}

.expert-hero__content>p:last-child{
  margin:14px 0 0;
  max-width:520px;
  font-size:1.08rem;
  line-height:1.5;
  color:rgba(255,255,255,.92);
}

.expert-heading{
  padding:4px 4px 0;
}

.expert-heading h2{
  margin:.15rem 0 .35rem;
  color:#173d2e;
  font-size:1.55rem;
}

.expert-heading p:last-child{
  margin:0;
  color:#66736c;
}

.expert-list{
  display:flex;
  flex-direction:column;
  gap:14px;
}

.expert-card{
  background:#fff;
  border-radius:16px;
  box-shadow:0 9px 26px rgba(22,45,34,.07);
  padding:20px;
}

.expert-card__head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:18px;
  padding-bottom:14px;
  border-bottom:1px solid rgba(14,58,43,.1);
}

.expert-card__head h2{
  margin:.12rem 0 .38rem;
  font-size:1.2rem;
  color:#153d2d;
}

.expert-card__meta{
  display:flex;
  flex-wrap:wrap;
  gap:7px 13px;
  margin:0;
  color:#66736c;
  font-size:.9rem;
}

.expert-card__meta span+span:before{
  content:"·";
  margin-right:13px;
  color:#b49b56;
}

.expert-card__title{
  margin:.65rem 0 0;
  font-weight:650;
  color:#33443c;
}

.expert-card__race-link{
  flex:0 0 auto;
  text-decoration:none;
  background:#0e3a2b;
  color:#fff;
  border-radius:999px;
  padding:9px 14px;
  font-weight:700;
  font-size:.88rem;
}

.expert-card__race-link:hover{
  background:#174f3b;
}

.expert-card__picks{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:9px;
  margin-top:14px;
}

.expert-card__picks>div{
  background:#f8f7f2;
  border-radius:11px;
  padding:11px 12px;
  min-width:0;
}

.expert-card__picks span{
  display:block;
  margin-bottom:5px;
  color:#9a7e31;
  font-size:.7rem;
  font-weight:800;
  letter-spacing:.05em;
  text-transform:uppercase;
}

.expert-card__picks strong{
  display:block;
  color:#173d2e;
  overflow-wrap:anywhere;
}

.expert-card__analysis{
  margin-top:14px;
  padding-top:14px;
  border-top:1px solid rgba(14,58,43,.1);
}

.expert-card__analysis h3{
  margin:0 0 6px;
  font-size:.96rem;
  color:#173d2e;
}

.expert-card__analysis p{
  margin:0;
  line-height:1.58;
  color:#3e4c45;
}

.expert-empty{
  padding:25px;
}

@media(max-width:1100px){
  .expert-card__picks{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media(max-width:720px){
  .expert-hero{min-height:210px;background-position:62% center}
  .expert-hero__shade{background:linear-gradient(90deg,rgba(7,48,35,.95) 0%,rgba(7,48,35,.79) 56%,rgba(7,48,35,.28) 100%)}
  .expert-hero__content{padding:30px 24px;max-width:82%}
  .expert-hero__content>p:last-child{font-size:.98rem}
  .expert-card{padding:15px}
  .expert-card__head{display:block}
  .expert-card__race-link{display:inline-block;margin-top:12px}
  .expert-card__picks{grid-template-columns:1fr}
  .expert-card__meta{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 8px}
  .expert-card__meta span+span:before{display:none}
}