/*
Theme Name: SYNC Launch
Author: SYNC
Description: Launch-Theme für SYNC – Taekwondo & Movement Jülich. Fokus auf Warteliste, Kinder-/Jugendtraining und sauberes Branding.
Version: 3.0.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: sync
*/
:root{--bg:#030303;--panel:#0b0b0b;--gold:#c6a15b;--gold-soft:rgba(198,161,91,.14);--text:#f5efe5;--muted:#aaa195;--line:rgba(198,161,91,.32);--white-line:rgba(255,255,255,.10)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:radial-gradient(circle at 80% 0%,rgba(198,161,91,.18),transparent 28%),radial-gradient(circle at 10% 38%,rgba(198,161,91,.07),transparent 24%),var(--bg);color:var(--text);font-family:Arial,Helvetica,sans-serif}body::before{content:"";position:fixed;inset:0;z-index:1;pointer-events:none;opacity:.035;background-image:linear-gradient(45deg,#fff 1px,transparent 1px);background-size:8px 8px}a{color:inherit;text-decoration:none}main,header,footer{position:relative;z-index:2}.sync-header{position:fixed;top:0;left:0;right:0;height:78px;z-index:50;display:flex;align-items:center;justify-content:space-between;padding:0 5vw;background:rgba(0,0,0,.88);backdrop-filter:blur(16px);border-bottom:1px solid var(--white-line)}.sync-brand{display:flex;align-items:center;gap:12px;font-weight:900;letter-spacing:-.04em;font-style:italic;color:var(--gold);font-size:28px}.sync-brand img{width:48px;height:48px;object-fit:cover;border-radius:50%}.sync-brand small{display:block;font-style:normal;font-size:8px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-top:-4px}.sync-nav{display:flex;gap:28px;align-items:center;font-size:12px;letter-spacing:.10em;text-transform:uppercase;font-weight:800;color:var(--muted)}.sync-nav a:hover{color:var(--gold)}.sync-menu-toggle{display:none;background:transparent;border:1px solid var(--line);color:var(--gold);border-radius:999px;padding:9px 14px}.sync-hero{min-height:100vh;padding:120px 5vw 60px;display:grid;grid-template-columns:1.05fr .95fr;gap:48px;align-items:center}.sync-kicker{color:var(--gold);text-transform:uppercase;letter-spacing:.20em;font-size:12px;font-weight:900;margin:0 0 22px}.sync-hero h1{margin:0;font-size:clamp(46px,7vw,98px);line-height:.92;letter-spacing:-.055em;text-transform:uppercase}.sync-hero h1 span{color:var(--gold);display:block}.sync-lead{max-width:660px;color:#d6cec0;font-size:clamp(18px,2vw,23px);line-height:1.58;margin:28px 0 0}.sync-actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:34px}.sync-btn{min-height:50px;display:inline-flex;align-items:center;justify-content:center;padding:0 24px;border:1px solid var(--gold);color:var(--gold);text-transform:uppercase;letter-spacing:.12em;font-size:12px;font-weight:900}.sync-btn:hover,.sync-btn-solid{background:var(--gold);color:#060606}.sync-btn-ghost{border-color:var(--white-line);color:var(--text)}.sync-hero-visual{position:relative;display:grid;place-items:center;min-height:520px;}.sync-hero-visual::before{content:"";position:absolute;width:85%;aspect-ratio:1;border:1px solid var(--line);border-radius:50%;opacity:.65}.sync-hero-visual::after{content:"";position:absolute;width:62%;aspect-ratio:1;border:1px solid rgba(255,255,255,.08);border-radius:50%}.sync-hero-visual img{position:relative;z-index:2;width:min(430px,82%);border-radius:50%;filter:drop-shadow(0 34px 90px rgba(0,0,0,.75))}.sync-hero-badges{
  position:absolute;
  right:-20px;
  top:50%;
  transform:translateY(-50%);
  display:flex;
  flex-direction:column;
  gap:12px;
  width:180px;
  z-index:4;
}
}.sync-badge{
  flex:1;
  min-width:0;
  background:rgba(255,255,255,.035);
  border:1px solid var(--white-line);
  padding:16px 14px;
  text-align:center;
  color:var(--muted);
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:.12em;
  backdrop-filter:blur(10px);
}

