/* aikompetenz.ch package homepage — 25-person Art. 4 offer (N20AK1). */
:root{
  --ph-ink:#13231c;
  --ph-muted:#3d5248;
  --ph-paper:#f3f6f2;
  --ph-line:#c5d4ce;
  --ph-accent:#244b40;
  --ph-accent-2:#3a6b5a;
  --ph-warm:#c4a35a;
  --ph-display:"Iowan Old Style","Palatino Linotype",Palatino,"Book Antiqua",Georgia,serif;
  --ph-sans:"Segoe UI",Candara,"Avenir Next",Avenir,ui-sans-serif,system-ui,sans-serif;
  color-scheme:light;
}
*{box-sizing:border-box}
html,body{margin:0}
body.ph{
  min-height:100vh;display:flex;flex-direction:column;
  background:var(--ph-paper);color:var(--ph-ink);
  font:17px/1.55 var(--ph-sans);
  overflow-x:hidden;
}
a{color:inherit}
.ph-skip{position:absolute;left:-9999px}
.ph-skip:focus{left:16px;top:16px;z-index:9;background:#fff;color:#000;padding:8px 12px;border-radius:8px}
.ph-bg{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.ph-bg-wash{
  position:absolute;inset:0;
  background:
    radial-gradient(ellipse 90% 70% at 10% -10%,rgba(36,75,64,.18),transparent 55%),
    radial-gradient(ellipse 70% 60% at 95% 15%,rgba(196,163,90,.2),transparent 50%),
    linear-gradient(165deg,#eef3ef 0%,#f7f5ef 45%,#e8efe9 100%);
}
.ph-bg-grid{
  position:absolute;inset:0;opacity:.35;
  background-image:
    linear-gradient(rgba(36,75,64,.07) 1px,transparent 1px),
    linear-gradient(90deg,rgba(36,75,64,.07) 1px,transparent 1px);
  background-size:48px 48px;
  mask-image:radial-gradient(ellipse 75% 65% at 50% 30%,#000 20%,transparent 75%);
  animation:ph-drift 48s linear infinite;
}
@keyframes ph-drift{to{transform:translate(48px,48px)}}
.ph-top{
  position:relative;z-index:2;display:flex;justify-content:space-between;align-items:center;
  padding:22px clamp(16px,4vw,56px);
}
.ph-brand{display:flex;align-items:center;gap:12px;text-decoration:none}
.ph-mark{
  width:36px;height:36px;border-radius:10px;display:grid;place-items:center;
  background:var(--ph-accent);color:#fff;font-weight:700;font-size:13px;letter-spacing:.04em;
}
.ph-brand span{display:flex;flex-direction:column;line-height:1.15}
.ph-brand strong{font-family:var(--ph-display);font-size:1.15rem;font-weight:700;letter-spacing:-.02em}
.ph-brand small{font-size:11px;color:var(--ph-muted);letter-spacing:.12em;text-transform:uppercase}
.ph-lang{display:flex;gap:4px;border:1px solid var(--ph-line);border-radius:999px;padding:3px;background:rgba(255,255,255,.65)}
.ph-lang a{font-size:12px;font-weight:700;text-decoration:none;padding:4px 10px;border-radius:999px;color:var(--ph-muted)}
.ph-lang a[aria-current]{background:var(--ph-accent);color:#fff}
.ph-hero{
  position:relative;z-index:1;flex:1;width:100%;max-width:720px;margin:0 auto;
  padding:clamp(28px,6vw,72px) clamp(16px,4vw,56px) 40px;
  animation:ph-rise .7s ease both;
}
@keyframes ph-rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.ph-eyebrow{
  margin:0 0 18px;font-size:13px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--ph-accent-2);
}
.ph-hero h1{
  margin:0;font-family:var(--ph-display);font-weight:700;
  font-size:clamp(2.2rem,5.2vw,3.55rem);line-height:1.08;letter-spacing:-.03em;
}
.ph-sub{margin:1.1rem 0 1.6rem;font-size:clamp(1.05rem,1.6vw,1.2rem);color:var(--ph-muted);max-width:36rem}
.ph-price{
  display:inline-flex;align-items:baseline;gap:.55rem;margin:0 0 1.5rem;
  padding:.55rem 1rem;border:1px solid var(--ph-line);border-radius:12px;background:rgba(255,255,255,.72);
}
.ph-price b{font-family:var(--ph-display);font-size:1.65rem;font-variant-numeric:tabular-nums}
.ph-price span{font-size:.95rem;color:var(--ph-muted)}
.ph-cta{display:flex;flex-wrap:wrap;gap:.85rem;align-items:center;margin:0 0 1.75rem}
.ph-cta .button{
  display:inline-flex;align-items:center;justify-content:center;gap:.45rem;
  padding:.85rem 1.35rem;border-radius:10px;text-decoration:none;font-weight:700;font-size:1.05rem;
  background:var(--ph-accent);color:#fff;border:2px solid var(--ph-accent);
  transition:transform .15s,filter .15s;
}
.ph-cta .button:hover{filter:brightness(1.06);transform:translateY(-1px)}
.ph-cta .button.secondary{background:transparent;color:var(--ph-accent)}
.ph-points{list-style:none;margin:0;padding:0;display:grid;gap:.7rem}
.ph-points li{position:relative;padding-left:1.35rem;color:var(--ph-muted);font-size:1rem}
.ph-points li::before{
  content:"";position:absolute;left:0;top:.55em;width:.55rem;height:.55rem;border-radius:50%;
  background:var(--ph-warm);box-shadow:0 0 0 3px rgba(196,163,90,.25);
}
.ph-foot{
  position:relative;z-index:1;display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;
  padding:16px clamp(16px,4vw,56px);border-top:1px solid var(--ph-line);
  font-size:12px;color:var(--ph-muted);background:rgba(255,255,255,.55);
}
.ph-foot a{color:var(--ph-muted);text-decoration:underline;text-underline-offset:2px}
.ph-foot a:hover{color:var(--ph-ink)}
.notice{position:relative;z-index:2;margin:0 clamp(16px,4vw,56px);background:#fff3cd;border:1px solid #ffe69c;padding:.6rem 1rem;border-radius:6px}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}
