/* KEEGA Capital GmbH – Stylesheet
   Texte: Deutsch steht in index.html (data-i18n), Englisch in js/main.js (Objekt EN).
   Impressum: Abschnitt #impressum-page in index.html (öffnet über #impressum). */
:root{
  --pine-900:#0E1C16; --pine-800:#132A20; --pine-700:#1E3B2D;
  --bone:#EDE7DA; --bone-2:#E5DECD;
  --ink:#14241C; --ink-2:#26332B; --sage:#5A655C;
  --brass:#9E7C3C; --brass-2:#C7A863;
  --line:rgba(20,36,28,.14); --line-d:rgba(237,231,218,.16);
  --serif:"Iowan Old Style","Palatino Linotype",Palatino,"Book Antiqua",Georgia,serif;
  --sans:system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --mono:"SF Mono",ui-monospace,"Cascadia Code","Roboto Mono",Menlo,Consolas,monospace;
  --maxw:1180px;
  --gutter:clamp(22px,5vw,64px);
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0; background:var(--bone); color:var(--ink);
  font-family:var(--sans); font-size:17px; line-height:1.68;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
}
h1,h2,h3{font-family:var(--serif); font-weight:500; letter-spacing:.005em; margin:0;}
a{color:inherit;}
::selection{background:var(--brass); color:var(--bone);}
.wrap{max-width:var(--maxw); margin:0 auto; padding:0 var(--gutter);}

/* Sub-Header (Über uns, Was uns auszeichnet …) */
.kicker{
  font-family:var(--mono); font-size:.88rem; line-height:1; letter-spacing:.22em; text-transform:uppercase;
  color:var(--brass); display:flex; align-items:center; gap:.75em; margin:0 0 1.3rem;
}
.kicker::before{content:""; flex:none; width:3px; height:1.05em; background:currentColor;}

/* ---------- typed caret: Strich beim Tippen, danach pulsierender Punkt ---------- */
.caret{display:inline-block; margin-left:.04em;}
.caret.bar{width:.58ch; background:var(--brass-2); align-self:stretch;
  animation:blink 1.05s steps(1) infinite;}
.caret.dot{color:var(--brass-2); animation:pulse 1.8s ease-in-out infinite;}
@keyframes blink{50%{opacity:0;}}
@keyframes pulse{0%,100%{opacity:1;}50%{opacity:0;}}

/* ---------- header ---------- */
.site-header{
  position:fixed; top:0; left:0; right:0; z-index:60;
  display:flex; align-items:center; justify-content:space-between;
  padding:16px var(--gutter);
  transition:background .4s ease, box-shadow .4s ease, padding .4s ease;
}
.site-header.solid{background:rgba(237,231,218,.86); backdrop-filter:blur(10px);
  box-shadow:0 1px 0 var(--line); padding-top:12px; padding-bottom:12px;}
.brand{font-family:var(--mono); font-size:.82rem; letter-spacing:.2em; text-decoration:none;
  color:var(--bone); display:flex; gap:.6em; opacity:0; transition:opacity .6s ease .1s, color .4s ease;}
.brand.show{opacity:1;}
.site-header.solid .brand{color:var(--ink);}
.brand b{font-weight:700;}
.brand .dot{color:var(--brass);}
.header-actions{display:flex; align-items:center; gap:10px;}
.btn{font-family:var(--mono); font-size:.7rem; letter-spacing:.18em; text-transform:uppercase;
  cursor:pointer; border:1px solid var(--line-d); background:transparent; color:var(--bone);
  padding:.72em 1.1em; border-radius:2px; transition:all .28s ease; line-height:1;
  text-decoration:none; display:inline-flex; align-items:center;}
.site-header.solid .btn{border-color:var(--line); color:var(--ink);}
.btn:hover{border-color:var(--brass); color:var(--brass-2);}
.site-header.solid .btn:hover{color:var(--brass);}
.btn-primary{background:var(--brass); color:var(--pine-900); border-color:var(--brass);}
.btn-primary:hover{background:var(--brass-2); border-color:var(--brass-2); color:var(--pine-900);}
.site-header.solid .btn-primary{color:var(--pine-900); border-color:var(--brass);}
.site-header.solid .btn-primary:hover{color:var(--pine-900);}
.lang-btn{min-width:2.9em; justify-content:center; padding:.72em .9em;}
.menu-btn{gap:.7em;}
.menu-btn .bars{display:inline-flex; flex-direction:column; gap:3px;}
.menu-btn .bars i{width:16px; height:1.5px; background:currentColor; display:block;}
@media(max-width:520px){ .btn-primary{display:none;} }

