/* =========================================================
   LINK COMMUNITY HUB™ · LAKE NORMAN
   COMMUNITY MEDIA
   Uses the current public LINK visual system.
   ========================================================= */

.media-page {
  background: #f7f5ef;
  color: #17324d;
  min-height: 70vh;
  padding: 0 0 72px;
}

/* HERO */

.media-hero {
  width: min(1180px, calc(100% - 40px));
  margin: 54px auto 0;
  padding: 68px 64px;
  background: #ffffff;
  border: 1px solid rgba(23, 50, 77, 0.12);
  border-radius: 24px;
  box-shadow: 0 18px 50px rgba(23, 50, 77, 0.08);
}

.media-hero-copy {
  max-width: 900px;
}

.media-eyebrow {
  margin-bottom: 16px;
  color: #c48b27;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.media-hero h1 {
  margin: 0;
  color: #17324d;
  font-size: clamp(48px, 7vw, 82px);
  line-height: 0.98;
  letter-spacing: -0.055em;
}

.media-hero p {
  max-width: 820px;
  margin: 26px 0 0;
  color: #536679;
  font-size: clamp(18px, 2vw, 23px);
  line-height: 1.6;
}

.media-hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin-top: 34px;
}

.media-primary,
.media-secondary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 50px;
  padding: 12px 22px;
  border-radius: 10px;
  font-weight: 800;
  text-decoration: none;
  transition:
    transform 160ms ease,
    box-shadow 160ms ease,
    background 160ms ease;
}

.media-primary {
  background: #17324d;
  color: #ffffff;
  border: 2px solid #17324d;
}

.media-secondary {
  background: #ffffff;
  color: #17324d;
  border: 2px solid rgba(23, 50, 77, 0.25);
}

.media-primary:hover,
.media-secondary:hover {
  transform: translateY(-1px);
  box-shadow: 0 9px 22px rgba(23, 50, 77, 0.12);
}

/* CONTENT */

.media-content {
  width: min(1180px, calc(100% - 40px));
  margin: 64px auto 0;
}

.media-section-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
  padding-bottom: 22px;
  border-bottom: 1px solid rgba(23, 50, 77, 0.14);
}

.media-section-head span {
  display: block;
  margin-bottom: 8px;
  color: #c48b27;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.14em;
}

.media-section-head h2 {
  margin: 0;
  color: #17324d;
  font-size: clamp(30px, 4vw, 46px);
  letter-spacing: -0.035em;
}

#media-count {
  color: #6a7885;
  font-size: 14px;
  font-weight: 700;
}

/* GALLERY */

.media-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 22px;
  margin-top: 30px;
}

.media-card {
  overflow: hidden;
  background: #ffffff;
  border: 1px solid rgba(23, 50, 77, 0.11);
  border-radius: 16px;
  box-shadow: 0 10px 28px rgba(23, 50, 77, 0.06);
}

.media-card img {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
}

.media-card-copy {
  padding: 20px;
}

.media-card-copy small {
  color: #c48b27;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.media-card-copy h3 {
  margin: 7px 0 8px;
  color: #17324d;
  font-size: 19px;
  line-height: 1.25;
}

.media-card-copy p {
  margin: 0;
  color: #647381;
  line-height: 1.55;
}

.media-loading,
.media-empty,
.media-error {
  grid-column: 1 / -1;
  padding: 54px 24px;
  background: #ffffff;
  border: 1px solid rgba(23, 50, 77, 0.11);
  border-radius: 16px;
  color: #647381;
  text-align: center;
}

/* STORY LINKS */

.story-links {
  display: grid;
  gap: 14px;
  margin-top: 34px;
}

.story-link {
  display: block;
  padding: 22px 24px;
  background: #ffffff;
  border: 1px solid rgba(23, 50, 77, 0.11);
  border-radius: 14px;
  color: #17324d;
  text-decoration: none;
}

.story-link:hover {
  border-color: rgba(196, 139, 39, 0.6);
}

/* RESPONSIVE */

@media (max-width: 900px) {
  .media-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .media-hero {
    padding: 48px 34px;
  }
}

