/* ==========================================================================
   Landmark Development Construction — Base Styles
   Design tokens, resets, and global typography.
   ========================================================================== */

:root{
  /* Brand colors */
  --navy:#283090;
  --navy-deep:#141A52;
  --brick:#E31E24;
  --brick-dark:#B3151B;
  --gold:#F58A1F;
  --gold-light:#FFB35C;
  --amber:#F58A1F;
  --indigo:#283090;
  --cream:#FAF8F4;
  --ink:#1B1F27;
  --gray:#6E6A63;
  --line: rgba(40,48,144,0.12);

  /* Layout */
  --container-width: 1200px;
  --header-h: 84px;

  /* Header — premium palette (scoped to header only) */
  --header-navy:#283090;
  --header-gold:#F58A1F;
  --header-blue-soft:#EAF2FC;
  --header-gray:#687184;
  --header-max-width: 1200px;

  /* Typography */
  --font-heading: 'Poppins', sans-serif;
  --font-body: 'Poppins', sans-serif;
}

*,
*::before,
*::after{
  margin:0;
  padding:0;
  box-sizing:border-box;
}

html{
  scroll-behavior:smooth;
}

body{
  font-family:var(--font-body);
  color:var(--ink);
  background:var(--cream);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}

img{
  max-width:100%;
  display:block;
}

a{
  color:inherit;
}

h1, h2, h3, h4{
  font-family:var(--font-heading);
  color:var(--navy);
  line-height:1.2;
}

/* Shared page container — keeps every section aligned to the same
   1200px content width used by the header. */
.container{
  max-width:var(--container-width);
  margin:0 auto;
  padding:0 32px;
}

/* Generic placeholder used on scaffold pages until real page content
   is designed. Safe to delete once a page's real layout is built. */
.page-placeholder{
  padding:80px 0;
}
.page-placeholder h1{
  font-size:32px;
  font-weight:600;
  margin-bottom:12px;
}
.page-placeholder p{
  color:var(--gray);
  font-size:15px;
  max-width:560px;
}

/* Screen-reader-only text — kept in the layout for assistive tech
   (e.g. live search-result announcements) without being visible. */
.sr-only{
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0;
}

@media (max-width: 480px){
  .container{ padding:0 16px; }
  .page-placeholder{ padding:48px 0; }
  .page-placeholder h1{ font-size:24px; }
}
