/*
Theme Name: Xportpark Prelaunch v2.0
Theme URI: https://xportpark.com
Author: Xportpark Inc.
Description: Mobile-first pre-launch theme with hamburger menu.
Version: 2.0
Text Domain: xportpark-prelaunch
License: GPL-2.0-or-later
*/

:root{--navy:#0B1D39;--gold:#E3B341;--crimson:#A11D33;--slate:#5B6473;--cloud:#F3F5F9}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:var(--navy);background:#fff}
a{color:var(--navy);text-decoration:none}
a:hover{color:#A11D33}
.container{max-width:1140px;margin:0 auto;padding:0 16px}
h1,h2,h3,h4{font-family:Georgia,'Times New Roman',serif;margin:0 0 8px}
.lead{font-size:1.1rem;color:var(--slate)}
.small{font-size:.9rem;color:var(--slate)}
.button{background:var(--gold);color:var(--navy);padding:12px 18px;border-radius:999px;font-weight:700;display:inline-block}
.button.outline{background:transparent;border:2px solid var(--navy)}
.header{border-bottom:1px solid #EAEFF5;background:#fff;position:sticky;top:0;z-index:1000}
.header .inner{display:flex;align-items:center;justify-content:space-between;padding:8px 0}
.logo-title{display:flex;align-items:center;gap:10px}
img.logo{height:42px;width:auto;display:block}
.site-title{font-weight:800}
.nav{display:flex;align-items:center}
.nav ul{list-style:none;margin:0;padding:0;display:flex;gap:14px}
.nav a{font-weight:600}
.hamburger{display:none;background:none;border:none;padding:8px;margin-left:8px}
.hamburger .bar{display:block;width:24px;height:2px;background:var(--navy);margin:5px 0;transition:transform .2s ease,opacity .2s ease}
.hamburger.active .bar:nth-child(1){transform:translateY(7px) rotate(45deg)}
.hamburger.active .bar:nth-child(2){opacity:0}
.hamburger.active .bar:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.mobile-menu{display:none;position:fixed;inset:0;background:rgba(11,29,57,0.92);color:#fff;z-index:999}
.mobile-menu .panel{padding:60px 24px}
.mobile-menu a{color:#fff;display:block;font-size:1.2rem;padding:12px 0;border-bottom:1px solid rgba(255,255,255,.12)}
.mobile-menu .close{position:absolute;top:14px;right:16px;background:none;border:2px solid #fff;color:#fff;border-radius:999px;padding:6px 10px;font-weight:700}
.hero{padding:56px 0}
.grid{display:grid;gap:20px}
.grid.cols-4{grid-template-columns:repeat(4,1fr)}
.grid.cols-3{grid-template-columns:repeat(3,1fr)}
.grid.cols-2{grid-template-columns:repeat(2,1fr)}
.card{background:#fff;border-radius:12px;box-shadow:0 8px 24px rgba(11,29,57,.08);padding:20px}
.section{padding:32px 0}
.section.alt{background:var(--cloud)}
.badges{display:flex;gap:10px;flex-wrap:wrap;margin-top:10px}
.badge{background:#fff;border:1px solid #EAEFF5;border-radius:999px;padding:6px 10px;font-size:.9rem}
.kpis{display:flex;gap:12px;flex-wrap:wrap;margin-top:10px}
.kpi{background:#fff;border:1px solid #EAEFF5;border-radius:8px;padding:8px 10px;min-width:110px;text-align:center}
.form-row{display:flex;gap:10px;flex-wrap:wrap}
.form-row input,.form-row select{flex:1;min-width:210px;padding:12px;border:1px solid #E1E5EC;border-radius:8px}
.form-row button{padding:12px 20px;border:none;border-radius:999px;background:var(--gold);color:var(--navy);font-weight:700}
.footer{background:var(--navy);color:#fff;padding:36px 0;margin-top:40px}
.footer a{color:#fff;opacity:.9}
@media (max-width:960px){.grid.cols-4{grid-template-columns:1fr 1fr}.grid.cols-3{grid-template-columns:1fr 1fr}}
@media (max-width:768px){.nav ul{display:none}.hamburger{display:inline-block}.grid.cols-2,.grid.cols-3,.grid.cols-4{grid-template-columns:1fr}.lead{font-size:1rem}}
/* CEO section */
.ceo-section { background: var(--cloud); padding: 40px 0; }
.ceo-wrap { display: grid; grid-template-columns: 320px 1fr; gap: 28px; align-items: center; }

.ceo-media img {
  width: 100%; max-width: 320px; height: auto;
  border-radius: 16px; box-shadow: 0 10px 30px rgba(11,29,57,.12);
  background: #fff; padding: 10px;
}

.ceo-content { color: var(--navy); }
.ceo-title { margin: 0 0 6px; }
.ceo-lead { font-size: 1.05rem; color: var(--slate); margin: 6px 0 14px; }

.ceo-body p { margin: 10px 0; line-height: 1.6; }
.kpi-highlight { color: var(--gold); font-weight: 800; }

.ceo-signoff { margin-top: 10px; }
.ceo-signoff .name { font-weight: 800; margin: 0; }
.ceo-signoff .title { margin: 2px 0 0; color: var(--slate); }

.ceo-cta { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 16px; }

/* Responsive */
@media (max-width: 900px) {
  .ceo-wrap { grid-template-columns: 1fr; }
  .ceo-media { order: -1; text-align: center; }
  .ceo-media img { margin: 0 auto; }
}
/* CEO portrait sizing fix */
.ceo-media img {
  max-width: 220px;   /* set a reasonable max width */
  width: 100%;        /* responsive within that max */
  height: auto;       /* keeps proportions */
  margin: 0 auto;     /* centers on smaller screens */
  display: block;
  border-radius: 12px; /* optional: rounded corners */
  box-shadow: 0 6px 16px rgba(0,0,0,0.1); /* optional: soft shadow */
}