/* ---------- fullscreen menu ---------- */
.menu{position:fixed; inset:0; z-index:80; background:var(--pine-900); color:var(--bone);
  display:flex; flex-direction:column; padding:var(--gutter);
  opacity:0; visibility:hidden; transform:translateY(-8px);
  transition:opacity .4s ease, transform .5s cubic-bezier(.2,.7,.2,1), visibility .4s;}
.menu.open{opacity:1; visibility:visible; transform:none;}
.menu-top{display:flex; justify-content:space-between; align-items:center;}
.menu-top .brand{opacity:1; color:var(--bone);}
.menu-close{background:none; border:none; color:var(--bone); font-family:var(--mono);
  font-size:.72rem; letter-spacing:.2em; cursor:pointer; text-transform:uppercase;}
.menu-close:hover{color:var(--brass-2);}
.menu-nav{margin:auto 0; display:flex; flex-direction:column; gap:.15em;}
.menu-nav a{font-family:var(--serif); font-size:clamp(2rem,6.4vw,4rem); text-decoration:none;
  color:var(--bone); line-height:1.12; width:max-content; max-width:100%;
  display:flex; align-items:baseline; gap:.4em; transition:color .3s ease;}
.menu-nav a .idx{font-family:var(--mono); font-size:.85rem; letter-spacing:.1em; color:var(--brass);
  opacity:.75; transform:translateY(-.6em);}
.menu-nav a:hover{color:var(--brass-2);}
.menu-foot{display:flex; gap:26px; flex-wrap:wrap; font-family:var(--mono); font-size:.72rem;
  letter-spacing:.12em; color:rgba(237,231,218,.6); text-transform:uppercase;}
.menu-foot a{all:unset; cursor:pointer;}
.menu-foot a:hover{color:var(--brass-2);}

/* ---------- hero ---------- */
.hero{position:relative; min-height:100svh; display:flex; flex-direction:column;
  justify-content:center; overflow:hidden; background:var(--pine-900); color:var(--bone);}
.hero::before{
  content:""; position:absolute; inset:-20%;
  background:
    radial-gradient(60% 55% at 26% 32%, rgba(158,124,60,.24), transparent 60%),
    radial-gradient(55% 60% at 82% 74%, rgba(30,59,45,.85), transparent 65%),
    radial-gradient(120% 120% at 50% 50%, transparent 55%, rgba(4,10,7,.7) 100%);
  animation:drift 26s ease-in-out infinite alternate;}
