/* ============================================================
   TRENCHPORT MICROSITE THEME
   Shared by /trenchport/, /trenchport/help/, and /trenchport/recipes/.
   This file loads after the studio's normal page styles and only affects
   pages with the body class "trenchport-site".
   ============================================================ */

body.trenchport-site{
  --bg:#050505;
  --panel:rgba(15,15,15,.96);
  --panel-solid:#111111;
  --text:#f4f0e8;
  --muted:#c2bbb0;
  --soft:#8e887f;
  --line:rgba(201,119,48,.34);
  --tp-rust:#d77a2d;
  --tp-rust-bright:#f09a49;
  --tp-cream:#f3eee5;
  --tp-steel:#77736d;
  --tp-border:rgba(255,255,255,.12);
  --tp-panel:#111111;
  --tp-panel-2:#171717;
  color:var(--text);
  background:
    linear-gradient(180deg,rgba(0,0,0,.10),rgba(0,0,0,.82)),
    radial-gradient(circle at 50% 5%,rgba(255,255,255,.07),transparent 32%),
    linear-gradient(135deg,#111 0%,#050505 42%,#0b0b0b 100%);
}

body.trenchport-site::before{
  background:
    radial-gradient(circle at 50% 32%,transparent 0 16%,rgba(0,0,0,.32) 52%,rgba(0,0,0,.82) 100%),
    repeating-linear-gradient(112deg,rgba(255,255,255,.018) 0 1px,transparent 1px 28px),
    repeating-linear-gradient(0deg,rgba(255,255,255,.012) 0 1px,transparent 1px 6px);
}

body.trenchport-site::after{
  background:
    linear-gradient(180deg,rgba(0,0,0,.02),rgba(0,0,0,.28)),
    radial-gradient(circle at 50% 100%,rgba(215,122,45,.06),transparent 40%);
}

.trenchport-site .site-shell{
  width:min(1220px,94vw);
}

/* Studio header remains available, but is visually neutralized on Trenchport pages. */
.trenchport-site .site-header{
  padding-bottom:16px;
  border-bottom:1px solid rgba(255,255,255,.10);
}

.trenchport-site .header-brand img{
  filter:grayscale(1) contrast(1.2) brightness(1.2) drop-shadow(0 0 8px rgba(255,255,255,.16));
}

.trenchport-site .brand-text strong{
  color:#f3f3f3;
  text-shadow:none;
}

.trenchport-site .brand-text span{
  color:#8f8f8f;
}

.trenchport-site .top-nav a{
  opacity:.72;
  filter:grayscale(1) contrast(1.1) brightness(1.02);
}

.trenchport-site .top-nav a:hover,
.trenchport-site .top-nav a.active{
  opacity:1;
  filter:grayscale(1) sepia(.35) saturate(2.1) brightness(1.1) drop-shadow(0 0 8px rgba(215,122,45,.32));
}

/* Shared Trenchport brand bar */
.trenchport-masthead{
  position:relative;
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  gap:22px;
  align-items:center;
  margin:14px 0 24px;
  padding:18px 22px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.12);
  border-top:3px solid var(--tp-rust);
  background:
    linear-gradient(90deg,rgba(215,122,45,.10),transparent 32%),
    linear-gradient(180deg,#171717,#0d0d0d);
  box-shadow:0 18px 42px rgba(0,0,0,.35),inset 0 0 0 1px rgba(255,255,255,.025);
}

.trenchport-masthead::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  opacity:.35;
  background:
    repeating-linear-gradient(115deg,transparent 0 28px,rgba(255,255,255,.025) 28px 29px),
    linear-gradient(90deg,transparent 0 70%,rgba(215,122,45,.06));
}

.trenchport-masthead-mark,
.trenchport-masthead-copy,
.trenchport-subnav{
  position:relative;
  z-index:1;
}

.trenchport-masthead-mark{
  display:block;
  width:94px;
  height:94px;
  padding:7px;
  border:1px solid rgba(255,255,255,.14);
  background:#050505;
  box-shadow:0 0 0 3px rgba(215,122,45,.08);
}

.trenchport-masthead-mark img{
  width:100%;
  height:100%;
  object-fit:cover;
  filter:saturate(.82) contrast(1.08);
}

.trenchport-kicker{
  display:block;
  margin-bottom:5px;
  color:var(--tp-rust-bright);
  font-size:.72rem;
  font-weight:900;
  letter-spacing:.14em;
  text-transform:uppercase;
}

.trenchport-masthead-copy strong{
  display:block;
  color:#fff;
  font-family:'Orbitron',Arial,Helvetica,sans-serif;
  font-size:clamp(1.2rem,2.4vw,1.85rem);
  letter-spacing:.04em;
  text-transform:uppercase;
}

