@charset "UTF-8";

.sevenbridge-page {
  --sb-forest: #052f27;
  --sb-night: #071613;
  --sb-felt: #075343;
  --sb-gold: #e9c377;
  --sb-gold-dark: #a16a24;
  --sb-ivory: #fff8e9;
  --sb-red: #621c24;
  color: var(--sb-ivory);
  background: var(--sb-night);
}
.sevenbridge-page .site-header { background: rgba(3, 27, 25, .9); color: #fff; }
.sevenbridge-page .site-header.is-scrolled { background: rgba(3, 27, 25, .97); }
.sevenbridge-page .site-footer { background: #031b19; }
.sevenbridge-page ::selection { background: var(--sb-gold); color: var(--sb-night); }
.sevenbridge-page :focus-visible { outline-color: var(--sb-gold); }

.sb-kicker {
  margin: 0 0 18px;
  color: var(--sb-gold);
  font-family: Georgia, "Yu Mincho", serif;
  font-size: .72rem;
  font-weight: 900;
  letter-spacing: .28em;
}
.sb-section-heading { position: relative; z-index: 1; max-width: 730px; margin: 0 0 46px; }
.sb-section-heading h2 {
  margin: 0 0 17px;
  color: var(--sb-ivory);
  font-size: clamp(2.65rem, 4.6vw, 5.1rem);
  font-weight: 900;
  letter-spacing: -.075em;
  line-height: 1.2;
  text-shadow: 0 6px 24px rgba(0, 0, 0, .35);
}
.sb-section-heading > p:last-child { margin: 0; color: #d8e6dd; font-size: .94rem; line-height: 1.9; }
.sb-section-heading::after {
  display: block;
  width: 146px;
  height: 1px;
  margin-top: 29px;
  background: linear-gradient(90deg, transparent, var(--sb-gold), transparent);
  content: "";
}

.sb-hero {
  position: relative;
  min-height: 780px;
  padding: 156px 0 118px;
  overflow: hidden;
  background:
    linear-gradient(90deg, rgba(1, 15, 14, .94) 0%, rgba(2, 28, 23, .88) 44%, rgba(1, 13, 12, .56) 100%),
    url("../images/sevenbridge/salon.png") center 55% / cover no-repeat;
}
.sb-hero::before {
  position: absolute;
  inset: 101px 26px 68px;
  border: 1px solid rgba(233, 195, 119, .23);
  content: "";
  pointer-events: none;
}
.sb-hero::after {
  position: absolute;
  top: 120px;
  right: 42px;
  width: 74px;
  height: 74px;
  border-top: 2px solid var(--sb-gold);
  border-right: 2px solid var(--sb-gold);
  content: "";
  opacity: .7;
  pointer-events: none;
}
.sb-hero__inner { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(315px, .88fr) minmax(0, 1.12fr); align-items: center; gap: clamp(36px, 5vw, 76px); }
.sb-back { display: inline-flex; align-items: center; gap: 8px; margin-bottom: 33px; color: #c2cbbb; font-size: .7rem; font-weight: 900; letter-spacing: .15em; }
.sb-back:hover { color: var(--sb-gold); }
.sb-hero__date { display: inline-flex; align-items: center; gap: 12px; margin: 0 0 26px; padding: 8px 17px; border: 1px solid var(--sb-gold); color: var(--sb-ivory); background: rgba(4, 33, 27, .7); font-size: .7rem; font-weight: 900; letter-spacing: .09em; }
.sb-hero__date span { color: var(--sb-gold); font-family: Georgia, serif; font-size: .98rem; letter-spacing: .14em; }
.sb-hero h1 { margin: 0 0 24px; color: var(--sb-ivory); font-size: clamp(4.25rem, 7.15vw, 7.8rem); font-weight: 900; letter-spacing: -.095em; line-height: 1.04; text-shadow: 0 10px 35px #000; }
.sb-hero__lead { margin: 0 0 19px; color: var(--sb-gold); font-size: clamp(1.23rem, 2vw, 1.72rem); font-weight: 800; line-height: 1.65; }
.sb-hero__description { max-width: 480px; margin: 0; color: #e1e7da; font-size: .9rem; line-height: 1.95; }
.sb-hero__actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 32px; }
.sb-button { display: inline-flex; min-height: 52px; align-items: center; justify-content: space-between; gap: 27px; padding: 12px 22px; border: 1px solid var(--sb-gold); border-radius: 2px; font-size: .82rem; font-weight: 900; line-height: 1.4; box-shadow: 0 8px 22px rgba(0,0,0,.18); transition: transform .2s ease, background .2s ease; }
.sb-button:hover { transform: translateY(-3px); }
.sb-button--gold { color: #20160c; background: linear-gradient(110deg, #b58238, #f9dfa3 45%, #d9a757); }
.sb-button--gold:hover { background: linear-gradient(110deg, #d19b4d, #ffeac0 45%, #f0c375); }
.sb-button--outline { color: var(--sb-ivory); background: rgba(2, 22, 18, .74); }
.sb-button--outline:hover { background: rgba(13, 69, 54, .9); }
.sb-hero__visual {
  position: relative;
  min-width: 0;
  width: 100%;
  margin: 0;
  padding: 10px;
  border: 4px ridge #bd8a3c;
  background: #071815;
  box-shadow: 0 30px 75px rgba(0,0,0,.65), 0 0 0 8px rgba(1,16,13,.8), 0 0 0 9px rgba(233,195,119,.45);
  transform: rotate(1.2deg);
}
.sb-hero__visual::before, .sb-hero__visual::after { position: absolute; width: 32px; height: 32px; border: 2px solid #f5d591; content: ""; pointer-events: none; z-index: 1; }
.sb-hero__visual::before { top: 4px; left: 4px; border-right: 0; border-bottom: 0; }
.sb-hero__visual::after { right: 4px; bottom: 4px; border-left: 0; border-top: 0; }
.sb-hero__visual img { display: block; width: 100%; height: auto; aspect-ratio: 16/9; }
.sb-hero__visual figcaption { position: absolute; right: 0; bottom: -39px; color: var(--sb-gold); font-family: Georgia, serif; font-size: .62rem; font-weight: 900; letter-spacing: .24em; text-shadow: 0 2px 5px #000; }
.sb-hero__edge { position: absolute; right: 0; bottom: 0; left: 0; padding: 13px 20px; border-top: 1px solid rgba(233,195,119,.48); border-bottom: 1px solid rgba(233,195,119,.28); color: var(--sb-gold); background: linear-gradient(90deg, #130e0d, #493012 50%, #130e0d); font-family: Georgia, serif; font-size: 1.06rem; letter-spacing: .75em; text-align: center; white-space: nowrap; overflow: hidden; }

.sb-features {
  position: relative;
  width: 100%;
  max-width: none;
  padding: clamp(94px, 10vw, 142px) max(24px, calc((100vw - 1180px) / 2)) clamp(108px, 10vw, 150px);
  background:
    radial-gradient(ellipse at center 32%, rgba(18, 119, 87, .58), transparent 70%),
    linear-gradient(rgba(0, 29, 23, .4), rgba(0, 20, 17, .64)),
    url("../images/sevenbridge/felt.png") repeat;
  box-shadow: inset 0 22px 40px rgba(0,0,0,.34), inset 0 -22px 40px rgba(0,0,0,.36);
}
.sb-features::before {
  position: absolute;
  inset: 28px;
  border: 2px solid rgba(233,195,119,.48);
  border-radius: min(16vw, 170px);
  box-shadow: inset 0 0 0 8px rgba(4,40,31,.7), inset 0 0 0 9px rgba(233,195,119,.25);
  content: "";
  pointer-events: none;
}
.sb-features .sb-section-heading { max-width: 100%; margin-inline: auto; text-align: center; }
.sb-features .sb-section-heading::after { margin-inline: auto; }
.sb-feature-grid { position: relative; z-index: 1; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; }
.sb-feature-card {
  position: relative;
  min-width: 0;
  min-height: 320px;
  padding: 30px 30px 37px;
  border: 1px solid #b98d50;
  border-radius: 10px;
  color: #271d12;
  background: linear-gradient(145deg, #fffdf4, #f3e5c7);
  box-shadow: 0 20px 38px rgba(0,0,0,.34), 0 0 0 5px rgba(5,36,28,.64);
}
.sb-feature-card::before { position: absolute; inset: 9px; border: 1px solid #c6aa74; border-radius: 5px; content: ""; pointer-events: none; }
.sb-feature-card::after { position: absolute; right: 24px; bottom: 20px; color: rgba(136, 99, 47, .12); content: "7"; font-family: Georgia, serif; font-size: 6rem; line-height: 1; pointer-events: none; }
.sb-feature-card:nth-child(2) { transform: translateY(16px); }
.sb-feature-card__number { position: relative; z-index: 1; color: #895923; font-family: Georgia, serif; font-size: .66rem; font-weight: 900; letter-spacing: .15em; }
.sb-feature-card__symbol { display: block; margin: 26px 0 12px; color: #0f5944; font-family: Georgia, serif; font-size: 4.3rem; line-height: 1; }
.sb-feature-card:nth-child(2) .sb-feature-card__symbol { color: #8b262e; }
.sb-feature-card:nth-child(3) .sb-feature-card__symbol { color: #9d702e; }
.sb-feature-card h3 { position: relative; margin: 0 0 11px; font-size: 1.42rem; font-weight: 900; }
.sb-feature-card p { position: relative; margin: 0; color: #544d3f; font-size: .84rem; line-height: 1.82; }

.sb-showcase {
  position: relative;
  padding: clamp(93px, 10vw, 142px) 0;
  border-block: 2px solid #97672d;
  background:
    radial-gradient(circle at 50% -5%, rgba(226, 154, 82, .22), transparent 42%),
    linear-gradient(135deg, rgba(18, 4, 8, .93), rgba(43, 8, 18, .93)),
    url("../images/sevenbridge/salon.png") center / cover no-repeat;
}
.sb-showcase::before { position: absolute; top: 18px; right: 18px; bottom: 18px; left: 18px; border: 1px solid rgba(233,195,119,.3); content: ""; pointer-events: none; }
.sb-showcase .section-shell { position: relative; z-index: 1; }
.sb-showcase .sb-section-heading > p:last-child { color: #eadbd5; }
.sb-gallery { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px; }
.sb-gallery figure { min-width: 0; width: 100%; margin: 0; padding: 10px 10px 0; border: 3px ridge #bb8b46; background: #100d0d; box-shadow: 0 20px 45px rgba(0,0,0,.5), 0 0 0 6px rgba(0,0,0,.33); }
.sb-gallery img { display: block; width: 100%; height: auto; aspect-ratio: 16/9; }
.sb-gallery figcaption { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 8px; color: var(--sb-ivory); }
.sb-gallery figcaption span { color: var(--sb-gold); font-family: Georgia, serif; font-size: .62rem; font-weight: 900; letter-spacing: .13em; }
.sb-gallery figcaption strong { font-size: .92rem; }

.sb-info {
  position: relative;
  width: 100%;
  max-width: none;
  padding: clamp(95px, 10vw, 145px) max(24px, calc((100vw - 1180px) / 2)) clamp(98px, 10vw, 145px);
  overflow: hidden;
  background:
    radial-gradient(ellipse at 85% 15%, rgba(37, 106, 81, .44), transparent 42%),
    linear-gradient(145deg, #041c18, #062c23 56%, #041c18);
}
.sb-info::before { position: absolute; top: -250px; right: -150px; width: 700px; height: 700px; border: 1px solid rgba(233,195,119,.16); border-radius: 50%; box-shadow: 0 0 0 65px rgba(233,195,119,.025), 0 0 0 130px rgba(233,195,119,.02); content: ""; pointer-events: none; }
.sb-info__list { position: relative; z-index: 1; margin: 0; padding: 10px 28px; border: 2px solid rgba(233,195,119,.64); background: rgba(0, 13, 11, .52); box-shadow: inset 0 0 0 6px rgba(233,195,119,.06), 0 24px 45px rgba(0,0,0,.25); }
.sb-info__list > div { display: grid; grid-template-columns: 240px 1fr; gap: 20px; padding: 21px 12px; border-bottom: 1px solid rgba(233,195,119,.24); }
.sb-info__list > div:last-child { border-bottom: 0; }
.sb-info__list dt { color: var(--sb-gold); font-size: .8rem; font-weight: 900; }
.sb-info__list dd { margin: 0; color: #f6f2e5; font-size: .95rem; font-weight: 800; }

@media (max-width: 1000px) {
  .sb-hero { padding-top: 137px; }
  .sb-hero__inner { grid-template-columns: 1fr; gap: 59px; }
  .sb-hero__copy { max-width: 680px; }
  .sb-hero__visual { width: min(100%, 750px); }
}
@media (max-width: 760px) {
  .sb-hero { min-height: 0; padding-bottom: 95px; background-position: 40% center; }
  .sb-hero::before { inset: 88px 12px 60px; }
  .sb-hero::after { top: 98px; right: 22px; width: 32px; height: 32px; }
  .sb-hero h1 { font-size: clamp(3.75rem, 13vw, 5.8rem); }
  .sb-hero__description { font-size: .85rem; }
  .sb-features::before { inset: 13px; border-radius: 80px; }
  .sb-feature-grid, .sb-gallery { grid-template-columns: 1fr; }
  .sb-feature-card { min-height: 268px; }
  .sb-feature-card:nth-child(2) { transform: none; }
  .sb-info__list > div { grid-template-columns: 125px 1fr; gap: 12px; }
}
@media (max-width: 480px) {
  .sb-hero { padding-top: 120px; }
  .sb-hero__inner { gap: 48px; }
  .sb-hero__actions { flex-direction: column; }
  .sb-hero__actions .sb-button { width: 100%; }
  .sb-features { padding-inline: 24px; }
  .sb-features::before { border-radius: 48px; }
  .sb-gallery figcaption { flex-wrap: wrap; }
  .sb-info { padding-inline: 24px; }
  .sb-info__list { padding-inline: 15px; }
  .sb-info__list > div { grid-template-columns: 1fr; gap: 2px; }
}

/* Release links and launch videos */
.sb-download { position: relative; padding: 76px 0 88px; border-bottom: 1px solid rgba(233,195,119,.55); background: linear-gradient(135deg,#0a211b,#0b3b2e 55%,#071b17); }
.sb-download__inner { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1.08fr); gap: clamp(28px,5vw,72px); align-items: center; }
.sb-download__copy h2 { margin: 0 0 20px; color: var(--sb-ivory); font-size: clamp(2.5rem,4.4vw,4.7rem); line-height: 1.18; letter-spacing: -.06em; }
.sb-download__copy > p:not(.sb-kicker) { max-width: 460px; margin: 0 0 22px; color: #d8e6dd; line-height: 1.85; }
.sb-download__x { color: var(--sb-gold); font-weight: 800; text-decoration: underline; text-underline-offset: 5px; }
.sb-download__x:hover { color: #ffe9bc; }
.sb-download__stores { display: grid; gap: 14px; }
.sb-store-card { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 20px; min-height: 82px; padding: 16px 24px; border: 1px solid #c59a57; border-radius: 5px; background: linear-gradient(120deg,rgba(11,32,26,.96),rgba(13,54,42,.96)); box-shadow: 0 15px 30px rgba(0,0,0,.25); }
.sb-store-card__eyebrow { width: 82px; color: var(--sb-gold); font: 800 .68rem Georgia,serif; letter-spacing: .13em; }
.sb-store-card strong { color: var(--sb-ivory); font-size: 1.22rem; }
.sb-store-card__status { margin-left: auto; color: #bdcbbf; font-size: .74rem; }
.sb-store-card--linked { text-decoration: none; transition: transform .2s ease,background .2s ease; }
.sb-store-card--linked:hover { transform: translateY(-3px); background: linear-gradient(120deg,#164f3d,#1b7353); }
.sb-download__note { margin: 5px 0 0; color: #cbd3c5; font-size: .76rem; line-height: 1.7; }
.sb-movies { padding: clamp(86px,9vw,130px) 0; border-bottom: 1px solid rgba(233,195,119,.4); background: radial-gradient(circle at 20% 5%,rgba(96,33,37,.48),transparent 40%),linear-gradient(135deg,#180f13,#09231e); }
.sb-movie-grid { display: grid; grid-template-columns: 1.2fr 1fr 1fr; gap: 18px; }
.sb-movie-card { min-height: 250px; padding: 30px; border: 1px solid rgba(233,195,119,.65); border-radius: 5px; background: linear-gradient(150deg,rgba(48,20,25,.94),rgba(8,34,29,.94)); box-shadow: 0 18px 35px rgba(0,0,0,.23); }
.sb-movie-card--main { background: linear-gradient(150deg,rgba(78,35,28,.95),rgba(17,58,44,.94)); }
.sb-movie-card > span { color: var(--sb-gold); font: 800 .67rem Georgia,serif; letter-spacing: .15em; }
.sb-movie-card h3 { margin: 54px 0 12px; font-size: clamp(1.25rem,1.8vw,1.7rem); }
.sb-movie-card p { margin: 0; color: #d8e1d7; font-size: .82rem; line-height: 1.75; }
.sb-movie-card--linked { display: block; text-decoration: none; transition: transform .2s ease,border-color .2s ease; }
.sb-movie-card--linked:hover { transform: translateY(-4px); border-color: #f7dda1; }
@media (max-width: 1000px) { .sb-download__inner { grid-template-columns: 1fr; } .sb-movie-grid { grid-template-columns: 1fr 1fr; } .sb-movie-card--main { grid-column: 1 / -1; } }
@media (max-width: 760px) { .sb-download { padding: 68px 0 74px; } .sb-movie-grid { grid-template-columns: 1fr; } .sb-movie-card--main { grid-column: auto; } .sb-movie-card { min-height: 210px; } .sb-movie-card h3 { margin-top: 38px; } }
@media (max-width: 480px) { .sb-store-card { display: grid; gap: 5px; } .sb-store-card__status { margin-left: 0; } }


/* Seven Bridge title and screenshot carousel */
.sevenbridge-page .site-header .brand-mark__logo,
.sevenbridge-page .site-header.is-scrolled .brand-mark__logo {
  filter: brightness(0) invert(1);
}
.sb-hero .sb-hero__title { margin: -25px -4% 0; line-height: 0; text-shadow: none; }
.sb-hero__title img { display: block; width: 108%; max-width: none; height: auto; filter: drop-shadow(0 18px 28px rgba(0,0,0,.55)); }
.sb-gallery { display: block; max-width: 1180px; margin-inline: auto; }
.sb-gallery__viewport {
  display: flex;
  width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  overscroll-behavior-x: contain;
  touch-action: pan-x pan-y;
  border: 4px ridge #bb8b46;
  background: #100d0d;
  box-shadow: 0 24px 55px rgba(0,0,0,.5), 0 0 0 6px rgba(0,0,0,.33);
}
.sb-gallery__viewport::-webkit-scrollbar { display: none; }
.sb-gallery .sb-gallery__slide {
  flex: 0 0 100%;
  min-width: 0;
  width: 100%;
  margin: 0;
  padding: 10px 10px 0;
  border: 0;
  background: #100d0d;
  box-shadow: none;
  scroll-snap-align: start;
}
.sb-gallery__slide img { width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; }
.sb-gallery__controls { display: flex; align-items: center; justify-content: center; gap: 18px; margin: 30px 0 25px; }
.sb-gallery__arrow {
  min-height: 44px;
  border: 1px solid rgba(233,195,119,.7);
  border-radius: 3px;
  color: var(--sb-ivory);
  background: rgba(4,32,25,.85);
  cursor: pointer;
  transition: background .2s ease, transform .2s ease;
}
.sb-gallery__arrow:hover { background: #11684e; transform: translateY(-2px); }
.sb-gallery__arrow { width: 50px; font-size: 1.4rem; }
.sb-gallery__count { min-width: 73px; color: var(--sb-gold); font: 800 .9rem Georgia, serif; letter-spacing: .14em; text-align: center; }
.sb-gallery__thumbs { display: flex; gap: 9px; overflow-x: auto; padding: 6px 5px 15px; scrollbar-color: #bb8b46 rgba(0,0,0,.28); }
.sb-gallery__thumbs button {
  flex: 0 0 calc((100% - 54px) / 7);
  min-width: 100px;
  padding: 3px;
  border: 2px solid rgba(233,195,119,.32);
  border-radius: 2px;
  background: #071815;
  opacity: .65;
  cursor: pointer;
  transition: border-color .2s ease, opacity .2s ease, transform .2s ease;
}
.sb-gallery__thumbs button:hover { opacity: 1; transform: translateY(-2px); }
.sb-gallery__thumbs button[aria-current="true"] { border-color: var(--sb-gold); opacity: 1; box-shadow: 0 0 0 2px rgba(233,195,119,.3); }
.sb-gallery__thumbs img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; }
@media (max-width: 760px) {
  .sb-hero .sb-hero__title { margin: -18px -4% -3px; }
  .sb-gallery__controls { flex-wrap: wrap; gap: 11px; }
  .sb-gallery__thumbs button { flex-basis: 25%; }
}
@media (prefers-reduced-motion: reduce) {
  .sb-gallery__viewport { scroll-behavior: auto; }
  .sb-gallery__arrow, .sb-gallery__thumbs button { transition: none; }
}


/* Release information links */
.sb-info__list dd a { color: var(--sb-gold); text-decoration: underline; text-underline-offset: 3px; }

/* Reveal release links only after their URLs are configured. */
.sevenbridge-page [hidden] { display: none !important; }
