/* =========================================================
   fobi · Funktionen V10
   kompletter Neuaufbau ohne Legacy-Visual-Regeln
   ========================================================= */

.fx-section{
  padding:var(--fw-section-desktop) 0;
  background:#fff;
}

.fx-inner{
  max-width:1200px;
}

.fx-head{
  max-width:760px;
  margin:0 0 56px;
}

.fx-head h2{
  margin:0;
  color:var(--fw-navy-900);
  font-size:var(--fw-h2);
  line-height:1.06;
  letter-spacing:-.035em;
}

.fx-head>p:last-child{
  max-width:700px;
  margin:18px 0 0;
  color:var(--fw-ink-500);
  font-size:1rem;
  line-height:1.65;
}


/* =========================================================
   GRID
   ========================================================= */

.fx-grid{
  display:grid;
  grid-template-columns:repeat(12,minmax(0,1fr));
  gap:16px;
}

.fx-card{
  min-width:0;
  overflow:hidden;
  border:1px solid var(--fw-line);
  border-radius:var(--fw-radius-card);
  background:var(--fw-surface-soft);
}

.fx-card--contacts{
  grid-column:span 7;
}

.fx-card--registrations{
  grid-column:span 5;
}

.fx-card--reminders{
  grid-column:span 5;
}

.fx-card--tasks{
  grid-column:span 7;
}

.fx-card--contacts,
.fx-card--registrations,
.fx-card--reminders,
.fx-card--tasks{
  min-height:350px;
  display:flex;
  flex-direction:column;
  padding:22px;
}

.fx-copy{
  margin-top:auto;
}

.fx-copy h3,
.fx-website-copy h3,
.fx-more h3{
  margin:0;
  color:var(--fw-navy-900);
  font-size:1rem;
  line-height:1.35;
  font-weight:650;
  letter-spacing:-.01em;
}

.fx-copy p,
.fx-website-copy p,
.fx-more article p{
  margin:7px 0 0;
  color:var(--fw-ink-500);
  font-size:.875rem;
  line-height:1.55;
}


/* =========================================================
   SHARED VISUAL
   ========================================================= */

.fx-visual{
  flex:0 0 230px;
  height:230px;
  min-height:230px;
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  margin-bottom:18px;
}


/* =========================================================
   CONTACTS
   ========================================================= */

.fx-contacts{
  display:block;
  padding:4px 8px 0;
}

.fx-filter-row{
  display:flex;
  gap:9px;
  align-items:center;
  height:38px;
}

.fx-filter-row span{
  height:30px;
  display:flex;
  align-items:center;
  gap:5px;
  padding:0 15px;
  border:1px solid var(--fw-line-strong);
  border-radius:999px;
  background:#fff;
  color:var(--fw-ink-600);
  font-size:10px;
  font-weight:600;
  white-space:nowrap;
}

.fx-filter-row i{
  font-style:normal;
  color:var(--fw-ink-500);
}

.fx-contact-table{
  margin-top:8px;
  border-top:1px solid var(--fw-line);
  border-bottom:1px solid var(--fw-line);
}

.fx-contact-head,
.fx-contact-row{
  display:grid;
  grid-template-columns:32px minmax(140px,1.7fr) minmax(80px,.8fr) minmax(90px,.9fr);
  align-items:center;
  column-gap:12px;
}

.fx-contact-head{
  height:28px;
  color:var(--fw-ink-500);
  font-size:8px;
  font-weight:650;
  letter-spacing:.065em;
  text-transform:uppercase;
}

.fx-contact-row{
  height:38px;
  position:relative;
  border-radius:8px;
}

.fx-checkbox{
  width:16px;
  height:16px;
  position:relative;
  justify-self:center;
  border-radius:50%;
  background:var(--fw-cyan-600);
}

.fx-checkbox::after{
  content:"";
  position:absolute;
  left:4px;
  top:3px;
  width:6px;
  height:3px;
  border-left:2px solid #fff;
  border-bottom:2px solid #fff;
  transform:rotate(-45deg);
}

.fx-person{
  display:flex;
  align-items:center;
  gap:11px;
}

.fx-person i{
  flex:0 0 20px;
  width:20px;
  height:20px;
  border-radius:50%;
  background:#e0e7ef;
}