@media (max-width: 640px) {
  .media-page {
    padding-bottom: 48px;
  }

  .media-hero {
    width: min(100% - 24px, 1180px);
    margin-top: 24px;
    padding: 38px 24px;
    border-radius: 18px;
  }

  .media-content {
    width: min(100% - 24px, 1180px);
    margin-top: 44px;
  }

  .media-section-head {
    align-items: flex-start;
    flex-direction: column;
  }

  .media-grid {
    grid-template-columns: 1fr;
  }

  .media-hero-actions {
    flex-direction: column;
  }

  .media-primary,
  .media-secondary {
    width: 100%;
  }
}

/* LINK PUBLIC MEDIA SUBMISSION START */

.community-submit-section{
  padding:64px 28px;
  background:#f7f3eb;
  color:#0b2344;
}

.community-submit-shell{
  width:min(1380px,100%);
  margin:0 auto;
  display:grid;
  grid-template-columns:minmax(300px,.75fr) minmax(0,1.25fr);
  gap:48px;
  align-items:start;
}

.community-submit-intro{
  position:sticky;
  top:24px;
}

.community-submit-kicker{
  display:block;
  margin-bottom:12px;
  color:#b87912;
  font:900 14px/1.2 Montserrat,Arial,sans-serif;
  letter-spacing:.12em;
}

.community-submit-intro h2{
  margin:0;
  color:#0b2344;
  font-family:"Libre Baskerville",Georgia,serif;
  font-size:clamp(38px,4vw,56px);
  line-height:1.05;
}

.community-submit-intro > p{
  max-width:530px;
  margin:20px 0 0;
  color:#344458;
  font-size:18px;
  line-height:1.7;
}

.community-submit-review-note{
  margin-top:28px;
  padding:22px;
  border-radius:10px;
  background:#0b2344;
  color:#fff;
}

.community-submit-review-note strong{
  display:block;
  color:#e0a52f;
  font:900 14px/1.45 Montserrat,Arial,sans-serif;
}

.community-submit-review-note span{
  display:block;
  margin-top:8px;
  color:#fff;
  font-size:15px;
  line-height:1.5;
}

.community-submit-form{
  padding:34px;
  border:1px solid rgba(11,35,68,.13);
  border-radius:14px;
  background:#fff;
  box-shadow:0 14px 36px rgba(6,23,46,.08);
}

.community-submit-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:20px;
}

.community-submit-grid label{
  color:#0b2344;
  font-size:14px;
  line-height:1.4;
  font-weight:800;
}

.community-submit-wide{
  grid-column:1/-1;
}

.community-submit-grid input,
.community-submit-grid select,
.community-submit-grid textarea{
  width:100%;
  box-sizing:border-box;
  margin-top:8px;
  padding:13px 14px;
  border:1px solid rgba(11,35,68,.22);
  border-radius:7px;
  background:#fff;
  color:#0b2344;
  font:600 15px/1.45 "Open Sans",Arial,sans-serif;
}

.community-submit-grid textarea{
  resize:vertical;
}

.community-file-field input{
  padding:12px;
  background:#f7f8fa;
}

.community-file-field small{
  display:block;
  margin-top:8px;
  color:#657184;
  font-size:12px;
  font-weight:600;
}

.community-submit-permissions{
  margin-top:26px;
  padding:22px;
  display:grid;
  gap:14px;
  border-radius:9px;
  background:#f1f4f7;
}

.community-submit-permissions label{
  display:flex;
  align-items:flex-start;
  gap:11px;
  color:#24364d;
  font-size:14px;
  line-height:1.5;
  font-weight:700;
}

.community-submit-permissions input{
  width:18px;
  height:18px;
  margin-top:2px;
  flex:0 0 auto;
}

.community-submit-button{
  width:100%;
  min-height:58px;
  margin-top:25px;
  padding:0 24px;
  border:0;
  border-radius:7px;
  background:#e0a52f;
  color:#0b2344;
  cursor:pointer;
  font:900 15px/1 Montserrat,Arial,sans-serif;
  letter-spacing:.03em;
}

.community-submit-button:hover{
  filter:brightness(.97);
}

