/* =======================
   EPOXY.AC – core styles
   Bootstrap-free, single file
   ======================= */

/* ---- CSS Custom Props ---- */
:root{
  --brand:#004080;
  --brand-2:#4278BE;  
  --bg:#f9f9f9;
  --text:#222;
  --muted:#667;
  --radius:8px;
  --maxw:950px;
}

/* ---- Base / Reset (light) ---- */
*{box-sizing:border-box}
html,body{margin:0;padding:0}
img{max-width:100%;height:auto;display:block}


/* System fonts ) */
body{
  font-family: Georgia,"Times New Roman",Times,serif;
  
  background:var(--bg);
  color:var(--text);
  line-height:1.6;
}

/* ---- Typography ---- */
h1,h2,h3{line-height:1.2;margin:0 0 .75rem}
h1{font-size:clamp(28px,4vw,40px)}
h2{font-size:clamp(22px,3vw,28px)}
.lead{font-size:1.125rem;color:var(--muted)}
.text-center{text-align:center}
.list-unstyled{list-style:none;padding-left:0;margin:0}

/* ---- Links ---- */
a{color:#0a58ca;text-decoration:none}
a:hover{text-decoration:underline}

/* ---- Layout (Container / Grid) ---- */
.container{max-width:var(--maxw);margin:0 auto;padding:0 1rem}
.container-fluid{width:100%;margin:0;padding:0}

.row{
  display:flex;flex-wrap:wrap;
  margin-left:-.75rem;margin-right:-.75rem
}
.row > [class^="col-"], .row > [class*=" col-"]{
  padding-left:.75rem;padding-right:.75rem;
  flex:0 0 100%;
}

/* Breakpoints: md ≥ 768px */
@media (min-width:768px){
  .col-md-3{flex:0 0 25%;max-width:25%}
  .col-md-4{flex:0 0 33.333%;max-width:33.333%}
  .col-md-6{flex:0 0 50%;max-width:50%}
  .col-md-8{flex:0 0 66.666%;max-width:66.666%}
  .col-md-9{flex:0 0 75%;max-width:75%}
}

/* ---- Utilities ) ---- */
.mb-4{margin-bottom:1.5rem}
.px-3{padding-left:1rem;padding-right:1rem}

/* ---- Sidebar ---- */
.sidebar{
  background-color:var(--brand-2);
  min-height:100vh;
  padding-top:2rem;
  color:#fff;
}
.sidebar a{
  color:#fff;display:block;margin:.8rem 0;
  font-weight:500;text-decoration:none
}
.sidebar a:hover{color:#fff;text-decoration:underline}

/* ---- Content Card ---- */
.content{
  background:#fff;border-radius:var(--radius);
  box-shadow:0 1px 10px rgba(0,0,0,.06);
  margin:2rem;padding:2rem;
}


.site-header{
  background:none;color:inherit;padding:0
}

/* ---- Main spacing ---- */
main{padding:0} 

/* ---- Footer ---- */
footer{
  background:#00222e;color:#ccc;text-align:center;
  font-size:10pt;padding:1rem;margin-top:2rem
}
footer a{color:#99ccff;margin:0 10px;font-weight:500}
footer a:hover{color:#fff;text-decoration:underline}

/* ---- Images (CLS-safe) ---- */
.logo img{width:200px;height:auto;padding-left:1rem}

/* ---- Lists inside content ---- */
.content ul{padding-left:1.2rem}



/* ---- Accessibility helper ---- */
.visually-hidden{
  position:absolute!important;width:1px;height:1px;
  padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);
  white-space:nowrap;border:0
}


