/* Beamicon2-Basic Modern (Siemens-inspired, clean industrial look)
   Keep lightweight and override templatemo styles without breaking layout.
*/

:root{
  --bg:#ffffff;
  --surface:#f5f7f9;
  --text:#111827;
  --muted:#4b5563;
  --border:#e5e7eb;
  --accent:#009999; /* teal industrial accent */
  --accent-dark:#007f7f;
  --shadow: 0 10px 30px rgba(17,24,39,.08);
  --radius: 14px;
}

html,body{height:100%}
body{
  background:var(--bg);
  color:var(--text);
  font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Inter,Arial,"Noto Sans","Helvetica Neue",sans-serif;
  line-height:1.55;
}

/* Navbar */
.navbar{
  background:#fff !important;
  border-bottom:1px solid var(--border);
  padding: .8rem 0;
}
.navbar-brand{
  font-weight:700;
  letter-spacing:.2px;
  color:var(--text) !important;
}
.navbar .nav-link{
  color:var(--muted) !important;
  font-weight:600;
  padding:.6rem .9rem !important;
}
.navbar .nav-link:hover,
.navbar .nav-link:focus{
  color:var(--text) !important;
}
.navbar .nav-link.btn-linklike{
  border:1px solid var(--border);
  border-radius: 999px;
}
.lang-switch{
  display:flex;
  gap:.4rem;
  align-items:center;
  margin-left: .75rem;
}
.lang-switch a{
  font-weight:700;
  color:var(--muted);
  border:1px solid var(--border);
  border-radius: 999px;
  padding:.35rem .55rem;
  text-decoration:none;
}
.lang-switch a.active{
  color:#fff;
  background:var(--accent);
  border-color:var(--accent);
}
.lang-switch a:hover{color:var(--text)}

/* Sections */
.section{
  padding: 72px 0;
}
.section.section-surface{
  background: var(--surface);
  border-top:1px solid var(--border);
  border-bottom:1px solid var(--border);
}
.kicker{
  text-transform:uppercase;
  letter-spacing:.14em;
  font-weight:800;
  font-size:.78rem;
  color:var(--accent);
  margin-bottom:.75rem;
}
.h1{
  font-size: clamp(2rem, 3.4vw, 3.05rem);
  line-height:1.1;
  font-weight:800;
  margin:0 0 1rem 0;
}
.h2{
  font-size: clamp(1.45rem, 2.1vw, 2.1rem);
  line-height:1.15;
  font-weight:800;
  margin:0 0 1rem 0;
}
.lead{
  font-size:1.05rem;
  color:var(--muted);
  margin-bottom: 1.35rem;
}

/* Hero */
.hero-modern{
  padding: 84px 0 64px 0;
  background:
    radial-gradient(1200px 500px at 80% 20%, rgba(0,153,153,.10), transparent 60%),
    radial-gradient(900px 500px at 20% 30%, rgba(17,24,39,.06), transparent 55%),
    #fff;
}
.hero-card{
  background:#fff;
  border:1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding: 26px;
}
.hero-meta{
  display:flex;
  gap:.6rem;
  flex-wrap:wrap;
  margin-top: 1rem;
}
.badge-pill{
  display:inline-flex;
  align-items:center;
  gap:.4rem;
  font-weight:700;
  color:var(--muted);
  border:1px solid var(--border);
  border-radius:999px;
  padding:.35rem .6rem;
  background:#fff;
}
.hero-image-frame{
  border-radius: var(--radius);
  border:1px solid var(--border);
  background: linear-gradient(180deg, rgba(0,153,153,.10), rgba(255,255,255,0));
  box-shadow: var(--shadow);
  overflow:hidden;
}

/* Buttons */
.btn-accent{
  background:var(--accent) !important;
  color:#fff !important;
  border:1px solid var(--accent) !important;
  border-radius: 12px !important;
  font-weight:800 !important;
  padding:.85rem 1.1rem !important;
}
.btn-accent:hover{background:var(--accent-dark) !important; border-color:var(--accent-dark) !important}
.btn-ghost{
  background:#fff !important;
  color:var(--text) !important;
  border:1px solid var(--border) !important;
  border-radius: 12px !important;
  font-weight:800 !important;
  padding:.85rem 1.1rem !important;
}
.btn-ghost:hover{border-color:#cfd5df !important}

/* Cards */
.card-lite{
  border:1px solid var(--border) !important;
  border-radius: var(--radius) !important;
  box-shadow: none;
  background:#fff;
}
.card-lite .card-body{padding: 18px}
.icon-dot{
  width: 12px;
  height: 12px;
  border-radius: 999px;
  background: var(--accent);
  display:inline-block;
  margin-right: .55rem;
}
.small-muted{color:var(--muted); font-size:.95rem}
.list-check{
  list-style:none;
  padding-left:0;
  margin:0;
}
.list-check li{
  padding-left: 1.6rem;
  position:relative;
  margin: .5rem 0;
  color: var(--muted);
  font-weight:600;
}
.list-check li:before{
  content:"✓";
  position:absolute;
  left:0;
  top:0;
  color:var(--accent);
  font-weight:900;
}

/* Accordions */
.accordion .card{
  border:1px solid var(--border) !important;
  border-radius: 12px !important;
  overflow:hidden;
}
.accordion .card-header{
  background:#fff !important;
  border-bottom:1px solid var(--border) !important;
}
.accordion .btn{
  font-weight:800 !important;
  color:var(--text) !important;
  text-decoration:none !important;
}

/* Tables */
.table-modern{
  border:1px solid var(--border);
  border-radius: var(--radius);
  overflow:hidden;
  background:#fff;
}
.table-modern thead th{
  background: var(--surface);
  border-bottom:1px solid var(--border) !important;
  color:var(--muted);
  text-transform:uppercase;
  letter-spacing:.08em;
  font-size:.78rem;
}
.table-modern td, .table-modern th{border-top:1px solid var(--border) !important}
.table-modern td{vertical-align: middle}

/* Footer */
.footer-modern{
  padding: 44px 0;
  border-top:1px solid var(--border);
  background:#fff;
}
.footer-modern a{color:var(--muted)}
.footer-modern a:hover{color:var(--text); text-decoration:none}

/* Reduce template leftovers */
.hero, .site-footer{display:none !important;}
.about, .project, .testimonial, .contact{padding:0 !important;}
.about-info p{color:var(--muted)}