.fx-person b,
.fx-line{
  display:block;
  height:7px;
  border-radius:999px;
  background:#aeb9c9;
}

.fx-person b{
  width:min(150px,72%);
}

.fx-line{
  background:#bdc8d6;
}

.fx-line--region{width:74%}
.fx-line--group{width:72%}

.fx-contact-foot{
  height:28px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  color:var(--fw-ink-500);
  font-size:9px;
  font-weight:600;
}

.fx-contact-foot em{
  display:flex;
  align-items:center;
  gap:6px;
  padding:4px 10px;
  border-radius:999px;
  background:var(--fw-cyan-100);
  color:var(--fw-cyan-700);
  font-size:8px;
  font-style:normal;
}

.fx-contact-foot em i{
  width:6px;
  height:6px;
  border-radius:50%;
  background:var(--fw-cyan-600);
}


/* =========================================================
   REGISTRATION
   ========================================================= */

.fx-registration{
  padding:8px 18px 0;
}

.fx-registration-panel{
  width:min(100%,360px);
  min-height:200px;
  position:relative;
  padding:22px 24px 24px;
  border:1px solid var(--fw-line-strong);
  border-radius:15px;
  background:#fff;
  box-shadow:0 16px 35px -24px rgb(0 31 65 / 30%);
}

.fx-registration-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
}

.fx-registration-head>div{
  display:flex;
  align-items:center;
  gap:10px;
}

.fx-registration-head strong{
  color:var(--fw-navy-900);
  font-size:15px;
}

.fx-registration-head time{
  color:var(--fw-ink-500);
  font-size:11px;
}

.fx-status-dot{
  width:11px;
  height:11px;
  border-radius:50%;
  background:var(--fw-cyan-600);
}

.fx-registration-content{
  margin-top:20px;
  padding-bottom:17px;
  border-bottom:1px solid var(--fw-line);
}

.fx-skeleton{
  display:block;
  height:7px;
  border-radius:999px;
  background:#b5bfcd;
}

.fx-skeleton--lg{width:74%}

.fx-registration-content>div{
  display:flex;
  align-items:center;
  gap:8px;
  margin-top:12px;
}

.fx-registration-content>div i{
  width:4px;
  height:4px;
  border-radius:50%;
  background:#c9d2dd;
}

.fx-skeleton--md{
  width:42%;
  background:#cad2dd;
}

.fx-skeleton--sm{
  width:25%;
  background:#cad2dd;
}

.fx-registration-meta{
  display:flex;
  align-items:center;
  gap:11px;
  margin-top:14px;
  font-size:10px;
}

.fx-registration-meta span{
  color:var(--fw-ink-500);
}

.fx-registration-meta strong{
  color:var(--fw-navy-900);
}

.fx-registration-actions{
  display:flex;
  gap:10px;
  margin-top:13px;
}

.fx-action{
  min-width:104px;
  height:36px;
  display:grid;
  place-items:center;
  border-radius:8px;
  font-size:10px;
  font-weight:650;
}

.fx-action--primary{
  background:var(--fw-cyan-600);
  color:#fff;
}

.fx-action--secondary{
  border:1px solid var(--fw-line-strong);
  background:#fff;
  color:var(--fw-ink-600);
}

.fx-registration-success{
  position:absolute;
  right:20px;
  bottom:29px;
  display:flex;
  align-items:center;
  gap:5px;
  color:var(--fw-cyan-700);
  font-size:8px;
  font-weight:650;
  opacity:0;
}

.fx-registration-success i{
  width:12px;
  height:12px;
  position:relative;
  border-radius:50%;
  background:var(--fw-cyan-100);
}

.fx-registration-success i::after{
  content:"";
  position:absolute;
  left:3px;
  top:3px;
  width:5px;
  height:3px;
  border-left:1.5px solid var(--fw-cyan-700);
  border-bottom:1.5px solid var(--fw-cyan-700);
  transform:rotate(-45deg);
}


/* =========================================================
   REMINDERS
   ========================================================= */

.fx-reminders{
  flex-direction:column;
  justify-content:flex-start;
  padding:26px 10px 0;
}

.fx-timeline{
  width:90%;
  height:76px;
  position:relative;
}