.hero::after{
  content:""; position:absolute; inset:0; opacity:.05; pointer-events:none; mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");}
@keyframes drift{from{transform:translate3d(-1.5%,-1%,0) scale(1.02);}
  to{transform:translate3d(2%,1.5%,0) scale(1.06);}}
.hero .wrap{position:relative; z-index:2; width:100%;}
.hero-word{font-family:var(--mono); font-weight:500; letter-spacing:.01em;
  font-size:clamp(2.5rem,9.2vw,6.6rem); line-height:1; display:flex; align-items:baseline;
  min-height:1.1em; color:var(--bone);}
.hero-word .txt{white-space:pre;}
.hero-tag{font-family:var(--serif); font-size:clamp(1.5rem,3.6vw,2.7rem); line-height:1.18;
  margin:1.2rem 0 0; color:var(--bone);
  opacity:0; transform:translateY(14px); transition:opacity 1s ease, transform 1s cubic-bezier(.2,.7,.2,1);}
.hero-tag .accent{color:var(--brass-2);}
.hero-sub{font-family:var(--mono); font-size:.74rem; letter-spacing:.24em; text-transform:uppercase;
  color:rgba(237,231,218,.62); margin-top:1.4rem;
  opacity:0; transform:translateY(14px); transition:opacity 1s ease .15s, transform 1s ease .15s;}
.hero.revealed .hero-tag,.hero.revealed .hero-sub{opacity:1; transform:none;}
.scroll-cue{position:absolute; left:0; right:0; bottom:26px; z-index:2; text-align:center;
  font-family:var(--mono); font-size:.64rem; letter-spacing:.28em; text-transform:uppercase;
  color:rgba(237,231,218,.5); opacity:0; transition:opacity 1s ease .5s;}
.hero.revealed .scroll-cue{opacity:1;}
.scroll-cue span:first-child{display:block; margin:0 auto 8px; width:1px; height:32px;
  background:linear-gradient(var(--brass-2),transparent); animation:cue 2.2s ease-in-out infinite;}
@keyframes cue{0%,100%{transform:scaleY(.5); opacity:.4; transform-origin:top;}50%{transform:scaleY(1); opacity:1;}}

/* ---------- sections ---------- */
section,.distinct{scroll-margin-top:84px;}
.section{padding:clamp(76px,12vh,150px) 0; border-top:1px solid var(--line);}
.lede{font-family:var(--serif); font-size:clamp(1.3rem,2.5vw,1.72rem); line-height:1.5;
  color:var(--ink); max-width:40ch;}
.section h2{font-size:clamp(2.05rem,4.6vw,3.5rem); line-height:1.05; margin-bottom:1.4rem;}
.prose p{max-width:62ch; color:var(--ink-2); margin:0 0 1.15em;}
.prose p:last-child{margin-bottom:0;}
.about-text{font-family:var(--serif); font-size:clamp(1.12rem,1.7vw,1.3rem); line-height:1.6;
  color:var(--ink) !important; max-width:56ch !important;}

.two-col{display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.3fr); gap:clamp(30px,6vw,84px); align-items:start;}
@media(max-width:860px){.two-col{grid-template-columns:1fr; gap:28px;}}

/* ---------- Was uns auszeichnet ---------- */
.distinct{margin-top:clamp(70px,10vh,120px); padding-top:clamp(50px,8vh,90px);
  border-top:1px solid var(--line);}
.statement{font-family:var(--serif); font-size:clamp(1.7rem,3.4vw,2.65rem); line-height:1.15; margin:0;}
.distinct .two-col{align-items:end;}
.statement-wide{max-width:none; text-wrap:balance;}
.distinct-intro{font-family:var(--serif); font-size:clamp(1.15rem,2vw,1.38rem); line-height:1.45;
  color:var(--ink) !important; max-width:40ch !important; padding-left:1.2em; border-left:2px solid var(--brass);}
.pillars{list-style:none; margin:clamp(40px,6vw,64px) 0 0; padding:0;
  display:grid; grid-template-columns:repeat(2,minmax(0,1fr));
  column-gap:clamp(28px,5vw,72px); row-gap:clamp(36px,5vw,56px);}
.pillar{border-top:1px solid var(--brass); padding-top:1.3rem;}
.pillar .n{display:block; font-family:var(--mono); font-size:.72rem; letter-spacing:.2em; color:var(--brass);
  line-height:1; margin-bottom:1rem;}
.pillar h3{font-size:1.5rem; line-height:1.2; margin:0 0 .5em;}
.pillar p{margin:0; color:var(--ink-2); font-size:.98rem; max-width:46ch;}
@media(max-width:760px){.pillars{grid-template-columns:1fr; row-gap:30px;}}

/* ---------- Geschäftsfelder ---------- */
.fields-head{margin-bottom:clamp(20px,3vw,36px);}
.field{display:grid; grid-template-columns:minmax(0,.44fr) minmax(0,1fr);
  column-gap:clamp(28px,6vw,90px); row-gap:0;
  padding:clamp(44px,6vw,68px) 0; border-top:1px solid var(--line);}
.field-idx{grid-column:1; grid-row:1; display:flex; align-items:center; gap:.9em;
  font-family:var(--mono); font-size:.74rem; letter-spacing:.2em; line-height:1; color:var(--brass);
  margin:0 0 1.15rem;}
.field-idx::after{content:""; width:34px; height:1px; background:currentColor; opacity:.55;}
.field-title{grid-column:1; grid-row:2; align-self:baseline;
  font-size:clamp(1.85rem,3.1vw,2.5rem); line-height:1.08; margin:0; hyphens:manual;}
.field-body{grid-column:2; grid-row:2; align-self:baseline;}
.field-lead{font-family:var(--serif); font-size:clamp(1.18rem,1.75vw,1.38rem); line-height:1.4;
  color:var(--sage); margin:0 0 1.1em; max-width:36ch;}