.sync-badge strong{
  display:block;
  color:var(--gold);
  font-size:16px;
  margin-bottom:6px;
}
.sync-strip{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--white-line);border-bottom:1px solid var(--white-line);background:#050505}
.sync-strip article{padding:34px 5vw;border-right:1px solid var(--white-line)}

.sync-strip-link{
    display:block;
    color:inherit;
    text-decoration:none;
    transition:.25s ease;
}

.sync-strip-link article{
    height:100%;
}

.sync-strip-link:hover article{
    background:rgba(198,161,91,.06);
}

.sync-strip-link:hover h2{
    color:var(--gold);
}

.sync-strip-link:hover{
    transform:translateY(-3px);
}
.sync-strip article:last-child{border-right:0}.sync-strip span{color:var(--gold);font-weight:900;letter-spacing:.15em;font-size:12px}.sync-strip h2{margin:18px 0 10px;font-size:26px;text-transform:uppercase}.sync-strip p{margin:0;color:var(--muted);line-height:1.65}.sync-section{padding:90px 5vw;border-top:1px solid var(--white-line)}.sync-section-head{display:flex;justify-content:space-between;align-items:flex-end;gap:32px;margin-bottom:36px}.sync-section h2{margin:0;font-size:clamp(36px,5vw,68px);line-height:.98;letter-spacing:-.045em;text-transform:uppercase}.sync-section-head p{color:var(--muted);line-height:1.7;max-width:560px;margin:0}.sync-training-feature{display:grid;grid-template-columns:390px 1fr;gap:28px}.sync-training-card{border:1px solid var(--line);background:linear-gradient(145deg,rgba(198,161,91,.12),rgba(255,255,255,.025));padding:32px}.sync-training-card .day{color:var(--gold);text-transform:uppercase;letter-spacing:.18em;font-size:12px;font-weight:900}.sync-training-card h3{margin:18px 0 12px;font-size:34px;text-transform:uppercase;line-height:1}.sync-training-card .time{font-size:24px;font-weight:900;margin-bottom:14px}.sync-training-card p{color:var(--muted);line-height:1.7;margin:0 0 22px}.sync-training-note{border:1px solid var(--white-line);background:linear-gradient(90deg,rgba(0,0,0,.82),rgba(0,0,0,.36)),url('assets/sync-icon-profile.png') center/42% no-repeat,#0a0a0a;min-height:330px;padding:32px;display:flex;align-items:flex-end}.sync-training-note div{max-width:620px}.sync-training-note h3{font-size:36px;text-transform:uppercase;margin:0 0 12px}.sync-training-note p{color:var(--muted);line-height:1.7;margin:0}.sync-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.sync-card{border:1px solid var(--white-line);background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.015));padding:28px;min-height:250px}.sync-card .tag{display:inline-block;color:var(--gold);font-size:11px;text-transform:uppercase;letter-spacing:.15em;font-weight:900;margin-bottom:22px}.sync-card h3{margin:0 0 14px;font-size:27px;text-transform:uppercase;line-height:1.05}.sync-card p{color:var(--muted);line-height:1.7;margin:0}.sync-waitlist{margin:90px 5vw;padding:60px;border:1px solid var(--line);background:radial-gradient(circle at 85% 10%,rgba(198,161,91,.18),transparent 32%),linear-gradient(135deg,rgba(198,161,91,.12),rgba(255,255,255,.02)),#080808}.sync-waitlist h2{font-size:clamp(38px,5vw,72px);line-height:.96;letter-spacing:-.05em;margin:0 0 22px;text-transform:uppercase}.sync-waitlist p{color:var(--muted);max-width:760px;line-height:1.7;font-size:18px}.sync-form-placeholder{margin-top:32px;border:1px dashed var(--line);padding:24px;color:var(--muted);background:rgba(0,0,0,.26)}.sync-form-placeholder strong{color:var(--gold)}.sync-editorial{display:grid;grid-template-columns:.9fr 1.1fr;gap:60px;background:linear-gradient(90deg,rgba(198,161,91,.08),transparent)}.sync-editorial p{color:var(--muted);font-size:18px;line-height:1.75;margin:0 0 18px}.sync-instagram{display:grid;grid-template-columns:330px 1fr;gap:34px;align-items:center}.sync-instagram h2{font-size:clamp(24px,2.8vw,42px)!important;line-height:1!important;word-break:break-word;letter-spacing:-.03em}.sync-insta-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.sync-insta-tile{aspect-ratio:1;border:1px solid var(--white-line);background:linear-gradient(135deg,rgba(198,161,91,.14),rgba(255,255,255,.035)),url('assets/sync-icon-profile.png') center/55% no-repeat,#090909}.sync-contact-row{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.sync-contact-row a,.sync-contact-row div{border:1px solid var(--white-line);background:rgba(255,255,255,.035);padding:28px}.sync-contact-row small{display:block;color:var(--gold);text-transform:uppercase;letter-spacing:.14em;margin-bottom:12px}.sync-contact-row strong{display:block;font-size:21px;margin-bottom:8px}.sync-contact-row span{color:var(--muted)}.sync-footer{display:grid;grid-template-columns:1fr 1fr 1fr;gap:34px;padding:70px 5vw 34px;border-top:1px solid var(--white-line);background:#050505;color:var(--muted)}.sync-footer-logo{color:var(--gold);font-size:44px;font-weight:900;font-style:italic;letter-spacing:-.07em}.sync-footer h4{color:var(--gold);text-transform:uppercase;letter-spacing:.12em;font-size:12px;margin:0 0 16px}.sync-footer p,.sync-footer a{display:block;margin:0 0 8px;color:var(--muted)}@media(max-width:980px){.sync-nav{display:none;position:absolute;right:5vw;top:78px;flex-direction:column;align-items:flex-start;background:#050505;border:1px solid var(--line);padding:18px}.sync-nav.open{display:flex}.sync-menu-toggle{display:block}.sync-hero,.sync-strip,.sync-training-feature,.sync-grid,.sync-waitlist,.sync-editorial,.sync-instagram,.sync-contact-row,.sync-footer{grid-template-columns:1fr}.sync-hero{padding-top:110px}.sync-hero-visual{min-height:420px}
.sync-hero-badges{
  position:static;
  transform:none;
  width:100%;
  flex-direction:column;
  margin-top:24px;
}
.sync-section-head{display:block}.sync-waitlist{margin:60px 5vw;padding:34px}}
/* WPForms Styling für SYNC */
.sync-form .wpforms-container input:not([type="checkbox"]):not([type="radio"]),
.sync-form .wpforms-container select,
.sync-form .wpforms-container textarea {
  width: 100% !important;
  background: #111 !important;
  border: 1px solid rgba(198,161,91,.35) !important;
  color: #fff !important;
  padding: 14px 16px !important;
  border-radius: 8px !important;
  font-size: 16px !important;
}

