@font-face{
  font-family:'Ailerons';
  src:url('../fonts/Ailerons-Typeface.otf') format('opentype');
  font-weight:normal;
  font-style:normal;
  font-display:swap;
}
@font-face{
  font-family:'Cormorant';
  font-style:italic;
  font-weight:400;
  src:url('../fonts/cormorant/cormorant-400-italic.woff2') format('woff2');
  font-display:swap;
}
@font-face{
  font-family:'Cormorant';
  font-style:normal;
  font-weight:400;
  src:url('../fonts/cormorant/cormorant-400.woff2') format('woff2');
  font-display:swap;
}
@font-face{
  font-family:'Cormorant';
  font-style:normal;
  font-weight:500;
  src:url('../fonts/cormorant/cormorant-400.woff2') format('woff2');
  font-display:swap;
}
@font-face{
  font-family:'Cormorant';
  font-style:normal;
  font-weight:600;
  src:url('../fonts/cormorant/cormorant-400.woff2') format('woff2');
  font-display:swap;
}
@font-face{
  font-family:'Crimson Pro';
  font-style:italic;
  font-weight:400;
  src:url('../fonts/crimson-pro/crimson-pro-400-italic.woff2') format('woff2');
  font-display:swap;
}
@font-face{
  font-family:'Crimson Pro';
  font-style:normal;
  font-weight:400;
  src:url('../fonts/crimson-pro/crimson-pro-400.woff2') format('woff2');
  font-display:swap;
}
@font-face{
  font-family:'Crimson Pro';
  font-style:normal;
  font-weight:500;
  src:url('../fonts/crimson-pro/crimson-pro-400.woff2') format('woff2');
  font-display:swap;
}
@font-face{
  font-family:'Cutive Mono';
  font-style:normal;
  font-weight:400;
  src:url('../fonts/cutive-mono/cutive-mono-400.woff2') format('woff2');
  font-display:swap;
}
@font-face{
  font-family:'Petit Formal Script';
  font-style:normal;
  font-weight:400;
  src:url('../fonts/petit-formal-script/petit-formal-script-400.woff2') format('woff2');
  font-display:swap;
}

:root{
  --ink:#0B0908;
  --ink-2:#161210;
  --paper:#EDE7DD;
  --poison:#7C9A4A;
  --poison-soft:#A3C56B;
  --blood:#7A1F24;
  --blood-soft:#A6383F;
  --muted:#9C9488;
  --cream-text:#EDE7DD;
  --ink-text:#1C1815;
}

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

html{scroll-behavior:smooth;}

body{
  font-family:'Crimson Pro', serif;
  background:var(--ink);
  color:var(--cream-text);
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}

h1,h2,h3{
  font-family:'Cormorant', serif;
  font-weight:500;
  letter-spacing:0.01em;
}

.eyebrow{
  font-family:'Cutive Mono', monospace;
  font-size:0.75rem;
  letter-spacing:0.2em;
  text-transform:uppercase;
  color:var(--poison-soft);
}
.brand-name{
  font-family:'Ailerons', 'Cormorant', serif;
  letter-spacing:0.06em;
  color:#D4A017;
  text-shadow:0 0 8px rgba(212,160,23,0.6), 0 0 18px rgba(212,160,23,0.35);
}
.eyebrow.brand-name{
  font-size:1.5rem;
}

a{color:inherit; text-decoration:none;}

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

.wrap{
  max-width:1100px;
  margin:0 auto;
  padding:0 32px;
}

@media (prefers-reduced-motion: reduce){
  *{animation:none !important; transition:none !important;}
}