.community-submit-button:disabled{
  opacity:.55;
  cursor:wait;
}

.community-submit-status{
  min-height:24px;
  margin:16px 0 0;
  font-size:14px;
  line-height:1.5;
  font-weight:800;
}

.community-submit-status.success{
  color:#39702e;
}

.community-submit-status.error{
  color:#9b3030;
}

.community-submit-honeypot{
  position:absolute !important;
  left:-10000px !important;
  width:1px !important;
  height:1px !important;
  overflow:hidden !important;
}

@media(max-width:900px){
  .community-submit-shell{
    grid-template-columns:1fr;
  }

  .community-submit-intro{
    position:static;
  }
}

@media(max-width:620px){
  .community-submit-section{
    padding:44px 18px;
  }

  .community-submit-form{
    padding:24px 18px;
  }

  .community-submit-grid{
    grid-template-columns:1fr;
  }

  .community-submit-wide{
    grid-column:auto;
  }
}

/* LINK PUBLIC MEDIA SUBMISSION END */

/* LINK COMMUNITY MEDIA FINAL SCALE START */

/* ---------- STANDARD MEDIA HEADER ---------- */

body > .site-header{
  position:relative !important;
  width:100% !important;
  min-height:84px !important;
  background:#0b2344 !important;
  z-index:50 !important;
}

body > .site-header .nav-shell{
  width:min(1460px,calc(100% - 48px)) !important;
  min-height:84px !important;
  height:auto !important;
  margin:0 auto !important;
  padding:8px 0 !important;

  display:flex !important;
  align-items:center !important;
  gap:22px !important;
}

body > .site-header .brand-logo{
  flex:0 0 190px !important;
  width:190px !important;
  max-width:190px !important;
  margin:0 !important;

  display:flex !important;
  align-items:center !important;

  text-decoration:none !important;
}

body > .site-header .brand-logo img{
  display:block !important;

  width:185px !important;
  max-width:185px !important;

  height:62px !important;
  max-height:62px !important;

  object-fit:contain !important;
  object-position:left center !important;
}

body > .site-header .main-nav{
  flex:1 1 auto !important;
  min-width:0 !important;

  display:grid !important;
  grid-template-columns:repeat(6,minmax(0,1fr)) !important;

  gap:8px !important;
  align-items:center !important;
}

body > .site-header .main-nav a{
  min-width:0 !important;

  color:#fff !important;
  text-decoration:none !important;
  text-align:center !important;
}

body > .site-header .main-nav strong{
  display:block !important;

  color:#fff !important;

  font:
    800 11px/1.15
    Montserrat,
    Arial,
    sans-serif !important;
}

body > .site-header .main-nav span{
  display:block !important;

  margin-top:4px !important;

  color:rgba(255,255,255,.72) !important;

  font:
    600 8px/1.2
    "Open Sans",
    Arial,
    sans-serif !important;
}

body > .site-header .get-involved{
  flex:0 0 145px !important;

  width:145px !important;
  max-width:145px !important;

  min-height:44px !important;

  padding:0 12px !important;

  display:flex !important;
  align-items:center !important;
  justify-content:center !important;

  border-radius:6px !important;

  background:#e0a52f !important;
  color:#0b2344 !important;

  text-decoration:none !important;
  white-space:nowrap !important;

  font:
    900 11px/1
    Montserrat,
    Arial,
    sans-serif !important;
}


/* ---------- MEDIA HERO ---------- */

.media-page{
  width:100% !important;
  max-width:100% !important;
  overflow-x:hidden !important;
}

.media-hero{
  min-height:0 !important;

  padding:
    48px 28px
    42px !important;
}

.media-hero-copy{
  width:min(1180px,100%) !important;
  max-width:1180px !important;

  margin:0 auto !important;
  padding:0 !important;
}

.media-eyebrow{
  margin-bottom:14px !important;

  font-size:13px !important;
  line-height:1.2 !important;

  letter-spacing:.12em !important;
}

.media-hero h1{
  max-width:100% !important;

  margin:
    0 0 18px !important;

  font-size:
    clamp(
      48px,
      6vw,
      76px
    ) !important;

  line-height:.98 !important;
}