.sync-form .wpforms-container label {
  color: #f5efe5 !important;
  font-weight: 700 !important;
}

.sync-form .wpforms-container .wpforms-field-description,
.sync-form .wpforms-container .wpforms-field-sublabel {
  color: #aaa195 !important;
}

.sync-form .wpforms-submit-container button,
.sync-form .wpforms-submit {
  background: var(--gold) !important;
  color: #000 !important;
  border: none !important;
  padding: 14px 28px !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
  letter-spacing: .08em !important;
  border-radius: 8px !important;
}
/* WPForms Dropdown Fix */
.sync-form .wpforms-container select {
  min-height: 52px !important;
  height: auto !important;
  line-height: 1.4 !important;
  padding-top: 12px !important;
  padding-bottom: 12px !important;
  appearance: auto !important;
}


.sync-waitlist-form{
  display:grid;
  gap:16px;
  max-width:640px;
  margin-top:32px;
}

.sync-waitlist-form input,
.sync-waitlist-form select,
.sync-waitlist-form textarea{
  width:100%;
  background:#111;
  border:1px solid rgba(198,161,91,.35);
  color:#fff;
  padding:14px 16px;
  border-radius:8px;
  font-size:16px;
}

.sync-waitlist-form textarea{
  min-height:120px;
  resize:vertical;
}