/* ---------- PLACEHOLDER ART ---------- */
.placeholder{
  position:relative;
  background:
    repeating-linear-gradient(135deg, rgba(255,255,255,0.03) 0px, rgba(255,255,255,0.03) 2px, transparent 2px, transparent 14px),
    linear-gradient(160deg, var(--ink-2), #0e0b0a);
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  color:var(--muted);
  font-family:'Cutive Mono', monospace;
  font-size:0.72rem;
  letter-spacing:0.08em;
  text-transform:uppercase;
  border:1px solid rgba(124,154,74,0.18);
}

/* ---------- NAV ---------- */
nav{
  position:sticky; top:0; z-index:50;
  background:rgba(11,9,8,0.9);
  backdrop-filter:blur(8px);
  border-bottom:1px solid rgba(124,154,74,0.2);
}
nav::after{
  content:"";
  position:absolute;
  left:0; right:0; bottom:-1px;
  height:2px;
  background:linear-gradient(90deg, transparent, #3D5A80 20%, #6E8FB8 50%, #3D5A80 80%, transparent);
  box-shadow:0 0 14px 3px rgba(110,143,184,0.55), 0 0 30px 8px rgba(61,90,128,0.35);
}
nav .wrap{
  display:flex; align-items:center; justify-content:space-between;
  padding-top:20px; padding-bottom:20px;
}
.brand{
  font-family:'Cormorant', serif;
  font-weight:600;
  font-size:1.3rem;
  letter-spacing:0.06em;
  display:flex; align-items:center; gap:10px;
}
.cat-a{
  position:relative;
  display:inline-block;
  font-size:1.4em;
  line-height:0.7;
  letter-spacing:normal;
  vertical-align:-0.1em;
}
.cat-eye{
  position:absolute;
  top:0.15em;
  left:50%;
  transform:translateX(-50%);
  width:0.58em;
  pointer-events:none;
}
.cat-eye::before{
  content:"";
  position:absolute;
  inset:-65%;
  background:radial-gradient(ellipse at center, rgba(160,220,255,0.55), rgba(160,220,255,0.18) 55%, transparent 78%);
  filter:blur(3px);
  z-index:-1;
}
.cat-eye svg{
  width:100%;
  height:auto;
  display:block;
  filter:drop-shadow(0 0 3px rgba(110,198,232,0.75)) drop-shadow(0 0 7px rgba(110,198,232,0.4));
}
.brand .logo-mark{
  width:34px; height:34px;
  object-fit:cover;
  -webkit-mask-image:radial-gradient(ellipse 62% 62% at center, #000 55%, transparent 100%);
  mask-image:radial-gradient(ellipse 62% 62% at center, #000 55%, transparent 100%);
  filter:drop-shadow(0 0 6px rgba(124,154,74,0.5));
}
.navlinks{display:flex; gap:32px; font-size:0.85rem; color:var(--muted); font-family:'Crimson Pro', serif;}
.navlinks a{transition:color 0.25s ease;}
.navlinks a:hover{color:var(--poison-soft);}

/* ---------- HERO ---------- */
.hero{
  position:relative;
  padding:130px 0 100px;
  text-align:center;
  overflow:hidden;
}
.hero-bg{
  position:absolute;
  inset:0;
  z-index:0;
}
.hero-bg img{
  width:100%;
  height:100%;
  object-fit:cover;
}
.hero-bg::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, transparent 55%, var(--ink) 100%);
}
.hero .wrap{position:relative; z-index:1;}
.hero .tagline-mark,
.hero h1,
.hero .lede{
  text-shadow:0 3px 14px rgba(0,0,0,0.85), 0 1px 4px rgba(0,0,0,0.9);
}
.hero .tagline-mark{
  font-family:'Cormorant', serif;
  font-style:italic;
  color:var(--poison-soft);
  font-size:1.4rem;
  margin-bottom:26px;
}
.hero h1{
  font-size:clamp(2.6rem, 6vw, 4.2rem);
  max-width:800px;
  margin:0 auto 26px;
  line-height:1.1;
}
.hero .lede{
  font-family:'Cormorant', serif;
  font-style:italic;
  font-size:1.25rem;
  color:var(--muted);
  max-width:560px;
  margin:0 auto 42px;
}
.btn{
  display:inline-block;
  font-family:'Cutive Mono', monospace;
  font-size:0.8rem;
  letter-spacing:0.14em;
  text-transform:uppercase;
  padding:16px 36px;
  background:transparent;
  border:1px solid var(--poison-soft);
  color:var(--poison-soft);
  transition:background 0.25s ease, color 0.25s ease;
}
.btn:hover{background:var(--poison-soft); color:var(--ink);}
.btn.btn-solid{
  background:var(--blood);
  border-color:var(--blood);
  color:var(--cream-text);
}
.btn.btn-solid:hover{background:var(--blood-soft); border-color:var(--blood-soft);}

/* ---------- FILMS ---------- */
.films{
  padding:110px 0;
  background:
    linear-gradient(180deg, var(--paper) 0, rgba(237,231,221,0.45) 30px, transparent 80px),
    var(--ink);
}
.section-head{
  text-align:center;
  max-width:640px;
  margin:0 auto 70px;
}
.section-head h2{
  font-size:2.2rem;
  margin-top:10px;
}
.film{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:60px;
  align-items:center;
  padding:60px 0;
  border-bottom:1px solid rgba(124,154,74,0.15);
}
.film:last-child{border-bottom:none;}
.film:nth-child(even) .film-media{order:2;}
.film-media{
  aspect-ratio:4/3;
  overflow:hidden;
}
.film-media img{
  width:100%;
  height:100%;
  object-fit:cover;
  -webkit-mask-image:radial-gradient(ellipse 82% 82% at center, #000 68%, transparent 100%);
  mask-image:radial-gradient(ellipse 82% 82% at center, #000 68%, transparent 100%);
  filter:drop-shadow(0 14px 34px rgba(0,0,0,0.5));
}
.film h3{font-size:1.9rem; margin-bottom:6px;}
.film .film-tagline{
  font-family:'Cormorant', serif;
  font-style:italic;
  color:var(--blood-soft);
  font-size:1.15rem;
  margin-bottom:20px;
}
.film .film-tagline.tagline-purple{
  color:#9B6BC4;
}
.film .film-tagline.tagline-ghost{
  color:#6EC6E8;
  text-shadow:0 0 6px rgba(110,198,232,0.55), 0 0 14px rgba(110,198,232,0.3);
}
.film .film-tagline.tagline-emerald{
  background:linear-gradient(100deg, #0B3D2E 15%, #3ECF8E 45%, #0F4A36 55%, #2ECC71 75%, #0B3D2E 90%);
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
  color:#1B5E42;
  text-shadow:0 0 10px rgba(46,204,113,0.35);
}
.film p{color:var(--muted); margin-bottom:26px; max-width:44ch;}
.film-trailer{
  aspect-ratio:16/9;
  margin-top:8px;
}
.film-trailer iframe{width:100%; height:100%; border:none;}
.imdb-link{
  display:inline-block;
  margin-top:16px;
  font-family:'Apple Chancery', 'Petit Formal Script', cursive;
  font-size:1.35rem;
  letter-spacing:0.02em;
  color:var(--poison-soft);
  border-bottom:1px solid rgba(163,197,107,0.4);
  text-shadow:0 0 6px rgba(110,198,232,0.55), 0 0 14px rgba(110,198,232,0.3);
  transition:color 0.25s ease, border-color 0.25s ease;
}
.imdb-link:hover{color:var(--cream-text); border-color:var(--cream-text);}

/* ---------- ABOUT ---------- */
.about{
  padding:100px 0;
  background:
    linear-gradient(180deg, var(--ink) 0, rgba(11,9,8,0.45) 60px, transparent 160px),
    radial-gradient(ellipse 500px 300px at 15% 20%, rgba(120,98,68,0.1), transparent 55%),
    radial-gradient(ellipse 600px 400px at 85% 75%, rgba(120,98,68,0.11), transparent 55%),
    radial-gradient(ellipse 450px 280px at 50% 95%, rgba(90,72,48,0.08), transparent 50%),
    radial-gradient(ellipse 350px 250px at 5% 85%, rgba(150,128,96,0.07), transparent 45%),
    linear-gradient(115deg, transparent 42%, rgba(90,72,48,0.05) 43%, transparent 45%),
    linear-gradient(25deg, transparent 68%, rgba(90,72,48,0.04) 69%, transparent 71%),
    repeating-linear-gradient(112deg, rgba(90,72,48,0.025) 0px, transparent 1px, transparent 3px),
    var(--paper);
  color:var(--ink-text);
  text-align:center;
}
.about h2{font-size:2.2rem; color:var(--blood); margin-bottom:28px;}
.about p{
  color:#4a423a;
  max-width:640px;
  margin:0 auto;
  font-size:1.1rem;
}

/* ---------- GALLERY ---------- */
.gallery{
  padding:100px 0;
  background:var(--ink-2);
}
.follow-strip{
  padding:60px 0;
  background:var(--ink-2);
  text-align:center;
  border-top:1px solid rgba(124,154,74,0.15);
}
.follow-label{
  font-family:'Apple Chancery', 'Petit Formal Script', cursive;
  color:var(--poison-soft);
  font-size:1.8rem;
  text-shadow:0 0 6px rgba(110,198,232,0.55), 0 0 14px rgba(110,198,232,0.3);
  margin-bottom:26px;
}
.follow-btn{
  display:inline-block;
  font-family:'Apple Chancery', 'Petit Formal Script', cursive;
  font-size:1.3rem;
  padding:20px 52px;
  background:transparent;
  border:1px solid var(--poison-soft);
  color:var(--poison-soft);
  text-shadow:0 0 6px rgba(110,198,232,0.55), 0 0 14px rgba(110,198,232,0.3);
  transition:background 0.25s ease, color 0.25s ease;
}
.follow-btn:hover{background:var(--poison-soft); color:var(--ink);}
.gallery-grid{
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:2px;
  background:rgba(124,154,74,0.15);
}
.gallery-grid .placeholder{aspect-ratio:1/1;}
.gallery-tile{
  aspect-ratio:1/1;
  overflow:hidden;
  background:var(--ink-2);
}
.gallery-tile img{
  width:100%;
  height:100%;
  object-fit:cover;
  filter:grayscale(1) contrast(1.05);
  transition:transform 0.4s ease, filter 0.4s ease;
}
.gallery-tile:hover img{
  transform:scale(1.05);
  filter:grayscale(0.3) contrast(1.1);
}

/* ---------- CONTACT ---------- */
.contact{
  padding:110px 0;
  background:var(--ink);
  text-align:center;
}
.contact-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:70px;
  max-width:760px;
  margin:0 auto 50px;
  text-align:center;
}
.contact-info h3{font-size:1.4rem; margin:10px 0 14px;}
.contact-info p{color:var(--muted); max-width:36ch; margin:0 auto;}
.contact-details{
  font-family:'Cutive Mono', monospace;
  font-size:0.85rem;
  color:var(--poison-soft);
  line-height:2;
}

footer{
  background:var(--ink);
  padding:40px 0;
  text-align:center;
  font-size:0.75rem;
  color:var(--muted);
  font-family:'Cutive Mono', monospace;
  border-top:1px solid rgba(124,154,74,0.15);
}
footer a{
  color:var(--poison-soft);
  border-bottom:1px solid rgba(163,197,107,0.4);
  transition:color 0.25s ease, border-color 0.25s ease;
}
footer a:hover{color:var(--cream-text); border-color:var(--cream-text);}

/* ---------- RESPONSIVE ---------- */
@media (max-width:760px){
  .wrap{padding:0 22px;}
  .film{grid-template-columns:1fr; gap:34px;}
  .film:nth-child(even) .film-media{order:0;}
  .gallery-grid{grid-template-columns:repeat(2, 1fr);}
  .contact-grid{grid-template-columns:1fr; gap:44px;}
  .navlinks{display:none;}
  .hero{padding:90px 0 70px;}
}

a:focus-visible, button:focus-visible{
  outline:2px solid var(--poison-soft);
  outline-offset:3px;
}

/* ---------- LIGHTBOX ---------- */
.lightbox{
  display:none;
  position:fixed;
  inset:0;
  background:rgba(11,9,8,0.95);
  align-items:center;
  justify-content:center;
  z-index:200;
  padding:60px;
}
.lightbox.active{display:flex;}
.lightbox-img{
  max-width:88vw;
  max-height:82vh;
  object-fit:contain;
  box-shadow:0 20px 60px rgba(0,0,0,0.6);
}
.lightbox-close{
  position:absolute;
  top:22px; right:32px;
  background:none;
  border:none;
  color:var(--cream-text);
  font-size:2.2rem;
  line-height:1;
  cursor:pointer;
  padding:8px;
}
.lightbox-close:hover{color:var(--poison-soft);}
.lightbox-nav{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  background:none;
  border:none;
  color:var(--cream-text);
  font-size:2rem;
  cursor:pointer;
  padding:16px;
  transition:color 0.25s ease;
}
.lightbox-nav:hover{color:var(--poison-soft);}
.lightbox-prev{left:12px;}
.lightbox-next{right:12px;}
@media (max-width:760px){
  .lightbox{padding:20px;}
  .lightbox-nav{font-size:1.5rem; padding:10px;}
}