:root{
  --bg:#f7f9fc; --card:#ffffff; --text:#0f1720; --muted:#445469;
  --brand:#0e3e73; --accent:#0aa368; --ring:rgba(14,62,115,.15);
  --border:rgba(0,0,0,.10);
}
*{box-sizing:border-box}
html,body{margin:0; padding:0}
body{font:16px/1.6 system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Helvetica,Arial; color:var(--text); background:var(--bg);}
img{max-width:100%; height:auto; display:block}
a{color:#0e3e73; text-decoration:none}
a.more{font-weight:600}
.container{max-width:1150px; margin:0 auto; padding:0 20px}
.skip{position:absolute; left:-999px; top:auto; width:1px; height:1px; overflow:hidden}
.skip:focus{left:12px; top:12px; width:auto; height:auto; padding:8px 10px; background:#fff; border:1px solid var(--border); border-radius:8px; z-index:999}

/* Header */
.site-header{position:sticky; top:0; z-index:20; background:#fff; border-bottom:1px solid var(--border); transition:box-shadow .2s ease}
.site-header.shrink{box-shadow:0 6px 20px -12px rgba(0,0,0,.25)}
.nav{display:flex; align-items:center; gap:16px; padding:10px 0}
.brand{display:flex; align-items:center; gap:12px}
.brand-logo{width:220px; height:auto}
.brand-text{display:flex; flex-direction:column}
.brand-text span{color:var(--muted); font-size:13px}
/* menu right */
nav ul{display:flex; gap:20px; list-style:none; margin:0 0 0 auto; padding:0; align-items:center}
nav a{color:#0f1720}
.nav-toggle{display:none; background:none; border:1px solid var(--border); padding:8px 10px; border-radius:10px; color:#0f1720}
@media (max-width:860px){
  .nav-toggle{display:block}
  nav ul{display:none; position:absolute; right:20px; top:64px; background:#fff; border:1px solid var(--border); padding:14px; border-radius:12px; flex-direction:column; min-width:220px}
  nav ul.open{display:flex}
}

/* Buttons & Chips */
.btn{display:inline-block; padding:10px 14px; border-radius:12px; border:1px solid var(--border); color:var(--text)}
.btn.primary{background:linear-gradient(135deg, var(--brand), var(--accent)); border:none; color:white}
.btn.small{padding:6px 10px; font-size:14px}
.tag{font-size:12px; color:var(--muted); border:1px solid var(--border); padding:4px 8px; border-radius:999px}

/* Cards/grid using auto-fit (robust across browsers) */
.cards.auto{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(260px, 1fr));
  gap:16px;
}
.card{background:#fff; border:1px solid var(--border); border-radius:16px; padding:16px}
.card.compact img{border:1px solid var(--border); border-radius:12px; margin-bottom:10px}

/* Hero */
.hero{padding:24px 0 8px}
.hero-title{font-size: clamp(28px, 4vw, 44px); line-height:1.1; text-align:center; margin:6px 0 4px}
.hero-sub{color:var(--muted); text-align:center; margin:0 0 16px}
.cta-row{display:flex; gap:12px; flex-wrap:wrap; justify-content:center}

/* Sections */
.section-title{margin:22px 0 12px}

/* Companies page */
.companies-list .company-card{display:grid; grid-template-columns:120px 1fr; gap:14px; align-items:center}
.company-logo{width:100%; border-radius:12px; border:1px solid var(--border); background:white; padding:6px}
@media (max-width:640px){
  .companies-list .company-card{grid-template-columns:1fr}
}

/* Contact */
.split{display:grid; grid-template-columns:1.1fr .9fr; gap:18px}
@media (max-width:900px){ .split{grid-template-columns:1fr} }
.form-card .field{display:flex; flex-direction:column; margin-bottom:12px}
.form-card input, .form-card textarea{border:1px solid var(--border); background:transparent; color:var(--text); padding:12px 14px; border-radius:12px}
.form-card input:focus, .form-card textarea:focus{outline:none; box-shadow:0 0 0 4px var(--ring)}
.error-msg{display:none; color:#c62828; font-size:13px}
.captcha{margin:12px 0; border:1px dashed var(--border); border-radius:12px; padding:10px; background:#fff}
.captcha-row{display:flex; gap:10px; align-items:center}
#captcha-question{font-weight:600}
.form-success{color:#2e7d32}
.form-note{color:var(--muted); font-size:14px}

/* Footer */
.site-footer{padding:36px 0 60px; color:var(--muted)}
.footer-inner{display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap}
.footer-links a{margin-left:14px}

/* Companies page alignment fixes */
.companies-list.cards.auto{
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
}
.companies-list .company-card{
  align-items: start;
}
.company-logo{
  width:100%;
  height:84px;
  object-fit:contain;
  background:#fff;
}

/* --- Company title containment fixes --- */
.companies-list .company-card{
  grid-template-columns: 140px minmax(0,1fr); /* prevent overflow from the content track */
  align-items: start;
}
.company-content{ min-width: 0; } /* allow children to shrink within grid cell */
.company-content h3{
  font-size: clamp(16px, 2.2vw, 20px);
  line-height: 1.25;
  margin: 4px 0 6px;
  overflow-wrap: anywhere;     /* break long domains/words gracefully */
  word-break: break-word;      /* legacy fallback */
  hyphens: auto;               /* enable hyphenation where allowed */
  display: -webkit-box;        /* multi-line clamp support */
  -webkit-line-clamp: 3;
  line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;            /* ensure title stays inside the card */
}
.company-content p{ margin-top: 0; }
@media (max-width:640px){
  .companies-list .company-card{ grid-template-columns: 1fr; }
}

/* --- Companies page: center logos at top --- */
.companies-list .company-card{
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 16px;
}
.company-logo{
  height: 84px;
  width: auto;
  margin: 0 auto 10px auto;
  object-fit: contain;
}
.company-content{
  min-width: 0;
  width: 100%;
}
.company-content h3{
  text-align: center;
}

/* --- Companies page: center all content under logo --- */
.company-content{
  text-align: center;
}
.company-content .tag{
  display: inline-block;
  margin: 0 auto 6px auto;
}
.company-content p{
  text-align: center;
}
.company-content a.more{
  display: inline-block;
  margin-top: 8px;
}

/* --- Companies page: uniform card heights --- */
.companies-list{
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 18px;
  align-items: stretch;
}
.companies-list .company-card{
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 16px;
  height: 100%;
}
.companies-list .company-card .company-content{
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}
.companies-list .company-card .company-content h3,
.companies-list .company-card .company-content p,
.companies-list .company-card .company-content a{
  flex-shrink: 0;
}

/* --- Uniform height for all cards (Strategy, Companies, Contact) --- */
.cards.auto{
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 18px;
  align-items: stretch;
}
.cards.auto .card{
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  height: 100%;
}
.cards.auto .card h3,
.cards.auto .card p,
.cards.auto .card a{
  flex-shrink: 0;
}
.split{
  align-items: stretch;
}
.split .card{
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  height: 100%;
}

/* --- Header menu fully right-aligned --- */
.nav{justify-content: space-between;}
nav{margin-left: auto;}
nav ul{margin-left: auto; justify-content: flex-end;}

/* --- Smaller logos in Selected Companies section on index --- */
.cards.auto .card.compact img{
  max-height: 60px;
  width: auto;
  margin: 0 auto 8px auto;
  object-fit: contain;
}

/* --- Smaller main logo in header --- */
.brand-logo{
  width:160px !important;
  height:auto;
}