.sync-waitlist-form input:focus,
.sync-waitlist-form select:focus,
.sync-waitlist-form textarea:focus{
  outline:none;
  border-color:var(--gold);
  box-shadow:0 0 0 3px rgba(198,161,91,.15);
}

.sync-checkbox{
  display:flex;
  align-items:flex-start;
  gap:10px;
  color:var(--muted);
  line-height:1.5;
}

.sync-checkbox input{
  width:auto;
  margin-top:4px;
  accent-color:var(--gold);
}

.sync-waitlist-form button{
  background:var(--gold);
  color:#000;
  border:none;
  padding:15px 28px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.08em;
  border-radius:8px;
  cursor:pointer;
}

.sync-form-success{
  background:rgba(198,161,91,.15);
  border:1px solid rgba(198,161,91,.45);
  color:#fff;
  padding:16px 18px;
  margin-bottom:20px;
  border-radius:8px;
}

.sync-waitlist .sync-form-success{
  margin-top:32px !important;
}

.sync-poomsae-hero{
    min-height:72vh;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:140px 5vw 80px;
    background:
        linear-gradient(90deg,rgba(0,0,0,.95),rgba(0,0,0,.55)),
        radial-gradient(circle at 75% 40%,rgba(198,161,91,.20),transparent 32%),
        #050505;
    border-bottom:1px solid var(--white-line);
}

.sync-poomsae-hero h1{
  margin:0;
  max-width:900px;
  font-size:clamp(52px,8vw,110px);
  line-height:.9;
  letter-spacing:-.06em;
  text-transform:uppercase;
}

.sync-poomsae-hero p{
  max-width:760px;
  color:var(--muted);
  font-size:20px;
  line-height:1.7;
  margin-top:28px;
}

.sync-video-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
  gap:24px;
}

.sync-video-grid iframe{
  width:100%;
  aspect-ratio:16/9;
  border:1px solid var(--line);
  background:#000;
}

.sync-poomsae-hero > div{
    width:100%;
    max-width:1400px;
    margin:0 auto;
}

.sync-movement-hero{
  min-height:72vh;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:140px 5vw 80px;
  background:
    linear-gradient(90deg,rgba(0,0,0,.95),rgba(0,0,0,.55)),
    radial-gradient(circle at 75% 40%,rgba(198,161,91,.20),transparent 32%),
    #050505;
  border-bottom:1px solid var(--white-line);
}

.sync-movement-hero > div{
  width:100%;
  max-width:1400px;
  margin:0 auto;
}

.sync-movement-hero h1{
  margin:0;
  max-width:900px;
  font-size:clamp(52px,8vw,110px);
  line-height:.9;
  letter-spacing:-.06em;
  text-transform:uppercase;
}

.sync-movement-hero p{
  max-width:760px;
  color:var(--muted);
  font-size:20px;
  line-height:1.7;
  margin-top:28px;
}

.sync-community-hero{
  min-height:72vh;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:140px 5vw 80px;
  background:
    linear-gradient(90deg,rgba(0,0,0,.95),rgba(0,0,0,.55)),
    radial-gradient(circle at 75% 40%,rgba(198,161,91,.20),transparent 32%),
    #050505;
  border-bottom:1px solid var(--white-line);
}

.sync-community-hero > div{
  width:100%;
  max-width:1400px;
  margin:0 auto;
}

.sync-community-hero h1{
  margin:0;
  max-width:900px;
  font-size:clamp(52px,8vw,110px);
  line-height:.9;
  letter-spacing:-.06em;
  text-transform:uppercase;
}

.sync-community-hero p{
  max-width:760px;
  color:var(--muted);
  font-size:20px;
  line-height:1.7;
  margin-top:28px;
}

.sync-gallery-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:14px;
}

.sync-gallery-item{
  aspect-ratio:4/3;
  border:1px solid var(--white-line);
  background:
    linear-gradient(135deg,rgba(198,161,91,.14),rgba(255,255,255,.035)),
    url('assets/sync-icon-profile.png') center/45% no-repeat,
    #090909;
}

.sync-community-instagram{
  display:grid;
  grid-template-columns:360px 1fr;
  gap:40px;
  align-items:center;
}

