/* Color scheme */
:root{
  --blue-900:#004080;
  --blue-600:#0073e6;
  --gray-50:#f5f5f5;
  --text-900:#0b1220;
  --text-600:#465169;
  --bg:#ffffff;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0; font-family: 'Roboto', system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color:var(--text-900); background:var(--bg);
}

h1,h2,h3{ font-family: 'Montserrat', ui-sans-serif; margin:0 0 .5rem; color:var(--blue-900)}
h1{ font-size: clamp(2rem,4vw,3rem);}
h2{ font-size: clamp(1.4rem,3vw,2rem);}
h3{ font-size: clamp(1.1rem,2.2vw,1.3rem);} 
.lead{ font-size:clamp(1rem,2.2vw,1.25rem); color:var(--text-600)}
.muted{ color:var(--text-600)}

.container{ width:min(1100px, 92%); margin-inline:auto}
.section{ padding:72px 0}
.section.alt{ background:var(--gray-50)}
.grid-2{ display:grid; grid-template-columns:1.1fr .9fr; gap:32px}
@media (max-width: 900px){ .grid-2{ grid-template-columns:1fr } }

/* Header */
.site-header{ position:sticky; top:0; z-index:10; background:#fff; border-bottom:1px solid #e6e9ef }
.header-inner{ display:flex; align-items:center; justify-content:space-between; padding:8px 0; gap:16px }
.brand{ display:inline-flex; align-items:center; text-decoration:none }
.brand img{ height:120px; width:auto; display:block }
.site-nav ul{ list-style:none; display:flex; gap:20px; padding:0; margin:0 }
.site-nav a{ color:var(--text-900); text-decoration:none }
.site-nav a:focus, .site-nav a:hover{ color:var(--blue-600) }
.lang-switch{ display:flex; align-items:center; gap:8px }
.lang-switch .btn-ghost{ background:transparent; border:none; color:var(--text-900); cursor:pointer; padding:6px 8px; border-radius:6px }
.lang-switch .btn-ghost[aria-current="true"]{ color:#fff; background:var(--blue-600) }
.lang-switch .divider{ color:#c0c8d6 }

@media (max-width: 900px){
  .brand img{ height:80px }
  .site-nav ul{ gap:12px }
}

/* Hero */
.hero .shape{ width:100%; height:260px; background:linear-gradient(135deg,var(--blue-900),var(--blue-600)); border-radius:16px; filter:drop-shadow(0 20px 40px rgba(0,64,128,.18));}
.hero-visual img{ width:100%; height:auto; border-radius:16px; box-shadow:0 20px 40px rgba(0,64,128,.18); object-fit:cover }
.hero .cta{ display:flex; gap:12px; margin-top:20px }

/* Buttons */
.btn{ display:inline-flex; align-items:center; gap:10px; padding:10px 16px; border-radius:10px; text-decoration:none; cursor:pointer; border:1px solid transparent; font-weight:500 }
.btn.primary{ background:var(--blue-600); color:#fff }
.btn.primary:hover{ filter:brightness(1.05) }
.btn.secondary{ background:#fff; color:var(--blue-600); border-color:var(--blue-600) }

/* Cards */
.cards{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:16px }
.card{ background:#fff; border:1px solid #e6e9ef; border-radius:12px; padding:18px }
@media (max-width: 900px){ .cards{ grid-template-columns:1fr } }

/* CEO box */
.ceo-box{ display:flex; gap:16px; align-items:flex-start; background:#fff; border:1px solid #e6e9ef; border-radius:14px; padding:16px; box-shadow:0 6px 18px rgba(0,0,0,.04) }
.ceo-photo{ width:88px; height:88px; border-radius:50%; background:linear-gradient(135deg,var(--blue-900),var(--blue-600)); flex:0 0 auto; background-image:url('/assets/images/greg.jpg'); background-size:cover; background-position:center }
.ceo-quote{ margin:0 }
.ceo-quote footer{ color:var(--text-600); margin-top:6px }

/* Timeline */
.timeline{ position:relative; display:grid; gap:16px; margin-top:16px }
.timeline-row{ display:grid; grid-template-columns:120px 20px 1fr; align-items:start; gap:12px }
.timeline-year{ font-weight:700; color:var(--blue-900) }
.timeline-dot{ width:12px; height:12px; border-radius:50%; background:var(--blue-600); margin-top:8px; box-shadow:0 0 0 3px rgba(0,115,230,.15) }
.timeline-card{ background:#fff; border:1px solid #e6e9ef; border-radius:12px; padding:14px }
.timeline-label{ font-weight:600 }
@media (max-width:700px){ .timeline-row{ grid-template-columns:90px 20px 1fr } }

/* Values grid */
.values-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-top:16px }
@media (max-width:1100px){ .values-grid{ grid-template-columns:repeat(3,1fr) } }
@media (max-width:800px){ .values-grid{ grid-template-columns:repeat(2,1fr) } }
@media (max-width:520px){ .values-grid{ grid-template-columns:1fr } }

/* Reveal animation */
[data-reveal]{ opacity:0; transform: translateY(10px); transition: opacity .5s ease, transform .5s ease }
.revealed{ opacity:1; transform:none }

/* Portfolio */
.portfolio-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px}
.portfolio-item{ background:#fff; border:1px solid #e6e9ef; border-radius:12px; overflow:hidden }
.portfolio-item a{ display:flex; padding:18px; align-items:center; gap:12px; text-decoration:none; color:inherit }
.portfolio-item img{ width:44px; height:44px; object-fit:contain }
.portfolio-item .title{ font-weight:600 }
@media (max-width:1100px){ .portfolio-grid{ grid-template-columns:repeat(3,1fr) } }
@media (max-width:800px){ .portfolio-grid{ grid-template-columns:repeat(2,1fr) } }
@media (max-width:520px){ .portfolio-grid{ grid-template-columns:1fr } }

/* Team */
.team-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:16px }
@media (max-width:1100px){ .team-grid{ grid-template-columns:repeat(2,1fr) } }
@media (max-width:640px){ .team-grid{ grid-template-columns:1fr } }
.team-card{ display:flex; flex-direction:column; gap:12px }
.team-card-head{ display:flex; gap:12px; align-items:center }
.team-avatar{ width:64px; height:64px; border-radius:50%; object-fit:cover; flex:0 0 auto; background:linear-gradient(135deg,var(--blue-900),var(--blue-600)); color:#fff; display:inline-flex; align-items:center; justify-content:center; font-weight:700 }
.team-avatar-fallback{ font-size:18px }
.team-card-meta .team-name{ margin:0; font-size:1.05rem }
.team-bio{ margin:0 }
.team-links a{ color:var(--blue-600); text-decoration:none }
.team-links a:hover{ text-decoration:underline }

/* Contact */
.form-field{ display:grid; gap:6px; margin-bottom:12px }
.form-field input, .form-field textarea{ padding:10px 12px; border:1px solid #d7dbe5; border-radius:10px; font:inherit }
.form-actions{ margin-top:8px }
.form-status{ margin-top:10px }
.map-responsive{ position:relative; padding-bottom:56.25%; height:0; overflow:hidden; border-radius:12px; border:1px solid #e6e9ef }
.map-responsive iframe{ position:absolute; top:0; left:0; width:100%; height:100%; border:0 }

/* Footer */
.site-footer{ border-top:1px solid #e6e9ef; padding:24px 0; background:#fff; color:var(--text-600) }

/* Accessibility */
.skip-link{ position:absolute; left:-10000px; top:auto; width:1px; height:1px; overflow:hidden }
.skip-link:focus{ position:static; width:auto; height:auto }
:focus-visible{ outline:3px solid var(--blue-600); outline-offset:3px }