:root{
    --blue:#1F6FC4;
    --blue-dark:#0B5CAD;
    --link:#0563C1;
    --text:#222222;
    --rule:#d8d8d8;
    --img-bg:#f3f3f3;
    --img-border:#b9b9b9;
  }
  *{box-sizing:border-box;}
  body{
    margin:0;
    font-family:Calibri, 'Segoe UI', Candara, Optima, Arial, sans-serif;
    color:var(--text);
    background:#ffffff;
    line-height:1.5;
    font-size:16px;
  }
  
html {
  scroll-behavior: smooth;
}
  
  /* Two Act Plays Layout */
#two-act-plays .two-act-content {
  display: grid;
  grid-template-columns: 1fr 1fr 300px;
  gap: 25px;
  align-items: start;
  margin-top: 20px;
}

#two-act-plays .two-act-text {
  font-size: 14px;
  line-height: 1.25;
}

#two-act-plays .two-act-text h3 {
  font-size: 26px;
  font-style: italic;
  margin: 0 0 8px;
  text-align: center;
}

#two-act-plays .play-meta {
  text-align: center;
  font-size: 13px;
  line-height: 1.2;
  margin-bottom: 20px;
}

#two-act-plays .two-act-text p {
  margin: 0 0 8px;
}

#two-act-plays .two-act-images {
  display: flex;
  flex-direction: column;
  gap: 18px;
}

#two-act-plays .two-act-images img {
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
}


/* Tablet */
@media (max-width: 900px) {
  #two-act-plays .two-act-content {
    grid-template-columns: 1fr 1fr;
  }

  #two-act-plays .two-act-images {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 15px;
  }
}