.fx-timeline-track,
.fx-timeline-progress{
  position:absolute;
  left:7%;
  right:7%;
  top:18px;
  height:2px;
}

.fx-timeline-track{
  background:repeating-linear-gradient(
    90deg,
    var(--fw-line-strong) 0 7px,
    transparent 7px 13px
  );
}

.fx-timeline-progress{
  right:auto;
  width:0;
  background:var(--fw-cyan-600);
}

.fx-timepoint{
  position:absolute;
  top:10px;
  width:90px;
  transform:translateX(-50%);
  text-align:center;
}

.fx-timepoint--1{left:7%}
.fx-timepoint--2{left:50%}
.fx-timepoint--3{left:93%}

.fx-timepoint i{
  width:16px;
  height:16px;
  display:block;
  margin:0 auto;
  border:2px solid var(--fw-line-strong);
  border-radius:50%;
  background:#fff;
}

.fx-timepoint span{
  display:block;
  margin-top:11px;
  color:var(--fw-ink-500);
  font-size:9px;
  font-weight:600;
}

.fx-mail-card{
  width:min(88%,320px);
  height:102px;
  display:flex;
  align-items:center;
  gap:16px;
  padding:18px 20px;
  border:1px solid var(--fw-line-strong);
  border-radius:12px;
  background:#fff;
  box-shadow:0 12px 28px -25px rgb(0 31 65 / 28%);
}

.fx-mail-icon{
  flex:0 0 36px;
  width:36px;
  height:36px;
  position:relative;
  border-radius:9px;
  background:var(--fw-cyan-100);
}

.fx-mail-icon i::before{
  content:"";
  position:absolute;
  left:10px;
  top:11px;
  width:15px;
  height:11px;
  border:1.5px solid var(--fw-cyan-700);
}

.fx-mail-icon i::after{
  content:"";
  position:absolute;
  left:11px;
  top:11px;
  width:13px;
  height:8px;
  border-bottom:1.5px solid var(--fw-cyan-700);
  transform:rotate(-34deg) skewX(20deg);
}

.fx-mail-lines{
  flex:1;
}

.fx-mail-lines b,
.fx-mail-lines span{
  display:block;
  border-radius:999px;
}

.fx-mail-lines b{
  width:82%;
  height:7px;
  background:#aeb9c9;
}

.fx-mail-lines span{
  height:6px;
  margin-top:9px;
  background:#ccd4df;
}

.fx-mail-lines span:nth-child(2){width:58%}
.fx-mail-lines span:nth-child(3){width:72%}

.fx-mail-state{
  flex:0 0 10px;
  width:10px;
  height:10px;
  border-radius:50%;
  background:var(--fw-cyan-600);
}


/* =========================================================
   TASKS
   ========================================================= */

.fx-tasks{
  flex-direction:column;
  justify-content:center;
  padding:7px 40px 0;
}

.fx-task-summary{
  width:min(100%,390px);
  display:flex;
  align-items:center;
  gap:14px;
  margin-bottom:19px;
}

.fx-task-summary strong{
  color:var(--fw-navy-900);
  font-size:14px;
}

.fx-progress-donut{
  width:40px;
  height:40px;
  position:relative;
  border-radius:50%;
  background:conic-gradient(
    var(--fw-cyan-600) 0 80%,
    var(--fw-line) 80% 100%
  );
}

.fx-progress-donut::after{
  content:"";
  position:absolute;
  inset:5px;
  border-radius:50%;
  background:var(--fw-surface-soft);
}

.fx-task-list{
  width:min(100%,390px);
  display:grid;
  gap:13px;
}

.fx-task-row{
  display:grid;
  grid-template-columns:18px 1fr;
  align-items:center;
  gap:14px;
}

.fx-task-row>span{
  width:var(--w);
  height:7px;
  border-radius:999px;
  background:#aeb9c9;
}

.fx-task-row>i{
  width:16px;
  height:16px;
  position:relative;
}

.fx-task-row.is-done>i::before{
  content:"";
  position:absolute;
  left:1px;
  top:2px;
  width:9px;
  height:5px;
  border-left:2px solid #9aaabd;
  border-bottom:2px solid #9aaabd;
  transform:rotate(-45deg);
}

.fx-task-row.is-open>i{
  border:2px solid var(--fw-cyan-600);
  border-radius:50%;
}