.media-hero-copy > p{
  max-width:820px !important;

  margin:
    0 0 28px !important;

  font-size:18px !important;
  line-height:1.55 !important;
}

.media-hero-actions{
  display:flex !important;
  flex-wrap:wrap !important;

  gap:14px !important;

  align-items:center !important;
}

.media-primary,
.media-secondary{
  width:auto !important;
  min-width:0 !important;
  max-width:100% !important;

  min-height:50px !important;

  padding:
    0 22px !important;

  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;

  font-size:14px !important;
  line-height:1.15 !important;
}


/* ---------- TABLET ---------- */

@media(max-width:1100px){

  body > .site-header .nav-shell{
    gap:14px !important;
  }

  body > .site-header .brand-logo{
    flex-basis:165px !important;
    width:165px !important;
  }

  body > .site-header .brand-logo img{
    width:160px !important;
    max-width:160px !important;
  }

  body > .site-header .main-nav{
    gap:5px !important;
  }

  body > .site-header .main-nav strong{
    font-size:9px !important;
  }

  body > .site-header .main-nav span{
    font-size:7px !important;
  }

  body > .site-header .get-involved{
    flex-basis:125px !important;
    width:125px !important;
    max-width:125px !important;

    font-size:9px !important;
  }

}


/* ---------- COMPACT / MOBILE ---------- */

@media(max-width:850px){

  body > .site-header .main-nav{
    display:none !important;
  }

  body > .site-header .nav-shell{
    justify-content:space-between !important;
  }

  body > .site-header .brand-logo{
    flex:0 0 175px !important;
    width:175px !important;
  }

  body > .site-header .brand-logo img{
    width:170px !important;
    max-width:170px !important;
  }

  body > .site-header .get-involved{
    flex:0 0 130px !important;

    width:130px !important;
    max-width:130px !important;
  }

}


@media(max-width:600px){

  body > .site-header{
    min-height:74px !important;
  }

  body > .site-header .nav-shell{
    width:calc(100% - 28px) !important;
    min-height:74px !important;
  }

  body > .site-header .brand-logo{
    flex-basis:150px !important;
    width:150px !important;
  }

  body > .site-header .brand-logo img{
    width:145px !important;
    max-width:145px !important;

    height:52px !important;
  }

  body > .site-header .get-involved{
    flex-basis:112px !important;

    width:112px !important;
    max-width:112px !important;

    min-height:40px !important;

    font-size:8px !important;
  }

  .media-hero{
    padding:
      36px 18px
      32px !important;
  }

  .media-hero h1{
    font-size:46px !important;
  }

  .media-hero-copy > p{
    font-size:16px !important;
  }

  .media-primary,
  .media-secondary{
    width:100% !important;
  }

}

/* LINK COMMUNITY MEDIA FINAL SCALE END */


/* LINK MEDIA HEADER BRAND PANEL START */

body > .site-header .brand-logo{
  flex:0 0 245px !important;
  width:245px !important;
  max-width:245px !important;
  min-width:245px !important;

  padding:6px 10px !important;

  display:flex !important;
  align-items:center !important;
  justify-content:center !important;

  background:#fff !important;
  border-radius:8px !important;
}

body > .site-header .brand-logo img{
  display:block !important;

  width:220px !important;
  max-width:220px !important;

  height:66px !important;
  max-height:66px !important;

  object-fit:contain !important;
  object-position:center !important;
}

@media(max-width:1100px){
  body > .site-header .brand-logo{
    flex-basis:205px !important;
    width:205px !important;
    max-width:205px !important;
  }

  body > .site-header .brand-logo img{
    width:185px !important;
    max-width:185px !important;
  }
}

@media(max-width:650px){
  body > .site-header .brand-logo{
    flex-basis:170px !important;
    width:170px !important;
    max-width:170px !important;
  }

  body > .site-header .brand-logo img{
    width:150px !important;
    max-width:150px !important;
    height:54px !important;
  }
}

/* LINK MEDIA HEADER BRAND PANEL END */