/*
Theme Name:        People of Determination
Theme URI:         https://www.pod-association.ch
Author:            People of Determination
Author URI:        https://www.pod-association.ch
Description:       Zweisprachige (DE/EN) Ein-Seiten-Website für den Verein People of Determination. Barrierefrei, WCAG-AA-konforme Kontraste, responsive.
Version:           1.0.1
Requires at least: 5.8
Requires PHP:      7.4
Tested up to:      6.6
License:           GPL v2 or later
License URI:       https://www.gnu.org/licenses/gpl-2.0.html
Text Domain:       pod-association-theme
*/


  :root{
    --ink:#0B1F4D;
    --bg:#FFFFFF;
    --bg-warm:#EAF1FF;
    --panel:#FFFFFF;
    --blue:#0243DF;
    --blue-deep:#0233A8;
    --blue-light:#9DBBFF;
    --purple:#6D28D9;
    --purple-deep:#5B21B6;
    --sky:#1D3E8F;
    --line:#C3D5F5;
    --ink-soft:#3B4A6B;
    --focus:#0233A8;
  }

  .pod-scope, .pod-scope *{box-sizing:border-box;}
  .pod-scope{scroll-behavior:smooth;}
  @media (prefers-reduced-motion: reduce){
    .pod-scope{scroll-behavior:auto;}
    .pod-scope *{animation-duration:0.001ms !important; animation-iteration-count:1 !important; transition-duration:0.001ms !important;}
  }

  .pod-scope{
    color-scheme: light;
    background:var(--bg);
    color:var(--ink);
    font-family:'Public Sans', sans-serif;
    line-height:1.6;
    -webkit-font-smoothing:antialiased;
  }

  .pod-scope h1, .pod-scope h2, .pod-scope h3{
    font-family:'Fraunces', serif;
    font-weight:600;
    line-height:1.12;
    margin:0 0 0.4em;
    letter-spacing:-0.01em;
  }

  .pod-scope a{color:inherit;}

  .pod-skip-link{
    position:absolute;
    left:-999px;
    top:auto;
    background:var(--ink);
    color:#fff;
    padding:12px 20px;
    border-radius:8px;
    z-index:100;
  }
  .pod-skip-link:focus{
    left:16px;
    top:16px;
  }

  .pod-scope a:focus-visible, .pod-scope button:focus-visible, .pod-scope input:focus-visible, .pod-scope textarea:focus-visible{
    outline:3px solid var(--focus);
    outline-offset:3px;
    border-radius:4px;
  }

  .pod-wrap{
    max-width:1080px;
    margin:0 auto;
    padding:0 28px;
  }

  .pod-eyebrow{
    font-family:'JetBrains Mono', monospace;
    font-size:0.78rem;
    letter-spacing:0.12em;
    text-transform:uppercase;
    color:var(--sky);
    font-weight:500;
    display:inline-flex;
    align-items:center;
    gap:10px;
  }
  .pod-eyebrow::before{
    content:"";
    width:22px;
    height:2px;
    background:var(--blue);
    display:inline-block;
  }
  .pod-eyebrow-purple{color:var(--purple);}
  .pod-eyebrow-purple::before{background:var(--purple);}

  /* HEADER */
  .pod-scope header{
    position:sticky;
    top:0;
    z-index:20;
    background:rgba(255,255,255,0.88);
    backdrop-filter:blur(10px);
    border-bottom:1px solid var(--line);
  }
  .pod-nav{
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:18px 0;
    gap:20px;
  }
  .pod-brand{
    display:flex;
    align-items:center;
    gap:12px;
    flex-shrink:0;
  }
  .pod-brand img{
    height:42px;
    width:auto;
    display:block;
  }
  .pod-brand-text{
    display:flex;
    flex-direction:column;
    line-height:1.2;
  }
  .pod-brand-name{
    font-family:'Fraunces', serif;
    font-weight:700;
    font-size:1.05rem;
    color:var(--ink);
  }
  .pod-brand small{
    font-family:'JetBrains Mono', monospace;
    font-weight:400;
    font-size:0.65rem;
    color:var(--ink-soft);
    letter-spacing:0.06em;
  }
  .pod-nav-right{
    display:flex;
    align-items:center;
    gap:24px;
  }
  .pod-scope nav ul{
    list-style:none;
    display:flex;
    gap:28px;
    margin:0;
    padding:0;
    font-size:0.95rem;
    font-weight:500;
  }
  .pod-scope nav ul a{
    text-decoration:none;
    padding:6px 2px;
    border-bottom:2px solid transparent;
    transition:border-color 0.15s ease;
  }
  .pod-scope nav ul a:hover{border-color:var(--blue);}

  .pod-nav-toggle{
    display:none;
    align-items:center;
    justify-content:center;
    width:42px;
    height:42px;
    border:1px solid var(--ink);
    border-radius:10px;
    background:transparent;
    cursor:pointer;
    flex-shrink:0;
  }
  .pod-nav-toggle span{
    display:block;
    width:18px;
    height:2px;
    background:var(--ink);
    position:relative;
  }
  .pod-nav-toggle span::before, .pod-nav-toggle span::after{
    content:"";
    position:absolute;
    left:0;
    width:18px;
    height:2px;
    background:var(--ink);
    transition:transform 0.2s ease;
  }
  .pod-nav-toggle span::before{top:-6px;}
  .pod-nav-toggle span::after{top:6px;}
  .pod-nav-toggle[aria-expanded="true"] span{background:transparent;}
  .pod-nav-toggle[aria-expanded="true"] span::before{transform:translateY(6px) rotate(45deg);}
  .pod-nav-toggle[aria-expanded="true"] span::after{transform:translateY(-6px) rotate(-45deg);}

  @media (max-width:720px){
    .pod-nav-toggle{display:flex;}
    .pod-scope nav[aria-label="Hauptnavigation"]{
      position:fixed;
      top:73px;
      left:0;
      right:0;
      background:var(--bg);
      border-bottom:1px solid var(--line);
      max-height:0;
      overflow:hidden;
      transition:max-height 0.25s ease;
    }
    .pod-scope nav[aria-label="Hauptnavigation"].pod-open{max-height:280px;}
    .pod-scope nav ul{
      display:flex;
      flex-direction:column;
      gap:0;
      padding:8px 28px 20px;
    }
    .pod-scope nav ul li{border-bottom:1px solid var(--line);}
    .pod-scope nav ul a{display:block; padding:14px 0;}
  }

  .pod-lang-switch{
    display:flex;
    border:1px solid var(--ink);
    border-radius:100px;
    overflow:hidden;
    flex-shrink:0;
  }
  .pod-lang-switch button{
    font-family:'JetBrains Mono', monospace;
    font-size:0.75rem;
    font-weight:500;
    letter-spacing:0.06em;
    border:none;
    background:transparent;
    color:var(--ink);
    padding:8px 14px;
    cursor:pointer;
    transition:background 0.15s ease, color 0.15s ease;
  }
  .pod-lang-switch button.pod-active{
    background:var(--ink);
    color:#fff;
  }
  .pod-lang-switch button:not(.pod-active):hover{
    background:var(--bg-warm);
  }

  /* HERO */
  .pod-hero{
    padding:96px 0 80px;
    position:relative;
    overflow:hidden;
  }
  .pod-hero .pod-wrap{
    display:grid;
    grid-template-columns:1.15fr 0.85fr;
    gap:48px;
    align-items:center;
  }
  @media (max-width:860px){
    .pod-hero .pod-wrap{grid-template-columns:1fr;}
  }
  .pod-hero h1{
    font-size:clamp(2.3rem, 4.6vw, 3.6rem);
    max-width:16ch;
  }
  .pod-hero h1 em{
    font-style:normal;
    color:var(--blue);
  }
  .pod-hero p.pod-lead{
    font-size:1.12rem;
    max-width:46ch;
    color:var(--ink-soft);
    margin:20px 0 32px;
  }
  .pod-cta-row{display:flex;gap:14px;flex-wrap:wrap;}
  .pod-btn{
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:14px 26px;
    border-radius:100px;
    font-weight:600;
    font-size:0.95rem;
    text-decoration:none;
    border:2px solid transparent;
    transition:transform 0.15s ease, background 0.15s ease;
  }
  .pod-btn-primary{
    background:var(--ink) !important;
    color:#fff !important;
  }
  .pod-btn-primary:hover{transform:translateY(-2px); background:#081430 !important;}
  .pod-btn-secondary{
    border-color:var(--ink) !important;
    color:var(--ink) !important;
  }
  .pod-btn-secondary:hover{transform:translateY(-2px); background:var(--panel) !important;}

  .pod-hero-graphic{position:relative;}
  .pod-hero-graphic svg{width:100%; height:auto; display:block;}

  .pod-scope section{padding:70px 0;}
  .pod-section-head{max-width:640px; margin-bottom:48px;}
  .pod-section-head h2{font-size:clamp(1.7rem, 3vw, 2.3rem);}
  .pod-section-head p{color:var(--ink-soft); font-size:1.05rem;}

  .pod-route-section{
    background:var(--bg-warm);
    border-top:1px solid var(--line);
    border-bottom:1px solid var(--line);
  }
  .pod-route{
    position:relative;
    display:grid;
    grid-template-columns:56px 1fr;
    column-gap:28px;
  }
  .pod-route-line-col{
    grid-column:1;
    position:relative;
  }
  .pod-route-line-col svg{
    position:absolute;
    top:0;
    left:50%;
    transform:translateX(-50%);
    width:4px;
    height:100%;
    overflow:visible;
  }
  .pod-route-path{
    fill:none;
    stroke:var(--line);
    stroke-width:4;
  }
  .pod-route-path-draw{
    fill:none;
    stroke:var(--blue);
    stroke-width:4;
    stroke-dasharray:2000;
    stroke-dashoffset:2000;
    transition:stroke-dashoffset 1.4s ease;
  }

  .pod-stop{
    position:relative;
    padding-bottom:56px;
  }
  .pod-stop:last-child{padding-bottom:0;}
  .pod-stop-marker{
    position:absolute;
    left:50%;
    top:2px;
    transform:translateX(-50%);
    width:16px;
    height:16px;
    border-radius:50%;
    background:var(--panel);
    border:3px solid var(--sky);
    z-index:2;
    transition:background 0.4s ease, border-color 0.4s ease;
  }
  .pod-stop.pod-visible .pod-stop-marker{
    background:var(--blue);
    border-color:var(--blue);
  }
  .pod-stop:nth-child(2n).pod-visible .pod-stop-marker{
    background:var(--purple);
    border-color:var(--purple);
  }
  .pod-stop-card{
    background:var(--panel);
    border:1px solid var(--line);
    border-radius:14px;
    padding:22px 26px;
    grid-column:2;
  }
  .pod-stop-card h3{
    font-size:1.15rem;
    margin-bottom:6px;
  }
  .pod-stop-card p{
    margin:0;
    color:var(--ink-soft);
    font-size:0.98rem;
  }
  .pod-stop-index{
    font-family:'JetBrains Mono', monospace;
    font-size:0.75rem;
    color:var(--sky);
    display:block;
    margin-bottom:6px;
    letter-spacing:0.06em;
  }

  .pod-about-grid{
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:24px;
  }
  @media (max-width:780px){
    .pod-about-grid{grid-template-columns:1fr;}
  }
  .pod-fact{
    border-top:2px solid var(--ink);
    padding-top:16px;
  }
  .pod-fact:nth-child(2){border-top-color:var(--purple);}
  .pod-fact:nth-child(3){border-top-color:var(--blue);}
  .pod-fact h3{
    font-size:1rem;
    font-family:'JetBrains Mono', monospace;
    text-transform:uppercase;
    letter-spacing:0.05em;
    font-weight:500;
    color:var(--sky);
    margin-bottom:10px;
  }
  .pod-fact p{margin:0; color:var(--ink-soft);}

  .pod-join{
    background:var(--ink);
    color:#F4F6F2;
  }
  .pod-join .pod-section-head p{color:#C7D3F0;}
  .pod-join-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:40px;
  }
  @media (max-width:780px){
    .pod-join-grid{grid-template-columns:1fr;}
  }
  .pod-join-card{
    background:rgba(255,255,255,0.04);
    border:1px solid rgba(255,255,255,0.16);
    border-radius:14px;
    padding:28px;
  }
  .pod-join-card h3{color:#fff; font-size:1.2rem;}
  .pod-join-card p{color:#C7D3F0;}
  .pod-join-card .pod-btn-primary{background:var(--blue) !important; color:#FFFFFF !important; margin-top:14px;}
  .pod-join-card .pod-btn-primary:hover{background:var(--blue-deep) !important;}

  .pod-contact-list{list-style:none; padding:0; margin:16px 0 0; font-size:0.98rem;}
  .pod-contact-list li{
    display:flex;
    gap:10px;
    padding:10px 0;
    border-bottom:1px solid rgba(255,255,255,0.12);
    color:#D8E2FB;
  }
  .pod-contact-list span{
    font-family:'JetBrains Mono', monospace;
    font-size:0.75rem;
    color:var(--blue);
    min-width:78px;
  }

  .pod-note{
    font-size:0.85rem;
    color:#8FA0C9;
    margin-top:18px;
    border-left:3px solid var(--blue);
    padding-left:12px;
  }

  .pod-contact-form{
    margin-top:24px;
    padding-top:20px;
    border-top:1px solid rgba(255,255,255,0.16);
  }
  .pod-contact-form .pod-field{
    margin-bottom:14px;
    display:flex;
    flex-direction:column;
    gap:6px;
  }
  .pod-contact-form label{
    font-size:0.85rem;
    font-weight:500;
    color:#D8E2FB;
  }
  .pod-contact-form input,
  .pod-contact-form textarea{
    background:rgba(255,255,255,0.06);
    border:1px solid rgba(255,255,255,0.24);
    border-radius:8px;
    padding:10px 12px;
    color:#fff;
    font-family:'Public Sans', sans-serif;
    font-size:0.95rem;
    resize:vertical;
  }
  .pod-contact-form input::placeholder,
  .pod-contact-form textarea::placeholder{color:#8FA39A;}
  .pod-contact-form button{
    border:none;
    cursor:pointer;
  }
  .pod-contact-form .pod-note{margin-top:12px; margin-bottom:0;}
  .pod-contact-form .pod-field.pod-invalid input,
  .pod-contact-form .pod-field.pod-invalid textarea{
    border-color:#E27C6B;
  }

  .pod-scope footer{
    padding:36px 0;
    border-top:1px solid var(--line);
  }
  .pod-footer-row{
    display:flex;
    justify-content:space-between;
    align-items:center;
    flex-wrap:wrap;
    gap:12px;
    font-size:0.85rem;
    color:var(--ink-soft);
  }

  .pod-reveal{
    opacity:0;
    transform:translateY(14px);
    transition:opacity 0.6s ease, transform 0.6s ease;
  }
  .pod-reveal.pod-in{opacity:1; transform:translateY(0);}