.trenchport-masthead-copy small{
  display:block;
  margin-top:6px;
  color:#aaa49b;
  font-size:.84rem;
  line-height:1.45;
}

.trenchport-subnav{
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  gap:8px;
}

.trenchport-subnav a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:40px;
  padding:9px 12px;
  border:1px solid rgba(255,255,255,.14);
  background:#0b0b0b;
  color:#d6d1c9;
  font-size:.78rem;
  font-weight:900;
  letter-spacing:.06em;
  text-decoration:none;
  text-transform:uppercase;
  transition:background .18s ease,border-color .18s ease,color .18s ease,transform .18s ease;
}

.trenchport-subnav a:hover,
.trenchport-subnav a.is-active{
  transform:translateY(-1px);
  border-color:rgba(215,122,45,.72);
  background:rgba(215,122,45,.13);
  color:#fff;
}

/* Page titles and shared panels */
.trenchport-site .page-title{
  position:relative;
  margin:16px auto 22px;
  padding:28px 24px 26px;
  border-top:1px solid rgba(255,255,255,.12);
  border-bottom:1px solid rgba(255,255,255,.12);
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.025),transparent);
}

.trenchport-site .page-title::after{
  content:"";
  position:absolute;
  left:50%;
  bottom:-2px;
  width:min(220px,45%);
  height:3px;
  transform:translateX(-50%);
  background:linear-gradient(90deg,transparent,var(--tp-rust),transparent);
}

.trenchport-site .page-title h1{
  color:#f7f3eb;
  letter-spacing:.075em;
  text-shadow:0 2px 0 #000,0 0 16px rgba(255,255,255,.08);
}

.trenchport-site .page-title p{
  color:#bdb7ae;
}

.trenchport-site .project-label,
.trenchport-site .recipe-eyebrow,
.trenchport-site .help-nav-kicker,
.trenchport-site .help-card-label{
  color:var(--tp-rust-bright);
}

.trenchport-site .panel{
  background:
    linear-gradient(180deg,rgba(20,20,20,.98),rgba(10,10,10,.98));
  border:1px solid rgba(255,255,255,.11);
  border-top-color:rgba(215,122,45,.54);
  border-radius:10px;
  box-shadow:0 18px 48px rgba(0,0,0,.40),inset 0 0 0 1px rgba(255,255,255,.02);
  backdrop-filter:none;
}

.trenchport-site .content-card h2,
.trenchport-site .content-card h3,
.trenchport-site .trenchport-intro h2,
.trenchport-site .help-group-heading h2,
.trenchport-site .help-copy h3,
.trenchport-site .help-finish-card h2,
.trenchport-site .recipe-browser-heading h2,
.trenchport-site .recipe-card h3,
.trenchport-site .station-banner-content h2{
  color:#f7f3eb;
  text-shadow:none;
}

.trenchport-site .content-card,
.trenchport-site .trenchport-intro p,
.trenchport-site .help-summary,
.trenchport-site .help-finish-card p,
.trenchport-site .recipe-description,
.trenchport-site .station-banner-content p{
  color:#bdb7ae;
}

