/* michael.css - Entwurf GREATsolution (G-68708)
   Eigene Schicht über der Menschsein-Seite: Inhalt und Aufbau bleiben,
   das Aussehen kommt aus Michael Habeckers bestehender Website
   (Handschrift Architects Daughter, Petrol #25998a für Integral,
   Orange #F39200 für Gitarre, dazu Beere #8C3B5A als Farbe für Menschsein). */

@font-face{font-family:'Architects Daughter';font-style:normal;font-weight:400;font-display:swap;src:url('fonts/architects-daughter.woff2') format('woff2')}

:root{
  --bg:#fff;--card:#fff;--warm:#faf6f8;--deep:#1c1c1c;--body:#2e2e2e;--light:#555;--faint:#666;--line:#e3e0e1;
  --amber:#8C3B5A;--as:rgba(140,59,90,.06);--am:rgba(140,59,90,.2);--at:#7A2E4C;
  --hand:'Architects Daughter',cursive;
  --sans:'Libre Franklin',Arial,sans-serif;
  --teal:#25998a;--orange:#F39200
}
html{font-size:17px}
body{font-family:var(--sans);font-weight:400;color:var(--body);
  background-color:#fff;
  background-image:radial-gradient(circle farthest-corner at center,#fff 80%,#D6D6D6 120%);
  background-attachment:fixed}
::selection{background:rgba(140,59,90,.18);color:var(--deep)}
a{text-underline-offset:.18em}
.stat-n{font-variant-numeric:tabular-nums}

/* ---------- Michaels Rahmen: Kopf mit Logo und Wegen zurück ---------- */
.mh-top{max-width:980px;margin:0 auto;padding:1.4rem 2rem 0;display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap}
.mh-logo img{display:block;width:170px;height:auto}
.mh-nav{display:flex;gap:1.6rem;flex-wrap:wrap;font-family:var(--hand);font-size:1rem}
.mh-nav a{color:var(--deep);text-decoration:none}
.mh-nav a:hover{text-decoration:underline}
.mh-nav .n-int:hover{color:#1d7a6e}
.mh-nav .n-git:hover{color:#b36b00}
.mh-nav [aria-current]{color:var(--amber)}

/* ---------- Kopfbereich: sofort sichtbar, keine Einblend-Kette ---------- */
.hero.mh-hero{min-height:auto;padding:3rem 2rem 3.5rem;display:grid;grid-template-columns:auto 1fr;gap:2.5rem;align-items:center;text-align:left;max-width:980px;margin:0 auto}
.mh-hero *{opacity:1;animation:none}
.mh-symbol{width:190px;display:flex;flex-direction:column;align-items:center}
.mh-symbol-slot{width:170px;height:170px;border:2px dashed var(--am);border-radius:50%;display:flex;align-items:center;justify-content:center;text-align:center;font-family:var(--hand);font-size:.95rem;line-height:1.3;color:var(--amber);padding:1.2rem}
.mh-portrait{display:block;width:170px;height:auto}
.mh-symbol-shadow{width:160px;height:14px;margin-top:18px;border-radius:50%;background:radial-gradient(ellipse at center,rgba(0,0,0,.28),rgba(0,0,0,0) 70%)}
.mh-title{font-family:var(--hand);font-weight:400;font-size:clamp(3rem,8vw,5.2rem);line-height:1;color:var(--amber);margin:0 0 1.4rem}
.mh-quote{margin:0 0 1.2rem;max-width:36rem;font-size:1.25rem;line-height:1.55;color:var(--deep)}
.mh-quote cite{display:block;margin-top:.5rem;font-size:.9rem;font-style:normal;color:var(--light)}
.mh-by{font-size:.95rem;color:var(--light);margin:0 0 1.6rem}
.mh-by strong{font-weight:600;color:var(--deep)}
.mh-go{font-family:var(--hand);font-size:1.25rem;color:var(--amber);text-decoration:none}
.mh-go:hover{text-decoration:underline}

/* ---------- Überschriften in Michaels Handschrift ---------- */
.stit,.p-ti,.gp-b,.map-ov-ti,.sb-title{font-family:var(--hand);font-weight:400;color:var(--deep)}
.stit{font-size:2rem;margin-bottom:.5rem}
.p-ti{font-size:1.8rem}
.gp-b{font-size:1.7rem}
.tc-n,.gc-b,.qc-name,.map-open-t{font-family:var(--hand);font-weight:400}
.tc-n{font-size:1.2rem}
.gc-b{font-size:1.1rem}
.qc-name{font-size:1.25rem}
.map-open-t{font-size:1.4rem}

/* ---------- Kein Versalien-Kicker: Untertitel als normaler Satz ---------- */
.ssub,.mbar-l,.stat-l,.ml-h,.mg-l,.mg-sub,.p-cn-l,.p-rf-l,.pf-l,.sb-label,.go-l,.gp-link,.ml-len,.mg-pending,.ml-pending,.map-flag,.map-openbadge,.ms-k,.map-back,.hero-label{text-transform:none;letter-spacing:normal}
.ssub{font-size:1rem;color:var(--light);margin-bottom:1.6rem}

/* ---------- Fließtexte statt Kursiv-Antiqua ---------- */
.ent-q,.p-in,.desc-text,.mbar-intro,.gp-k,.sb-desc,.quote-ring q,.lg-n,.lg-s,.sb-cap,.ctg,.map-lbl,.ms-t,.gz-t,.gz-cs{font-family:var(--sans)}
.ent-q{font-style:normal;font-size:1.05rem;font-weight:500}
.p-in,.gp-k,.mbar-intro,.lg-s,.sb-desc{font-style:normal}
.desc-text{font-size:1rem;line-height:1.7}
.desc-text em{color:var(--at);font-weight:600}
.ent-m{font-family:var(--hand);color:var(--amber)}
.stat-n{font-family:var(--hand);color:var(--amber)}

/* ---------- Lesbare Mindestgrößen (Publikum 60+) ---------- */
.ent-h,.tc-s,.gc-h,.qc-role,.sr-theme,.ml-theme,.mg-d,.mg-link,.ml-link,.p-rf-i,.gp-stub,.mg-more,.map-open-s,.sb-src{font-size:.8rem}
.fmt,.mg-b,.sr-fmt,.ml-len,.mg-sb,.mg-meyer,.ml-meyer,.mg-pending,.ml-pending,.stat-l,.mbar-l,.ml-h,.mg-l,.mg-sub,.p-cn-l,.p-rf-l,.pf-l,.sb-label,.map-flag,.map-openbadge,.ms-k{font-size:.72rem}
.mg-t,.ml-title,.sr-title,.gp-v{font-size:.95rem}
.mb{font-size:.85rem}
.pfb{font-size:.78rem}
.footer{font-size:.8rem}

/* ---------- Weniger Kachel, mehr Seite ---------- */
.section{padding-left:2rem;padding-right:2rem}
.gc-h{font-style:normal}
.ent-grid,.tgrid,.g-grid,.q-grid{border-radius:0;border-left:0;border-right:0}
.tc::before,.gc::before,.qc::before{height:3px}
.mb,.pfb,.fmt,.mg-b,.sr-fmt,.ml-len,.mg-sb,.ctg,.ms-k,.map-openbadge,.map-flag,.map-back{border-radius:3px}
.map-open-btn{border-radius:3px}
.map-open-btn:hover,.map-open-btn:focus-visible{box-shadow:2px 3px 0 var(--am);transform:none}
.hero-go:hover,.sb-thumb:hover{transform:none}
.divider::after{background:var(--line)}

/* ---------- Knöpfe: größer, gut treffbar ---------- */
.mb{font-size:.95rem;padding:.55rem 1.1rem;min-height:44px;border-width:1.5px;font-weight:500}
.mbar{gap:.5rem;margin-top:.7rem}
.mbar{position:relative;padding-left:80px}
.mbar-l{font-size:.9rem;width:70px;color:var(--deep);position:absolute;left:0;top:.75rem}
.gc,.tc,.qc{min-width:0;overflow-wrap:break-word;hyphens:auto}
.pfb{font-size:.88rem;padding:.45rem .9rem;min-height:38px;border-width:1.5px}
.search-wrap{max-width:520px}
.search-input{font-size:1rem;padding:.8rem 1rem .8rem 2.6rem;min-height:48px;border-width:1.5px}
.search-icon{left:1rem;top:50%;transform:translateY(-50%);line-height:0}
.map-open-btn{padding:1.2rem 1.8rem;border-width:1.5px}
.map-open-s{font-size:.9rem}
.mh-go{display:inline-block;font-size:1.3rem;padding:.6rem 1.4rem;border:2px solid var(--amber);border-radius:3px}
.mh-go:hover{background:var(--amber);color:#fff;text-decoration:none}
.p-cl,.gp-cl{width:40px;height:40px;font-size:.9rem}
.ctg{font-size:.9rem;padding:.45rem .9rem}

/* ---------- Fußzeile mit Pflichtangaben ---------- */
.footer a{color:var(--deep)}
.mh-legal a{margin-left:1rem}

@media(max-width:700px){
  .hero.mh-hero{grid-template-columns:1fr;justify-items:center;text-align:center;padding:2rem 1.25rem 2.5rem;gap:1.5rem}
  .mh-quote{font-size:1.1rem}
  .section{padding-left:1.25rem;padding-right:1.25rem}
  .g-grid{grid-template-columns:1fr}
  .mbar{padding-left:0}
  .mbar-l{position:static;width:100%;margin-bottom:.1rem}
  .mh-top{justify-content:center;padding:1rem 1.25rem 0}
  .mh-nav{justify-content:center;gap:1.1rem}
}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;animation:none!important;scroll-behavior:auto!important}}