.fx-task-row.is-open>span{
  background:#c3cdd9;
}


/* =========================================================
   WEBSITE
   ========================================================= */

.fx-card--website{
  grid-column:1/-1;
  min-height:348px;
  display:grid;
  grid-template-columns:minmax(230px,.72fr) minmax(0,1.6fr);
  gap:34px;
  align-items:center;
  padding:30px 24px 0 42px;
  background:var(--fw-surface-muted);
}

.fx-website-copy{
  align-self:center;
  padding-bottom:30px;
}

.fx-website-copy h3{
  font-size:1.1rem;
}

.fx-website-copy p{
  max-width:320px;
  margin-top:10px;
  font-size:.94rem;
}

.fx-browser-wrap{
  height:318px;
  align-self:end;
  overflow:hidden;
  display:flex;
  align-items:flex-start;
  justify-content:center;
}

.fx-browser{
  width:100%;
  min-width:0;
  border:1px solid var(--fw-line-strong);
  border-bottom:0;
  border-radius:15px 15px 0 0;
  background:#fff;
  box-shadow:0 18px 45px -30px rgb(0 31 65 / 26%);
}

.fx-browser-bar{
  height:46px;
  display:flex;
  align-items:center;
  gap:8px;
  padding:0 18px;
  border-bottom:1px solid var(--fw-line);
}

.fx-browser-bar span{
  width:8px;
  height:8px;
  border-radius:50%;
  background:#c9d2de;
}

.fx-browser-bar i{
  width:150px;
  height:7px;
  margin-left:12px;
  border-radius:999px;
  background:#c3ccd8;
}

.fx-browser-page{
  position:relative;
  padding:19px 24px 0;
}

.fx-browser-nav{
  display:flex;
  gap:25px;
}

.fx-browser-nav i{
  width:55px;
  height:6px;
  border-radius:999px;
  background:#c7d0dc;
}

.fx-browser-heading{
  margin-top:25px;
}

.fx-browser-heading strong,
.fx-browser-heading span{
  display:block;
  border-radius:999px;
}

.fx-browser-heading strong{
  width:230px;
  height:8px;
  background:#aeb9c9;
}

.fx-browser-heading span{
  width:170px;
  height:6px;
  margin-top:12px;
  background:#c7d0dc;
}

.fx-embed{
  height:175px;
  position:relative;
  margin-top:20px;
  overflow:hidden;
  border:1.5px solid var(--fw-line-strong);
  border-radius:12px 12px 0 0;
  background:#fbfdff;
}

.fx-embed-label{
  position:absolute;
  left:18px;
  top:-12px;
  z-index:2;
  display:flex;
  align-items:center;
  gap:7px;
  height:26px;
  padding:0 14px;
  border-radius:999px;
  background:var(--fw-cyan-100);
  color:var(--fw-cyan-700);
  font-size:9px;
  font-weight:650;
}

.fx-embed-label i{
  width:6px;
  height:6px;
  border-radius:50%;
  background:var(--fw-cyan-600);
}

.fx-event{
  height:78px;
  display:grid;
  grid-template-columns:54px 1fr 92px;
  align-items:center;
  gap:18px;
  margin:21px 18px 0;
  padding-bottom:16px;
  border-bottom:1px solid var(--fw-line);
}

.fx-event--second{
  margin-top:0;
}

.fx-event time{
  width:54px;
  height:56px;
  display:grid;
  place-content:center;
  text-align:center;
  border-radius:8px;
  background:var(--fw-surface-muted);
}

.fx-event time strong{
  color:var(--fw-navy-900);
  font-size:15px;
  line-height:1;
}

.fx-event time small{
  margin-top:6px;
  color:var(--fw-ink-500);
  font-size:8px;
  font-weight:650;
  letter-spacing:.07em;
}

.fx-event>div b,
.fx-event>div span{
  display:block;
  border-radius:999px;
}

.fx-event>div b{
  width:72%;
  height:8px;
  background:#aeb9c9;
}

.fx-event>div span{
  width:49%;
  height:6px;
  margin-top:10px;
  background:#cad3de;
}

