:root{
    --teal-900:#0f2e2b;
    --teal-700:#155e56;
    --teal-600:#1a7a70;
    --teal-500:#20998c;
    --teal-100:#e4f5f2;
    --coral:#ff6f59;
    --coral-dark:#e8543f;
    --amber:#f5a623;
    --amber-dark:#d6890a;
    --red:#e34b4b;
    --red-dark:#c53737;
    --green:#3bab72;
    --green-dark:#2c8a5a;
    --ink:#1c2b29;
    --ink-soft:#4a5c59;
    --paper:#fbfaf7;
    --card:#ffffff;
    --line:#e4e0d8;
    --shadow: 0 10px 30px rgba(15,46,43,0.08);
    --radius: 20px;
    --radius-sm: 12px;
  }
  *{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{
    margin:0;
    font-family:'Inter',system-ui,sans-serif;
    color:var(--ink);
    background:var(--paper);
    line-height:1.6;
  }
  h1,h2,h3,h4{
    font-family:'Poppins',system-ui,sans-serif;
    line-height:1.2;
    margin:0 0 .5em 0;
  }
  p{margin:0 0 1em 0;}
  a{color:var(--teal-600);}
  img{max-width:100%;}
  .wrap{max-width:920px;margin:0 auto;padding:0 20px;}
  .wrap-narrow{max-width:720px;margin:0 auto;padding:0 20px;}

  /* Quick exit */
  #quick-exit{
    position:fixed; top:14px; right:14px; z-index:9999;
    background:var(--ink); color:#fff; border:none;
    padding:10px 16px; border-radius:999px; font-family:'Inter',sans-serif;
    font-weight:600; font-size:13px; cursor:pointer; box-shadow:0 6px 18px rgba(0,0,0,0.25);
    display:flex; align-items:center; gap:6px;
    opacity:0.92;
  }
  #quick-exit:hover{opacity:1; background:#000;}
  .exit-note{
    position:fixed; top:56px; right:14px; z-index:9998; max-width:220px;
    background:#fff; border:1px solid var(--line); border-radius:10px; padding:10px 12px;
    font-size:11.5px; color:var(--ink-soft); box-shadow:var(--shadow); display:none;
  }
  #quick-exit:hover + .exit-note, .exit-note.show{display:block;}
  @media (max-width:640px){
    #quick-exit{top:auto; bottom:16px; right:14px;}
    .exit-note{top:auto; bottom:60px; right:14px;}
  }

  /* Nav */
  nav{
    position:sticky; top:0; z-index:500; background:rgba(251,250,247,0.92);
    backdrop-filter:blur(6px); border-bottom:1px solid var(--line);
  }
  nav .navwrap{
    max-width:920px; margin:0 auto; padding:14px 20px; display:flex;
    align-items:center; justify-content:space-between; gap:12px;
  }
  .brand{display:flex; align-items:center; gap:9px; font-family:'Poppins'; font-weight:700; color:var(--teal-900); font-size:17px; text-decoration:none;}
  .brand-dot{width:11px; height:11px; border-radius:50%; background:var(--coral);}
  nav ul{list-style:none; display:flex; gap:22px; margin:0; padding:0;}
  nav a.navlink{color:var(--ink-soft); text-decoration:none; font-weight:600; font-size:14.5px;}
  nav a.navlink:hover{color:var(--teal-700);}
  #nav-toggle{display:none; background:none; border:1px solid var(--line); border-radius:8px; padding:8px 10px; cursor:pointer;}
  @media (max-width:640px){
    nav ul{
      display:none; position:absolute; top:100%; left:0; right:0; flex-direction:column; gap:0;
      background:#fff; border-bottom:1px solid var(--line); padding:8px 20px 14px;
    }
    nav ul.open{display:flex;}
    nav ul li{border-top:1px solid var(--line);}
    nav ul li:first-child{border-top:none;}
    nav a.navlink{display:block; padding:13px 2px;}
    #nav-toggle{display:block;}
  }

  /* Language switcher */
  .lang-switch{display:flex; align-items:center; gap:4px; margin-left:6px;}
  .lang-switch a{
    color:var(--ink-soft); text-decoration:none; font-weight:700; font-size:12.5px;
    padding:5px 9px; border-radius:999px; border:1px solid transparent;
  }
  .lang-switch a:hover{background:var(--teal-100); color:var(--teal-700);}
  .lang-switch a.active{background:var(--teal-600); color:#fff;}
  @media (max-width:640px){
    .lang-switch{margin:10px 2px 4px;}
  }

  /* Hero */
  header.hero{
    padding:64px 0 56px; background:
      radial-gradient(1000px 500px at 85% -10%, var(--teal-100), transparent 60%);
  }
  .eyebrow{
    display:inline-block; background:var(--teal-100); color:var(--teal-700);
    font-weight:700; font-size:12.5px; letter-spacing:.04em; text-transform:uppercase;
    padding:6px 14px; border-radius:999px; margin-bottom:18px;
  }
  h1.title{font-size:clamp(32px,5vw,50px); color:var(--teal-900); max-width:12ch;}
  .lede{font-size:18px; color:var(--ink-soft); max-width:56ch;}
  .cta-row{display:flex; gap:14px; flex-wrap:wrap; margin-top:26px;}
  .btn{
    display:inline-flex; align-items:center; gap:8px; font-weight:700; font-size:15.5px;
    padding:14px 26px; border-radius:999px; text-decoration:none; cursor:pointer; border:2px solid transparent;
    font-family:'Inter'; transition:transform .15s ease;
  }
  .btn:active{transform:scale(.97);}
  .btn-primary{background:var(--coral); color:#fff;}
  .btn-primary:hover{background:var(--coral-dark);}
  .btn-ghost{background:transparent; color:var(--teal-700); border-color:var(--teal-600);}
  .btn-ghost:hover{background:var(--teal-100);}
  .btn-wide{width:100%; justify-content:center;}
  .btn[disabled]{opacity:.4; cursor:not-allowed;}

  .trust-row{display:flex; gap:22px; flex-wrap:wrap; margin-top:36px; font-size:13.5px; color:var(--ink-soft);}
  .trust-item{display:flex; align-items:center; gap:8px;}
  .trust-item svg{flex:none;}

  section{padding:64px 0;}
  section.alt{background:var(--teal-900); color:#fff;}
  section.alt h2, section.alt h3{color:#fff;}
  section.alt .sub{color:#c9ddd8;}
  .section-head{max-width:640px; margin-bottom:38px;}
  .kicker{color:var(--coral); font-weight:700; font-size:12.5px; text-transform:uppercase; letter-spacing:.06em;}
  .sub{color:var(--ink-soft); font-size:16px;}

  /* Intro cards */
  .grid2{display:grid; grid-template-columns:repeat(2,1fr); gap:18px;}
  .grid3{display:grid; grid-template-columns:repeat(3,1fr); gap:18px;}
  @media (max-width:720px){ .grid2,.grid3{grid-template-columns:1fr;} }
  .info-card{background:var(--card); border:1px solid var(--line); border-radius:var(--radius); padding:24px; box-shadow:var(--shadow);}
  .info-card h4{font-size:16.5px; color:var(--teal-900);}
  .info-card p{color:var(--ink-soft); font-size:14.5px; margin:0;}

  /* BITE categories */
  .bite-cat{
    background:var(--card); border:1px solid var(--line); border-radius:var(--radius);
    margin-bottom:16px; overflow:hidden; box-shadow:var(--shadow);
  }
  .bite-head{
    display:flex; align-items:center; gap:16px; padding:22px 24px; cursor:pointer; user-select:none;
    background:#fff;
  }
  .bite-num{
    flex:none; width:44px; height:44px; border-radius:12px; display:flex; align-items:center; justify-content:center;
    font-family:'Poppins'; font-weight:700; font-size:18px; color:#fff;
  }
  .bite-head h3{margin:0; font-size:18px; color:var(--teal-900);}
  .bite-head .tag{font-size:12.5px; color:var(--ink-soft); font-weight:500;}
  .bite-chevron{margin-left:auto; transition:transform .2s ease; color:var(--ink-soft); flex:none;}
  .bite-cat.open .bite-chevron{transform:rotate(180deg);}
  .bite-body{max-height:0; overflow:hidden; transition:max-height .3s ease;}
  .bite-body-inner{padding:0 24px 24px 24px; color:var(--ink-soft); font-size:15px;}
  .bite-body-inner ul{margin:10px 0; padding-left:20px;}
  .bite-body-inner li{margin-bottom:6px;}
  .example-toggle{
    margin-top:14px; display:inline-flex; align-items:center; gap:7px; background:var(--teal-100);
    color:var(--teal-700); border:none; padding:9px 15px; border-radius:999px; font-weight:600; font-size:13px; cursor:pointer;
  }
  .example-box{
    display:none; margin-top:14px; background:#faf6ee; border-left:4px solid var(--amber); border-radius:8px;
    padding:16px 18px; font-size:14px; color:var(--ink);
  }
  .example-box.show{display:block;}
  .example-box blockquote{
    margin:8px 0; padding-left:12px; border-left:3px solid var(--line); font-style:italic; color:var(--ink-soft); font-size:13.5px;
  }
  .c-behavior{background:var(--teal-600);}
  .c-info{background:var(--amber-dark);}
  .c-thought{background:var(--coral-dark);}
  .c-emotion{background:#8e5bc9;}

  /* Other groups strip */
  .chips{display:flex; flex-wrap:wrap; gap:10px; margin-top:18px;}
  .chip{background:rgba(255,255,255,0.08); border:1px solid rgba(255,255,255,0.18); color:#fff; padding:8px 16px; border-radius:999px; font-size:13.5px; font-weight:600;}

  /* Quiz */
  .quiz-card{
    background:var(--card); border:1px solid var(--line); border-radius:var(--radius);
    box-shadow:var(--shadow); padding:34px; max-width:680px; margin:0 auto;
  }
  .quiz-intro-list{margin:18px 0; padding-left:0; list-style:none;}
  .quiz-intro-list li{display:flex; gap:10px; align-items:flex-start; margin-bottom:12px; font-size:14.5px; color:var(--ink-soft);}
  .quiz-intro-list li svg{flex:none; margin-top:2px; color:var(--teal-600);}
  .progress-wrap{margin-bottom:22px;}
  .progress-label{display:flex; justify-content:space-between; font-size:12.5px; color:var(--ink-soft); font-weight:600; margin-bottom:8px;}
  .progress-bar{height:8px; background:var(--teal-100); border-radius:999px; overflow:hidden;}
  .progress-fill{height:100%; background:linear-gradient(90deg,var(--teal-500),var(--coral)); width:0%; transition:width .3s ease; border-radius:999px;}
  .q-cat{display:inline-block; font-size:11.5px; font-weight:700; text-transform:uppercase; letter-spacing:.04em; padding:5px 11px; border-radius:999px; margin-bottom:14px; color:#fff;}
  .q-text{font-size:20px; font-family:'Poppins'; font-weight:600; color:var(--teal-900); margin-bottom:22px;}
  .answers{display:flex; flex-direction:column; gap:10px;}
  .answer-btn{
    text-align:left; background:#fff; border:2px solid var(--line); border-radius:var(--radius-sm);
    padding:14px 18px; font-size:15px; font-weight:600; color:var(--ink); cursor:pointer; font-family:'Inter';
  }
  .answer-btn:hover{border-color:var(--teal-500); background:var(--teal-100);}
  .answer-btn.selected{border-color:var(--teal-600); background:var(--teal-100); color:var(--teal-900);}
  .quiz-nav{display:flex; justify-content:space-between; margin-top:26px; gap:12px;}
  .quiz-nav .btn-ghost{border-color:var(--line); color:var(--ink-soft);}

  /* Results */
  .result-badge{
    display:inline-flex; align-items:center; gap:10px; padding:10px 20px; border-radius:999px;
    font-weight:700; font-size:14px; margin-bottom:18px;
  }
  .bar-row{margin-bottom:16px;}
  .bar-row .lbl{display:flex; justify-content:space-between; font-size:13.5px; font-weight:600; color:var(--ink-soft); margin-bottom:6px;}
  .bar-track{height:12px; background:var(--teal-100); border-radius:999px; overflow:hidden;}
  .bar-fill{height:100%; border-radius:999px; width:0%; transition:width .8s ease;}

  .help-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:16px; margin-top:10px;}
  @media (max-width:720px){.help-grid{grid-template-columns:1fr;}}
  .help-card{background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:22px; box-shadow:var(--shadow);}
  .help-card .num{font-family:'Poppins'; font-weight:800; font-size:22px; color:var(--teal-700); display:block; margin-bottom:4px;}
  .help-card h4{font-size:15.5px; margin-bottom:4px; color:var(--teal-900);}
  .help-card p{font-size:13.5px; color:var(--ink-soft); margin-bottom:8px;}
  .help-card a.link{font-size:13px; font-weight:700;}

  .disclaimer-box{
    background:#fff7ec; border:1px solid #f0d9ab; border-radius:var(--radius); padding:20px 22px; font-size:14px; color:#6b4e12; margin-top:20px;
  }

  /* Author / About */
  .author-wrap{display:grid; grid-template-columns:120px 1fr; gap:28px; align-items:start;}
  @media (max-width:640px){ .author-wrap{grid-template-columns:1fr;} }
  .author-avatar{
    width:110px; height:110px; border-radius:50%; background:linear-gradient(140deg,var(--teal-600),var(--coral));
    display:flex; align-items:center; justify-content:center; color:#fff; font-family:'Poppins'; font-weight:800; font-size:34px;
    box-shadow:var(--shadow);
  }
  .author-badges{display:flex; flex-wrap:wrap; gap:8px; margin-bottom:16px;}
  .author-badge{
    display:inline-flex; align-items:center; gap:6px; background:var(--teal-100); color:var(--teal-700);
    font-size:12.5px; font-weight:700; padding:6px 13px; border-radius:999px;
  }
  .author-story p{color:var(--ink-soft); font-size:15.5px; margin-bottom:14px;}
  .author-story p:last-child{margin-bottom:0;}

  .related-links{margin-top:28px; padding-top:24px; border-top:1px solid var(--line);}
  .related-links-label{font-size:12.5px; font-weight:700; text-transform:uppercase; letter-spacing:.04em; color:var(--ink-soft); margin-bottom:12px;}
  .related-links-row{display:flex; flex-wrap:wrap; gap:12px;}
  .related-link-card{
    display:flex; align-items:center; gap:12px; background:#fff; border:1px solid var(--line); border-radius:var(--radius-sm);
    padding:12px 16px; text-decoration:none; flex:1 1 260px; box-shadow:var(--shadow);
  }
  .related-link-card:hover{border-color:var(--teal-500); background:var(--teal-100);}
  .related-link-icon{font-size:22px; flex:none;}
  .related-link-title{display:block; font-weight:700; font-size:14px; color:var(--teal-900);}
  .related-link-sub{display:block; font-size:12.5px; color:var(--ink-soft); margin-top:2px;}

  /* Article */
  .article-box{
    background:var(--card); border:1px solid var(--line); border-radius:var(--radius);
    box-shadow:var(--shadow); padding:36px; max-width:820px; margin:0 auto;
  }
  @media (max-width:640px){ .article-box{padding:24px 20px;} }
  .article-meta{
    display:flex; flex-wrap:wrap; gap:8px 18px; font-size:13px; color:var(--ink-soft);
    border-bottom:1px solid var(--line); padding-bottom:18px; margin-bottom:26px;
  }
  .article-title{font-size:24px; color:var(--teal-900); margin-bottom:6px;}
  .article-subtitle{font-size:14.5px; color:var(--ink-soft); font-style:italic; margin-bottom:18px;}
  .article-box h3{font-size:19px; color:var(--teal-900); margin-top:34px; margin-bottom:12px; border-left:4px solid var(--coral); padding-left:12px;}
  .article-box h4{font-size:16px; color:var(--teal-700); margin-top:22px; margin-bottom:8px;}
  .article-box p{font-size:15px; color:var(--ink); margin-bottom:14px;}
  .article-box ul{padding-left:22px; margin-bottom:14px;}
  .article-box li{margin-bottom:8px; font-size:15px; color:var(--ink);}
  .article-box blockquote{
    margin:14px 0; padding:12px 16px; border-left:3px solid var(--amber); background:#faf6ee;
    font-style:italic; color:var(--ink-soft); font-size:14.5px; border-radius:0 8px 8px 0;
  }
  .abstract-box{
    background:var(--teal-100); border-radius:var(--radius-sm); padding:20px 22px; margin-bottom:8px;
  }
  .abstract-box h4{margin-top:0; color:var(--teal-700); font-size:13px; text-transform:uppercase; letter-spacing:.04em;}
  .abstract-box p{font-size:14.5px; color:var(--teal-900); margin-bottom:10px;}
  .keywords{font-size:13px; color:var(--teal-700);}
  details.article-toggle{max-width:820px; margin:0 auto;}
  details.article-toggle > summary{
    list-style:none; cursor:pointer; display:flex; align-items:center; justify-content:center; gap:10px;
  }
  details.article-toggle > summary::-webkit-details-marker{display:none;}

  footer{padding:44px 0; background:var(--teal-900); color:#c9ddd8; font-size:13.5px;}
  footer a{color:#fff;}
  footer .foot-wrap{display:flex; justify-content:space-between; flex-wrap:wrap; gap:16px;}

  .hidden{display:none !important;}
  .center{text-align:center;}
  .small{font-size:13px; color:var(--ink-soft);}

  /* Przycisk wsparcia (Suppi) — zawsze widoczny, po lewej, żeby nie kolidować z szybkim wyjściem */
  .coffee-fab{
    position:fixed; z-index:9999; left:16px; bottom:16px;
    display:flex; align-items:center; gap:8px;
    background:var(--amber); color:var(--ink);
    text-decoration:none; font-family:'Inter',system-ui,sans-serif;
    font-size:14px; font-weight:700; padding:11px 16px;
    border-radius:999px; box-shadow:0 6px 16px rgba(0,0,0,0.28);
    transition:transform 0.18s ease, box-shadow 0.18s ease;
  }
  .coffee-fab:hover, .coffee-fab:focus-visible{
    transform:translateY(-2px); box-shadow:0 9px 20px rgba(0,0,0,0.34); background:var(--amber-dark); color:#fff;
  }
  .coffee-fab .coffee-icon{font-size:16px; line-height:1;}
  @media (max-width:480px){
    .coffee-fab{left:12px; bottom:12px; padding:10px 14px; font-size:13px;}
  }
  @media (min-width:900px){
    .coffee-fab{left:24px; bottom:24px;}
  }