.sync-community-instagram p{
  color:var(--muted);
  line-height:1.7;
  margin-bottom:24px;
}

@media(max-width:980px){
  .sync-gallery-grid,
  .sync-community-instagram{
    grid-template-columns:1fr;
  }
}

.sync-progress{
    display:grid;
    grid-template-columns:1.3fr .7fr;
    gap:50px;
    align-items:center;
}

.sync-progress-card{
    display:grid;
    grid-template-columns:1fr auto 1fr;
    gap:20px;
    align-items:center;
}

.sync-before,
.sync-after{
    text-align:center;
}

.sync-before img,
.sync-after img{

    width:100%;
    border-radius:18px;
    border:1px solid var(--line);

}

.sync-before span,
.sync-after span{

    display:block;
    margin-bottom:15px;
    color:var(--gold);
    text-transform:uppercase;
    letter-spacing:.15em;

}

.sync-progress-arrow{

    font-size:48px;
    color:var(--gold);

}

.sync-progress-info ul{

    list-style:none;
    padding:0;

}

.sync-progress-info li{

    padding:14px 0;
    border-bottom:1px solid rgba(255,255,255,.08);

}

.sync-progress-timeline{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
}

.sync-progress-step{
  border:1px solid var(--white-line);
  background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.015));
  padding:28px;
}

.sync-progress-step .tag{
  color:var(--gold);
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:.15em;
  font-weight:900;
}

.sync-progress-step h3{
  margin:18px 0;
  font-size:26px;
  text-transform:uppercase;
}

.sync-progress-step p{
  color:var(--muted);
  line-height:1.7;
}

.sync-progress-media{
  aspect-ratio:4/3;
  border:1px dashed var(--line);
  display:flex;
  align-items:center;
  justify-content:center;
  color:var(--gold);
  text-transform:uppercase;
  letter-spacing:.12em;
  font-size:12px;
  margin-bottom:18px;
  background:
    linear-gradient(135deg,rgba(198,161,91,.12),rgba(255,255,255,.025)),
    #090909;
}

.sync-progress-metrics{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
  margin-top:28px;
}

.sync-progress-metrics div{
  border:1px solid var(--line);
  padding:22px;
  background:rgba(198,161,91,.06);
}

.sync-progress-metrics span{
  display:block;
  color:var(--gold);
  text-transform:uppercase;
  letter-spacing:.14em;
  font-size:11px;
  margin-bottom:10px;
}

.sync-progress-metrics strong{
  font-size:18px;
}

@media(max-width:980px){
  .sync-progress-timeline,
  .sync-progress-metrics{
    grid-template-columns:1fr;
  }
}

/* Premium Hero V2 */
.sync-hero-v2{
  position:relative;
  min-height:100vh;
  padding:130px 5vw 90px;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:60px;
  align-items:center;
  overflow:hidden;
}

.sync-hero-v2::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 72% 45%, rgba(198,161,91,.20), transparent 32%),
    radial-gradient(circle at 12% 25%, rgba(255,255,255,.06), transparent 22%);
  pointer-events:none;
}

.sync-hero-copy{
  position:relative;
  z-index:3;
}

.sync-hero-copy h1{
  margin:0;
  font-size:clamp(54px,8vw,112px);
  line-height:.88;
  letter-spacing:-.07em;
  text-transform:uppercase;
}

.sync-hero-copy h1 span{
  color:var(--gold);
}

.sync-hero-stage{
  position:relative;
  z-index:3;
  min-height:560px;
  display:grid;
  place-items:center;
}

.sync-orbit{
  position:absolute;
  border:1px solid var(--line);
  border-radius:50%;
  pointer-events:none;
}

.sync-orbit-one{
  width:min(520px,80vw);
  aspect-ratio:1;
  animation:syncPulse 4.5s ease-in-out infinite;
}

.sync-orbit-two{
  width:min(390px,62vw);
  aspect-ratio:1;
  opacity:.45;
  animation:syncRotate 18s linear infinite;
}

.sync-hero-icon{
  width:min(390px,70%);
  border-radius:50%;
  position:relative;
  z-index:3;
  filter:drop-shadow(0 40px 90px rgba(0,0,0,.75));
  animation:syncFloat 5s ease-in-out infinite;
}