/* Mobile */
@media (max-width: 600px) {
  #two-act-plays .two-act-content {
    grid-template-columns: 1fr;
  }

  #two-act-plays .two-act-images {
    grid-column: auto;
    display: flex;
    flex-direction: column;
  }
}
  h1,h2,h3,.script-title{
    font-family:'EB Garamond', Georgia, 'Times New Roman', serif;
    font-style:italic;
    color:var(--blue);
    font-weight:600;
    margin:0 0 6px 0;
  }
  h1{font-size:44px;text-align:center;}
  h2{font-size:34px;text-align:center;}
  h3{font-size:26px;}
  .page-title{font-size:30px;text-align:center;margin-bottom:2px;}
  a{color:var(--link);text-decoration:underline;}
  a:hover{color:var(--blue-dark);}
  .top-link{display:block;text-align:center;color:#333;font-family:Calibri,sans-serif;font-style:normal;margin-bottom:18px;font-size:15px;}
  .wrap{max-width:1200px;margin:0 auto;padding:36px 28px;}
  .section{
    padding: 56px 0 40px 0;
  }
  .section:first-of-type{border-top:none;}
  .center{text-align:center;}
  .subtitle{text-align:center;margin-bottom:24px;font-size:15px;}
  .subtitle a{font-style:normal;}
  .return-home{
    display:inline-block;
    margin-top:18px;
    font-size:15px;
  }
  .return-home-row{text-align:right;margin-top:10px;}

  /* Image placeholder boxes */
  .img-ph{
    background:repeating-linear-gradient(45deg, var(--img-bg), var(--img-bg) 10px, #ececec 10px, #ececec 20px);
    border:2px dashed var(--img-border);
    color:#777;
    display:flex;
    align-items:center;
    justify-content:center;
    text-align:center;
    font-size:13px;
    padding:10px;
    border-radius:2px;
  }
  .caption{
    text-align:center;
    font-style:italic;
    font-family:'EB Garamond', Georgia, serif;
    margin-top:6px;
    font-size:15px;
    color:#333;
  }

  /* HOME layout */
  .home-hero{padding-top:28px;}
  .home-images{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:24px;
    margin-top:36px;
  }
  .home-images figure{margin:0;}
  .home-images .img-ph{aspect-ratio:3/4;}
  .home-images figcaption{margin-top:10px;}
  .home-images figcaption a{
    display:block;text-align:center;font-family:'EB Garamond', Georgia, serif;
    font-style:italic;font-size:22px;color:var(--blue);text-decoration:none;
  }
  .home-images figcaption a:hover{text-decoration:underline;}
  .home-images .no-link{
    display:block;text-align:center;font-family:'EB Garamond', Georgia, serif;
    font-style:italic;font-size:22px;color:#999;
  }

  /* Plays landing page (3-col nav + reviews) */
  .plays-grid{
    display:grid;
    grid-template-columns:1.1fr 1.3fr 1.1fr;
    gap:30px;
    margin-top:18px;
    align-items:start;
  }
  .plays-nav{
    text-align:center;
    font-size:22px;
  }
  .plays-nav a{
    display:block;
    font-family:'EB Garamond', Georgia, serif;
    font-style:italic;
    margin-bottom:14px;
    text-decoration:underline;
  }
  .plays-grid .img-ph{aspect-ratio:3/4;}
  .review-block{font-size:14.5px;margin-top:14px;}
  .review-block b{font-weight:700;}

  /* generic 2-col / 3-col content layouts */
  .cols-2{display:grid;grid-template-columns: 1fr 1fr 1fr;gap:34px;}
  .cols-3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:30px;}
  .cols-1-2{display:grid;grid-template-columns:1fr 2fr;gap:34px;}
  .cols-2-1{display:grid;grid-template-columns:2fr 1fr;gap:34px;}
  .cols-1-1-1_2col_text{display:grid;grid-template-columns:1fr 1fr;gap:34px;}

  .meta-line{text-align:center;font-size:14.5px;margin-bottom:14px;}
  .meta-line.left{text-align:left;}
  p{margin:0 0 12px 0;font-size:15.5px;}
  .small-note{font-size:13px;color:#888;font-style:italic;margin-top:6px;}

  ul.theme-list{margin:0 0 14px 22px;padding:0;font-size:15.5px;}
  ul.theme-list li{margin-bottom:2px;}

  .book-side{text-align:center;}
  .book-side .img-ph{aspect-ratio:2/3;margin-bottom:10px;}

  .two-act-list{
    columns:1;
    font-size:15.5px;
  }
  .two-act-list a{display:block;margin-bottom:6px;}

  footer{
    text-align:center;
    padding:40px 20px;
    font-size:14px;
    color:#666;
    border-top:1px solid var(--rule);
  }

.home-images img {
    width: 100%;
}

  @media (max-width: 900px){
    .home-images{grid-template-columns:1fr;}
    .plays-grid{grid-template-columns:1fr;}
    .cols-2,.cols-3,.cols-1-2,.cols-2-1{grid-template-columns:1fr;}
  }

  /* ===== Navigation menu ===== */
  .site-nav{
    position:sticky;
    top:0;
    z-index:100;
    background:#ffffff;
    border-bottom:1px solid var(--rule);
    box-shadow:0 1px 4px rgba(0,0,0,0.06);
  }
  .site-nav ul{
    list-style:none;
    margin:0;
    padding:0;
    max-width:1200px;
    margin:0 auto;
    display:flex;
    justify-content:center;
    gap:6px;
  }
  .site-nav li{position:relative;}
  .site-nav > ul > li > a,
  .site-nav > ul > li > .nav-toggle{
    display:block;
    padding:16px 22px;
    font-family:'EB Garamond', Georgia, serif;
    font-style:italic;
    font-size:19px;
    color:var(--blue);
    text-decoration:none;
    cursor:pointer;
    background:none;
    border:none;
  }
  .site-nav > ul > li > a:hover,
  .site-nav > ul > li:hover > .nav-toggle,
  .site-nav > ul > li.open > .nav-toggle{
    color:#ffffff;
    background:var(--blue);
  }
  .nav-toggle .caret{
    font-style:normal;
    font-size:12px;
    margin-left:5px;
    display:inline-block;
  }
  .dropdown{
    position:absolute;
    top:100%;
    left:0;
    min-width:220px;
    background:#ffffff;
    border:1px solid var(--rule);
    box-shadow:0 6px 16px rgba(0,0,0,0.12);
    display:none;
    flex-direction:column;
    padding:6px 0;
  }
  .site-nav li:hover .dropdown,
  .site-nav li.open .dropdown{
    display:flex;
  }
  .dropdown a{
    display:block;
    padding:11px 20px;
    font-family:'EB Garamond', Georgia, serif;
    font-style:italic;
    font-size:17px;
    color:var(--blue);
    text-decoration:none;
    white-space:nowrap;
  }
  .dropdown a:hover{
    background:#eef5fc;
    color:var(--blue-dark);
  }
  @media (max-width:640px){
    .site-nav ul{flex-wrap:wrap;}
    .site-nav > ul > li > a,
    .site-nav > ul > li > .nav-toggle{padding:12px 14px;font-size:17px;}
  }

a.return-home.last-text {
  font-size: 20px;
  text-decoration: auto;
  width: 100%;
  text-align: center;
}

.home-images img {
    width: 100% !important;
    height: 559px;
    object-fit: cover;
}

section#two-act-plays {
    padding-bottom: 0px !important;
}


/* ======================================================
   MUSICALS PAGE — additions (uses existing :root vars,
   fonts, .img-ph pattern, .site-nav pattern)
   ====================================================== */

/* ---- top nav (matches .sitenav used in musicals.html) ---- */
.sitenav{
  position:sticky;
  top:0;
  z-index:100;
  background:#ffffffee;
  backdrop-filter:blur(4px);
  border-bottom:1px solid var(--rule);
  box-shadow:0 1px 4px rgba(0,0,0,0.06);
  padding:10px 24px;
  display:flex;
  gap:18px;
  flex-wrap:wrap;
  align-items:center;
  font-family:Calibri, 'Segoe UI', Candara, Optima, Arial, sans-serif;
  font-size:15px;
}
.sitenav .home{
  font-family:'EB Garamond', Georgia, serif;
  font-style:italic;
  color:var(--blue);
  font-weight:600;
  margin-right:auto;
  font-size:20px;
  text-decoration:none;
}
.sitenav a{
  color:var(--blue);
  text-decoration:none;
}
.sitenav a:hover{
  color:var(--blue-dark);
  text-decoration:underline;
}

/* ---- section wrapper / rhythm ---- */
section{
  max-width:1200px;
  margin:0 auto;
  padding:56px 28px 40px;
  border-bottom:1px solid var(--rule);
}
section:last-of-type{border-bottom:none;}

/* ---- titles (reuse h1/h2 styling already defined, just alias) ---- */
h1.pagetitle{
  font-family:'EB Garamond', Georgia, serif;
  font-style:italic;
  color:var(--blue);
  font-weight:600;
  font-size:44px;
  text-align:center;
  margin:0 0 30px;
}
h2.showtitle{
  font-family:'EB Garamond', Georgia, serif;
  font-style:italic;
  color:var(--blue);
  font-weight:600;
  font-size:34px;
  text-align:center;
  margin:0 0 26px;
}

/* ---- home / index links (matches .home-links) ---- */
.home-grid{
  display:grid;
  grid-template-columns:1fr 1.4fr 1fr;
  gap:24px;
  align-items:start;
}
.home-links{
  text-align:center;
  font-size:22px;
  display:flex;
  flex-direction:column;
  gap:16px;
}
.home-links a{
  display:block;
  font-family:'EB Garamond', Georgia, serif;
  font-style:italic;
  color:var(--blue);
  text-decoration:underline;
}
.home-links a:hover{color:var(--blue-dark);}
.home-links .return{
  font-family:Calibri, sans-serif;
  font-style:normal;
  font-size:15px;
  margin-top:6px;
}
.home-bottom{margin-top:26px;text-align:center;}

/* ---- image placeholder (same look as var(--img-ph) box) ---- */
.imgph{
  background:repeating-linear-gradient(45deg, var(--img-bg), var(--img-bg) 10px, #ececec 10px, #ececec 20px);
  border:2px dashed var(--img-border);
  color:#777;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  font-family:Calibri, sans-serif;
  font-size:13px;
  padding:12px;
  border-radius:2px;
  min-height:150px;
}

/* ---- meta line under show titles ---- */
.meta{
  text-align:center;
  font-family:Calibri, sans-serif;
  font-size:14.5px;
  margin-bottom:22px;
}

/* ---- multi-column testimonial blocks ---- */
.cols3{columns:3 260px;column-gap:32px;}
.cols2{columns:2 320px;column-gap:32px;}
.cols3 p, .cols2 p{margin:0 0 14px;font-size:15px;break-inside:avoid;}
.cols3 .quote, .cols2 .quote{
  font-family:'EB Garamond', Georgia, serif;
  font-style:italic;
}
.cols3 .school, .cols2 .school{
  font-family:Calibri, sans-serif;
  font-weight:700;
  font-style:normal;
}

/* ---- side image stack next to text ---- */
.show-figs{display:flex;flex-direction:column;gap:18px;}
.show-figs .imgph{min-height:180px;}

/* ---- generic layout grids used per-show ---- */
.layout-2col{display:grid;grid-template-columns:1fr 1fr;gap:40px;}
.layout-3col-with-image{
  display:grid;
  grid-template-columns:1fr 1fr 300px;
  gap:30px;
  align-items:start;
}

/* ---- script / preview links ---- */
.scriptlink{
  text-align:center;
  margin:22px 0;
  font-size:16px;
}
.scriptlink a{color:var(--link);text-decoration:underline;}

/* ---- return-to-home links ---- */
.return-link{
  text-align:right;
  max-width:1200px;
  margin:0 auto;
  padding:8px 28px 0;
  font-family:Calibri, sans-serif;
  font-size:14.5px;
}
.return-link a{color:#333;text-decoration:none;}
.return-link a:hover{text-decoration:underline;}

/* ---- responsive ---- */
@media (max-width:900px){
  .home-grid{grid-template-columns:1fr;}
  .layout-2col,
  .layout-3col-with-image{grid-template-columns:1fr;}
  .cols3,.cols2{columns:1;}
  h1.pagetitle{font-size:34px;}
  h2.showtitle{font-size:26px;}
  .sitenav{padding:10px 16px;}
}

li.has-dropdown {
    display: flex !important;
}

li.has-dropdown button.nav-toggle {
    padding: 0px !important;
}

li.has-dropdown a.nav-link {
    padding-right: 22px !important;
}

.big-image img {
    height: 100%;
    width: 100%;
}

p.big-image {
    text-align: center;
}

.music-links a {
    text-decoration: none !important;
}

.return-link a {
    color: var(--link);
    text-decoration: underline;
}

img.image-1-wrong {
    height: 300px;
    object-fit: contain;
}

#stage-mothers {
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 16px;
}

#stage-mothers .showtitle {
  text-align: center;
  font-size: 2.6rem;
  font-style: italic;
  margin: 0 0 24px 0;
}

#stage-mothers .layout-3col {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 24px;
  align-items: start; /* image top par align */
}

#stage-mothers .layout-3col p {
  line-height: 1.5;
  margin: 0 0 16px 0;
  text-align: left;
  hyphens: auto;
  -webkit-hyphens: auto;
}

#stage-mothers .meta {
  text-align: center;
}

#stage-mothers .quote {
  font-style: italic;
}

#stage-mothers .layout-3col img {
  width: 100%;
  height: auto;
  display: block;
}

#stage-mothers .scriptlink {
  text-align: center;
  margin-top: 24px;
}

#stage-mothers .scriptlink a {
  color: #0563c1;
  text-decoration: underline;
}

/* Tablet / mobile: ek column */
@media (max-width: 900px) {
  #stage-mothers .layout-3col {
    grid-template-columns: 1fr;
  }
  #stage-mothers .showtitle {
    font-size: 2rem;
  }
}


section#novel-writing {
    padding-top: 30px !important;
}

#remain-seated p {
    margin-bottom: 0px !important;
}

#all-wrong p {
    margin-bottom: 0px !important;
}

section#one-person-plays {
    border: none;
    padding-bottom: 0px !important;
    padding-top: 40px !important;
}

section#aunt-georgy {
    padding-top: 30px !important;
}