@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;600;800&display=swap');

:root{
  --font-sans: 'Inter', system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji";
  --hero-speed: 5000ms;          /* default auto-advance */
  --hero-fade: 600ms;            /* transition duration */
  --hero-overlay: rgba(0,0,0,.35); /* overlay darkness */
}

html, body { font-family: var(--font-sans); background:#0a0a0a; color:#eee; }
:root{--accent:#ff5a00;}
*{box-sizing:border-box}
body{margin:0;font:16px/1.6 system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:#111;background:#fff}
a{color:var(--accent);text-decoration:none}
header,footer{max-width:none;margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw);padding:0px}
main{max-width:none; margin:0 auto;padding:24px 16px; padding-top: 0;}
.nav{display:flex;gap:16px;align-items:center;justify-content:space-between}
.logo{font-weight:800;letter-spacing:.3px}
.btn{display:inline-block;padding:10px 14px;border:1px solid #ddd;border-radius:10px}
.grid{display:grid;gap:16px}
.cards{grid-template-columns:repeat(auto-fill,minmax(240px,1fr))}
.card{border:1px solid #eee;border-radius:12px;overflow:hidden;display:flex;flex-direction:column}
.card img{width:100%;height:140px;object-fit:cover}
.card .pad{padding:12px}
.hero{display:grid;gap:10px;padding:0px 0; margin-top: 0;}
.hero h1{margin:0}
.gallery{grid-template-columns:repeat(auto-fill,minmax(180px,1fr))}
.gallery img{width:100%;height:160px;object-fit:cover;border-radius:10px}
.video{position:relative;padding-top:56.25%;border-radius:10px;overflow:hidden}
.video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.footer{border-top:1px solid #eee;color:#555}

body { margin: 0; }              /* remove default browser margin */
main { margin-top: 0; padding: 0; }
main > :first-child { margin-top: 0; }

.full-bleed {
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
}

.page {
  max-width: 1100px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 1.5rem;
  padding-right: 1.5rem;
}

.intro {
  display: flex;
  flex-direction: column;
  align-items: center;     /* center horizontally */
  justify-content: center; /* center vertically if you set a min-height */
  text-align: center;
  padding: 3rem 1rem;
  background: #fafafa;
}

/* Make the main intro title bigger + italic */
.intro-title em {
  font-style: italic;
  font-size: clamp(2.2rem, 6vw, 3.5rem); /* responsive size */
  display: block;
  margin-bottom: 1rem;
}

/* Button style */
.btn-primary {
  display: inline-block;
  margin-top: 1.5rem;
  padding: 0.75rem 1.5rem;
  background: var(--accent, #2337ff);
  color: #fff;
  font-weight: 600;
  border-radius: 999px;
  text-decoration: none;
  transition: background 0.2s ease;
}

.btn-primary:hover {
  background: var(--accent-dark, #000d8a);
}

/* Section title style for consistency */
.section-title {
  text-align: center;
  font-size: clamp(1.4rem, 2.4vw, 2rem);
  font-weight: 800;
  margin: 1.5rem 0 1rem;
}

/* Responsive grid for the cards */
.grid.cards {
  display: grid;
  grid-template-columns: repeat( auto-fit, minmax(260px, 1fr) );
  gap: 20px;
  margin-top: 1rem;
}

.section-title {
  text-align: center;
  font-size: 2rem;
  font-weight: 800;
  margin: 2rem 0 1rem;
  color: #111;
}

.content-section {
  margin-top: 2.5rem;
}

html, body { overflow-x: hidden; }

/* Reserve space for the fixed header globally */
:root { --header-h: 76px; }      /* fallback */
body { padding-top: var(--header-h); }

.full-bleed:first-child { margin-top: 0; }