/* ===== KUSTOM STUDIO STARTSEITE (Claude, 2026-06-12) =====
   1:1-Port des Design-Handoffs «Studio» (variant-studio.jsx, Praefix vs-).
   Container-Queries des Prototyps als Media-Queries. Nur auf dem Template
   studio-home_template.php geladen. */
body.vs-page{margin:0;padding:0}
body.vs-page #wpadminbar{position:fixed}
.vs{background:#F4F1EC;color:#16140F;font-family:forma-djr-text,Archivo,system-ui,sans-serif;line-height:1.5;-webkit-font-smoothing:antialiased;font-size:16px}
.vs *{box-sizing:border-box;margin:0}
.vs a{color:inherit;text-decoration:none}
.vs img{display:block}
.vs ul{padding:0}
.vs .wrap{max-width:1240px;margin:0 auto;padding-left:48px;padding-right:48px}
.vs .h{font-family:forma-djr-display,forma-djr-text,Archivo,sans-serif;font-weight:600;letter-spacing:-.025em;line-height:1.04}
/* Customizer-CSS (wp-custom-css) erzwingt forma-djr-text per !important auf h1-h6 —
   hier zurueckholen, damit Headlines auf forma-djr-display wechseln, sobald im Kit. */
.vs .h,.vs-show .info h3{font-family:forma-djr-display,forma-djr-text,Archivo,sans-serif !important}
.vs .h,.vs-show .info h3{color:#16140F}
.vs-style .h,.vs-style h2{color:#F4F1EC}
.vs .kick{font-size:12px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:#8A847A}
.vs .num{font-size:12px;font-weight:600;letter-spacing:.14em;color:#274D59}
.vs-topbar{display:flex;justify-content:center;gap:40px;padding:10px 16px;font-size:12.5px;color:#6E6A60;border-bottom:1px solid #E3DDD2;white-space:nowrap;overflow:hidden}
.vs-topbar span{display:flex;align-items:center;gap:7px}
.vs-topbar svg{color:#274D59;flex:none}
.vs-head{display:flex;align-items:center;gap:40px;padding:22px 48px;border-bottom:1px solid #E3DDD2}
.vs-head .logo{height:24px;width:auto;flex:none}
.vs-nav{display:flex;gap:30px;font-size:14px;font-weight:500}
.vs-nav a{padding-bottom:2px}
.vs-nav a.hot{border-bottom:2px solid #274D59}
.vs-tools{margin-left:auto;display:flex;align-items:center;gap:22px;font-size:14px;color:#16140F}
.vs-tools .s{display:flex;align-items:center;gap:9px;border-bottom:1px solid #16140F;padding:6px 2px;width:220px;color:#8A847A}
.vs-tools .s input{all:unset;flex:1;font-size:14px;color:#16140F;min-width:0}
.vs-tools .s input::placeholder{color:#8A847A}
.vs-burger{display:none;margin-left:auto;position:relative}
.vs-burger summary{list-style:none;cursor:pointer;font-size:13px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;padding:8px 0}
.vs-burger summary::-webkit-details-marker{display:none}
.vs-burger[open] .bm{position:absolute;right:0;top:100%;z-index:50;background:#fff;border:1px solid #E3DDD2;min-width:230px;display:grid;padding:8px 0}
.vs-burger .bm a{padding:11px 18px;font-size:14px;font-weight:500;border-bottom:1px solid #F0EDE6}
.vs-burger .bm a:last-child{border-bottom:0}
.vs-hero{padding:96px 48px 80px;max-width:1240px;margin:0 auto}
.vs-hero h1{font-size:84px;font-weight:600;letter-spacing:-.03em;line-height:1;max-width:13ch}
.vs-hero h1 em{font-style:normal;color:#274D59}
.vs-hero .row{display:grid;grid-template-columns:1.2fr .8fr;gap:64px;align-items:end;margin-top:36px}
.vs-hero .sub{font-size:18px;color:#55514A;max-width:52ch}
.vs-hero .facts{display:flex;gap:40px;justify-content:flex-end}
.vs-hero .facts b{display:block;font-size:34px;font-weight:600;letter-spacing:-.02em}
.vs-hero .facts i{font-style:normal;font-size:12.5px;letter-spacing:.1em;text-transform:uppercase;color:#8A847A}
.vs-herosearch{display:flex;align-items:center;gap:14px;margin-top:44px;border:1px solid #16140F;background:#fff;padding:6px 6px 6px 22px;max-width:560px}
.vs-herosearch input{all:unset;flex:1;font-size:15px;color:#16140F}
.vs-herosearch input::placeholder{color:#A29C90}
.vs-herosearch .go{background:#16140F;color:#F4F1EC;font-size:13px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;padding:14px 24px;border:0;cursor:pointer;font-family:inherit}
.vs-rule{border-top:1px solid #E3DDD2}
.vs-sec{padding:88px 0}
.vs-sechead{display:grid;grid-template-columns:200px minmax(0,1fr) auto;gap:24px;align-items:baseline;margin-bottom:44px}
.vs-sechead h2{font-size:44px}
.vs-sechead .more{font-size:13px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;border-bottom:1px solid #16140F;padding-bottom:3px;white-space:nowrap}
.vs-worlds{display:grid;grid-template-columns:1fr 1fr;gap:48px}
.vs-world .ph{display:block;aspect-ratio:5/4;background:#fff;background-size:contain;background-repeat:no-repeat;background-position:center;border:1px solid #E3DDD2}
.vs-world .cap{display:grid;grid-template-columns:1fr auto;gap:6px 16px;padding-top:18px}
.vs-world .cap strong{font-size:26px;font-weight:600;letter-spacing:-.02em}
.vs-world .cap .cnt{font-size:13px;color:#274D59;font-weight:600;align-self:center}
.vs-world .cap em{grid-column:1/-1;font-style:normal;color:#8A847A;font-size:14px}
.vs-world .cap .cta{grid-column:1/-1;margin-top:10px;font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase}
.vs-world .cap .cta span{border-bottom:1px solid #16140F;padding-bottom:3px}
.vs-logogrid{display:grid;grid-template-columns:repeat(6,1fr);border-top:1px solid #E3DDD2;border-left:1px solid #E3DDD2}
.vs-logogrid .cell{display:grid;place-items:center;height:104px;border-right:1px solid #E3DDD2;border-bottom:1px solid #E3DDD2;padding:24px;background:#F8F6F1}
.vs-logogrid img{max-width:100%;max-height:36px;width:auto;object-fit:contain;filter:grayscale(1);opacity:.8;transition:filter .18s ease,opacity .18s ease}
.vs-logogrid .cell:hover img{filter:none;opacity:1}
.vs-logogrid img.wht{filter:brightness(0);opacity:.8}
.vs-thisis{display:grid;grid-template-columns:.9fr 1.1fr;gap:64px;align-items:center}
.vs-thisis .pic{aspect-ratio:4/5;background-size:cover;background-position:center}
.vs-thisis h2{font-size:48px;margin:14px 0 18px}
.vs-thisis p{color:#55514A;font-size:16.5px;max-width:50ch;margin-bottom:30px}
.vs-btn,.vs a.vs-btn{display:inline-block;background:#16140F;color:#F4F1EC;font-size:13px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;padding:16px 28px}
.vs-btn.lite{background:transparent;color:#16140F;border:1px solid #16140F}
.vs-cats{display:grid;grid-template-columns:repeat(5,1fr);gap:24px}
.vs-cat .ph{display:block;aspect-ratio:3/4;background:#fff;border:1px solid #E3DDD2;background-size:contain;background-repeat:no-repeat;background-position:center}
.vs-cat .lbl{display:flex;justify-content:space-between;align-items:baseline;padding-top:12px;font-size:14.5px;font-weight:600}
.vs-cat .lbl span{color:#274D59}
.vs-services .grid{display:grid;grid-template-columns:1fr 1fr;gap:0 64px}
.vs-services a{display:grid;grid-template-columns:40px 1fr auto;gap:18px;align-items:baseline;padding:17px 2px;border-bottom:1px solid #E3DDD2;font-size:17px;font-weight:500}
.vs-services a i{font-style:normal;font-size:12px;color:#274D59;font-weight:600}
.vs-services a .arr{opacity:.35;transition:opacity .15s}
.vs-services a:hover .arr{opacity:1}
.vs-services a.hot{font-weight:600}
.vs-services a.hot .nm small{display:block;margin-top:3px;font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:#274D59}
.vs-services .lede{max-width:60ch;color:#55514A;font-size:16.5px;margin-bottom:36px}
.vs-style{display:grid;grid-template-columns:1.15fr .85fr;gap:0;background:#16140F;color:#F4F1EC}
.vs-show{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:start}
.vs-show .pics{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.vs-show .pics .p{aspect-ratio:4/5;background-size:cover;background-position:center}
.vs-show .pics .p.wide{grid-column:1/-1;aspect-ratio:16/10}
.vs-show .pics .cap{grid-column:1/-1;font-size:12.5px;color:#8A847A;letter-spacing:.06em;text-transform:uppercase}
.vs-show .info h3{font-family:forma-djr-display,forma-djr-text,Archivo,sans-serif;font-size:34px;font-weight:600;letter-spacing:-.02em;line-height:1.08;margin:10px 0 16px}
.vs-show .info .lede{color:#55514A;font-size:16px;max-width:46ch;margin-bottom:26px}
.vs-show .row{display:grid;grid-template-columns:150px 1fr;gap:18px;padding:15px 2px;border-bottom:1px solid #E3DDD2;font-size:15.5px}
.vs-show .row i{font-style:normal;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:#8A847A;padding-top:3px}
.vs-show .row b{font-weight:600}
.vs-show .row b small{display:block;font-weight:400;color:#8A847A;font-size:13.5px}
.vs-show .vs-btn{margin-top:28px}
.vs-style .pic{min-height:480px;background-size:cover;background-position:center}
.vs-style .txt{padding:64px 56px;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:18px}
.vs-style h2{font-size:42px}
.vs-style .num{color:#8FB6C2}
.vs-style p{color:#B9B4AA;max-width:42ch}
.vs-style .ctas{display:flex;flex-wrap:wrap;gap:12px;margin-top:10px}
.vs-style .ctas a{border:1px solid #F4F1EC;color:#F4F1EC;font-size:12.5px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;padding:14px 22px}
.vs-style .ctas a.alt{background:#F4F1EC;color:#16140F}
.vs-feat{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid #E3DDD2;border-bottom:1px solid #E3DDD2}
.vs-feat div{padding:30px 12px;text-align:center}
.vs-feat div+div{border-left:1px solid #E3DDD2}
.vs-feat b{display:block;font-size:14px;font-weight:600;letter-spacing:.08em;text-transform:uppercase}
.vs-feat span{font-size:13.5px;color:#8A847A;letter-spacing:.06em;text-transform:uppercase}
.vs-insta{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.vs-insta div{aspect-ratio:4/5;background-size:cover;background-position:center}
@media (max-width:1120px){
  .vs-nav{gap:22px}
  .vs-tools .s{display:none}
}
@media (max-width:760px){
  .vs .wrap{padding-left:22px;padding-right:22px}
  .vs-topbar span:nth-child(n+3){display:none}
  .vs-head{padding:16px 22px;gap:18px}
  .vs-nav,.vs-tools{display:none}
  .vs-burger{display:block}
  .vs-hero{padding:56px 22px 48px}
  .vs-hero h1{font-size:46px;hyphens:auto;-webkit-hyphens:auto;overflow-wrap:break-word}
  .vs-hero .row{grid-template-columns:1fr;gap:28px}
  .vs-hero .facts{justify-content:flex-start;gap:28px}
  .vs-sec{padding:56px 0}
  .vs-sechead{grid-template-columns:1fr;gap:8px}
  .vs-sechead .more{justify-self:start}
  .vs-sechead h2{font-size:32px}
  .vs-worlds{grid-template-columns:1fr;gap:36px}
  .vs-logogrid{grid-template-columns:repeat(3,1fr)}
  .vs-logogrid .cell{height:84px;padding:18px}
  .vs-thisis{grid-template-columns:1fr;gap:28px}
  .vs-thisis h2{font-size:34px}
  .vs-cats{grid-template-columns:repeat(2,1fr);gap:18px}
  .vs-cat:last-child{grid-column:1/-1}
  .vs-services .grid{grid-template-columns:1fr}
  .vs-show{grid-template-columns:1fr;gap:32px}
  .vs-show .info h3{font-size:27px}
  .vs-show .row{grid-template-columns:1fr;gap:2px}
  .vs-style{grid-template-columns:1fr}
  .vs-style .pic{min-height:300px}
  .vs-style .txt{padding:36px 26px}
  .vs-style h2{font-size:30px}
  .vs-feat{grid-template-columns:1fr}
  .vs-feat div+div{border-left:none;border-top:1px solid #E3DDD2}
  .vs-insta{gap:8px;grid-template-columns:repeat(2,1fr)}
}
/* ===== ENDE KUSTOM STUDIO STARTSEITE ===== */