.fx-event em{
  height:34px;
  display:grid;
  place-items:center;
  border:1px solid var(--fw-line-strong);
  border-radius:8px;
  background:#fff;
  color:var(--fw-ink-600);
  font-size:9px;
  font-style:normal;
  font-weight:600;
}

.fx-embed-sheen{
  position:absolute;
  top:0;
  bottom:0;
  left:-80px;
  width:58px;
  background:linear-gradient(
    90deg,
    transparent,
    rgb(255 255 255 / 70%),
    transparent
  );
  opacity:0;
  transform:skewX(-14deg);
}


/* =========================================================
   MORE
   ========================================================= */

.fx-more{
  margin-top:46px;
}

.fx-more>p{
  margin:0 0 15px;
  color:var(--fw-ink-500);
  font-size:.72rem;
  font-weight:650;
  letter-spacing:.09em;
  text-transform:uppercase;
}

.fx-more-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  border-top:1px solid var(--fw-line);
}

.fx-more article{
  min-width:0;
  display:grid;
  grid-template-columns:8px 1fr;
  gap:14px;
  padding:20px 18px 6px 0;
}

.fx-more article+article{
  padding-left:24px;
  border-left:1px solid var(--fw-line);
}

.fx-more article>i{
  width:6px;
  height:6px;
  margin-top:7px;
  border-radius:50%;
  background:var(--fw-cyan-600);
}


/* =========================================================
   MOTION
   ========================================================= */

.fx-section.is-motion .fx-filter-row span:nth-child(1){
  animation:fx-chip 8.8s var(--fw-ease) 0s infinite;
}
.fx-section.is-motion .fx-filter-row span:nth-child(2){
  animation:fx-chip 8.8s var(--fw-ease) .18s infinite;
}
.fx-section.is-motion .fx-filter-row span:nth-child(3){
  animation:fx-chip 8.8s var(--fw-ease) .36s infinite;
}

.fx-section.is-motion .fx-contact-row:nth-child(2){
  animation:fx-row 8.8s var(--fw-ease) .4s infinite;
}
.fx-section.is-motion .fx-contact-row:nth-child(3){
  animation:fx-row 8.8s var(--fw-ease) .6s infinite;
}
.fx-section.is-motion .fx-contact-row:nth-child(4){
  animation:fx-row 8.8s var(--fw-ease) .8s infinite;
}

.fx-section.is-motion .fx-status-dot{
  animation:fx-status 8.8s var(--fw-ease) 1.7s infinite;
}

.fx-section.is-motion .fx-action--primary{
  animation:fx-primary 8.8s var(--fw-ease) 1.7s infinite;
}

.fx-section.is-motion .fx-registration-success{
  animation:fx-success 8.8s var(--fw-ease) 1.7s infinite;
}

.fx-section.is-motion .fx-timeline-progress{
  animation:fx-timeline 8.8s var(--fw-ease) 2.8s infinite;
}

.fx-section.is-motion .fx-timepoint--1 i{
  animation:fx-point 8.8s var(--fw-ease) 2.8s infinite;
}
.fx-section.is-motion .fx-timepoint--2 i{
  animation:fx-point 8.8s var(--fw-ease) 3.15s infinite;
}
.fx-section.is-motion .fx-timepoint--3 i{
  animation:fx-point 8.8s var(--fw-ease) 3.5s infinite;
}

.fx-section.is-motion .fx-mail-card{
  animation:fx-mail 8.8s var(--fw-ease) 3.25s infinite;
}

.fx-section.is-motion .fx-progress-donut{
  animation:fx-donut 8.8s var(--fw-ease) 4.45s infinite;
}

.fx-section.is-motion .fx-task-row:nth-child(1){
  animation:fx-task 8.8s var(--fw-ease) 4.3s infinite;
}
.fx-section.is-motion .fx-task-row:nth-child(2){
  animation:fx-task 8.8s var(--fw-ease) 4.5s infinite;
}
.fx-section.is-motion .fx-task-row:nth-child(3){
  animation:fx-task 8.8s var(--fw-ease) 4.7s infinite;
}
.fx-section.is-motion .fx-task-row:nth-child(4){
  animation:fx-task 8.8s var(--fw-ease) 4.9s infinite;
}

.fx-section.is-motion .fx-embed{
  animation:fx-embed-focus 8.8s var(--fw-ease) 5.7s infinite;
}

