/* Leatherneck Archive cinematic redesign — shared test-site theme */
:root{
  --la-black:#030403;
  --la-panel:#080a08;
  --la-gold:#c99a4b;
  --la-cream:#f4efe3;
  --la-muted:#b9b4a8;
  --la-line:rgba(201,154,75,.30);
}
html,body{background:var(--la-black)!important;color:var(--la-cream)!important}
body{min-width:320px}

/* Sitewide cinematic header */
.cinematic-header{
  position:relative;
  z-index:100;
  width:100%;
  min-height:82px;
  border-bottom:1px solid rgba(255,255,255,.12);
  background:
    radial-gradient(circle at 12% 0%,rgba(88,112,76,.18),transparent 28%),
    linear-gradient(180deg,#090b09 0%,#050605 100%);
}
.cinematic-nav{
  width:100%;
  max-width:1600px;
  min-height:82px;
  margin:0 auto;
  padding:10px clamp(20px,3.2vw,52px);
  display:flex;
  align-items:center;
  gap:30px;
}
.cinematic-logo{display:block;width:clamp(225px,20vw,325px);line-height:0;text-decoration:none;flex:0 0 auto}
.cinematic-logo img{display:block;width:100%;height:auto}
.cinematic-links{margin-left:auto;display:flex;align-items:center;gap:clamp(18px,2vw,34px)}
.cinematic-links a{
  position:relative;padding:12px 0;color:#fff!important;text-decoration:none!important;
  text-transform:uppercase;white-space:nowrap;font-size:.74rem;font-weight:900;letter-spacing:.105em;
  border:0!important
}
.cinematic-links a::after{content:"";position:absolute;left:0;right:100%;bottom:4px;height:2px;background:var(--la-gold);transition:right .18s ease}
.cinematic-links a:hover::after,.cinematic-links a:focus-visible::after,.cinematic-links a.active::after{right:0}
.cinematic-menu{display:none;margin-left:auto;padding:9px 13px;border:1px solid rgba(255,255,255,.72);border-radius:3px;background:rgba(0,0,0,.35);color:#fff;text-transform:uppercase;font-weight:800;letter-spacing:.08em;cursor:pointer}

/* Homepage movie-poster hero */
.cinematic-hero{position:relative;width:100%;overflow:hidden;background:#000}
.cinematic-hero-image{display:block;width:100%;height:auto}
.cinematic-hero::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:23%;z-index:2;pointer-events:none;
  background:linear-gradient(to bottom,rgba(3,4,3,0) 0%,rgba(3,4,3,.28) 38%,rgba(3,4,3,.80) 73%,rgba(3,4,3,1) 100%)
}
.cinematic-hero-content{
  position:absolute;z-index:5;left:5.5%;top:79.5%;width:48%;transform:translateY(-50%);text-align:center
}
.cinematic-hero-description{
  max-width:650px;margin:0 auto 22px;color:#fff;
  font-family:"Arial Narrow","Franklin Gothic Medium",Arial,sans-serif;
  font-size:clamp(.95rem,1.25vw,1.28rem);font-weight:700;letter-spacing:.055em;line-height:1.45;
  text-shadow:0 3px 18px rgba(0,0,0,.98)
}
.cinematic-hero-actions{display:flex;justify-content:center;gap:14px;flex-wrap:wrap}
.cinematic-hero-button{
  min-width:230px;padding:17px 26px;display:inline-flex;justify-content:center;align-items:center;
  border:1px solid rgba(255,255,255,.80);border-radius:4px;background:rgba(8,10,9,.28);color:#fff!important;
  text-decoration:none!important;text-transform:uppercase;font-size:.84rem;font-weight:900;letter-spacing:.035em;
  backdrop-filter:blur(3px);transition:transform .18s ease,background .18s ease,border-color .18s ease
}
.cinematic-hero-button:hover,.cinematic-hero-button:focus-visible{transform:translateY(-2px);background:rgba(255,255,255,.14);border-color:#fff}

/* Bring existing site sections into the new wider, darker visual system */
.homepage-wrap,.page,.submit-page{width:100%!important;max-width:1280px!important;margin:0 auto!important;background:var(--la-black)!important}
.live-photos-section{background:radial-gradient(circle at 78% 0%,rgba(81,110,72,.14),transparent 30%),linear-gradient(180deg,#0b0d0b,#050605)!important;border-top:0!important}
.home-footer{background:linear-gradient(180deg,#080a08,#030403)!important}

/* Interior-page title areas now echo the green mountain design */
.page-hero,.submit-hero{
  position:relative;overflow:hidden;
  background:
    linear-gradient(90deg,rgba(0,0,0,.90),rgba(0,0,0,.48)),
    url('assets/cinematic/hero.jpg') center 44%/cover no-repeat!important;
  border-top:0!important;border-bottom:1px solid var(--la-line)!important
}
.page-hero::after,.submit-hero::after{content:"";position:absolute;inset:auto 0 0;height:36%;background:linear-gradient(transparent,var(--la-black));pointer-events:none}
.page-hero>* ,.submit-hero>*{position:relative;z-index:2}
.page-hero h1,.submit-hero h1{color:var(--la-cream)!important;text-shadow:0 4px 20px rgba(0,0,0,.95)!important}
.page-hero .gold{color:var(--la-gold)!important}

/* Admin keeps its tools, but shares the new identity */
.admin-subnav{background:#080a08!important;border-color:var(--la-line)!important}
.admin-subnav a.active{background:var(--la-gold)!important;color:#111!important}

@media(max-width:1040px){
  .cinematic-nav{
    display:grid;
    grid-template-columns:1fr auto;
    align-items:center;
    gap:18px;
    padding:16px 28px 20px;
    background:#080908;
  }

  .cinematic-logo{
    width:clamp(225px,62vw,340px);
    max-width:100%;
  }

  .cinematic-menu{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:136px;
    min-height:70px;
    margin-left:0;
    padding:14px 24px;
    border:1px solid rgba(255,255,255,.78);
    border-radius:7px;
    background:#151515;
    color:#fff;
    font-size:1.02rem;
    font-weight:900;
    letter-spacing:.06em;
    text-transform:uppercase;
  }

  .cinematic-menu[aria-expanded="true"]{
    background:#d1ae5c;
    border-color:#d1ae5c;
    color:#080808;
  }

  .cinematic-links{
    grid-column:1 / -1;
    display:none;
    width:100%;
    margin:0;
    padding:76px 0 10px;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:18px;
  }

  .cinematic-links.open{
    display:grid;
  }

  .cinematic-links a,
  .cinematic-links a.active{
    display:flex;
    align-items:center;
    justify-content:center;
    width:100%;
    min-height:82px;
    padding:16px 12px;
    margin:0;
    border:1px solid rgba(255,255,255,.78)!important;
    border-radius:8px;
    background:#151515;
    color:#fff!important;
    text-align:center;
    font-size:1rem;
    font-weight:900;
    letter-spacing:.05em;
    text-transform:uppercase;
  }

  .cinematic-links a::after{
    display:none;
  }

  .cinematic-hero-content{left:4%;top:80%;width:56%}
  .cinematic-hero-button{min-width:190px;padding:14px 19px}
}
@media(max-width:700px){
  .cinematic-nav{min-height:72px;background:#080908}
  .cinematic-logo{width:225px}
  .cinematic-hero::after{display:none}
  .cinematic-hero-content{position:relative;left:auto;top:auto;width:auto;transform:none;padding:28px 22px 38px;background:#080908}
  .cinematic-hero-actions{display:grid;grid-template-columns:1fr}
  .cinematic-hero-button{width:100%;min-width:0}
  .page-hero,.submit-hero{background-position:66% center!important}
}


/* Exact mobile menu sizing used on the working homepage */
@media(max-width:620px){
  .cinematic-nav{
    padding-left:28px!important;
    padding-right:28px!important;
  }
  .cinematic-logo{width:min(62vw,340px)!important}
  .cinematic-menu{min-width:132px!important}
  .cinematic-links{gap:18px!important}
  .cinematic-links a,
  .cinematic-links a.active{
    min-height:82px!important;
    font-size:.98rem!important;
  }
}

@media(max-width:430px){
  .cinematic-nav{
    padding-left:18px!important;
    padding-right:18px!important;
    gap:12px!important;
  }
  .cinematic-logo{width:230px!important}
  .cinematic-menu{
    min-width:108px!important;
    min-height:58px!important;
    padding:12px 16px!important;
  }
  .cinematic-links{
    padding-top:48px!important;
    gap:12px!important;
  }
  .cinematic-links a,
  .cinematic-links a.active{
    min-height:70px!important;
    font-size:.88rem!important;
  }
}


/* Simplified public navigation: Home | Archive | Submit */
@media(max-width:1040px){
  .cinematic-links{grid-template-columns:repeat(3,minmax(0,1fr));padding-top:24px;}
  .cinematic-links a,.cinematic-links a.active{background:#151515!important;border-color:rgba(255,255,255,.78)!important;color:#fff!important;}
}
@media(max-width:620px){
  .cinematic-links{padding-top:calc(env(safe-area-inset-top, 0px) + 24px)!important;}
}

/* Leatherneck Archive flag-raising homepage hero */
.leatherneck-hero{
  background:#0a0a09;
  border-bottom:1px solid rgba(201,154,75,.30);
}
.leatherneck-hero .cinematic-hero-image{
  width:100%;
  height:auto;
  display:block;
}
.leatherneck-hero::after{display:none;}
@media(max-width:700px){
  .leatherneck-hero .cinematic-hero-image{
    min-height:330px;
    object-fit:cover;
    object-position:center;
  }
}

/* 2026-08 Marine Corps interior-page redesign */
.page-hero.interior-marine-hero,
.submit-hero.interior-marine-hero{
  min-height:clamp(360px,34vw,520px)!important;
  padding:0!important;
  display:flex!important;
  align-items:flex-end!important;
  position:relative!important;
  overflow:hidden!important;
  background:
    linear-gradient(90deg,rgba(3,4,3,.98) 0%,rgba(3,4,3,.90) 25%,rgba(3,4,3,.42) 53%,rgba(3,4,3,.06) 78%),
    url('assets/cinematic/interior-flag.png') center center/cover no-repeat!important;
  border-bottom:1px solid var(--la-line)!important;
}
.page-hero.interior-marine-hero::after,
.submit-hero.interior-marine-hero::after{
  content:""!important;
  position:absolute!important;
  inset:auto 0 0!important;
  height:34%!important;
  background:linear-gradient(to bottom,transparent,rgba(3,4,3,.94))!important;
  pointer-events:none!important;
}
.interior-hero-copy{
  position:relative;
  z-index:3;
  width:min(620px,52%);
  padding:0 0 clamp(48px,5vw,74px) clamp(34px,5vw,72px);
  text-align:left;
}
.interior-kicker{
  margin-bottom:10px;
  color:#c99a4b;
  font-size:.78rem;
  font-weight:900;
  letter-spacing:.22em;
  text-transform:uppercase;
}
.interior-hero-copy h1{
  margin:0!important;
  color:#f4efe3!important;
  font-family:"Bebas Neue","Arial Narrow",Arial,sans-serif!important;
  font-size:clamp(4.6rem,9vw,8.4rem)!important;
  font-weight:400!important;
  letter-spacing:.035em!important;
  line-height:.82!important;
  text-transform:uppercase!important;
  text-shadow:0 4px 22px rgba(0,0,0,.9)!important;
}
.interior-rule{width:92px;height:4px;margin-top:22px;background:#8f1d1d;box-shadow:0 1px 5px rgba(0,0,0,.5)}
.page-intro,.submit-intro{
  background:linear-gradient(180deg,#0b0c0a,#070806)!important;
  border-bottom:1px solid var(--la-line)!important;
}
.page-intro p,.submit-intro p{color:#d7d2c6!important;font-size:1.05rem!important;line-height:1.75!important}
.browse-tools,.submit-section{background:radial-gradient(circle at 85% 0%,rgba(92,100,65,.13),transparent 27%),linear-gradient(180deg,#0a0b09,#050605)!important}
.submit-panel{border-top:3px solid #8f1d1d!important}
.submit-panel h2{color:#f4efe3!important;letter-spacing:.075em!important}
.filter-btn.active,.filter-btn:hover,.submit-btn{background:#8f1d1d!important;color:#fff!important;border-color:#a22a2a!important}
#browseSearch:focus,.submit-panel input:focus,.submit-panel textarea:focus{border-color:#c99a4b!important;box-shadow:0 0 0 1px rgba(201,154,75,.28)!important}
@media(max-width:700px){
 .page-hero.interior-marine-hero,.submit-hero.interior-marine-hero{min-height:390px!important;background-position:62% center!important}
 .interior-hero-copy{width:100%;padding:0 24px 46px;background:linear-gradient(90deg,rgba(3,4,3,.82),transparent)}
 .interior-hero-copy h1{font-size:clamp(4.1rem,19vw,6rem)!important}
}