.sync-hero-info{
  position:absolute;
  right:0;
  top:50%;
  transform:translateY(-50%);
  display:flex;
  flex-direction:column;
  gap:12px;
  z-index:4;
}

.sync-info-pill{
  width:175px;
  padding:15px 16px;
  border:1px solid var(--white-line);
  background:rgba(5,5,5,.62);
  backdrop-filter:blur(12px);
}

.sync-info-pill small{
  display:block;
  color:var(--muted);
  font-size:10px;
  text-transform:uppercase;
  letter-spacing:.16em;
  margin-bottom:7px;
}

.sync-info-pill strong{
  color:var(--gold);
  font-size:17px;
}

.sync-animate{
  opacity:0;
  transform:translateY(28px);
  animation:syncReveal .8s ease forwards;
}

.sync-animate:nth-child(1){animation-delay:.1s}
.sync-animate:nth-child(2){animation-delay:.25s}
.sync-animate:nth-child(3){animation-delay:.4s}
.sync-animate:nth-child(4){animation-delay:.55s}

@keyframes syncReveal{
  to{
    opacity:1;
    transform:translateY(0);
  }
}

@keyframes syncFloat{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-14px)}
}

@keyframes syncPulse{
  0%,100%{
    transform:scale(1);
    opacity:.75;
  }
  50%{
    transform:scale(1.045);
    opacity:1;
  }
}

@keyframes syncRotate{
  from{transform:rotate(0deg)}
  to{transform:rotate(360deg)}
}

@media(max-width:980px){
  .sync-hero-v2{
    grid-template-columns:1fr;
    padding-top:120px;
  }

  .sync-hero-stage{
    min-height:430px;
  }

  .sync-hero-info{
    position:static;
    transform:none;
    margin-top:28px;
    width:100%;
  }

  .sync-info-pill{
    width:100%;
  }
}
.sync-strip article{
  opacity:0;
  transform:translateY(32px);
  transition:.7s ease;
}

.sync-strip article.sync-visible{
  opacity:1;
  transform:translateY(0);
}

.sync-strip article:hover{
  background:rgba(198,161,91,.06);
}

.sync-trainer-hero{
  min-height:72vh;
  display:flex;
  align-items:center;
  padding:140px 5vw 80px;
  background:
    linear-gradient(90deg,rgba(0,0,0,.96),rgba(0,0,0,.55)),
    radial-gradient(circle at 75% 45%,rgba(198,161,91,.20),transparent 32%),
    #050505;
  border-bottom:1px solid var(--white-line);
}

.sync-trainer-copy{
  width:100%;
  max-width:1400px;
  margin:0 auto;
}

.sync-trainer-copy h1{
  margin:0;
  max-width:950px;
  font-size:clamp(52px,8vw,110px);
  line-height:.9;
  letter-spacing:-.06em;
  text-transform:uppercase;
}

.sync-trainer-copy p{
  max-width:760px;
  color:var(--muted);
  font-size:20px;
  line-height:1.7;
  margin-top:28px;
}

.sync-coach-profile{
  display:grid;
  grid-template-columns:.9fr 1.1fr;
  gap:60px;
  align-items:center;
}

.sync-coach-profile h2{
  font-size:clamp(42px,6vw,78px);
  line-height:.95;
  letter-spacing:-.05em;
  margin:0 0 24px;
  text-transform:uppercase;
}

.sync-coach-profile p{
  color:var(--muted);
  font-size:18px;
  line-height:1.75;
}

.sync-photo-placeholder{
  min-height:420px;
  border:1px solid var(--line);
  background:
    linear-gradient(135deg,rgba(198,161,91,.16),rgba(255,255,255,.035)),
    url('assets/sync-icon-profile.png') center/45% no-repeat,
    #090909;
  display:flex;
  align-items:flex-end;
  justify-content:center;
  padding:24px;
  color:var(--gold);
  text-transform:uppercase;
  letter-spacing:.16em;
  font-size:12px;
}

.sync-credentials{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:28px;
}

.sync-credentials span{
  border:1px solid var(--line);
  color:var(--gold);
  padding:10px 14px;
  font-size:12px;
  letter-spacing:.08em;
  text-transform:uppercase;
  background:rgba(198,161,91,.06);
}