.field-body p{max-width:60ch; color:var(--ink-2); margin:0 0 1.1em;}
.field-body > p:last-child{margin-bottom:0;}
.facts{list-style:none; margin:1.6em 0 1.8em; padding:0; border-top:1px solid var(--line);}
.facts li{display:grid; grid-template-columns:minmax(130px,.3fr) 1fr; gap:16px;
  padding:.75em 0; border-bottom:1px solid var(--line); font-size:.95rem; align-items:baseline;}
.facts .k{font-family:var(--mono); font-size:.7rem; letter-spacing:.14em; text-transform:uppercase;
  color:var(--sage);}
.facts .v{color:var(--ink);}
.cta{display:inline-flex; align-items:center; gap:.7em; text-decoration:none;
  font-family:var(--mono); font-size:.74rem; letter-spacing:.16em; text-transform:uppercase;
  background:var(--pine-900); color:var(--bone); padding:1.05em 1.5em; border-radius:2px;
  transition:background .3s ease, transform .3s ease;}
.cta:hover{background:var(--pine-700); transform:translateX(3px);}
.cta .ar{color:var(--brass-2);}
.cta-note{margin:.9em 0 0 !important; font-size:.86rem; color:var(--sage) !important;}
.cta-note a{color:var(--ink); text-decoration:none; border-bottom:1px solid var(--brass);}
.cta-note a:hover{color:var(--brass);}
@media(max-width:760px){
  .field{grid-template-columns:1fr;}
  .field-title{grid-row:2; margin-bottom:1.1rem;}
  .field-body{grid-column:1; grid-row:3;}
}

/* ---------- Philosophie – dunkles Band ---------- */
.philosophy{background:var(--pine-900); color:var(--bone); border-top:none;}
.philosophy .kicker{color:var(--brass-2);}
.philosophy h2{color:var(--bone);}
.philosophy .lede{color:var(--bone);}
.phil-motto{font-family:var(--serif); font-size:clamp(1.2rem,2.1vw,1.5rem); line-height:1.4;
  color:var(--brass-2); margin:0;}
.principles{list-style:none; margin:2.2rem 0 0; padding:0; border-top:1px solid var(--line-d);}
.principles li{display:grid; grid-template-columns:3rem minmax(0,1fr); column-gap:1rem; align-items:baseline;
  padding:1.5rem 0; border-bottom:1px solid var(--line-d);}
.principles .n{font-family:var(--mono); font-size:.72rem; letter-spacing:.18em; color:var(--brass-2);}
.principles h3{font-size:1.32rem; line-height:1.25; color:var(--bone); margin:0 0 .4em;}
.principles p{margin:0; color:rgba(237,231,218,.78); max-width:58ch;}

/* footer */
.site-footer{background:var(--pine-800); color:var(--bone); padding:clamp(56px,9vh,110px) 0 40px;}
.foot-top{display:flex; justify-content:space-between; gap:40px; flex-wrap:wrap; align-items:flex-end;}
.foot-word{font-family:var(--mono); font-size:clamp(1.6rem,5vw,2.6rem); letter-spacing:.14em;}
.foot-word .dot{color:var(--brass-2);}
.foot-contact{text-align:right;}
@media(max-width:640px){.foot-contact{text-align:left;}}
.foot-contact .lbl{font-family:var(--mono); font-size:.64rem; letter-spacing:.2em; text-transform:uppercase;
  color:rgba(237,231,218,.5); display:block; margin-bottom:.5rem;}
.foot-email{font-family:var(--serif); font-size:1.35rem; color:var(--bone); text-decoration:none;
  border-bottom:1px solid var(--brass); padding-bottom:2px; transition:color .3s ease;}
.foot-email:hover{color:var(--brass-2);}
.foot-bottom{margin-top:clamp(40px,7vh,70px); padding-top:24px; border-top:1px solid var(--line-d);
  display:flex; justify-content:space-between; gap:20px; flex-wrap:wrap;
  font-family:var(--mono); font-size:.68rem; letter-spacing:.1em; color:rgba(237,231,218,.5);
  text-transform:uppercase;}
.foot-bottom a{color:inherit; text-decoration:none;} .foot-bottom a:hover{color:var(--brass-2);}
.foot-legal{display:flex; gap:1.4em; flex-wrap:wrap;}


