
:root{
  --navy:#081323;
  --blue:#173a57;
  --copper:#c7783a;
  --cream:#f4f1ec;
  --ink:#102640;
  --grey:#6b6f76;
  --white:#fffdf9;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--navy);color:var(--cream);font-family:Arial,Helvetica,sans-serif;line-height:1.55}
a{color:inherit}
img{max-width:100%;display:block}
.site-header{position:sticky;top:0;z-index:20;background:rgba(8,19,35,.97);border-bottom:1px solid rgba(199,120,58,.35)}
.nav{max-width:1220px;margin:auto;display:flex;align-items:center;justify-content:space-between;padding:14px 24px;gap:30px}
.brand{display:flex;align-items:center;gap:14px;text-decoration:none}
.brand img{width:52px;height:52px;object-fit:cover;border-radius:2px}
.brand strong{font-family:Georgia,serif;font-size:1.12rem;letter-spacing:.12em;font-weight:500}
.brand span{display:block;color:var(--copper);font-size:.67rem;letter-spacing:.19em;text-transform:uppercase}
nav ul{display:flex;align-items:center;gap:28px;list-style:none;margin:0;padding:0}
nav a{text-decoration:none;font-size:.83rem;letter-spacing:.08em;text-transform:uppercase}
nav a:hover,nav a.active{color:var(--copper)}
.facebook-link{border:1px solid var(--copper);padding:9px 13px}
.container{max-width:1220px;margin:auto;padding:0 24px}
.hero{min-height:500px;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:56px;padding:64px 0}
.hero-art{position:relative}
.hero-art img{width:100%;max-width:460px;margin:auto;box-shadow:0 24px 60px rgba(0,0,0,.4)}
.eyebrow{color:var(--copper);text-transform:uppercase;letter-spacing:.2em;font-size:.76rem}
h1,h2,h3{font-family:Georgia,'Times New Roman',serif;font-weight:500}
h1{font-size:clamp(2.7rem,6vw,5.2rem);line-height:.98;margin:.18em 0}
h2{font-size:clamp(2rem,4vw,3.3rem);margin:.2em 0 .7em}
h3{font-size:1.55rem;margin:.35em 0}
.lead{font-family:Georgia,serif;font-size:1.34rem;max-width:620px}
.tagline{font-family:Georgia,serif;font-style:italic;color:#e9dfd5;font-size:1.16rem}
.actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:28px}
.button{display:inline-block;text-decoration:none;text-transform:uppercase;letter-spacing:.08em;font-size:.78rem;background:var(--copper);padding:13px 19px;color:white;border:1px solid var(--copper)}
.button.secondary{background:transparent}
.section{padding:70px 0}
.section-light{background:var(--cream);color:var(--ink)}
.section-title-row{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:24px}
.play-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.play-card{background:var(--white);color:var(--ink);text-decoration:none;border:1px solid rgba(255,255,255,.15);transition:.2s transform,.2s box-shadow}
.play-card:hover{transform:translateY(-4px);box-shadow:0 16px 36px rgba(0,0,0,.25)}
.card-art{height:190px;position:relative;overflow:hidden;background:#19334a}
.card-art:before,.page-hero:before{content:"";position:absolute;inset:0;background:
 radial-gradient(circle at 28% 24%,rgba(255,255,255,.24),transparent 20%),
 linear-gradient(145deg,rgba(199,120,58,.22),transparent 45%),
 linear-gradient(30deg,#061321,#254966)}
.theme-wedding:after{content:"";position:absolute;width:90px;height:90px;border-radius:50%;background:#f2e5d2;left:50%;top:52%;transform:translate(-50%,-50%);box-shadow:0 0 55px rgba(255,220,168,.45)}
.theme-stage:after{content:"♪";position:absolute;font-family:Georgia;font-size:92px;left:50%;top:48%;transform:translate(-50%,-50%);color:#d8a267}
.theme-hospital:after{content:"";position:absolute;left:20%;right:20%;bottom:32%;height:5px;background:#b8cedb;box-shadow:0 -34px 0 #b8cedb}
.theme-storm:before{background:linear-gradient(160deg,#06111e 0 55%,#293949 56% 60%,#0b1621 61%)}
.theme-white:before{background:linear-gradient(#dfe8ed,#f9fbfc)}
.theme-white:after{content:"";position:absolute;width:34px;height:70px;background:rgba(255,255,255,.72);border:2px solid rgba(40,67,90,.25);left:50%;top:50%;transform:translate(-50%,-40%)}
.theme-cosmos:before{background:radial-gradient(circle at 60% 40%,#e7b276 0 2%,transparent 3%),radial-gradient(circle at 50% 48%,#f8ead5 0 4%,#956640 5%,transparent 15%),radial-gradient(circle at 30% 22%,#fff 0 1%,transparent 1.5%),linear-gradient(145deg,#040a16,#18395c)}
.theme-vinyl:after{content:"";position:absolute;width:120px;height:120px;border-radius:50%;background:repeating-radial-gradient(circle,#111 0 4px,#242424 5px 7px);left:50%;top:50%;transform:translate(-50%,-50%);box-shadow:0 0 0 15px rgba(255,255,255,.05)}
.theme-seer:before{background:linear-gradient(#304a5d 0 52%,#17271f 53%)}
.theme-seer:after{content:"";position:absolute;width:18px;height:105px;background:#6e706c;left:50%;bottom:20px;transform:translateX(-50%);box-shadow:-90px 12px 0 5px #62645f,90px 12px 0 5px #62645f,-45px 2px 0 1px #777974,45px 2px 0 1px #777974}
.theme-coast:before{background:linear-gradient(#bc7b4a 0 24%,#6f8290 25% 45%,#1d3c53 46% 68%,#172728 69%)}
.card-copy{padding:16px 18px 18px}
.meta{font-size:.72rem;letter-spacing:.09em;text-transform:uppercase;color:#30353a}
.meta b{color:var(--copper)}
.about-grid{display:grid;grid-template-columns:300px 1fr;gap:50px;align-items:center}
.about-grid img{width:100%;border:1px solid rgba(199,120,58,.4)}
.footer{border-top:1px solid rgba(199,120,58,.35);padding:34px 0;color:#d8d4cd}
.footer-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:30px}
.footer a{color:var(--copper)}
.page-hero{height:310px;position:relative}
.page-hero .container{position:relative;height:100%;display:flex;align-items:end;padding-bottom:34px}
.page-hero h1{font-size:clamp(2.4rem,5vw,4.4rem);margin:0;text-shadow:0 2px 18px rgba(0,0,0,.7)}
.play-layout{display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:54px}
.fact-box,.contact-box{border-top:3px solid var(--copper);background:#fff;padding:24px;color:var(--ink);margin-bottom:22px}
.fact{padding:10px 0;border-bottom:1px solid #ddd}
.fact:last-child{border-bottom:0}
.content-section{margin-bottom:42px}
.content-section p{font-size:1.05rem}
.award-list,.production-list{padding-left:20px}
.other-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.other-grid .card-art{height:120px}
.notice{background:#fff4e8;border-left:4px solid var(--copper);padding:15px;color:#3b2e25}
@media(max-width:900px){
  nav ul{gap:13px}
  .hero{grid-template-columns:1fr}
  .play-grid{grid-template-columns:repeat(2,1fr)}
  .play-layout{grid-template-columns:1fr}
  .about-grid{grid-template-columns:1fr}
}
@media(max-width:620px){
  .nav{align-items:flex-start}
  nav ul{display:none}
  .play-grid,.other-grid,.footer-grid{grid-template-columns:1fr}
  .hero{padding-top:35px}
  .card-art{height:165px}
}


/* Revised catalogue presentation */
.hero-compact{
  min-height:360px;
  grid-template-columns:minmax(0,1.45fr) minmax(220px,.55fr);
  gap:42px;
  padding:44px 0;
}
.hero-compact h1{
  font-size:clamp(2.55rem,5vw,4.35rem);
}
.hero-logo-small img{
  max-width:290px;
  box-shadow:0 18px 42px rgba(0,0,0,.3);
}
.play-grid{
  gap:20px;
}
.play-card{
  display:flex;
  flex-direction:column;
}
.card-art{
  height:142px;
  background:none;
}
.card-art:before,.card-art:after{
  display:none !important;
}
.card-art img{
  width:100%;
  height:100%;
  object-fit:cover;
}
.card-copy{
  padding:18px 20px 21px;
  min-height:168px;
}
.card-copy h3{
  font-size:1.55rem;
  line-height:1.12;
  margin:0 0 15px;
}
.meta{
  font-size:.76rem;
  line-height:1.5;
}
.page-hero{
  height:285px;
  background-size:cover;
  background-position:center;
}
.page-hero:before{
  display:none;
}
.other-grid .card-art{
  height:100px;
}
.other-grid .card-copy{
  min-height:150px;
}
@media(max-width:900px){
  .hero-compact{grid-template-columns:1fr}
  .hero-logo-small{display:none}
}


/* Requested catalogue revisions */
.social-icon{
  width:1.05em;
  height:1.05em;
  display:inline-block;
  vertical-align:-.16em;
  flex:0 0 auto;
}
.facebook-link{
  display:inline-flex;
  align-items:center;
  gap:5px;
}
.footer strong .social-icon{
  color:var(--copper);
  margin-right:4px;
}
.brand img{
  object-fit:contain;
}
.hero-compact{
  grid-template-columns:minmax(230px,.58fr) minmax(0,1.42fr);
}
.hero-logo-small{
  order:1;
}
.hero-compact > div:not(.hero-art){
  order:2;
}
.hero-logo-small img{
  background:transparent;
  box-shadow:none;
  max-width:330px;
}
.hero-compact h1{
  font-size:clamp(2.2rem,4.25vw,3.75rem);
  line-height:1.08;
}
.section-title-row{
  display:block;
}
.section-title-row > p{
  max-width:760px;
  margin:0;
  text-align:left;
}
.play-section-title{
  font-size:clamp(1.7rem,2.6vw,2.25rem);
  margin-bottom:.55em;
}
.other-grid{
  grid-template-columns:repeat(3,1fr);
}
.other-grid .card-copy{
  min-height:145px;
}
.about-photo{
  width:100%;
  max-width:330px;
  justify-self:center;
  border:0 !important;
  -webkit-mask-image:linear-gradient(to bottom,transparent 0%,black 7%,black 92%,transparent 100%);
  mask-image:linear-gradient(to bottom,transparent 0%,black 7%,black 92%,transparent 100%);
}
.contact-page-title{
  font-size:clamp(2.2rem,4.2vw,3.7rem);
  line-height:1.05;
}
.social-button{
  display:inline-flex;
  align-items:center;
  gap:7px;
}
.card-art{
  position:relative;
}
.time-figures{
  position:absolute;
  inset:0;
  pointer-events:none;
}
.time-figures .figure{
  position:absolute;
  bottom:7%;
  width:7%;
  height:48%;
  background:rgba(5,9,16,.88);
  border-radius:45% 45% 16% 16% / 18% 18% 8% 8%;
  box-shadow:0 8px 16px rgba(0,0,0,.35);
}
.time-figures .figure:before{
  content:"";
  position:absolute;
  width:72%;
  aspect-ratio:1;
  border-radius:50%;
  background:inherit;
  left:14%;
  top:-20%;
}
.time-figures .figure-left{left:35%;height:41%}
.time-figures .figure-centre{left:46.5%;height:51%;width:7.5%}
.time-figures .figure-right{left:58%;height:44%}
.time-figures-hero{
  z-index:1;
  inset:auto 0 0;
  height:72%;
}
.time-figures-hero .figure{
  width:3.2%;
  bottom:0;
}
.time-figures-hero .figure-left{left:42%;height:55%}
.time-figures-hero .figure-centre{left:49%;height:68%;width:3.5%}
.time-figures-hero .figure-right{left:56.5%;height:59%}
.page-hero .container{
  z-index:2;
}
@media(max-width:900px){
  .hero-compact{
    grid-template-columns:1fr;
  }
  .hero-logo-small{
    display:block;
    max-width:240px;
  }
  .hero-logo-small img{
    max-width:240px;
  }
  .other-grid{
    grid-template-columns:repeat(2,1fr);
  }
}
@media(max-width:620px){
  .hero-logo-small{
    max-width:190px;
  }
  .hero-logo-small img{
    max-width:190px;
  }
  .other-grid{
    grid-template-columns:1fr;
  }
}


/* Fourth revision: portrait, production gallery and mobile polish */
.about-title{
  font-size:clamp(2.25rem,4vw,3.55rem);
  line-height:1.02;
}
.about-portrait{
  position:relative;
  width:100%;
  max-width:350px;
  justify-self:center;
  padding:14px;
  background:
    linear-gradient(145deg,rgba(8,19,35,.98),rgba(23,58,87,.92)),
    var(--navy);
  box-shadow:0 24px 55px rgba(8,19,35,.24);
  overflow:hidden;
}
.about-portrait:before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 72% 20%,rgba(199,120,58,.23),transparent 32%),
    linear-gradient(to top,rgba(8,19,35,.46),transparent 45%);
  z-index:1;
  pointer-events:none;
}
.about-portrait .about-photo{
  position:relative;
  z-index:0;
  max-width:none;
  width:100%;
  filter:saturate(.88) contrast(1.04);
  -webkit-mask-image:linear-gradient(to bottom,transparent 0%,black 5%,black 94%,transparent 100%);
  mask-image:linear-gradient(to bottom,transparent 0%,black 5%,black 94%,transparent 100%);
}
.production-gallery{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px;
}
.production-gallery figure{
  margin:0;
  overflow:hidden;
  background:var(--navy);
  aspect-ratio:4/3;
}
.production-gallery a{
  display:block;
  width:100%;
  height:100%;
}
.production-gallery img{
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .25s ease;
}
.production-gallery a:hover img{
  transform:scale(1.025);
}

/* Mobile navigation remains visible rather than disappearing. */
@media(max-width:620px){
  .site-header{
    position:static;
  }
  .nav{
    display:block;
    padding:12px 18px 10px;
  }
  .brand{
    justify-content:center;
    margin-bottom:10px;
  }
  .brand img{
    width:44px;
    height:44px;
  }
  .brand strong{
    font-size:.95rem;
  }
  .brand span{
    font-size:.58rem;
  }
  nav ul{
    display:flex;
    justify-content:center;
    flex-wrap:wrap;
    gap:4px 13px;
  }
  nav a{
    font-size:.7rem;
    letter-spacing:.055em;
  }
  .facebook-link{
    border:0;
    padding:0;
  }
  .hero-compact{
    padding:28px 18px 36px;
    gap:20px;
  }
  .hero-logo-small{
    max-width:170px;
    margin:0 auto;
  }
  .hero-logo-small img{
    max-width:170px;
  }
  .hero-compact h1{
    font-size:2.15rem;
    text-align:center;
  }
  .hero-compact .tagline{
    text-align:center;
  }
  .hero-compact .actions{
    justify-content:center;
  }
  .section{
    padding:48px 0;
  }
  .section-title-row h2{
    font-size:2.1rem;
  }
  .play-grid,
  .other-grid,
  .footer-grid,
  .production-gallery{
    grid-template-columns:1fr;
  }
  .card-copy{
    min-height:0;
  }
  .page-hero{
    height:230px;
  }
  .page-hero h1{
    font-size:2.35rem;
  }
  .play-layout{
    gap:30px;
  }
  .about-grid{
    gap:28px;
  }
  .about-title{
    font-size:2.55rem;
  }
  .about-portrait{
    max-width:280px;
  }
  .footer{
    text-align:center;
  }
  .footer-grid{
    gap:22px;
  }
}


/* Fifth revision: stronger Saltire and theatrical homepage spotlight */
.hero-compact h1{
  font-size:clamp(2.05rem,3.95vw,3.48rem);
}
.hero-copy-spotlight{
  position:relative;
  isolation:isolate;
  padding:34px 34px 34px 24px;
}
.hero-copy-spotlight:before{
  content:"";
  position:absolute;
  z-index:-1;
  top:-85px;
  right:-55px;
  width:540px;
  height:420px;
  background:
    radial-gradient(
      ellipse at 88% 8%,
      rgba(245,232,197,.24) 0%,
      rgba(245,232,197,.12) 27%,
      rgba(245,232,197,.045) 48%,
      transparent 70%
    );
  transform:rotate(-12deg);
  pointer-events:none;
}
.hero-copy-spotlight:after{
  content:"";
  position:absolute;
  z-index:-1;
  top:-115px;
  right:30px;
  width:210px;
  height:500px;
  background:linear-gradient(
    166deg,
    rgba(248,235,198,.14) 0%,
    rgba(248,235,198,.045) 48%,
    transparent 78%
  );
  clip-path:polygon(44% 0,100% 0,72% 100%,0 100%);
  filter:blur(5px);
  pointer-events:none;
}
.about-grid a{
  font-weight:700;
  text-decoration:underline;
  text-underline-offset:3px;
}
@media(max-width:620px){
  .hero-copy-spotlight{
    padding:22px 8px 26px;
  }
  .hero-copy-spotlight:before{
    top:-25px;
    right:-120px;
    width:440px;
    height:330px;
    opacity:.72;
  }
  .hero-copy-spotlight:after{
    display:none;
  }
  .hero-compact h1{
    font-size:2rem;
  }
}
\n/* Sixth revision */
.hero-copy-spotlight:before{top:-95px;right:-70px;width:620px;height:460px;background:radial-gradient(ellipse at 82% 10%,rgba(255,244,208,.38) 0%,rgba(255,244,208,.22) 24%,rgba(255,244,208,.10) 43%,rgba(255,244,208,.035) 60%,transparent 75%);transform:rotate(-10deg)}
.hero-copy-spotlight:after{top:-135px;right:15px;width:250px;height:560px;background:linear-gradient(164deg,rgba(255,244,208,.24) 0%,rgba(255,244,208,.11) 38%,rgba(255,244,208,.035) 63%,transparent 82%);clip-path:polygon(40% 0,100% 0,74% 100%,0 100%);filter:blur(4px)}
.hero-copy-spotlight h1{background:linear-gradient(112deg,#f2eadc 0%,#f2eadc 28%,#fff8df 45%,#ffffff 52%,#f7efda 60%,#f2eadc 76%,#f2eadc 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.facebook-visible-button{display:inline-flex!important;align-items:center;justify-content:center;min-height:48px;padding:13px 18px!important;color:#fff!important;background:var(--copper)!important;border:1px solid var(--copper)!important;opacity:1!important;visibility:visible!important;text-decoration:none!important;font-weight:700!important}
.facebook-visible-button:hover{color:#fff!important;filter:brightness(1.08)}
@media(max-width:620px){.hero-copy-spotlight:before{right:-145px;width:500px;height:360px}.hero-copy-spotlight h1{background:linear-gradient(112deg,#f2eadc 0%,#fff8df 48%,#f2eadc 100%);-webkit-background-clip:text;background-clip:text;color:transparent}}


/* Seventh revision: restrained theatrical light wash */
.hero-copy-spotlight:before{
  top:-70px;
  right:-35px;
  width:560px;
  height:410px;
  background:
    radial-gradient(
      ellipse at 88% 8%,
      rgba(250,240,210,.20) 0%,
      rgba(250,240,210,.11) 28%,
      rgba(250,240,210,.045) 48%,
      transparent 72%
    );
  transform:rotate(-9deg);
  filter:blur(2px);
}
.hero-copy-spotlight:after{
  top:-110px;
  right:50px;
  width:190px;
  height:470px;
  background:linear-gradient(
    165deg,
    rgba(250,240,210,.11) 0%,
    rgba(250,240,210,.045) 46%,
    transparent 82%
  );
  clip-path:polygon(46% 0,100% 0,70% 100%,8% 100%);
  filter:blur(8px);
}
.hero-copy-spotlight h1{
  background:
    linear-gradient(
      112deg,
      #f2eadc 0%,
      #f2eadc 34%,
      #f8f0dc 46%,
      #fff8e7 52%,
      #f4ecda 61%,
      #f2eadc 76%,
      #f2eadc 100%
    );
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}
@media(max-width:620px){
  .hero-copy-spotlight:before{
    top:-20px;
    right:-120px;
    width:420px;
    height:310px;
    opacity:.55;
  }
  .hero-copy-spotlight:after{
    display:none;
  }
}


/* V8 subtle refinement */
.hero-copy-spotlight:before{
  opacity:.92;
  width:590px;
  height:430px;
  background:radial-gradient(ellipse at 90% 6%,
    rgba(255,245,220,.24) 0%,
    rgba(255,245,220,.14) 26%,
    rgba(255,245,220,.06) 48%,
    transparent 74%);
}
.hero-copy-spotlight:after{
  opacity:.75;
  filter:blur(10px);
}
.hero-copy-spotlight h1{
  background:linear-gradient(112deg,
    #f2eadc 0%,
    #f2eadc 36%,
    #fffdf5 50%,
    #f5eddc 63%,
    #f2eadc 100%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}

.contact-heading-small{
  font-size:clamp(2rem,3vw,2.65rem)!important;
  line-height:1.15;
}
