/* ==========================================================================
   Granaria AC — Lernplattform-Styles (nur auf Plattform-Seiten geladen)
   Basis: template/style.css (Header, Nav, Footer, Tokens). Diese Datei
   ergänzt die ak-*-Komponenten; frueher inline in ui.php.
   ========================================================================== */

main.page{background:var(--bg2)}

/* Plattform-Leiste unter dem Hauptmenü */
.ak-subnav{position:sticky;top:var(--hh);z-index:50;background:var(--ink);color:var(--paper)}
.ak-subnav-in{max-width:var(--mw);margin:0 auto;padding:.55rem 1.25rem;display:flex;align-items:center;gap:1.1rem;flex-wrap:wrap}
.ak-subnav-brand{font-family:var(--fd);font-size:.72rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--gold)}
.ak-subnav a{color:#d8d5cf;font-size:.85rem}
.ak-subnav a:hover{color:var(--gold);text-decoration:none}
.ak-subnav .ak-who{margin-left:auto;color:var(--t3);font-size:.78rem}

.ak-wrap{max-width:var(--mw);margin:0 auto;padding:2rem 1.25rem 4rem}
.ak-hero{background:var(--ink);color:var(--paper);padding:3rem 0 2.5rem}
.ak-hero-in{max-width:var(--mw);margin:0 auto;padding:0 1.25rem}
.ak-hero h1{color:var(--paper);font-size:clamp(1.6rem,3.6vw,2.5rem);margin-bottom:.6rem}
.ak-hero p{color:#cfcbc4;max-width:62ch}
.ak-kicker{color:var(--gold);font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;font-weight:700;display:block;margin-bottom:.7rem}

.ak-hero h1,.ak-wrap h1,.ak-wrap h2,.ak-wrap h3,.ak-wrap h4,.ak-wrap h5{font-family:var(--fd);line-height:1.25;font-weight:600}
.ak-wrap h1,.ak-wrap h2,.ak-wrap h3,.ak-wrap h4,.ak-wrap h5{color:var(--t1)}
.ak-wrap :where(a){color:var(--acc)}
.ak-wrap :where(a):hover{text-decoration:underline}

.ak-card{background:var(--card);border:1px solid var(--brd);border-radius:var(--r);padding:1.4rem}
.ak-grid{display:grid;gap:1rem}
.ak-grid.c2{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
.ak-grid.c3{grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}

.ak-branche{display:block;background:var(--card);border:1px solid var(--brd);border-radius:var(--r);padding:1.4rem;transition:.15s;color:inherit!important}
.ak-branche:hover{border-color:var(--gold);box-shadow:0 6px 20px rgba(0,0,0,.07);text-decoration:none!important;transform:translateY(-2px)}
.ak-branche h3{font-size:1.05rem;margin-bottom:.25rem}
.ak-branche .ak-kurz{color:var(--t2);font-size:.85rem;display:block;margin-bottom:.7rem}
.ak-branche .ak-frage{color:var(--t1);font-size:.9rem;font-style:italic}

.ak-tag{display:inline-block;font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;font-weight:700;padding:.2rem .5rem;border-radius:4px;background:var(--bg2);color:var(--t2);border:1px solid var(--brd)}
.ak-tag.gold{background:rgba(201,168,76,.13);color:#8a6f1f;border-color:rgba(201,168,76,.4)}
.ak-tag.ok{background:rgba(30,142,62,.1);color:var(--ok,#1e8e3e);border-color:rgba(30,142,62,.3)}
.ak-tag.warn{background:rgba(176,96,0,.1);color:#b06000;border-color:rgba(176,96,0,.3)}
.ak-tag.bad{background:rgba(197,34,31,.09);color:#c5221f;border-color:rgba(197,34,31,.3)}

.ak-btn{display:inline-block;background:var(--ink);color:var(--paper)!important;border:1px solid var(--ink);padding:.62rem 1.15rem;border-radius:8px;font-family:var(--fd);font-weight:600;font-size:.9rem;cursor:pointer;transition:.15s}
.ak-btn:hover{background:#2a2a45;text-decoration:none!important;color:var(--paper)!important}
.ak-btn.gold{background:var(--gold);border-color:var(--gold);color:#221c05!important}
.ak-btn.gold:hover{background:#d8b95c;color:#221c05!important}
.ak-btn.ghost{background:transparent;color:var(--t1)!important;border-color:var(--brd2)}
.ak-btn.ghost:hover{background:var(--bg2);color:var(--t1)!important}
.ak-btn[disabled],.ak-btn.off{opacity:.45;pointer-events:none}

.ak-bar{height:7px;background:var(--brd);border-radius:99px;overflow:hidden}
.ak-bar i{display:block;height:100%;background:var(--gold);border-radius:99px;transition:width .3s}

.ak-step{display:flex;gap:.6rem;align-items:center;flex-wrap:wrap;margin:.8rem 0}
.ak-step span{font-size:.75rem;padding:.28rem .6rem;border-radius:99px;border:1px solid var(--brd);background:var(--card);color:var(--t2)}
.ak-step span.on{background:var(--ink);color:var(--paper);border-color:var(--gold)}
.ak-step span.done{background:rgba(30,142,62,.1);color:#1e8e3e;border-color:rgba(30,142,62,.35)}

.ak-wrap label{display:block;font-size:.82rem;font-weight:600;color:var(--t2);margin-bottom:.3rem;font-family:var(--fd)}
.ak-wrap input[type=text],.ak-wrap input[type=email],.ak-wrap input[type=password],.ak-wrap select,.ak-wrap textarea{
  width:100%;padding:.6rem .75rem;border:1px solid var(--brd2);border-radius:8px;
  font-family:var(--fb);font-size:.95rem;background:var(--card);color:var(--t1)}
.ak-wrap input:focus,.ak-wrap select:focus,.ak-wrap textarea:focus{outline:2px solid var(--gold);outline-offset:-1px;border-color:var(--gold)}
.ak-wrap textarea{min-height:110px;resize:vertical;line-height:1.55}
.ak-field{margin-bottom:1rem}
.ak-hint{font-size:.8rem;color:var(--t3);margin-top:.25rem}

.ak-msg{padding:.8rem 1rem;border-radius:8px;margin-bottom:1.2rem;font-size:.9rem;border:1px solid}
.ak-msg.err{background:rgba(197,34,31,.06);border-color:rgba(197,34,31,.35);color:#8f1a18}
.ak-msg.ok{background:rgba(30,142,62,.07);border-color:rgba(30,142,62,.35);color:#14682d}
.ak-msg.info{background:rgba(26,115,232,.06);border-color:rgba(26,115,232,.3);color:#13509f}

table.ak-tbl{width:100%;border-collapse:collapse;font-size:.9rem}
table.ak-tbl th,table.ak-tbl td{text-align:left;padding:.55rem .6rem;border-bottom:1px solid var(--brd)}
table.ak-tbl th{font-family:var(--fd);font-size:.78rem;text-transform:uppercase;letter-spacing:.06em;color:var(--t2)}

.ak-note{border-left:3px solid var(--gold);padding:.6rem 0 .6rem .9rem;color:var(--t2);font-size:.88rem;margin:1rem 0}
.ak-ko{border-left:3px solid #c5221f;padding:.6rem 0 .6rem .9rem;font-size:.88rem;margin:1rem 0}
.ak-ko strong{color:#c5221f}

.ak-foot-note{max-width:var(--mw);margin:3rem auto 0;padding:1.5rem 1.25rem;border-top:1px solid var(--brd);color:var(--t3);font-size:.8rem}

/* 12er-Merkkarte, Flip — Bauart wie erbrecht/ und fundacja-rodzinna/ */
.fc-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:1rem}
.fc{perspective:1200px;height:210px;cursor:pointer}
.fc-in{position:relative;width:100%;height:100%;transition:transform .55s;transform-style:preserve-3d}
.fc.flip .fc-in{transform:rotateY(180deg)}
.fc-face{position:absolute;inset:0;backface-visibility:hidden;border:1px solid var(--brd);border-radius:var(--r);padding:1rem;display:flex;flex-direction:column;background:var(--card);overflow:auto}
.fc-back{transform:rotateY(180deg);background:var(--ink);color:var(--paper);border-color:var(--ink)}
.fc-back h4{color:var(--gold);font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;margin-bottom:.4rem}
.fc-idx{font-size:.7rem;color:var(--t3);font-weight:700;letter-spacing:.1em}
.fc-face h3{font-size:1rem;margin:.35rem 0 .5rem}
.fc-merk{font-size:.88rem;color:var(--t2);line-height:1.5}
.fc-back .fc-merk{color:#cfcbc4}
.fc-done{position:absolute;right:.6rem;top:.6rem;font-size:.7rem;color:#1e8e3e;font-weight:700}

@media(prefers-reduced-motion:reduce){
  .fc-in{transition:none}
  .ak-branche,.ak-btn,.ak-bar i{transition:none}
}

@media(max-width:640px){
  .ak-hero{padding:2rem 0 1.6rem}
  .ak-wrap{padding:1.25rem 1rem 3rem}
  .fc{height:230px}
}