:root{
  --ink:#101214;
  --muted:#626970;
  --paper:#f5f1ea;
  --white:#ffffff;
  --panel:#171a1d;
  --orange:#ef7d00;
  --orange-dark:#b85900;
  --line:#ded6cc;
  --soft:#eee7dd;
  --shadow:0 18px 45px rgba(17,18,20,.12);
  --radius:24px;
  --max:1180px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,Arial,Helvetica,sans-serif;color:var(--ink);background:var(--paper);line-height:1.58}
a{color:inherit}
img{max-width:100%;display:block}
.wrap{width:min(var(--max),calc(100% - 40px));margin:auto}
.kicker{font-size:.78rem;letter-spacing:.18em;text-transform:uppercase;font-weight:900;color:var(--orange)}
.lead{font-size:1.18rem;color:#30353a;max-width:760px}
.muted{color:var(--muted)}
.orange{color:var(--orange)}
.section{padding:82px 0}
.section.dark{background:var(--panel);color:#f7f4ef}
.section.dark .muted{color:#bac0c5}
.section.soft{background:var(--soft)}
.section-head{max-width:820px;margin-bottom:34px}
h1,h2,h3{line-height:1.04;margin:0 0 18px;font-weight:950;letter-spacing:-.03em}
h1{font-size:clamp(3.4rem,7vw,6.7rem)}
h2{font-size:clamp(2.4rem,5vw,4.4rem)}
h3{font-size:1.4rem}
p{margin:0 0 18px}
.btnrow{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 20px;border-radius:999px;background:var(--orange);color:white;text-decoration:none;font-weight:900;letter-spacing:.01em;transition:.2s ease;border:2px solid var(--orange)}
.btn:hover{transform:translateY(-2px);background:#ff8b0d}
.btn.secondary{background:transparent;color:var(--ink)}
.dark .btn.secondary{color:white;border-color:#5b5e62}
.btn.secondary:hover{border-color:var(--orange);color:var(--orange)}
.topbar{position:sticky;top:0;z-index:30;background:rgba(245,241,234,.94);backdrop-filter:blur(12px);border-bottom:1px solid rgba(0,0,0,.08)}
.nav{min-height:76px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;font-weight:950;letter-spacing:.02em}
.brand img{width:45px;height:45px;border-radius:50%}
.brand span small{display:block;font-size:.67rem;letter-spacing:.18em;color:var(--muted)}
.navlinks{display:flex;align-items:center;gap:22px;flex-wrap:wrap}
.navlinks a{text-decoration:none;font-size:.86rem;font-weight:850;text-transform:uppercase;letter-spacing:.08em}
.navlinks a:hover{color:var(--orange)}
.hero-banner{width:100%;aspect-ratio:4/1;object-fit:cover;background:#ddd}
.hero{padding:70px 0 55px}
.hero-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:50px;align-items:center}
.hero-copy strong{color:var(--orange)}
.hero-card{background:#0e1113;color:white;border-radius:var(--radius);padding:26px;box-shadow:var(--shadow);border:1px solid #2a2e32}
.hero-card .mini{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:18px}
.hero-card .mini div{padding:16px;background:#171a1d;border-radius:16px;border:1px solid #2e3236}
.hero-card .mini b{display:block;color:var(--orange);font-size:.8rem;text-transform:uppercase;letter-spacing:.08em;margin-bottom:4px}
.pillars{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.pillar{background:white;border-radius:22px;padding:26px;border:1px solid var(--line);box-shadow:0 10px 30px rgba(17,18,20,.06);text-decoration:none;transition:.2s ease}
.pillar:hover{transform:translateY(-5px);border-color:var(--orange)}
.pillar .num{font-size:.74rem;color:var(--orange);font-weight:950;letter-spacing:.15em}
.pillar p{color:var(--muted);margin-bottom:0}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.card{background:white;border-radius:var(--radius);overflow:hidden;border:1px solid var(--line);box-shadow:0 10px 32px rgba(17,18,20,.07)}
.card.darkcard{background:#111417;border-color:#2c3034;color:white}
.card img{width:100%;height:230px;object-fit:cover}
.card-body{padding:26px}
.card p{color:var(--muted)}
.darkcard p{color:#bbc1c5}
.card-link{display:inline-block;margin-top:6px;color:var(--orange);font-weight:950;text-decoration:none}
.split{display:grid;grid-template-columns:1fr 1fr;gap:42px;align-items:center}
.split img{border-radius:var(--radius);box-shadow:var(--shadow)}
.service-list{display:grid;gap:12px;margin-top:26px}
.service-item{display:grid;grid-template-columns:34px 1fr;gap:12px;align-items:start}
.dot{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:var(--orange);color:white;font-weight:950}

.platform-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:0 0 24px}
.platform-card{display:grid;grid-template-columns:72px 1fr;gap:22px;align-items:center;padding:26px;border-radius:24px;background:#111417;color:white;text-decoration:none;border:1px solid #2b2f34;transition:.2s ease}
.platform-card:hover{transform:translateY(-3px);border-color:var(--orange);box-shadow:0 14px 35px rgba(17,18,20,.14)}
.platform-mark{width:68px;height:68px;border-radius:20px;display:grid;place-items:center;background:var(--orange);color:white;font-weight:950;font-size:1.15rem;letter-spacing:.04em}
.platform-card .tag{display:block;color:var(--orange);font-weight:950;letter-spacing:.12em;text-transform:uppercase;font-size:.74rem;margin-bottom:4px}
.platform-card h3{margin:0 0 8px;font-size:1.55rem}
.platform-card p{color:#bac0c5;margin:0 0 10px}
.platform-card strong{color:white}

.media-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:18px}
.media-box{min-height:240px;border-radius:24px;padding:28px;background:#121518;color:white;display:flex;flex-direction:column;justify-content:flex-end;text-decoration:none;position:relative;overflow:hidden;border:1px solid #2b2f34}
.media-box.big{min-height:498px;background-image:linear-gradient(to top,rgba(5,6,7,.98),rgba(5,6,7,.12)),url('assets/hero-header.webp');background-size:cover;background-position:center}
.media-box.book{background-image:linear-gradient(to top,rgba(5,6,7,.98),rgba(5,6,7,.18)),url('assets/cover_tisch.webp');background-size:cover;background-position:center}
.media-box:hover{outline:2px solid var(--orange)}
.media-box .tag{color:var(--orange);font-weight:950;letter-spacing:.12em;text-transform:uppercase;font-size:.74rem}
.media-box h3{font-size:1.7rem;margin:8px 0}
.media-side{display:grid;gap:18px}
.quote{font-size:clamp(1.6rem,3vw,2.6rem);font-weight:900;line-height:1.25;max-width:950px;margin:0}
.about-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:40px;align-items:center}
.about-grid img{border-radius:var(--radius)}
.cta{padding:55px;border-radius:30px;background:#111417;color:white;display:grid;grid-template-columns:1.3fr .7fr;gap:28px;align-items:center}
.cta h2{font-size:clamp(2.2rem,4vw,3.8rem)}
.footer{background:#090b0d;color:#d8dcdf;padding:42px 0}
.footer-grid{display:flex;justify-content:space-between;gap:30px;align-items:center;flex-wrap:wrap}
.footer a{color:#d8dcdf;text-decoration:none;margin-right:18px}
.footer a:hover{color:var(--orange)}
.subhero{padding:80px 0;background:#101315;color:white}
.subhero .wrap{display:grid;grid-template-columns:1.2fr .8fr;gap:42px;align-items:center}
.subhero-card{background:#171b1f;border:1px solid #2d3237;border-radius:26px;padding:28px}
.three{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.feature{padding:28px;border-radius:22px;background:white;border:1px solid var(--line)}
.dark .feature{background:#171b1f;border-color:#2d3237}
.feature ul{padding-left:20px;margin-bottom:0}
.feature li{margin:8px 0}
.timeline{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:30px}
.step{padding:22px;border-top:4px solid var(--orange);background:white;border-radius:0 0 18px 18px;border-left:1px solid var(--line);border-right:1px solid var(--line);border-bottom:1px solid var(--line)}
.note{border-left:5px solid var(--orange);padding:18px 22px;background:#fff;border-radius:0 16px 16px 0}
@media(max-width:980px){
  .nav{align-items:flex-start;padding:14px 0;flex-direction:column}
  .navlinks{gap:12px 18px}
  .hero-grid,.split,.about-grid,.cta,.subhero .wrap{grid-template-columns:1fr}
  .pillars{grid-template-columns:1fr 1fr}
  .cards,.three{grid-template-columns:1fr 1fr}
  .platform-grid{grid-template-columns:1fr}
  .media-grid{grid-template-columns:1fr 1fr}
  .media-box.big{grid-column:1/-1;min-height:360px}
  .timeline{grid-template-columns:1fr 1fr}
}
@media(max-width:650px){
  .wrap{width:min(100% - 24px,var(--max))}
  .section{padding:58px 0}
  .hero{padding-top:48px}
  .pillars,.cards,.three,.platform-grid,.media-grid,.timeline{grid-template-columns:1fr}
  .media-box.big{grid-column:auto}
  h1{font-size:3.2rem}
  .hero-card .mini{grid-template-columns:1fr}
  .navlinks a{font-size:.78rem}
  .cta{padding:32px 24px}
}

/* V6 .... richer visual media and service presentation */
.advisory-split{align-items:stretch}
.advisory-list{display:grid;gap:12px}
.advisory-list .feature{padding:18px 20px}
.advisory-image{
  width:100%;
  min-height:520px;
  height:100%;
  object-fit:cover;
  border-radius:24px;
  border:1px solid #34383d;
  box-shadow:0 20px 50px rgba(0,0,0,.26)
}

.platform-card{
  position:relative;
  overflow:hidden;
  isolation:isolate
}
.platform-card::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-2;
  background-size:cover;
  background-position:center;
  opacity:.42
}
.platform-card::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background:linear-gradient(90deg,rgba(12,14,16,.98) 0%,rgba(12,14,16,.91) 42%,rgba(12,14,16,.70) 100%)
}
.youtube-platform::before{background-image:url('assets/youtube_podcast.webp')}
.spotify-platform::before{background-image:url('assets/spotify_podcast.webp')}

.media-box{
  background-size:cover;
  background-position:center;
}
.media-box::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(to top,rgba(5,6,7,.98) 0%,rgba(5,6,7,.72) 48%,rgba(5,6,7,.18) 100%);
  z-index:0
}
.media-box>*{position:relative;z-index:1}
.media-box.big::before{background:linear-gradient(to top,rgba(5,6,7,.98),rgba(5,6,7,.28))}
.media-portal-card{background-image:url('assets/media_portal_visual.webp')!important}
.youtube-card{background-image:url('assets/youtube_podcast.webp')}
.lage-null-game-card{background-image:url('assets/lage_null_game.webp')}
.computer23-game-card{background-image:url('assets/computer23_game.webp')}

@media(max-width:980px){
  .advisory-image{min-height:360px}
}
@media(max-width:680px){
  .advisory-image{min-height:280px}
}

/* V7 .... local social logos */
.platform-mark{
  width:68px;
  height:68px;
  border-radius:20px;
  display:grid;
  place-items:center;
  background:rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.12);
  overflow:hidden;
}
.platform-mark img{
  width:54px;
  height:54px;
  display:block;
}

.social-inline{
  margin-top:22px;
}
.social-link{
  display:inline-flex;
  align-items:center;
  gap:11px;
  min-height:46px;
  padding:8px 14px 8px 9px;
  border:1px solid var(--line);
  border-radius:14px;
  background:#fff;
  color:var(--ink);
  text-decoration:none;
  font-weight:850;
  transition:.2s ease;
}
.social-link:hover{
  transform:translateY(-2px);
  border-color:#0A66C2;
}
.social-link img{
  width:30px;
  height:30px;
  display:block;
}

.footer-actions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:22px;
  flex-wrap:wrap;
}
.footer-links{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:14px;
}
.footer-links a{
  margin-right:0;
}
.social-icons{
  display:flex;
  align-items:center;
  gap:10px;
}
.social-icons a{
  width:42px;
  height:42px;
  margin-right:0;
  display:grid;
  place-items:center;
  border-radius:12px;
  background:#15191d;
  border:1px solid #2c3136;
  transition:.2s ease;
}
.social-icons a:hover{
  transform:translateY(-2px);
  border-color:var(--orange);
  background:#1b2025;
}
.social-icons img{
  width:30px;
  height:30px;
  display:block;
}

@media(max-width:780px){
  .footer-actions{
    justify-content:flex-start;
  }
  .footer-links{
    width:100%;
  }
}

/* V8 .... contrast and platform logo cleanup */
.subhero .btn.secondary,
.cta .btn.secondary{
  color:#ffffff;
  border-color:#666b70;
  background:transparent;
}
.subhero .btn.secondary:hover,
.cta .btn.secondary:hover{
  color:var(--orange);
  border-color:var(--orange);
  background:rgba(255,255,255,.03);
}

/* Footer links on dark background a bit brighter */
.footer a{
  color:#f1f4f6;
}
.footer .muted{
  color:#c3c8cc;
}

/* Remove the orange-tile look from YouTube and Spotify marks */
.platform-mark{
  width:60px;
  height:60px;
  border-radius:0;
  background:transparent;
  border:none;
  padding:0;
  overflow:visible;
  box-shadow:none;
}
.platform-mark img{
  width:56px;
  height:56px;
}

/* Slightly calmer social icon containers in footer */
.social-icons a{
  background:transparent;
  border:1px solid #3a4046;
}
.social-icons a:hover{
  background:#13171b;
  border-color:var(--orange);
}