.sync-assistant-card{
  display:grid;
  grid-template-columns:320px 1fr;
  gap:32px;
  align-items:center;
  border:1px solid var(--white-line);
  background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.015));
  padding:28px;
}

.sync-assistant-card .sync-photo-placeholder{
  min-height:260px;
}

.sync-assistant-card .tag{
  color:var(--gold);
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:.15em;
  font-weight:900;
}

.sync-assistant-card h3{
  margin:14px 0;
  font-size:34px;
  text-transform:uppercase;
}

.sync-assistant-card p{
  color:var(--muted);
  line-height:1.7;
}

@media(max-width:980px){
  .sync-coach-profile,
  .sync-assistant-card{
    grid-template-columns:1fr;
  }
}

/* =========================================================
   TRAINING CARDS - FINAL LAYOUT
   ========================================================= */

.sync-training .sync-training-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px;
    width: 100%;
}

.sync-training .sync-training-card {
    display: flex;
    flex-direction: column;
    min-width: 0;
    width: 100%;
    overflow: hidden;
    padding: 0;
}

.sync-training .sync-training-card-content {
    display: flex;
    flex-direction: column;
    flex: 1;
    padding: 32px;
}

.sync-training .sync-training-image {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 9;
    flex-shrink: 0;

    background-image: url("assets/training_cards.png");
    background-repeat: no-repeat;

    /*
     * Das Gesamtbild enthält zwei gleich große 16:9-Motive.
     * 200% Breite zeigt deshalb exakt eine Bildhälfte.
     * Höhe bleibt automatisch proportional.
     */
    background-size: 204% auto;
}

.sync-training .sync-training-image-kids {
    background-position: left center;
}

.sync-training .sync-training-image-poomsae {
    background-position: right center;
}

.sync-training .sync-training-card .sync-btn {
    margin-top: auto;
    align-self: flex-start;
}

/* Nur auf kleinen Displays untereinander */
@media (max-width: 768px) {

    .sync-training .sync-training-grid {
        grid-template-columns: 1fr;
    }

    .sync-training .sync-training-card-content {
        padding: 24px;
    }
}

/* =========================================================
   ANGEBOT / WAS DICH BEI SYNC ERWARTET
   ========================================================= */

.sync-offer-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 24px;
}

.sync-offer-card {
    display: flex;
    flex-direction: column;
    padding: 0;
    overflow: hidden;
}

.sync-offer-content {
    display: flex;
    flex-direction: column;
    flex: 1;
    padding: 28px;
}

.sync-offer-content .sync-kicker {
    margin: 0 0 12px;
}

.sync-offer-content h3 {
    margin: 0 0 16px;
}

.sync-offer-content > p:last-child {
    margin: 0;
    line-height: 1.7;
}


/* Tablet */
@media (max-width: 1000px) {

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

}


/* Smartphone */
@media (max-width: 680px) {

    .sync-offer-grid {
        grid-template-columns: 1fr;
    }

    .sync-offer-content {
        padding: 24px;
    }

}
/* =========================================================
   OFFER IMAGE VIEWPORT
   ========================================================= */

.sync-offer-image {
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 9;
    overflow: hidden;
    background: #0a0a0a;
    border-bottom: 1px solid rgba(212, 175, 55, 0.35);
}

.sync-offer-image img {
    position: absolute;

    /* Bildmitte = Mitte der Kachel */
    left: 50%;
    top: 50%;

    width: 100%;
    height: auto;
    max-width: none;

    transform: translate(-50%, -50%);
    transition: transform 0.45s ease;
}


/* =========================================
   BASICS
   etwas hineinzoomen
   ========================================= */

.sync-offer-image .sync-offer-img-basics {
    width: 162%;
}


/* =========================================
   POOMSAE
   etwas herauszoomen
   ========================================= */

.sync-offer-image .sync-offer-img-poomsae {
    width: 88%;
    top: 60%;
}


/* =========================================
   MOVEMENT
   etwas herauszoomen
   ========================================= */

.sync-offer-image .sync-offer-img-movement {
    width: 88%;
    top: 70%;
}