:root{
  --pitt-blue:#003594;
  --pitt-gold:#FFB81C;
  --text:#1a1a1a;
  --bg:#ffffff;
  --muted:#666;
  --max-width:860px;   /* base page width */
  --radius:8px;
  --measure:65ch;      /* readable line length (desktop only) */
}

/* ============== BASE ============== */
*{box-sizing:border-box;}
body{
  margin:0;
  font-family:Inter, system-ui, -apple-system, sans-serif;
  color:var(--text);
  background:var(--bg);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4{
  font-family:Merriweather, serif;
  margin-top:2rem;
  margin-bottom:0.75rem;
  line-height:1.3;
}
p{margin:0 0 1rem;}
a{color:var(--pitt-blue); text-decoration:none;}
a:hover,a:focus{text-decoration:underline;}

.container{
  width:100%;
  max-width:var(--max-width);
  margin:0 auto;
  padding:0 1rem 3rem;
}

.site-header{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:0.75rem 1rem;
  border-bottom:4px solid var(--pitt-blue);
  position:sticky;
  top:0;
  background:var(--bg);
  z-index:1000;
}
.site-title{font-weight:600; font-size:1.15rem; color:var(--text);}

.site-nav ul{
  list-style:none;
  margin:0;
  padding:0;
  display:flex;
  gap:1rem;
}
.nav-toggle{
  display:none;
  font-size:1.3rem;
  background:none;
  border:none;
  cursor:pointer;
}

.btn{
  display:inline-block;
  padding:0.5rem 0.9rem;
  border-radius:var(--radius);
  border:2px solid var(--pitt-blue);
  color:var(--pitt-blue);
  font-weight:600;
}
.btn:hover{
  background:var(--pitt-blue);
  color:#fff;
  text-decoration:none;
}

.site-footer{
  padding:2rem 1rem;
  text-align:center;
  border-top:1px solid #e5e5e5;
  color:var(--muted);
  font-size:0.9rem;
}

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

figure{margin:1.5rem 0;}
figcaption{font-size:0.85rem; color:var(--muted);}

table{
  width:100%;
  border-collapse:collapse;
  margin:1.5rem 0;
}
th,td{padding:0.5rem; border:1px solid #ddd;}
th{background:var(--pitt-blue); color:#fff; text-align:left;}

code,pre{
  font-family:ui-monospace, SFMono-Regular, Menlo, monospace;
  background:#f5f5f5;
  padding:0.2rem 0.3rem;
  border-radius:4px;
  overflow-x:auto;
}

/* ============== DESKTOP (>=900px) ============== */
@media (min-width:900px){

  .container{
    max-width:1200px !important;
  }

  /* Make the intro “table”  two clean columns */
  table.wsite-multicol-table,
  table.wsite-multicol-table td{
    border:0 !important;
  }
  .wsite-multicol-tr{display:table-row !important;}
  .wsite-multicol-col{
    display:table-cell !important;
    vertical-align:top;
    padding:0 1.5rem 0 0 !important;
  }
  .wsite-multicol-col:first-child{
    width:48% !important;                 /* wider image column */
    padding-right:2rem !important;
  }
  .wsite-multicol-col:last-child{
    width:52% !important;
    padding-right:0 !important;
  }

  .wsite-multicol-col:first-child img,
  .wsite-multicol-col:first-child img[style],
  .wsite-multicol-col:first-child img[width]{
    width:100% !important;
    max-width:none !important;
    height:auto !important;
  }

  /* Wide, justified text */
  .site-main p,
  .paragraph{
    max-width:none !important;
    text-align:justify;
    text-justify:inter-word;
  }
}

/* ============== TABLET/DESKTOP NAV ============== */
@media (max-width:720px){
  .site-nav{
    position:absolute;
    top:60px;
    right:0;
    background:var(--bg);
    width:60%;
    max-width:240px;
    border-left:3px solid var(--pitt-blue);
    border-bottom:3px solid var(--pitt-blue);
    transform:translateX(100%);
    transition:transform .25s ease;
    padding:1rem 0;
  }
  .site-nav[data-open="true"]{transform:translateX(0);}
  .site-nav ul{flex-direction:column; gap:0;}
  .site-nav a{display:block; padding:0.75rem 1rem;}
  .nav-toggle{display:block;}
}

/* ============== MOBILE (<720px) ============== */
@media (max-width:720px){

  .container{
    max-width:100vw !important;
    padding-left:4vw;
    padding-right:4vw;
  }

  /* Stack legacy multicol table */
  table.wsite-multicol-table,
  .wsite-multicol-tbody,
  .wsite-multicol-tr,
  .wsite-multicol-col{
    display:block !important;
    width:100% !important;
    padding:0 !important;
    border:0 !important;
  }
  .wsite-multicol-col + .wsite-multicol-col{
    margin-top:1.5rem !important;
  }

  /* Full-width image */
  .wsite-multicol-col:first-child img,
  table.wsite-multicol-table img,
  img[style*="max-width"],
  img[width]{
    width:100vw !important;
    max-width:100vw !important;
    margin-left:calc(-4vw) !important; 
    height:auto !important;
  }

  /* Full-width justified text */
  .wsite-multicol-col:last-child .paragraph,
  .wsite-multicol-col:last-child p,
  .site-main p,
  .paragraph{
    max-width:none !important;
    width:100% !important;
    margin:0 auto !important;
    text-align:justify !important;
    text-justify:inter-word;
    font-size:1.08rem;
    line-height:1.62;
    hyphens:auto;
    word-break:normal;
  }
}

/* ---------- Contact page styles ---------- */
.contact-section h1{
  margin-top:1.5rem;
}

.contact-list{
  list-style:none;
  padding:0;
  margin:2rem 0 0;
  max-width:700px;
}

.contact-list li{
  margin-bottom:1rem;
}

.contact-list a{
  display:flex;
  align-items:center;
  gap:.6rem;
  font-size:1.05rem;
  text-decoration:none;
  color:var(--text);
}

.contact-list a:hover{
  color:var(--pitt-blue);
  text-decoration:underline;
}

.icon{
  width:1.25rem;
  height:1.25rem;
  display:inline-flex;
  flex:0 0 auto;
  color:var(--pitt-blue);
}

.icon svg{
  width:100%;
  height:100%;
  display:block;
}

@media (max-width:720px){
  .contact-list a{
    font-size:1.1rem;
    line-height:1.5;
  }
  .icon{
    width:1.35rem;
    height:1.35rem;
  }
}
