/*
  German in Context — About page V1 (builds on gic-legal-v2.css: tiles, hero, variables).
  Six feature tiles, "system" stat tiles, a dark principle card, one gold call to action.
*/
main.gic-about{max-width:880px}

/* feature tiles */
main.gic-about .ga-feats{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:0 0 34px}
main.gic-about .ga-feats .gk{gap:11px;padding:15px 15px 14px}
main.gic-about .ga-feats .gk b{font-size:17px;margin:0}
main.gic-about .gk .ga-de{
  display:block;margin-top:4px;
  font:italic 500 13.5px/1.25 "Newsreader",Georgia,"Iowan Old Style",serif;
  color:var(--lg-gold);
}

/* sections */
main.gic-about .ga-sec{margin:0 0 30px}
main.gic-about .ga-sec h2,
main.gic-about .ga-principle h2{
  font-family:"Newsreader",Georgia,"Iowan Old Style","Times New Roman",serif!important;
  font-size:clamp(26px,7vw,32px)!important;
  line-height:1.12!important;
  letter-spacing:-.015em!important;
  margin:0 0 12px!important;
}
main.gic-about .ga-sec h2{color:var(--lg-head)!important}
main.gic-about .ga-sec > p{margin:0 0 4px!important;color:var(--lg-ink)!important;font-size:16px!important;line-height:1.72!important}

/* system stats */
main.gic-about .ga-stats{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:18px 0 18px}
main.gic-about .ga-stats .gk{padding:16px;gap:0}
main.gic-about .ga-stats .gk b{font-size:17px;margin:0}
main.gic-about .ga-stat-hero{grid-column:1 / -1}
main.gic-about .ga-num{
  display:block;margin:0 0 4px;
  font:600 58px/1 "Bahnschrift","DIN Alternate","sans-serif-condensed","Roboto Condensed","Arial Narrow",system-ui,sans-serif;
  letter-spacing:.01em;
  background:linear-gradient(180deg,#e8cd85 0%,#b98f35 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;
}
main.gic-about .ga-callout{
  margin:0;padding:15px 18px;border-left:3px solid var(--lg-gold);border-radius:0 18px 18px 0;
  background:var(--lg-tile);
  font:italic 500 19px/1.5 "Newsreader",Georgia,"Iowan Old Style",serif;color:var(--lg-head);
}

/* principle: dark emerald card in both themes */
main.gic-about .ga-principle{
  position:relative;overflow:hidden;margin:0 0 24px;padding:28px 22px 24px;border-radius:26px;
  background:linear-gradient(150deg,#1b4a3d 0%,#123a30 60%,#0f2f27 100%);
  border:1px solid rgba(214,178,90,.30);box-shadow:0 18px 38px rgba(8,30,24,.30);
}
main.gic-about .ga-principle::before{
  content:"";position:absolute;left:0;right:0;top:0;height:3px;
  background:linear-gradient(90deg,#4a4a4a 0 33.34%,#c0303c 33.34% 66.67%,#d6a93d 66.67% 100%);
}
main.gic-about .ga-principle h2{color:#f3ecd6!important}
main.gic-about .ga-principle p{margin:0!important;color:rgba(233,239,233,.82)!important;font-size:16px!important;line-height:1.7!important}
main.gic-about .ga-principle .ga-big{
  margin:0 0 14px!important;color:#f6efdc!important;
  font:italic 500 clamp(21px,5.8vw,26px)/1.35 "Newsreader",Georgia,"Iowan Old Style",serif!important;
}

/* call to action */
main.gic-about .ga-cta{display:flex;flex-direction:column;gap:14px;margin:0 0 8px}
main.gic-about .ga-btn{
  display:flex;align-items:center;justify-content:center;gap:8px;min-height:54px;border-radius:999px;
  background:linear-gradient(180deg,#f3dc95 0%,#d3ab50 100%);color:#173a30!important;
  font-size:16px;font-weight:700;text-decoration:none;
  box-shadow:0 1px 0 rgba(255,255,255,.5) inset,0 10px 22px rgba(120,88,24,.30);
  -webkit-tap-highlight-color:transparent;touch-action:manipulation;
  transition:transform .15s cubic-bezier(.2,.8,.2,1);
}
main.gic-about .ga-btn:active{transform:scale(.975)}
main.gic-about .ga-note{margin:0;color:var(--lg-muted);font-size:13px;line-height:1.55;text-align:center}
main.gic-about .ga-note a{color:var(--lg-link);text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--lg-gold-line)}

@media (min-width:700px){
  main.gic-about .ga-feats{grid-template-columns:repeat(3,1fr)}
  main.gic-about .ga-stats{grid-template-columns:repeat(3,1fr)}
  main.gic-about .ga-stat-hero{grid-column:auto}
  main.gic-about .ga-principle{padding:34px 36px 30px}
  main.gic-about .ga-cta{flex-direction:row;align-items:center;justify-content:space-between}
  main.gic-about .ga-btn{min-width:240px;padding:0 24px}
  main.gic-about .ga-note{text-align:left;max-width:30em}
}
@media (prefers-reduced-motion:reduce){main.gic-about .ga-btn{transition:none}}