.trenchport-site .mini-card{
  border:1px solid rgba(255,255,255,.10);
  border-left:3px solid rgba(215,122,45,.72);
  border-radius:8px;
  background:linear-gradient(180deg,#171717,#101010);
  box-shadow:none;
}

.trenchport-site .site-button,
.trenchport-site .recipe-clear-button{
  border:1px solid rgba(215,122,45,.70);
  border-radius:4px;
  background:linear-gradient(180deg,#df8437,#b85a1d);
  color:#120b06;
  box-shadow:0 8px 20px rgba(0,0,0,.28);
  text-transform:uppercase;
}

.trenchport-site .site-button:hover,
.trenchport-site .recipe-clear-button:hover{
  border-color:#f3a45c;
  filter:brightness(1.08);
}

.trenchport-site .site-button-secondary{
  border-color:rgba(255,255,255,.20);
  background:linear-gradient(180deg,#292929,#171717);
  color:#eee9e0;
}

.trenchport-site .footer{
  color:#89847c;
  border-top:1px solid rgba(255,255,255,.08);
  margin-top:34px;
  padding-top:22px;
}

/* Landing page */
.trenchport-site .trenchport-hud-showcase{
  border:1px solid rgba(255,255,255,.11);
  border-radius:8px;
  background:
    radial-gradient(circle at 50% 42%,rgba(215,122,45,.14),transparent 48%),
    linear-gradient(145deg,#171717,#080808);
  box-shadow:inset 0 0 45px rgba(0,0,0,.55);
}

.trenchport-site .trenchport-hud-showcase img{
  filter:drop-shadow(0 18px 24px rgba(0,0,0,.52)) saturate(.9) contrast(1.04);
}

/* Help guide */
.trenchport-site .help-nav-sticky{
  border:1px solid rgba(255,255,255,.11);
  border-top:3px solid rgba(215,122,45,.72);
  border-radius:7px;
  background:linear-gradient(180deg,#181818,#0c0c0c);
  box-shadow:0 14px 36px rgba(0,0,0,.34);
}

.trenchport-site .help-nav-heading{
  color:#ece7de;
}

.trenchport-site .help-nav a{
  color:#aca69d;
}

.trenchport-site .help-nav a:hover,
.trenchport-site .help-nav a:focus-visible{
  background:rgba(215,122,45,.12);
  color:#fff;
}

.trenchport-site .help-card{
  border:1px solid rgba(255,255,255,.10);
  border-left:4px solid rgba(215,122,45,.72);
  border-radius:8px;
  background:linear-gradient(180deg,#171717,#0d0d0d);
  box-shadow:0 14px 34px rgba(0,0,0,.30);
}

.trenchport-site .help-image-panel{
  min-height:0;
  border:1px solid rgba(255,255,255,.13);
  border-radius:5px;
  background:#000;
}

.trenchport-site .help-list li{
  background:#111;
  border:1px solid rgba(255,255,255,.055);
  border-radius:4px;
  color:#b9b3aa;
}

.trenchport-site .help-list li::before{
  color:var(--tp-rust-bright);
}

.trenchport-site .help-list strong{
  color:#f3eee5;
}

.trenchport-site .help-tip{
  border-color:rgba(215,122,45,.34);
  border-radius:4px;
  background:rgba(215,122,45,.07);
  color:#c1b9af;
}

.trenchport-site .help-tip strong,
.trenchport-site .help-top-link{
  color:var(--tp-rust-bright);
}

.trenchport-site .help-finish-card{
  border:1px solid rgba(255,255,255,.11);
  border-top:3px solid var(--tp-rust);
  border-radius:8px;
  background:linear-gradient(135deg,#171717,#0b0b0b);
}

/* Recipe browser */
.trenchport-site .recipe-controls{
  border:1px solid rgba(255,255,255,.11);
  border-radius:6px;
  background:#111;
}

.trenchport-site .recipe-control > span{
  color:#c7c0b7;
}

.trenchport-site .recipe-control input,
.trenchport-site .recipe-control select{
  border:1px solid rgba(255,255,255,.14);
  border-radius:4px;
  background:#080808;
  color:#f2ede5;
}

.trenchport-site .recipe-control input:focus,
.trenchport-site .recipe-control select:focus{
  border-color:rgba(215,122,45,.82);
  box-shadow:0 0 0 3px rgba(215,122,45,.12);
}

.trenchport-site .recipe-card{
  border:1px solid rgba(255,255,255,.10);
  border-top:3px solid rgba(215,122,45,.62);
  border-radius:8px;
  background:linear-gradient(180deg,#171717,#0c0c0c);
  box-shadow:0 12px 30px rgba(0,0,0,.32);
}

.trenchport-site .recipe-card-image{
  height:220px;
  border:1px solid rgba(255,255,255,.11);
  border-radius:5px;
  background:#050505;
}

.trenchport-site .recipe-card-image img{
  filter:saturate(.70) contrast(1.06) brightness(.88);
}

.trenchport-site .recipe-card:hover .recipe-card-image img{
  filter:saturate(.82) contrast(1.06) brightness(.98);
}

.trenchport-site .station-badge,
.trenchport-site .station-banner-count{
  border-color:rgba(215,122,45,.48);
  background:rgba(215,122,45,.12);
  color:#f1c397;
}

.trenchport-site .craft-time{
  border-color:rgba(255,255,255,.16);
  background:rgba(255,255,255,.05);
  color:#d1ccc4;
}

.trenchport-site .recipe-output,
.trenchport-site .recipe-effect{
  border-color:rgba(255,255,255,.11);
  border-radius:5px;
  background:#101010;
}

.trenchport-site .recipe-output span,
.trenchport-site .recipe-effect-heading span{
  color:#a9a39b;
}

.trenchport-site .recipe-output strong,
.trenchport-site .recipe-effect-heading strong,
.trenchport-site .recipe-ingredients li strong{
  color:#f3eee5;
}

.trenchport-site .recipe-effect p,
.trenchport-site .recipe-ingredients li{
  color:#b9b3aa;
}

.trenchport-site .recipe-ingredients h4{
  color:#d9d3ca;
}

.trenchport-site .recipe-ingredients li{
  border-radius:4px;
  background:#101010;
}

.trenchport-site .effect-xp{
  border-left:3px solid #d77a2d;
}

.trenchport-site .effect-maxhp{
  border-left:3px solid #b98b4e;
}

.trenchport-site .effect-healing{
  border-left:3px solid #708b6c;
}

.trenchport-site .effect-instant-heal{
  border-left:3px solid #9e4b46;
}

.trenchport-site .effect-none{
  border-left:3px solid #686868;
}

.trenchport-site .recipe-tag{
  border-color:rgba(255,255,255,.12);
  background:#101010;
  color:#99938b;
}

.trenchport-site .recipe-tag.is-positive{
  border-color:rgba(215,122,45,.30);
  color:#e3b184;
}

.trenchport-site .recipe-tag.is-warning{
  border-color:rgba(202,154,72,.32);
  color:#e1c58f;
}

.trenchport-site .station-banner{
  border:1px solid rgba(255,255,255,.12);
  border-top:3px solid var(--tp-rust);
  border-radius:7px;
  background:#050505;
  box-shadow:0 16px 36px rgba(0,0,0,.40);
}

.trenchport-site .station-banner img{
  filter:saturate(.58) contrast(1.10) brightness(.78);
}

.trenchport-site .station-banner-shade{
  background:
    linear-gradient(90deg,rgba(3,3,3,.97) 0%,rgba(3,3,3,.80) 43%,rgba(3,3,3,.28) 74%,rgba(3,3,3,.52) 100%),
    linear-gradient(0deg,rgba(3,3,3,.78),transparent 60%);
}

.trenchport-site .station-banner-content h2{
  text-shadow:0 3px 16px rgba(0,0,0,.9);
}

.trenchport-site .recipe-status{
  border-color:rgba(255,255,255,.11);
  border-radius:6px;
  background:#111;
}

@media (max-width:940px){
  .trenchport-masthead{
    grid-template-columns:auto minmax(0,1fr);
  }

  .trenchport-subnav{
    grid-column:1 / -1;
    justify-content:flex-start;
  }
}

@media (max-width:620px){
  .trenchport-masthead{
    grid-template-columns:1fr;
    text-align:center;
    padding:18px 16px;
  }

  .trenchport-masthead-mark{
    margin:0 auto;
  }

  .trenchport-subnav{
    justify-content:center;
  }

  .trenchport-subnav a{
    flex:1 1 42%;
  }

  .trenchport-site .page-title{
    padding:24px 15px 22px;
  }

  
  .trenchport-site .recipe-card-image{
    height:180px;
  }
}

/* Space between the Trenchport hero panel and System Highlights */
body.trenchport-site main > .trenchport-hero-panel + .content-card{
  margin-top:32px !important;
}

/* ============================================================
   TRENCHPORT MASTHEAD LAYOUT V2
   Keeps the identity copy above the navigation so long button rows
   do not squeeze the portal title into a narrow column.
   ============================================================ */
.trenchport-masthead{
  grid-template-columns:94px minmax(0,1fr);
  grid-template-areas:
    "mark copy"
    "nav nav";
  align-items:center;
  row-gap:16px;
}

.trenchport-masthead-mark{
  grid-area:mark;
}

.trenchport-masthead-copy{
  grid-area:copy;
  min-width:0;
}

.trenchport-subnav{
  grid-area:nav;
  justify-content:flex-start;
  width:100%;
}

@media (max-width:940px){
  .trenchport-masthead{
    grid-template-columns:94px minmax(0,1fr);
    grid-template-areas:
      "mark copy"
      "nav nav";
  }

  .trenchport-subnav{
    grid-column:auto;
  }
}

@media (max-width:620px){
  .trenchport-masthead{
    grid-template-columns:1fr;
    grid-template-areas:
      "mark"
      "copy"
      "nav";
    text-align:center;
  }

  .trenchport-masthead-copy{
    width:100%;
  }

  .trenchport-subnav{
    justify-content:center;
  }
}



/* Rentals page */
.rental-hero-panel{
  display:grid;
  grid-template-columns:minmax(0,1.5fr) minmax(230px,.5fr);
  gap:30px;
  align-items:center;
  padding:clamp(26px,4vw,46px);
  overflow:hidden;
  background:
    radial-gradient(circle at 88% 38%,rgba(215,122,45,.19),transparent 34%),
    linear-gradient(135deg,rgba(27,27,27,.99),rgba(8,8,8,.99));
}

.rental-status{
  display:inline-flex;
  margin-bottom:12px;
  padding:6px 9px;
  border:1px solid rgba(215,122,45,.52);
  background:rgba(215,122,45,.10);
  color:var(--tp-rust-bright);
  font-size:.72rem;
  font-weight:900;
  letter-spacing:.11em;
  text-transform:uppercase;
}

.rental-hero-copy h2,
.rental-info-card h2,
.rental-support-panel h2{
  margin:0 0 12px;
  color:#f7f3eb;
}

.rental-hero-copy p,
.rental-info-card p,
.rental-support-panel p{
  color:#bdb7ae;
}

.rental-action-row{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:22px;
}

.rental-primary-button{
  min-width:230px;
}

.rental-external-note{
  margin:13px 0 0;
  color:#8e887f !important;
  font-size:.82rem;
}

.rental-kiosk-panel{
  margin-top:20px;
  padding:clamp(18px,3vw,30px);
  overflow:hidden;
}

.rental-kiosk-heading{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:24px;
  margin-bottom:18px;
}

.rental-kiosk-heading h2{
  margin:5px 0 7px;
  color:#f7f3eb;
}

.rental-kiosk-heading p{
  margin:0;
  color:#aaa49a;
}

.rental-refresh-link{
  flex:0 0 auto;
  color:var(--tp-rust-bright);
  font-size:.78rem;
  font-weight:900;
  letter-spacing:.08em;
  text-decoration:none;
  text-transform:uppercase;
}

.rental-refresh-link:hover,
.rental-refresh-link:focus-visible{
  color:#fff;
  text-decoration:underline;
}

.casper-rentals-frame{
  min-height:560px;
  padding:8px;
  border:1px solid rgba(255,255,255,.12);
  background:#fff;
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.08),0 18px 38px rgba(0,0,0,.28);
}

.casper-rentals-frame iframe{
  display:block;
  width:100% !important;
  min-height:760px !important;
  background:#fff;
}

.rental-kiosk-fallback{
  margin:0;
  padding:28px;
  color:#242424;
  text-align:center;
}

.rental-kiosk-fallback a{
  color:#9c4917;
  font-weight:800;
}

.rental-mark{
  display:flex;
  min-height:230px;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  padding:30px;
  border:1px solid rgba(255,255,255,.13);
  background:
    repeating-linear-gradient(115deg,transparent 0 22px,rgba(255,255,255,.025) 22px 23px),
    linear-gradient(145deg,#171717,#090909);
  box-shadow:inset 0 0 50px rgba(0,0,0,.48),0 18px 36px rgba(0,0,0,.25);
  text-align:center;
}

.rental-mark span{
  display:grid;
  width:92px;
  height:92px;
  place-items:center;
  border:2px solid var(--tp-rust);
  border-radius:50%;
  color:#fff;
  font-family:'Orbitron',Arial,Helvetica,sans-serif;
  font-size:2rem;
  font-weight:900;
  letter-spacing:.07em;
  box-shadow:0 0 0 7px rgba(215,122,45,.08);
}

.rental-mark strong{
  margin-top:18px;
  color:#fff;
  font-family:'Orbitron',Arial,Helvetica,sans-serif;
  font-size:1.35rem;
  letter-spacing:.10em;
  text-transform:uppercase;
}

.rental-mark small{
  margin-top:7px;
  color:#9f998f;
  font-size:.75rem;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.rental-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px;
  margin-top:20px;
}

.rental-info-card{
  position:relative;
  min-height:210px;
  padding:28px 24px 24px;
}

.rental-step{
  display:inline-block;
  margin-bottom:18px;
  color:var(--tp-rust-bright);
  font-family:'Orbitron',Arial,Helvetica,sans-serif;
  font-size:1.35rem;
  font-weight:900;
  letter-spacing:.08em;
}

.rental-support-panel{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  margin-top:20px;
  padding:28px;
}

.rental-support-panel p{
  margin-bottom:0;
}

@media (max-width:880px){
  .rental-hero-panel{
    grid-template-columns:1fr;
  }

  .rental-mark{
    min-height:190px;
  }

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

@media (max-width:620px){
  .rental-kiosk-heading{
    align-items:flex-start;
    flex-direction:column;
  }

  .casper-rentals-frame{
    margin-right:-10px;
    margin-left:-10px;
    padding:2px;
  }

  .casper-rentals-frame iframe{
    min-height:680px !important;
  }

  .rental-action-row,
  .rental-support-panel{
    align-items:stretch;
    flex-direction:column;
  }

  .rental-action-row .site-button,
  .rental-support-panel .site-button{
    width:100%;
  }
}