/* =========================================================
   VALENDOR Human Clean V5
   Ruhiger, direkter und weniger nach Promo Template
   ========================================================= */

:root{
  --human-bg:#080a0e;
  --human-panel:#0d1016;
  --human-line:rgba(255,255,255,.085);
  --human-red:#8B1A1A;
  --human-red-soft:#c45b5b;
  --human-text:#f2f4f7;
  --human-muted:#a8b0bb;
}

html{scroll-padding-top:104px}
[id]{scroll-margin-top:104px}
body.promo-site{
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  background:#080a0e;
}
.promo-site .noise{display:none}

/* Navigation: familiar and simple */
.promo-site .site-header{
  top:12px;
  width:min(1160px,calc(100% - 24px));
  height:72px;
  padding:0 10px 0 12px;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(8,11,16,.92);
  box-shadow:0 14px 40px rgba(0,0,0,.34);
  backdrop-filter:blur(16px);
}
.promo-site .site-header::before,.promo-site .site-header::after{display:none}
.promo-site .brand{
  border:0;
  background:transparent;
  border-radius:12px;
  padding:7px 10px 7px 4px;
  font-family:Georgia,"Times New Roman",serif;
  letter-spacing:.01em;
}
.promo-site .brand:hover{background:rgba(255,255,255,.035)}
.promo-site .brand img{width:40px;height:40px}
.promo-site .main-nav{
  gap:2px;
  border:0;
  background:transparent;
  padding:0;
  box-shadow:none;
}
.promo-site .main-nav>a:not(.nav-cta){
  min-height:40px;
  padding:0 13px;
  border-radius:11px;
  color:#d9dee5;
  background:transparent;
}
.promo-site .main-nav>a:not(.nav-cta):hover,
.promo-site .main-nav>a:not(.nav-cta).active{
  color:#fff;
  background:rgba(255,255,255,.055);
  box-shadow:none;
  transform:none;
}
.promo-site .main-nav .builder-nav{color:#e9c17f;background:transparent}
.promo-site .main-nav .beta-nav{color:#ff9ca3;background:transparent;box-shadow:none}
.promo-site .main-nav .builder-nav.active{background:rgba(214,168,107,.10)}
.promo-site .main-nav .beta-nav.active{background:rgba(226,50,62,.12)}
.promo-site .nav-cta{
  min-width:88px;
  height:40px;
  border-radius:11px;
  border:1px solid rgba(255,105,115,.20);
  background:rgba(226,50,62,.08);
  color:#fff;
  box-shadow:none;
}
.promo-site .nav-cta:hover{background:rgba(226,50,62,.14);border-color:rgba(255,105,115,.32)}

/* Start page: one statement, one logo, no dashboard look */
.human-hero{
  position:relative;
  min-height:100svh;
  padding:122px 0 80px;
  display:flex;
  align-items:center;
  overflow:hidden;
  background:#07090d;
}
.human-hero-bg{
  position:absolute;
  inset:0;
  background:url("images/hero.webp") center/cover no-repeat;
  filter:brightness(.40) saturate(.96) contrast(1.03);
  transform:scale(1.015);
}
.human-hero-shade{
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg,rgba(5,7,11,.95) 0%,rgba(5,7,11,.84) 42%,rgba(5,7,11,.50) 69%,rgba(5,7,11,.74) 100%),
    linear-gradient(180deg,rgba(5,7,11,.20),rgba(5,7,11,.28) 66%,#080a0e 100%);
}
.human-hero-inner{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:minmax(0,1.2fr) minmax(260px,.55fr);
  gap:70px;
  align-items:center;
  width:100%;
  padding-left:clamp(14px,1.2vw,26px);
}
.human-hero-copy{max-width:760px}
.human-beta-line{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
  margin-bottom:22px;
  color:#e7e9ee;
  font-size:12px;
  font-weight:750;
}
.human-beta-line>span{
  width:9px;height:9px;border-radius:50%;background:#a82d2d;
  box-shadow:0 0 0 5px rgba(255,92,103,.10);
}
.human-beta-line b{
  margin-left:6px;
  padding-left:16px;
  border-left:1px solid rgba(255,255,255,.15);
  color:#b7bec8;
  font-size:11px;
  font-weight:650;
}
.human-hero h1{
  margin:0 0 24px;
  max-width:760px;
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(60px,6.1vw,98px);
  line-height:.92;
  letter-spacing:-.045em;
  color:#f7f4ef;
  text-shadow:0 14px 36px rgba(0,0,0,.32);
}
.human-hero h1 em{
  color:#c95e5e;
  font-style:normal;
}
.human-hero-copy>p{
  max-width:690px;
  margin:0;
  color:#c7cdd6;
  font-size:18px;
  line-height:1.72;
}
.human-hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px}
.human-primary,.human-secondary{
  min-height:52px;
  padding:0 20px;
  border-radius:12px;
  font-size:13px;
  font-weight:760;
}
.human-primary{
  color:#fff;
  border:1px solid rgba(255,116,125,.32);
  background:#8B1A1A;
  box-shadow:0 12px 28px rgba(121,16,24,.24);
}
.human-primary:hover{background:#a22828;transform:translateY(-1px)}
.human-secondary{
  color:#eef1f5;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(9,12,17,.72);
}
.human-secondary:hover{background:rgba(18,22,29,.82);transform:translateY(-1px)}
.human-hero-note{
  margin-top:22px;
  max-width:650px;
  color:#89929e;
  font-size:12px;
  line-height:1.55;
}
.human-hero-brand{
  justify-self:end;
  width:min(100%,360px);
  text-align:center;
}
.human-hero-brand img{
  width:min(100%,295px);
  height:auto;
  filter:drop-shadow(0 28px 46px rgba(0,0,0,.45));
}
.human-hero-brand>div{
  display:flex;align-items:center;justify-content:center;gap:12px;margin-top:4px;
  color:#e9edf2;font-family:Georgia,"Times New Roman",serif;font-size:15px;letter-spacing:.08em;
}
.human-hero-brand>div span{width:34px;height:1px;background:rgba(255,255,255,.18)}
.human-hero-brand p{margin:8px 0 0;color:#9098a4;font-size:12px}
.human-scroll{bottom:22px}

/* Typography: ordinary site hierarchy instead of repeated fantasy promo headlines */
.promo-site .section-heading h2,
.promo-site .section-copy h2,
.promo-site .story-copy h2,
.promo-site .cinematic-copy h2,
.promo-site .community-copy h2,
.promo-site .fairplay-box h2{
  font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  font-weight:760;
  letter-spacing:-.035em;
  line-height:1.03;
  color:var(--human-text);
}
.promo-site .section-heading h2 span,
.promo-site .section-copy h2 span,
.promo-site .story-copy h2 span,
.promo-site .cinematic-copy h2 span,
.promo-site .community-copy h2 span,
.promo-site .fairplay-box h2 span{color:inherit}
.promo-site .section-copy h2,.promo-site .story-copy h2{font-size:clamp(38px,4vw,62px)}
.promo-site .section-heading h2,.promo-site .community-copy h2{font-size:clamp(36px,3.7vw,58px)}
.promo-site .cinematic-copy h2{font-size:clamp(42px,5vw,72px)}
.promo-site .kicker,.promo-site .promo-kicker{
  color:#bd5a5a;
  font-size:10px;
  font-weight:800;
  letter-spacing:.10em;
  text-transform:uppercase;
}
.promo-site .promo-kicker::before{background:#8B1A1A;opacity:.55}
.section{padding:96px 0}
.section-heading{margin-bottom:42px;align-items:end}
.section-copy p,.story-copy p,.section-heading p,.community-copy p{color:#aeb5bf;line-height:1.7}

/* Systems: looks written and built, not generated as six identical marketing cards */
.systems-grid{
  grid-template-columns:repeat(2,1fr);
  border:0;
  gap:0 42px;
}
.system-card{
  min-height:0;
  padding:24px 0 27px;
  border:0;
  border-bottom:1px solid var(--human-line);
  background:transparent;
  overflow:visible;
}
.system-card::before{display:none}
.system-card:hover{
  background:transparent;
  transform:none;
}
.system-card h3{font-size:20px;margin:0 0 8px;color:#f0f2f5}
.system-card p{max-width:540px;color:#969faa;font-size:14px;line-height:1.65}

/* Feature sections */
.story-grid{gap:64px}
.story-chip{
  left:20px;bottom:20px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(7,9,13,.78);
  color:#e8eaee;
  font-size:10px;
  letter-spacing:.08em;
}
.story-list>div{border-color:var(--human-line)}
.showcase-main figcaption{background:rgba(6,8,11,.76);font-size:13px}
.fairplay-box{
  grid-template-columns:1fr 1.15fr;
  gap:48px;
  padding:42px 46px;
  border-radius:18px;
  border:1px solid rgba(226,50,62,.18);
  border-left:3px solid #8B1A1A;
  background:#0c0f14;
  box-shadow:none;
}
.fairplay-mark{display:none}
.fairplay-box h2{font-size:clamp(36px,4vw,54px)}
.fairplay-box p{line-height:1.7}

/* Gallery: keep the screenshots dominant */
.gallery-section{background:#090c10}
.gallery-item{border-radius:15px;border-color:rgba(255,255,255,.09)}
.gallery-item:hover{transform:none;border-color:rgba(255,255,255,.17);box-shadow:0 16px 34px rgba(0,0,0,.24)}
.gallery-label{
  left:14px;bottom:14px;
  padding:9px 12px;
  border-radius:9px;
  background:rgba(7,9,13,.82);
  border:1px solid rgba(255,255,255,.10);
  backdrop-filter:blur(10px);
}
.gallery-label-icon{display:none}
.gallery-label strong{font-size:12px;font-weight:700}

/* Builder and Beta stay special because they are actual calls to action */
.builder-card h2,.beta-card h2{
  font-family:Georgia,"Times New Roman",serif;
  letter-spacing:-.035em;
  text-transform:none;
}
.builder-card h2{font-size:clamp(42px,4.3vw,62px)}
.beta-card h2{font-size:clamp(40px,4.1vw,58px);line-height:1.02}
.builder-kicker,.beta-kicker{font-family:ui-sans-serif,system-ui,sans-serif;letter-spacing:.12em}
.builder-lead,.beta-lead{line-height:1.7}
.builder-visual-kicker,.beta-visual-kicker{letter-spacing:.10em}
.builder-note,.beta-note{letter-spacing:0;line-height:1.5}
.builder-shell,.beta-shell{box-shadow:0 22px 60px rgba(0,0,0,.30)}

/* Community and contact: simpler blocks */
.social-grid{gap:10px}
.social-grid a{
  border-radius:13px;
  background:#0c0f14;
  box-shadow:none;
}
.social-grid a:hover{transform:none;border-color:rgba(255,255,255,.14);box-shadow:none}
.contact-grid-premium{
  grid-template-columns:repeat(2,1fr)!important;
  gap:1px;
  padding:1px;
  margin-top:38px;
  background:rgba(255,255,255,.08);
  border-radius:16px;
  overflow:hidden;
}
.contact-grid-premium .contact-card{
  min-height:178px;
  border:0!important;
  border-radius:0;
  padding:26px 52px 26px 26px;
  background:#0c0f14;
  box-shadow:none;
}
.contact-grid-premium .contact-card:hover{
  transform:none;
  background:#10131a;
  border:0!important;
  box-shadow:none;
}
.contact-grid-premium .contact-card small{color:#df5963;letter-spacing:.08em}
.contact-grid-premium .contact-card strong{font-size:19px}
.contact-grid-refined .contact-card-legal{grid-column:span 2}

/* Footer */
.site-footer{background:#07090d;border-top-color:rgba(255,255,255,.07)}
.footer-brand strong{font-family:Georgia,"Times New Roman",serif}

/* Subtle reveal only */
.reveal{transform:translateY(10px);transition:opacity .45s ease,transform .45s ease}
.reveal-delay{transition-delay:.06s}

@media (max-width:980px){
  .human-hero{padding-top:112px}
  .human-hero-inner{grid-template-columns:1fr;gap:34px}
  .human-hero-brand{justify-self:start;width:260px;text-align:left}
  .human-hero-brand img{width:210px}
  .human-hero-brand>div{justify-content:flex-start}
  .human-hero-brand>div span{display:none}
  .systems-grid{gap:0 28px}
  .fairplay-box{grid-template-columns:1fr;gap:18px}
}

@media (max-width:768px){
  html{scroll-padding-top:90px}
  [id]{scroll-margin-top:90px}
  .promo-site .site-header{top:9px;width:calc(100% - 14px);height:68px;border-radius:16px}
  .promo-site .brand img{width:36px;height:36px}
  .promo-site .main-nav{
    top:84px;
    width:calc(100% - 14px);
    padding:8px;
    border:1px solid rgba(255,255,255,.08);
    border-radius:16px;
    background:#0a0d12;
  }
  .human-hero{min-height:auto;padding:112px 0 70px}
  .human-hero-shade{background:linear-gradient(90deg,rgba(5,7,11,.94),rgba(5,7,11,.82)),linear-gradient(180deg,transparent,#080a0e)}
  .human-hero-inner{gap:26px}
  .human-hero h1{font-size:clamp(49px,14vw,72px);line-height:.94}
  .human-hero-copy>p{font-size:16px}
  .human-hero-actions{display:grid;grid-template-columns:1fr}
  .human-primary,.human-secondary{width:100%}
  .human-hero-brand{width:190px;margin-top:10px}
  .human-hero-brand img{width:160px}
  .human-scroll{display:none}
  .section{padding:76px 0}
  .systems-grid{grid-template-columns:1fr}
  .system-card{padding:21px 0 23px}
  .fairplay-box{padding:30px 24px}
  .contact-grid-premium{grid-template-columns:1fr!important}
  .contact-grid-refined .contact-card-legal{grid-column:auto}
}