.fx-section.is-motion .fx-event:first-of-type{
  animation:fx-event 8.8s var(--fw-ease) 5.85s infinite;
}

.fx-section.is-motion .fx-embed-sheen{
  animation:fx-sheen 8.8s var(--fw-ease) 5.7s infinite;
}


@keyframes fx-chip{
  0%,6%,100%{transform:translateY(0);box-shadow:none}
  3%{transform:translateY(-2px);box-shadow:0 5px 12px rgb(11 159 216 / 10%)}
}

@keyframes fx-row{
  0%,5%,13%,100%{background:transparent}
  9%{background:rgb(11 159 216 / 5%)}
}

@keyframes fx-status{
  0%,6%,17%,100%{transform:scale(1);box-shadow:none}
  11%{transform:scale(1.35);box-shadow:0 0 0 5px rgb(11 159 216 / 10%)}
}

@keyframes fx-primary{
  0%,8%,20%,100%{box-shadow:none}
  13%{box-shadow:0 7px 18px rgb(11 159 216 / 18%)}
}

@keyframes fx-success{
  0%,12%,20%,100%{opacity:0;transform:translateX(-4px)}
  15%,18%{opacity:1;transform:translateX(0)}
}

@keyframes fx-timeline{
  0%,3%{width:0}
  18%,78%{width:86%}
  90%,100%{width:86%}
}

@keyframes fx-point{
  0%,5%,17%,100%{
    background:#fff;
    border-color:var(--fw-line-strong);
    transform:scale(1);
  }
  10%{
    background:var(--fw-cyan-600);
    border-color:var(--fw-cyan-600);
    transform:scale(1.18);
  }
}

@keyframes fx-mail{
  0%,10%,24%,100%{transform:translateY(0)}
  16%{transform:translateY(-4px)}
}

@keyframes fx-donut{
  0%,8%,22%,100%{transform:scale(1)}
  14%{transform:scale(1.08)}
}

@keyframes fx-task{
  0%,5%,15%,100%{transform:translateX(0)}
  10%{transform:translateX(4px)}
}

@keyframes fx-embed-focus{
  0%,7%,26%,100%{
    border-color:var(--fw-line-strong);
    box-shadow:none;
  }
  14%,20%{
    border-color:var(--fw-cyan-600);
    box-shadow:0 12px 24px -20px rgb(11 159 216 / 30%);
  }
}

@keyframes fx-event{
  0%,7%,21%,100%{transform:translateY(0)}
  14%{transform:translateY(-2px)}
}

@keyframes fx-sheen{
  0%,9%,100%{
    left:-80px;
    opacity:0;
  }
  12%{opacity:.65}
  24%{
    left:110%;
    opacity:0;
  }
}


/* =========================================================
   TABLET
   ========================================================= */

@media(max-width:1023px){
  .fx-section{
    padding:var(--fw-section-tablet) 0;
  }

  .fx-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .fx-card--contacts,
  .fx-card--registrations,
  .fx-card--reminders,
  .fx-card--tasks{
    grid-column:auto;
    min-height:330px;
  }

  .fx-card--website{
    grid-column:1/-1;
    grid-template-columns:minmax(200px,.75fr) minmax(0,1.4fr);
  }

  .fx-filter-row span{
    padding-inline:11px;
    font-size:9px;
  }

  .fx-contact-head,
  .fx-contact-row{
    grid-template-columns:28px minmax(110px,1.5fr) minmax(60px,.7fr) minmax(70px,.8fr);
  }
}


/* =========================================================
   MOBILE
   ========================================================= */