/* ---------- Impressum (eigene Seitenansicht, über #impressum) ---------- */
.imp-page{position:fixed; inset:0; z-index:90; background:var(--bone); color:var(--ink);
  overflow-y:auto; overscroll-behavior:contain; font-size:16px;
  opacity:0; visibility:hidden; transition:opacity .35s ease, visibility .35s;}
.imp-page.open{opacity:1; visibility:visible;}
.imp-top{position:sticky; top:0; z-index:2; display:flex; justify-content:space-between; align-items:center;
  padding:16px var(--gutter); background:rgba(237,231,218,.92); backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);}
.imp-top .brand{opacity:1; color:var(--ink);}
.imp-back{font-family:var(--mono); font-size:.7rem; letter-spacing:.18em; text-transform:uppercase;
  text-decoration:none; color:var(--ink); border:1px solid var(--line); padding:.72em 1.1em; border-radius:2px;
  transition:all .28s ease; background:none; cursor:pointer; line-height:1;}
.imp-back:hover{border-color:var(--brass); color:var(--brass);}
.imp-main{max-width:860px; margin:0 auto; padding:clamp(56px,10vh,110px) var(--gutter) clamp(70px,12vh,130px);}
.imp-main .kicker{font-size:.8rem; margin-bottom:1.2rem;}
.imp-main h1{font-family:var(--serif); font-weight:500; font-size:clamp(2.4rem,5.5vw,3.8rem); line-height:1.02; margin:0 0 clamp(36px,6vh,60px);}
.imp-data{list-style:none; margin:0; padding:0; border-top:1px solid var(--ink);}
.imp-data li{display:grid; grid-template-columns:minmax(0,220px) minmax(0,1fr); gap:24px;
  padding:1.15rem 0; border-bottom:1px solid var(--line); align-items:baseline;}
.imp-data .k{font-family:var(--mono); font-size:.68rem; letter-spacing:.14em; text-transform:uppercase; color:var(--sage);}
.imp-data .v{color:var(--ink);}
.imp-data .v a{text-decoration:none; border-bottom:1px solid var(--brass);}
.imp-data .v a:hover{color:var(--brass);}
.imp-data .v .sub{color:var(--sage);}
.imp-legal{margin-top:clamp(56px,9vh,90px);}
.imp-legal section{padding:clamp(28px,4vh,40px) 0; border-top:1px solid var(--line); scroll-margin-top:0;}
.imp-legal h2{font-family:var(--serif); font-weight:500; font-size:1.55rem; line-height:1.2; margin:0 0 .8rem;}
.imp-legal h3{font-family:var(--mono); font-weight:500; font-size:.72rem; letter-spacing:.16em; text-transform:uppercase;
  color:var(--brass); margin:1.8rem 0 .6rem;}
.imp-legal h2 + h3{margin-top:.4rem;}
.imp-legal p{margin:0 0 1em; color:var(--ink-2); max-width:68ch;}
.imp-legal p:last-child{margin-bottom:0;}
.imp-legal a{text-decoration:none; border-bottom:1px solid var(--brass);}
.imp-legal a:hover{color:var(--brass);}
.imp-foot{background:var(--pine-800); color:rgba(237,231,218,.55); font-family:var(--mono); font-size:.68rem;
  letter-spacing:.1em; text-transform:uppercase;}
.imp-foot .in{max-width:860px; margin:0 auto; padding:28px var(--gutter); display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap;}
.imp-foot a{text-decoration:none;} .imp-foot a:hover{color:var(--brass-2);}
@media(max-width:620px){ .imp-data li{grid-template-columns:1fr; gap:4px;} }

/* reveal on scroll */
.reveal{opacity:0; transform:translateY(22px); transition:opacity .9s ease, transform .9s cubic-bezier(.2,.7,.2,1);}
.reveal.in{opacity:1; transform:none;}

:focus-visible{outline:2px solid var(--brass-2); outline-offset:3px; border-radius:2px;}

@media(prefers-reduced-motion:reduce){
  *{animation:none !important;}
  html{scroll-behavior:auto;}
  .reveal,.hero-tag,.hero-sub,.scroll-cue,.brand{opacity:1 !important; transform:none !important;}
  .caret.bar{display:none;}
}
@media(max-width:560px){
  .facts li{grid-template-columns:1fr; gap:2px;}
  body{font-size:16px;}
}
