/*
Theme Name: powershape
Theme URI: https://powershape.ch
Author: Walia Solutions
Author URI: https://walia-solutions.ch
Description: Locked-in Theme für powershape – EMS Training Studio Uster. Design fix, Inhalte im Backend editierbar.
Version: 1.8.1
Requires PHP: 8.0
Text Domain: powershape
*/

/* ---------- Tokens ---------- */
:root{
  --c-bg:#fff;--c-text:#1c1c1c;--c-text-2:#5c5c5c;--c-muted:#f5f5f4;--c-line:#e6e6e4;
  --c-dark:#141414;--c-accent:#dd4444;--c-on-dark:#fff;
  --f-head:'Montserrat',Arial,sans-serif;--f-body:'Roboto',Arial,sans-serif;
  --w:1280px;--w-text:70ch;--gap:24px;--r:8px;--r-sm:6px;
  --sp:clamp(3.5rem,8vw,7rem);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--c-bg);color:var(--c-text);font:400 1.0625rem/1.7 var(--f-body)}
img,video{max-width:100%;height:auto;display:block}
a{color:var(--c-accent);text-decoration:none;transition:color .15s,opacity .15s}
a:hover{text-decoration:underline}
h1,h2,h3,h4,h5{font-family:var(--f-head);font-weight:700;line-height:1.15;letter-spacing:-.015em;margin:0 0 .6em;color:var(--c-text)}
h1{font-size:clamp(2.2rem,4.5vw,3.4rem)}h2{font-size:clamp(1.75rem,3.2vw,2.5rem)}h3{font-size:clamp(1.3rem,2vw,1.6rem)}h4{font-size:1.2rem}h5{font-size:1rem}
p,ul,ol{margin:0 0 1.25em}
strong{font-weight:600}
.accent-color,.accent{color:var(--c-accent)}
.wrap{width:min(var(--w),100% - 2*var(--gap));margin-inline:auto}
.wrap--text{width:min(var(--w-text),100% - 2*var(--gap))}
.section{padding:var(--sp) 0}
.section--muted{background:var(--c-muted)}
.skip-link{position:absolute;left:-999px;top:0}.skip-link:focus{left:0;background:#fff;padding:.5rem 1rem;z-index:99}
:focus-visible{outline:3px solid var(--c-accent);outline-offset:3px}

/* ---------- Buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5em;padding:.9em 1.7em;border:2px solid var(--c-accent);border-radius:var(--r-sm);background:var(--c-accent);color:#fff;font:600 .95rem/1.2 var(--f-head);cursor:pointer;transition:background .15s,border-color .15s,color .15s}
.btn:hover{background:#c43838;border-color:#c43838;text-decoration:none;color:#fff}
.btn--ghost{background:transparent;color:inherit;border-color:currentColor}
.btn--ghost:hover{background:var(--c-accent);border-color:var(--c-accent);color:#fff}
.btn-row{display:flex;flex-wrap:wrap;gap:.9rem;margin-top:1.75rem}

/* ---------- Header ---------- */
.site-header{background:var(--c-bg);position:sticky;top:0;z-index:50;box-shadow:0 1px 0 var(--c-line)}
.site-header .wrap{display:flex;align-items:center;justify-content:space-between;gap:var(--gap);min-height:88px}
.site-logo{flex:none}
.custom-logo{height:44px;width:auto;max-width:none;object-fit:contain}
.nav-toggle{display:none;background:none;border:0;padding:.5rem;cursor:pointer;z-index:2}
.nav-toggle span{display:block;width:26px;height:2px;background:var(--c-text);margin:6px 0;transition:transform .25s,opacity .25s}
.nav-toggle[aria-expanded=true] span:nth-child(1){transform:translateY(8px) rotate(45deg)}
.nav-toggle[aria-expanded=true] span:nth-child(2){opacity:0}
.nav-toggle[aria-expanded=true] span:nth-child(3){transform:translateY(-8px) rotate(-45deg)}
.nav{min-width:0}
.nav ul{list-style:none;margin:0;padding:0;display:flex;gap:clamp(1rem,2vw,2rem);align-items:center;white-space:nowrap}
.nav a{position:relative;display:inline-block;padding:.4rem 0;color:var(--c-text);font:500 .95rem var(--f-head)}
.nav a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--c-accent);transform:scaleX(0);transform-origin:left;transition:transform .2s}
.nav a:hover,.nav .current-menu-item>a{text-decoration:none}
.nav a:hover::after,.nav .current-menu-item>a::after{transform:scaleX(1)}
.nav .menu-item-btn>a{background:var(--c-accent);color:#fff;border-radius:var(--r-sm);padding:.7em 1.4em;font-weight:600}
.nav .menu-item-btn>a::after{display:none}
.nav .menu-item-btn>a:hover{background:#c43838}
@media(max-width:1200px){
  .nav-toggle{display:block}
  .nav{display:none;position:fixed;inset:0;background:var(--c-bg);padding:7rem var(--gap) 2rem;overflow:auto}
  .nav.is-open{display:block}
  .nav ul{flex-direction:column;align-items:stretch;gap:0;white-space:normal}
  .nav li{border-bottom:1px solid var(--c-line)}
  .nav a{display:block;padding:1.1rem 0;font-size:1.25rem}
  .nav a::after{display:none}
  .nav .menu-item-btn{border:0}
  .nav .menu-item-btn>a{margin-top:1.5rem;text-align:center}
  body.nav-open{overflow:hidden}
}

/* ---------- Hero: Vollbild-Cover, Parallax, zentriert ---------- */
.hero{position:relative;display:grid;place-items:center;min-height:min(62svh,560px);padding:clamp(4rem,8vw,7rem) 0;background:var(--c-dark);color:var(--c-on-dark);overflow:hidden;isolation:isolate;text-align:center}
.hero--full{min-height:calc(100svh - 88px)}
.hero__bg{position:absolute;inset:-12% 0;width:100%;height:124%;object-fit:cover;object-position:center;z-index:-2;will-change:transform}
.hero::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(ellipse 70% 60% at 50% 45%,rgba(0,0,0,.2),rgba(0,0,0,.62) 78%),linear-gradient(180deg,rgba(0,0,0,.3),rgba(0,0,0,.55))}
.hero__body{display:grid;justify-items:center;gap:1rem;max-width:min(var(--w),100% - 2*var(--gap));animation:ps-rise .7s cubic-bezier(.2,.7,.2,1) both}
@keyframes ps-rise{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
.hero__kicker{margin:0;font:400 clamp(1rem,1.5vw,1.2rem)/1.4 var(--f-body);letter-spacing:.02em;opacity:.85}
.hero__title{color:inherit;font-size:clamp(2.2rem,4.5vw,3.6rem);font-weight:700;letter-spacing:-.025em;line-height:1.05;margin:0;max-width:20ch;text-wrap:balance}
.hero--full .hero__title{font-size:clamp(2.6rem,6.5vw,5.4rem);font-weight:800;max-width:16ch}
.hero__sub{font:400 clamp(1.05rem,1.6vw,1.3rem)/1.5 var(--f-body);margin:0;opacity:.9;max-width:52ch}
.hero .btn-row{justify-content:center;margin-top:1.25rem}
.hero .btn--ghost{border-color:rgba(255,255,255,.55)}
@media(prefers-reduced-motion:reduce){.hero__bg{inset:0;height:100%;transform:none!important}}

/* ---------- Content ---------- */
.cols{display:grid;gap:clamp(2rem,5vw,5rem);align-items:start}
@media(min-width:900px){.cols--aside{grid-template-columns:5fr 7fr;align-items:start}.cols__aside{position:sticky;top:112px}}
.cols__aside h2{margin:0;font-size:clamp(1.9rem,3vw,2.6rem);max-width:16ch}
.page-fig{margin:0}
.page-img{width:100%;height:auto;object-fit:cover;object-position:center top;border-radius:var(--r)}
.page-img__cap{margin-top:.75rem;font-size:.9rem;color:var(--c-text-2)}
@media(max-width:900px){.page-img{max-height:460px}}
.entry-content>*+*{margin-top:1.25em}
.entry-content>h2{margin-top:2.2em}.entry-content>h3,.entry-content>h4{margin-top:1.8em}
.entry-content .lead{font-size:clamp(1.15rem,1.7vw,1.35rem);line-height:1.55;color:var(--c-text)}
.entry-content .kontakt{margin:1.75rem 0}
.entry-content--wide>h2{margin-top:3.5rem}
.entry-content>:first-child{margin-top:0}
.entry-content>p,.entry-content>ul,.entry-content>ol,.entry-content>h3,.entry-content>h4{max-width:var(--w-text)}
.entry-content ul{padding-left:1.2em}
.entry-content .link::before{content:"» "}
.entry-content video{border-radius:var(--r)}
.entry-content .wp-video{max-width:100%!important;margin:2rem 0}
.entry-content .btn-row{margin-top:1.75rem}
.entry-content--wide>h2:first-child{margin-top:0}.entry-content--wide>h2{font-size:clamp(1.9rem,3vw,2.6rem)}
.entry-content--after{margin-top:var(--sp);padding-top:var(--sp);border-top:1px solid var(--c-line)}

/* ---------- Kontakt ---------- */
.kontakt{list-style:none;padding:0;margin:0;display:grid;gap:.8rem}
.kontakt li{display:flex;gap:.8rem;align-items:flex-start}
.kontakt svg{width:20px;height:20px;flex:none;margin-top:.3em;fill:var(--c-accent)}
.kontakt a{color:inherit}

/* ---------- Preise ---------- */
.preisgruppe+.preisgruppe{margin-top:3.5rem}
.preisgruppe>h3{margin-bottom:1.25rem}
.preise{display:grid;gap:var(--gap);grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}
.preise--compact{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.preis{position:relative;display:flex;flex-direction:column;gap:1rem;padding:1.75rem;background:var(--c-bg);border:1px solid var(--c-line);border-radius:var(--r);transition:transform .2s,box-shadow .2s}
.preis:hover{transform:translateY(-3px);box-shadow:0 12px 30px rgba(0,0,0,.08)}
.preis--beliebt{border-color:var(--c-accent);box-shadow:0 0 0 1px var(--c-accent)}
.preis__head h4{margin:0 0 .35em;font-size:1.15rem}
.preis__meta{color:var(--c-text-2);font-size:.95rem}
.preis__preis{font:700 1.9rem/1 var(--f-head);letter-spacing:-.02em;margin:.75rem 0 0}
.preis__badge{position:absolute;top:-.8rem;right:1.25rem;background:var(--c-accent);color:#fff;font:600 .72rem var(--f-head);text-transform:uppercase;letter-spacing:.06em;padding:.35em .75em;border-radius:999px}
.preis ul{margin:0;padding:0;list-style:none;display:grid;gap:.4rem;font-size:.95rem;border-top:1px solid var(--c-line);padding-top:1rem}
.preis ul li::before{content:"✓";color:var(--c-accent);font-weight:700;margin-right:.6em}
.preis--compact{padding:1.25rem 1.5rem}.preis--compact .preis__head{display:flex;justify-content:space-between;align-items:baseline;gap:1rem}
.preis--compact .preis__preis{margin:0;font-size:1.4rem}
.preis--compact .preis__head h4{margin:0;font-size:1rem}

/* Preisliste (Zeilen) */
.preisliste{border:1px solid var(--c-line);border-radius:var(--r);overflow:hidden;background:var(--c-bg)}
.preisliste__row{display:flex;justify-content:space-between;align-items:center;gap:1.5rem;padding:1.15rem 1.5rem}
.preisliste__row+.preisliste__row{border-top:1px solid var(--c-line)}
.preisliste__row{transition:background .15s}.preisliste__row:hover{background:var(--c-muted)}.preisliste__row.is-beliebt{background:var(--c-muted)}
.preisliste__row h4{margin:0;font-size:1.05rem;display:flex;align-items:center;gap:.6rem}
.preisliste__row .preis__badge{position:static;font-size:.65rem}
.preisliste__row .preis__meta{margin-top:.15rem;font-size:.9rem}
.preisliste__row .preis__preis{margin:0;font-size:1.35rem;white-space:nowrap}
@media(max-width:600px){.preisliste__row{padding:1rem 1.1rem}.preisliste__row .preis__preis{font-size:1.15rem}}

/* Tabs */
.tabs__nav{display:inline-flex;gap:.25rem;padding:.3rem;background:var(--c-muted);border-radius:999px;margin-bottom:2rem}
.tabs__tab{border:0;background:transparent;padding:.7em 1.5em;border-radius:999px;font:600 .95rem var(--f-head);color:var(--c-text-2);cursor:pointer;transition:background .15s,color .15s}
.tabs__tab:hover{color:var(--c-text)}
.tabs__tab[aria-selected=true]{background:var(--c-bg);color:var(--c-text);box-shadow:0 1px 3px rgba(0,0,0,.12)}
.tabs__panel>*+*{margin-top:1.5rem}
.tabs__panel>p{max-width:var(--w-text)}
.tabs__panel .preise{grid-template-columns:minmax(0,520px)}
.entry-content--wide .tabs__panel>h3{margin-top:0}

/* ---------- Videos ---------- */
.videos{display:grid;gap:var(--gap);grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}
.video{position:relative;aspect-ratio:16/9;background:#000;border-radius:var(--r);overflow:hidden;cursor:pointer;border:0;padding:0}
.video img{transition:transform .4s}.video:hover img{transform:scale(1.04)}
.video img,.video iframe{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.video::after{content:"";position:absolute;left:50%;top:50%;width:64px;height:64px;translate:-50% -50%;border-radius:50%;background:var(--c-accent) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23fff'%3E%3Cpath d='M8 5v14l11-7z'/%3E%3C/svg%3E") center/32px no-repeat;transition:transform .15s}
.video:hover::after{transform:scale(1.08)}
.video.is-playing::after{display:none}

/* ---------- Formulare ---------- */
.form{display:grid;gap:1.1rem;max-width:600px}
.form label{display:grid;gap:.4rem;font:500 .9rem var(--f-head)}
.form input,.form textarea{width:100%;padding:.85em 1em;border:1px solid #c9c9c6;border-radius:var(--r-sm);font:inherit;background:#fff;color:var(--c-text)}
.form input:focus,.form textarea:focus{border-color:var(--c-accent);outline:none;box-shadow:0 0 0 3px rgba(221,68,68,.15)}
.form textarea{min-height:130px;resize:vertical}
.form .hp{position:absolute;left:-9999px}
.form .btn{justify-self:start}
.form__msg{padding:1rem 1.25rem;border-radius:var(--r-sm);background:var(--c-muted)}
.form__msg--ok{background:#e8f5ec;color:#1c5f2c}.form__msg--err{background:#fdecec;color:#8a1c1c}
dialog.modal[open]{animation:ps-rise .3s ease both}
dialog.modal{border:0;border-radius:var(--r);padding:2.25rem;max-width:min(640px,92vw);width:100%;box-shadow:0 30px 80px rgba(0,0,0,.35)}
dialog.modal::backdrop{background:rgba(0,0,0,.6)}
.modal__close{position:absolute;right:.75rem;top:.75rem;border:0;background:none;font-size:1.8rem;line-height:1;cursor:pointer}

/* ---------- CTA ---------- */
.cta{background:var(--c-muted);color:var(--c-text);padding:clamp(2.5rem,5vw,4rem) 0;border-top:1px solid var(--c-line)}
.cta .wrap{display:flex;flex-wrap:wrap;gap:1.25rem 2rem;align-items:center;justify-content:space-between}
.cta__text{margin:0;font:600 clamp(1.15rem,2vw,1.5rem)/1.3 var(--f-head);letter-spacing:-.01em;max-width:32ch}

/* ---------- Footer ---------- */
.site-footer{background:var(--c-dark);color:var(--c-on-dark);padding:3.5rem 0 2rem;font-size:.95rem}
.zert{display:flex;flex-wrap:wrap;gap:2rem 3rem;align-items:center;justify-content:space-between;padding-bottom:3rem;margin-bottom:3rem;border-bottom:1px solid rgba(255,255,255,.12)}
.zert__titel{margin:0 0 .35rem;font:800 clamp(1.5rem,3vw,2.4rem)/1.1 var(--f-head);letter-spacing:-.02em}
.zert__text{margin:0;opacity:.75;max-width:52ch}
.zert__logos{display:flex;align-items:center;gap:2.5rem;flex-wrap:wrap;margin-left:auto}
.zert__logo{height:96px;width:auto;max-width:none}
.zert__chip{display:inline-flex;align-items:center;background:#fff;border-radius:var(--r-sm);padding:.6rem 1rem}
.zert__chip .zert__logo{height:40px}
@media(max-width:600px){.zert__logo{height:56px}.zert__chip .zert__logo{height:28px}}
.site-footer .wrap{display:grid;gap:2rem}
@media(min-width:800px){.site-footer .wrap{grid-template-columns:1.2fr 1fr 1fr;align-items:start}}
.site-footer .custom-logo{filter:brightness(0) invert(1)}
.site-footer a{color:inherit}
.site-footer ul{list-style:none;margin:0;padding:0;display:grid;gap:.5rem}
.site-footer .kontakt svg{fill:var(--c-on-dark)}
.footer-bottom{grid-column:1/-1;border-top:1px solid rgba(255,255,255,.12);padding-top:1.25rem;font-size:.85rem;opacity:.7;display:flex;flex-wrap:wrap;gap:1rem 2rem;justify-content:space-between}

/* ---------- Cookie-Hinweis ---------- */
.consent{position:fixed;left:var(--gap);bottom:var(--gap);z-index:60;max-width:420px;background:var(--c-bg);color:var(--c-text);padding:1.5rem;border-radius:var(--r);box-shadow:0 10px 40px rgba(0,0,0,.25);font-size:.95rem}
.consent p{margin:0}.consent .btn-row{margin-top:1rem}.consent .btn{padding:.6em 1.2em}
@media(max-width:480px){.consent{left:0;right:0;bottom:0;max-width:none;border-radius:0}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important;scroll-behavior:auto!important}}