@media(max-width:767px){
  .fx-section{
    padding:var(--fw-section-mobile) 0;
  }

  .fx-head{
    margin-bottom:36px;
  }

  .fx-grid{
    grid-template-columns:1fr;
    gap:14px;
  }

  .fx-card--contacts,
  .fx-card--registrations,
  .fx-card--reminders,
  .fx-card--tasks,
  .fx-card--website{
    grid-column:auto;
    min-height:0;
    padding:18px;
  }

  .fx-visual{
    height:auto;
    min-height:0;
    flex-basis:auto;
    margin-bottom:22px;
  }

  .fx-contacts{
    padding:0;
  }

  .fx-filter-row{
    overflow:hidden;
  }

  .fx-filter-row span{
    padding-inline:10px;
    font-size:8px;
  }

  .fx-contact-head,
  .fx-contact-row{
    grid-template-columns:25px minmax(100px,1.5fr) minmax(55px,.7fr);
  }

  .fx-contact-head span:last-child,
  .fx-contact-row>span:last-child{
    display:none;
  }

  .fx-registration{
    padding:0;
  }

  .fx-registration-panel{
    width:100%;
    min-height:198px;
  }

  .fx-registration-success{
    display:none;
  }

  .fx-reminders{
    padding:20px 0 0;
  }

  .fx-mail-card{
    width:94%;
  }

  .fx-tasks{
    padding:18px 12px 4px;
  }

  .fx-card--website{
    display:block;
    padding:22px 18px 0;
  }

  .fx-website-copy{
    padding:0 2px 24px;
  }

  .fx-browser-wrap{
    height:255px;
  }

  .fx-browser{
    width:108%;
  }

  .fx-browser-page{
    padding-inline:16px;
  }

  .fx-event{
    grid-template-columns:48px 1fr 72px;
    gap:12px;
    margin-inline:12px;
  }

  .fx-event em{
    font-size:8px;
  }

  .fx-more{
    margin-top:36px;
  }

  .fx-more-grid{
    grid-template-columns:1fr;
  }

  .fx-more article{
    padding:17px 0;
  }

  .fx-more article+article{
    padding-left:0;
    border-left:0;
    border-top:1px solid var(--fw-line);
  }
}


/* =========================================================
   REDUCED MOTION
   ========================================================= */

@media(prefers-reduced-motion:reduce){
  .fx-section *,
  .fx-section *::before,
  .fx-section *::after{
    animation:none !important;
    transition:none !important;
  }

  .fx-timeline-progress{
    width:86%;
  }

  .fx-registration-success{
    opacity:0;
  }
}


/* =========================================================
   Funktionen V11 · Icon + Embed Polish
   ========================================================= */


/* ---------------------------------------------------------
   Einheitliche SVG-Icons
   --------------------------------------------------------- */

.fx-checkbox{
  display:grid;
  place-items:center;
}

.fx-checkbox::after{
  display:none;
}

.fx-checkbox svg{
  width:10px;
  height:10px;
  fill:none;
  stroke:#fff;
  stroke-width:2.4;
  stroke-linecap:round;
  stroke-linejoin:round;
}


.fx-mail-icon{
  display:grid;
  place-items:center;
}

.fx-mail-icon i::before,
.fx-mail-icon i::after{
  display:none;
}

.fx-mail-icon svg{
  width:20px;
  height:20px;
  fill:none;
  stroke:var(--fw-cyan-700);
  stroke-width:1.7;
  stroke-linecap:round;
  stroke-linejoin:round;
}


.fx-task-row.is-done>i{
  display:grid;
  place-items:center;
}

.fx-task-row.is-done>i::before{
  display:none;
}

.fx-task-row.is-done>i svg{
  width:16px;
  height:16px;
  fill:none;
  stroke:#98a8bd;
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round;
}


.fx-registration-success i{
  display:grid;
  place-items:center;
}

.fx-registration-success i::after{
  display:none;
}

.fx-registration-success svg{
  width:8px;
  height:8px;
  fill:none;
  stroke:var(--fw-cyan-700);
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round;
}


/* ---------------------------------------------------------
   Website-Einbindung
   Badge darf bewusst über der Embed-Kante sitzen.
   --------------------------------------------------------- */

.fx-embed{
  overflow:visible;
}

.fx-embed-label{
  top:-13px;
  z-index:5;
  box-shadow:0 3px 9px rgb(0 31 65 / 5%);
}

.fx-event:first-of-type{
  margin-top:25px;
}


/*
 * Die zweite Zeile darf unten kontrolliert angeschnitten
 * werden. Das Clipping übernimmt der äußere Browserbereich,
 * nicht das Embed selbst.
 */
.fx-browser-wrap{
  overflow:hidden;
}


/* Mobile: Badge ebenfalls vollständig sichtbar */
@media(max-width:767px){
  .fx-embed-label{
    top:-12px;
  }
}

/* END Funktionen V11 · Icon + Embed Polish */