/* LCARS Lower Decks PADD 24.2 by Jim Robertus, www.thelcars.com.
 * Adapted for optional Astro rendering; Jonathan D'Ambra's custom frame/card rules retained.
 * Framework selectors are scoped to .lcars-home; the portfolio root/reset are unchanged.
 * This file replaces the first-pass lcars.css. Do not load the upstream CSS separately.
 */
.lcars-home{

  color-scheme: dark;
  --lfw: 240px;
  --alpha-blue: #58e;
  --arctic-ice: #6cf;
  --arctic-snow: #9cf;
  --radioactive: #8ff;
  --beta-blue: #79d;
  --night-cloud: #344470;
  --night-rain: #455580;
  --sunset-red: #f30;
  --left-frame-top-color: var(--alpha-blue);
  --left-frame-color: var(--alpha-blue);
  --left-frame-padding: 16.5px;
  --corner-color-top: var(--alpha-blue);
  --corner-color-bottom: var(--alpha-blue);
  --panel-1-color: var(--night-rain);
  --panel-4-color: var(--beta-blue);
  --panel-5-color: var(--night-rain);
  --panel-7-color: var(--night-cloud);
  --panel-top-button-color: var(--beta-blue);
  --bar-height: 28px;
  --bar-1-6-width: 10%;
  --bar-2-7-width: 28%;
  --bar-3-8-width: 7%;
  --bar-5-10-width: 5%;
  --bar-1-color: var(--alpha-blue);
  --bar-2-color: var(--radioactive);
  --bar-3-color: var(--beta-blue);
  --bar-4-color: var(--alpha-blue);
  --bar-5-color: var(--arctic-ice);
  --bar-6-color: var(--alpha-blue);
  --bar-7-color: var(--radioactive);
  --bar-8-color: var(--beta-blue);
  --bar-9-color: var(--alpha-blue);
  --bar-10-color: var(--arctic-ice);

  --font-color: var(--beta-blue);
  --sub-fonts: 19.25px;
  --banner-color: var(--radioactive);
  --h1-color: var(--arctic-ice);
  --h2-color: var(--arctic-ice);
  --h3-color: var(--arctic-ice);
  --h4-color: var(--arctic-ice);
  --light-color: #bdf;
  --link-color: var(--beta-blue);
  --code-color: var(--alpha-blue);
  --nav-width: 240px;
  --nav-1-color: var(--alpha-blue);
  --nav-2-color: var(--beta-blue);
  --nav-3-color: var(--arctic-ice);
  --nav-4-color: var(--night-rain);
  --button-color: var(--alpha-blue);
  --button-color-sidebar: var(--alpha-blue);
  --radius-top: 0 0 0 100px;
  --radius-bottom: 100px 0 0 0;
  --radius-content-top: 0 0 0 44px;
  --radius-content-bottom: 44px 0 0 0;
  --panel-border: 8.8px solid #000;
  --bar-border: 8.8px solid #000;
  --bar-cut-width: 27%;
  --divider-height: 16.5px;
  --lcars-bar-color: var(--night-rain);
  --lcars-bar-start-color: var(--beta-blue);
  --lcars-bar-end-color: var(--beta-blue);
  --lcars-bar-text-color: var(--beta-blue);



  --image-border-color: var(--beta-blue);
  --primary-color: var(--night-rain);
  --secondary-color: var(--beta-blue);
  --accent-color: var(--arctic-snow);
  --spacers: 14.3px;
  --frame-height: 40px;
}
@media (max-width: 1500px){
.lcars-home{
    --lfw: 200px;
    --nav-width: 210px;
    --bar-height: 20px;
    --divider-height: 11px;
  }
}
@media (max-width: 1300px){
.lcars-home{

    --sub-fonts: 19.8px;
    --lfw: 180px;
    --radius-top: 0 0 0 80px;
    --radius-bottom: 80px 0 0 0;
    --radius-content-top: 0 0 0 30px;
    --radius-content-bottom: 30px 0 0 0;
    --nav-width: 180px;
  }
}
@media (max-width: 950px){
.lcars-home{
    --lfw: 150px;
  }
}
@media (max-width: 750px){
.lcars-home{
    --lfw: 120px;
    --radius-top: 0 0 0 60px;
    --radius-bottom: 60px 0 0 0;
    --radius-content-top: 0 0 0 24px;
    --radius-content-bottom: 24px 0 0 0;
    --bar-height: 16px;
    --spacers: 11px;
    --frame-height: 25px;
  }
}
@media (max-width: 525px){
.lcars-home{
    --lfw: 62px;
    --left-frame-padding: 11px;
    --radius-top: 0 0 0 30px;
    --radius-bottom: 30px 0 0 0;
    --bar-height: 10px;
    --panel-border: 5.5px solid black;
    --bar-border: 5.5px solid black;
    --divider-height: 7.59px;
  }
}
@media (max-width: 450px){
.lcars-home{
    --nav-width: 48%;
  }
}
.lcars-home *,
.lcars-home *:after,
.lcars-home *:before{
  box-sizing: border-box;
}
.lcars-home *{
  margin: 0;
  padding: 0;
  font: inherit;
}
.lcars-home img{
  display: block;
  max-width: 100%;
  height: auto;
}
.lcars-home input,
.lcars-home textarea,
.lcars-home button,
.lcars-home select{
  font: inherit;
}
@font-face{
  font-family: 'LCARS Antonio';
  font-weight: 400;
  src: url("../fonts/lcars/Antonio-Regular.woff2") format('woff2');
}
@font-face{
  font-family: 'LCARS Antonio';
  font-weight: 700;
  src: url("../fonts/lcars/Antonio-Bold.woff2") format('woff2')
}
.lcars-home{
  scroll-behavior: smooth;
}
.lcars-home{
  display: flex;
  padding-top: 10px;
  padding-left: 5px;
  background-color: black;
  font-family: 'LCARS Antonio', 'Arial Narrow', 'Avenir Next Condensed', sans-serif;
  font-weight: 400;
  line-height: 1.5;
  color: var(--font-color);
}
.lcars-home a{
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: 4.4px;
  color: var(--link-color);
}
.lcars-home a:hover{
  filter: brightness(115%);
  animation: none;
}
.lcars-home a:active{
  filter: brightness(80%);
  outline: none;
}
.lcars-home button{
  border: none;
  outline: none;
  word-break: break-all;
  color: black;
  transition: width 1s;
}
.lcars-home button:hover{
  cursor: pointer;
  animation: none;
  filter: brightness(115%);
  color: black;
}
.lcars-home button:active{
  filter: brightness(85%);
}
@keyframes lcars-colorchange{
  0% {color: var(--night-cloud)}
  25% {color: var(--night-cloud);}
  50% {color: var(--arctic-snow);}
  75% {color: var(--arctic-snow);}
  80% {color: var(--arctic-snow);}
  90% {color: var(--night-cloud);}
  100% {color: var(--night-cloud);}
}
.lcars-home .wrap-all{
  width: 100%;
}
.lcars-home .wrap{
  display: flex;
  width: 100%;
  padding-left: 5px;
  padding-right: 15px;
  overflow: hidden;
}
.lcars-home .scroll-top{
  display: none;
}
.lcars-home .left-frame-top,
.lcars-home .left-frame{
  width: var(--lfw);
  text-align: right;
  font-size: clamp(19.25px, 2vw, 22px);
  line-height: 1.2;
  font-weight: bold;
  color: black;
  transition: width 1s;
}
.lcars-home .left-frame-top{
  background-color: var(--left-frame-top-color);
  border-radius: var(--radius-top);
}
.lcars-home .left-frame-top a,
.lcars-home .left-frame a{
  text-decoration: none;
  color: black;
}
.lcars-home .left-frame{
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding-top: 14vh;
  background-color: var(--left-frame-color);
  border-radius: var(--radius-bottom);
}
.lcars-home .left-frame:has(.sidebar-nav){
  padding-top: 10vh;
}
.lcars-home .panel-2{
  padding-top: 16.5px;
  padding-right: 16.5px;
}
.lcars-home .right-frame-top{
  flex: 1;
  position: relative;
}
.lcars-home .right-frame-top::before{
  content: '';
  display: block;
  width: 60px;
  height: 60px;
  background: linear-gradient(to top right, var(--corner-color-top) 50%, #000 50%);
  position: absolute;
  left: 0;
  bottom: var(--bar-height);
  z-index: -1;
}
.lcars-home .right-frame-top::after{
  content: '';
  display: block;
  width: 60px;
  height: 60px;
  background-color: black;
  border-radius: var(--radius-content-top);
  position: absolute;
  left: 0;
  bottom: var(--bar-height);
  z-index: -1;
}
@media (max-width: 500px){
.lcars-home .right-frame-top::before{
    bottom: 10px;
  }
.lcars-home .right-frame-top::after{
    bottom: 10px;
  }
}
.lcars-home .banner{
  padding-bottom: 22px;
  padding-left: 5px;
  text-align: right;
  text-transform: uppercase;
  line-height: 1.1;
  font-size: clamp(33px, 27.5px + 3.5vw, 88px);
  color: var(--banner-color);
}
.lcars-home .banner a{
  color: var(--banner-color);
  text-decoration: none;
}
.lcars-home .data-cascade-button-group{
  display: flex;
  justify-content: flex-end;
  align-items: flex-start;
  flex-wrap: wrap;
  padding-bottom: 16.5px;
}
.lcars-home .data-cascade-button-group:has(.header-content){
  justify-content: flex-start;
}
@media (max-width: 1440px){
.lcars-home .data-cascade-button-group:has(.header-content){
    row-gap: 22px;
  }
.lcars-home .data-cascade-button-group:has(.header-content) > nav{
    width: 100%;
  }
}
.lcars-home .header-content{
  flex: 1;
  min-height: 184px;
  padding-right: 44px;
  padding-left: clamp(20px, 3vw, 50px);
}
.lcars-home .header-content > *:first-child{
  margin-top: 0;
}
.lcars-home .header-content > *:last-child{
  margin-bottom: 0;
}
.lcars-home .data-wrapper{
  flex: 1;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  align-items: flex-end;
  max-width: 100%;
  height: 164px;
  overflow: hidden;
  padding-top: 10px;
  padding-right: 44px;
  padding-left: clamp(20px, 3vw, 50px);
  column-gap: 22px;
  font-size: 27.5px;
}
.lcars-home .data-column{
  display: grid;
  grid-template-columns: 1fr;
  line-height: 1;
  --dc-row-height: 40px;
}
.lcars-home .data-bullet{
  width: 38px;
  height: 22px;
  border-radius: 50%;
  background-color: var(--font-color);
}
.lcars-home .dc-row-1,
.lcars-home .dc-row-2,
.lcars-home .dc-row-3,
.lcars-home .dc-row-4{
  display: flex;
  align-items: center;
  min-height: var(--dc-row-height);
}
.lcars-home .dc-row-1:has(.data-bullet){
  padding-inline: 22px;
}
.lcars-home .dc-row-2:has(.data-bullet){
  padding-inline: 22px;
}
.lcars-home .dc-row-3:has(.data-bullet){
  padding-inline: 22px;
}
.lcars-home .dc-row-4:has(.data-bullet){
  padding-inline: 22px;
}
.lcars-home .darkspace{
  min-width: 66px;
  text-align: center;
  justify-content: center;
}
.lcars-home .darkfont{
  color: black;
}
@media (max-width: 1300px){
.lcars-home .data-wrapper{
    height: 130px;
    font-size: 22px;
  }
.lcars-home .data-column{
    --dc-row-height: 30px;
  }
.lcars-home .data-bullet{
    transform: scale(.8);
  }
}
@media (max-width: 1100px){
.lcars-home .hide-data{
    display: none;
  }
.lcars-home .data-wrapper{
    column-gap: 12.65px;
    padding-right: 22px;
  }
}
@media (max-width: 740px){
.lcars-home .data-wrapper{
    display: none;
  }
}
.lcars-home .lcars-button{
  display: flex;
  justify-content: flex-end;
  align-items: flex-end;
  margin-block: 22px;
  width: 224px;
  height: 80px;
  padding-inline: 38.5px;
  padding-bottom: 14.85px;
  background-color: var(--button-color);
  border-radius: 100vmax;
  border-width: 0;
  text-align: right;
  line-height: 1.175;
  text-decoration: none;
  font-weight: bold;
  text-transform: uppercase;
  color: black;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.lcars-home .panel-1 a{
  display: flex;
  width: var(--lfw);
  justify-content: flex-end;
  align-items: flex-end;
  background-color: var(--panel-1-color);
  height: clamp(90px, 11vw, 160px);
  padding: var(--left-frame-padding);
  border-radius: 0;
  border-bottom: var(--panel-border);
  text-decoration: none;
  color: black;
  transition: width 1s;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.lcars-home .panel-1-button{
  display: flex;
  width: var(--lfw);
  justify-content: flex-end;
  align-items: flex-end;
  background-color: var(--panel-1-color);
  min-height: clamp(90px, 11vw, 160px);
  overflow: hidden;
  padding: var(--left-frame-padding);
  border-radius: 0;
  border-bottom: var(--panel-border);
  text-decoration: none;
  color: black;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.lcars-home nav{
  display: flex;
  flex-wrap: wrap;
  align-self: center;
  width: calc(var(--nav-width) + var(--nav-width) + 22px);
  justify-content: flex-end;
  column-gap: 11px;
  row-gap: 14.3px;
}
@media (max-width: 1500px){
.lcars-home nav{
    column-gap: 8.25px;
    row-gap: 11px;
  }
}
@media (max-width: 1440px){
.lcars-home .data-cascade-button-group:has(.header-content){
    row-gap: 22px;
  }
.lcars-home .data-cascade-button-group:has(.header-content) > nav{
    width: 100%;
  }
}
.lcars-home nav a,
.lcars-home nav button,
.lcars-home .buttons button{
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: flex-end;
  width: var(--nav-width);
  height: calc(var(--nav-width) / 2.8);
  padding-inline: 33px;
  padding-bottom: 15.4px;
  border-radius: 100vmax;
  background-color: var(--button-color);
  text-align: right;
  line-height: 1.175;
  text-decoration: none;
  text-transform: uppercase;
  font-weight: bold;
  color: black;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.lcars-home nav a:nth-child(1),
.lcars-home nav button:nth-child(1){
  background-color: var(--nav-1-color);
}
.lcars-home nav a:nth-child(2),
.lcars-home nav button:nth-child(2){
  background-color: var(--nav-2-color);
}
.lcars-home nav a:nth-child(3),
.lcars-home nav button:nth-child(3){
  background-color: var(--nav-3-color);
}
.lcars-home nav a:nth-child(4),
.lcars-home nav button:nth-child(4){
  background-color: var(--nav-4-color);
}
@media (max-width: 1300px){
.lcars-home nav{
    padding-left: 11px;
    gap: 11px;
  }
.lcars-home nav button{
    padding-bottom: 11px;
    font-size: 19.25px;
    padding-inline: 27.5px;
  }
}
@media (max-width: 780px){
.lcars-home nav{
    flex: 1;
  }
.lcars-home .data-cascade-button-group:has(.header-content) > *:nth-child(2){
    flex: none;
  }
}
@media (max-width: 450px){
.lcars-home nav a,
.lcars-home nav button{
    height: 63px;
  }
}
.lcars-home .buttons{
  display: flex;
  flex-wrap: wrap;
  gap: 11px;
  margin-block: 44px;
}
.lcars-home .justify-space-between{
  justify-content: space-between;
}
.lcars-home .justify-center{
  justify-content: center;
}
.lcars-home .justify-flex-end{
  justify-content: flex-end;
}
.lcars-home .justify-space-around{
  justify-content: space-around;
}
.lcars-home .justify-space-evenly{
  justify-content: space-evenly;
}
.lcars-home .buttons a,
.lcars-home .buttons button{
  display: flex;
  justify-content: flex-end;
  align-items: flex-end;
  width: 224px;
  height: 80px;
  padding-inline: 38.5px;
  padding-bottom: 14.85px;
  background-color: var(--button-color);
  border-radius: 100vmax;
  border-width: 0;
  text-align: right;
  line-height: 1.175;
  text-decoration: none;
  font-weight: bold;
  text-transform: uppercase;
  color: black;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.lcars-home .sidebar-nav button,
.lcars-home .sidebar-nav a,
.lcars-home .sidebar-button{
  display: flex;
  justify-content: flex-end;
  align-items: flex-end;
  min-height: 82.5px;
  width: var(--lfw);
  background-color: var(--button-color-sidebar);
  border-radius: 0;
  border-bottom: var(--panel-border);
  padding: var(--left-frame-padding);
  text-decoration: none;
  text-align: right;
  word-break: break-all;
  text-transform: uppercase;
  color: black;
}
@media (max-width: 1300px){
.lcars-home .lcars-button,
.lcars-home .buttons a,
.lcars-home .buttons button{
    width: 200px;
    height: 74px;
  }
}
.lcars-home .panel-button{
  display: flex;
  justify-content: flex-end;
  width: var(--lfw);
  border-radius: 0;
  padding: var(--left-frame-padding);
  border-bottom: var(--panel-border);
}
.lcars-home .pan-0{
  height: 18vh;
  max-height: 240px;
  background-color: var(--button-color-sidebar);
}
.lcars-home .pan-4{
  height: 14vh;
  background-color: var(--panel-4-color) !important;
}
.lcars-home .pan-5{
  height: 30vh;
  background-color: var(--panel-5-color) !important;
}
.lcars-home .pan-7{
  height: 30vh;
  background-color: var(--panel-7-color) !important;
}
.lcars-home .text-bottom{
  align-items: flex-end;
}
.lcars-home #topBtn{
  display: none;
  position: fixed;
  bottom: 0;
  z-index: 99;
  border-radius: 0;
  border-top: var(--panel-border);
  border-right: none;
  border-bottom: var(--panel-border);
  border-left: none;
  outline: none;
  width: var(--lfw);
  padding: var(--left-frame-padding);
  padding-bottom: 10vh;
  background-color: var(--panel-top-button-color);
  text-align: right;
  line-height: 1;
  font-weight: bold;
  text-transform: uppercase;
  color: black;
  cursor: pointer;
}
.lcars-home #topBtn:hover{
  filter: brightness(115%);
}
.lcars-home #topBtn:active{
  filter: brightness(80%);
}
@media (max-width: 525px){
.lcars-home .sidebar-button,
.lcars-home .sidebar-nav a,
.lcars-home .sidebar-nav button,
.lcars-home .panel-button{
    font-size: 16.5px;
  }
.lcars-home #topBtn{
    padding-bottom: 6vh;
  }
}
.lcars-home .bar-panel{
  display: flex;
  height: var(--bar-height);
}
.lcars-home .first-bar-panel{
  margin-top: 2.5vh;
  position: relative;
}
.lcars-home .bar-1,
.lcars-home .bar-2,
.lcars-home .bar-3,
.lcars-home .bar-4,
.lcars-home .bar-5,
.lcars-home .bar-6,
.lcars-home .bar-7,
.lcars-home .bar-8,
.lcars-home .bar-9,
.lcars-home .bar-10{
  height: var(--bar-height);
}
.lcars-home .bar-1,
.lcars-home .bar-2,
.lcars-home .bar-3,
.lcars-home .bar-4,
.lcars-home .bar-6,
.lcars-home .bar-7,
.lcars-home .bar-8,
.lcars-home .bar-9{
  border-right: var(--bar-border);
}
.lcars-home .divider{
  display: flex;
  height: var(--divider-height);
  z-index: 1999;
}
.lcars-home .block-left{
  width: var(--lfw);
  height: var(--divider-height);
}
.lcars-home .block-right{
  flex: 1;
  height: var(--divider-height);
  position: relative;
}
.lcars-home .block-row{
  display: flex;
  width: 100%;
  height: var(--divider-height);
  padding-right: 8.8px;
  padding-left: 1px;
}
.lcars-home .bar-11{
  height: var(--divider-height);
  width: var(--bar-1-6-width);
}
.lcars-home .bar-12{
  height: var(--divider-height);
  width: var(--bar-2-7-width);

}
.lcars-home .bar-13{
  height: var(--divider-height);
  width: var(--bar-3-8-width);
}
.lcars-home .bar-14{
  flex: 1;
  height: var(--divider-height);
  z-index: 1999;
}
.lcars-home .bar-1{
  width: var(--bar-1-6-width);
  background-color: var(--bar-1-color);
}
.lcars-home .bar-2{
  width: var(--bar-2-7-width);
  background-color: var(--bar-2-color);
}
.lcars-home .bar-3{
  width: var(--bar-3-8-width);
  background-color: var(--bar-3-color);
}
.lcars-home .bar-4{
  flex: 1;
  position: relative;
  background-color: var(--bar-4-color);
}
.lcars-home .bar-5{
  width: var(--bar-5-10-width);
  background-color: var(--bar-5-color);
}
.lcars-home .bar-6{
  width: var(--bar-1-6-width);
  background-color: var(--bar-6-color);
}
.lcars-home .bar-7{
  width: var(--bar-2-7-width);
  background-color: var(--bar-7-color);
}
.lcars-home .bar-8{
  width: var(--bar-3-8-width);
  background-color: var(--bar-8-color);
}
.lcars-home .bar-9{
  flex: 1;
  position: relative;
  background-color: var(--bar-9-color);
}
.lcars-home .bar-4::after{
  content: "";
  display: block;
  width: var(--bar-cut-width);
  height: 48%;
  background-color: black;
  border-radius: 0 8px 0 0;
  position: absolute;
  left: 0;
  bottom: 0;
}
.lcars-home .bar-9::after{
  content: "";
  display: block;
  width: var(--bar-cut-width);
  height: 48%;
  background-color: black;
  border-radius: 0 0 8px 0;
  position: absolute;
  left: 0;
  top: 0;
}
.lcars-home .bar-10{
  width: var(--bar-5-10-width);
  background-color: var(--bar-10-color);
}
.lcars-home #gap{
  margin-top: var(--divider-height);
}
.lcars-home .panel-3,
.lcars-home .panel-4,
.lcars-home .panel-5{
  border-bottom: var(--panel-border);
}
.lcars-home .panel-2,
.lcars-home .panel-3,
.lcars-home .panel-4,
.lcars-home .panel-5,
.lcars-home .panel-6,
.lcars-home .panel-7{
  padding: var(--left-frame-padding);
}
.lcars-home .panel-4{
  display: flex;
  align-items: flex-end;
  justify-content: flex-end;
  min-height: 14vh;
  background-color: var(--panel-4-color);
}
.lcars-home .panel-5{
  height: 30vh;
  background-color: var(--panel-5-color);
}
.lcars-home .panel-6{
  min-height: 15vh;
}
.lcars-home .panel-7{
  height: 30vh;
  border-top: var(--panel-border);
  background-color: var(--panel-7-color);
}
.lcars-home .right-frame{
  flex: 1;
  position: relative;
}
.lcars-home .right-frame::before{
  content: '';
  display: block;
  width: 60px;
  height: 60px;
  background: linear-gradient(to bottom right, var(--corner-color-bottom) 50%, #000 50%);
  position: absolute;
  left: 0;
  top: var(--bar-height);
  z-index: -1;
}
.lcars-home .right-frame::after{
  content: '';
  display: block;
  width: 60px;
  height: 60px;
  background-color: black;
  border-radius: var(--radius-content-bottom);
  position: absolute;
  left: 0;
  top: var(--bar-height);
  z-index: -1;
}
.lcars-home main{
  padding-top: 33px;
  padding-bottom: 11px;
  padding-left: clamp(20px, 3vw, 50px);
}
.lcars-home main > *:first-child,
.lcars-home article > *:first-child{
  margin-top: 0;
}
.lcars-home main:has(.floor-heading) > *:nth-child(2){
  margin-top: 0;
}
.lcars-home .flexbox{
  display: flex;
  gap: 26.4px;
  flex-wrap: wrap;
}
.lcars-home .col{
  flex: 1 1 360px;
}
.lcars-home .col > *:first-child{
  margin-top: 0;
}
.lcars-home h1,
.lcars-home h2,
.lcars-home h3,
.lcars-home h4{
  margin-block: 38.5px;
  font-weight: normal;
  line-height: 1.2;
  text-transform: uppercase;
  text-box: trim-both cap alphabetic;
}
.lcars-home h1{
  font-size: clamp(33px, 27.5px + 3.5vw, 88px);
  text-align: right;
  color: var(--h1-color);
}
.lcars-home h2{
  font-size: clamp(30.8px, 24.2px + 2.25vw, 50.6px);
  color: var(--h2-color);
}
.lcars-home h3{
  font-size: clamp(25.3px, 23.1px + 1.25vw, 41.25px);
  color: var(--h3-color);
}
.lcars-home h4{
  font-size: clamp(22.55px, 22px + 1.125vw, 34.65px);
  color: var(--h4-color);
}
.lcars-home .floor-heading{
  display: flex;
  justify-content: flex-end;
  width: 100%;
  position: fixed;
  left: 50%;
  transform: translate(-50%, 0);
  bottom: 10px;
  z-index:4;
}
.lcars-home .floor-heading > *{
  margin-block: 0;
  width: fit-content;
  padding: 11px;
  background-color: black;
}
.lcars-home p{
  margin-block: 38.5px;
  text-box: trim-both cap alphabetic;
}
.lcars-home .caption{
  margin-top: -22px;
  text-align: center;
  font-size: var(--sub-fonts);
}
.lcars-home .indent{
  padding-left: 33px;
}
.lcars-home .postmeta{
  margin-block: 27.5px;
  text-align: right;
  font-size: clamp(26.4px, 19.36px + 1.28vw, 35.2px);
  line-height: 1.2;
  text-transform: uppercase;
}
.lcars-home article h1{
  margin-bottom: 0;
}
.lcars-home hr{
  margin-block: 33px;
  height: 6px;
  border: none;
  background-color: var(--font-color);
  border-radius: 3px;
}
.lcars-home blockquote{
  margin-block: 38.5px;
  margin-left: 33px;
  padding-block: 5.5px;
  padding-left: 33px;
  position: relative;
  text-box: trim-both cap alphabetic;
}
.lcars-home blockquote::before{
  content: '';
  display: block;
  width: 10px;
  height: 100%;
  background-color: var(--font-color);
  border-radius: 5px;
  position: absolute;
  left: 0;
  top: 0;
}
.lcars-home blockquote > *:first-child{
  margin-top: 0;
}
.lcars-home blockquote > *{
  margin-bottom: 0;
}
.lcars-home .flush{
  margin-top: -22px;
}
.lcars-home .nomar{
  margin-block: 0 !important;
}
.lcars-home .go-center{
  text-align: center !important;
}
.lcars-home .go-right{
  text-align: right !important;
}
.lcars-home .go-left{
  text-align: left !important;
}
.lcars-home .go-big{
  font-size: clamp(26.4px, 22px + 1vw, 28.05px);
}
.lcars-home .uppercase{
  text-transform: uppercase;
}
.lcars-home .strike{
  text-decoration: line-through;
  text-decoration-thickness: 3.3px;
}
.lcars-home .now{
  white-space: nowrap;
}
.lcars-home .big-sky{
  margin-top: 110px;
}
.lcars-home .smoke-glass{
  opacity: .35;
}
.lcars-home strong{
  font-weight: bold;
}
.lcars-home code{
  font-family: monospace;
  font-size: 19.8px;
  color: var(--code-color);
}
.lcars-home .code{
  width: 100%;
  min-height: 110px;
  padding-block: 11px;
  padding-inline: 22px;
  background-color: #232323;
  border-color: #4c4c4c;
  tab-size: 4;
  font-family: monospace;
  font-size: 18.7px;
  color: #dcdcdc;
}
@keyframes lcars-blink{
  0% {opacity: 0}
  49%{opacity: 0}
  50% {opacity: 1}
}
.lcars-home .blink-slow{
  animation: lcars-blink 3500ms infinite;
  animation-delay: 1s;
}
.lcars-home .lcars-blink{
  animation: lcars-blink 2s infinite;
  animation-delay: 1s;
}
.lcars-home .blink-fast{
  animation: lcars-blink 1s infinite;
  animation-delay: 1s;
}
@keyframes lcars-pulse{
  0% {filter: brightness(1.0)}
  50% {filter: brightness(.25)}
}
.lcars-home .lcars-pulse{
  animation: lcars-pulse 2300ms infinite;
}
.lcars-home .pulse-rate-high{
  animation: lcars-pulse 1s infinite;
}
.lcars-home .accordion-wrapper{
  display: block;
  margin: 38.5px auto;
  width: 100%;
}
.lcars-home .limit-width{
  max-width: 1240px;
}
.lcars-home .accordion{
  display: flex;
  align-items: center;
  min-height: 66px;
  width: 100%;
  padding-right: 60.5px;
  padding-left: 22px;
  border-radius: 100vmax;
  background-color: var(--alpha-blue);
  border-left: solid 66px var(--night-rain);
  text-align: left;
  font-size: 27.5px;
  color: black;
  cursor: pointer;
  transition: 0.4s ease;
  position: relative;
}
.lcars-home .active,
.lcars-home .accordion:hover{
  background-color: var(--beta-blue);
  border-left-color: var(--radioactive);
  filter: none;
}
.lcars-home .accordion:before{
  content: '';
  display: block;
  width: 11px;
  height: 88px;
  background-color: black;
  position: absolute;
  top: 0;
  left: 0;
}
.lcars-home .accordion:after{
  display: block;
  content: '\276F';
  position: absolute;
  right: 33px;
  top: 21%;
  transform: rotate(90deg);
  transition: 0.4s;
  font-weight: bold;
  color: black;
}
.lcars-home .active:after{
  content: "\276F";
  transform:rotate(-90deg);
  transition: 0.4s ease;
}
.lcars-home .accordionContent{
    padding-block: 11px;
    padding-inline: 77px;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.25s ease-out;
}
.lcars-home .accordionContent ul{
  margin-left: 0;
}
@media (max-width: 525px){
.lcars-home .accordion{
    min-height: 55px;
    font-size: 22px;
    border-left-width: 55px;
  }
}
.lcars-home .pics-right{
  float: right;
  margin-inline: 22px;
  margin-bottom: 44px;
  max-width: 500px;
}
.lcars-home .pics-left{
  float: left;
  margin-inline: 22px;
  margin-bottom: 44px;
  max-width: 500px;
}
@media (max-width: 1060px){
.lcars-home .pics-right,
.lcars-home .pics-left{
    float: none;
    margin-inline: auto;
  }
.lcars-home .pics-right img,
.lcars-home .pics-left img{
    margin-inline: auto;
  }
}
.lcars-home .pics{
  margin-block: 44px;
  margin-inline: auto;
}
.lcars-home .border{
  border: 2px solid var(--font-color);
}
.lcars-home .lcars-list{
  margin-block: 25.3px;
  margin-left: 44px;
  list-style: none;
}
.lcars-home .lcars-list li{
  position: relative;
  padding-block: 9.9px;
  padding-left: 49.5px;
  text-box: trim-both cap alphabetic;
}
.lcars-home .lcars-list li::before{
  content: '';
  display: block;
  width: 34px;
  height: 18px;
  border-radius: 50%;
  background-color: var(--font-color);
  position: absolute;
  top: 9.9px;
  left: 0;
}
@media (max-width: 650px){
.lcars-home .lcars-list{
    margin-left: 11px;
  }
.lcars-home .lcars-list li::before{
    transform: scale(90%);
  }
}
.lcars-home .lcars-bar{
  margin-block: 38.5px;
  height: clamp(15px, 2vh, 25px);
  background: transparent;
  border-right: clamp(15px, 2vh, 25px) solid var(--lcars-bar-end-color);
  border-left: clamp(15px, 2vh, 25px) solid var(--lcars-bar-start-color);
  border-radius: 100vmax;
  position: relative;
}
.lcars-home .lcars-bar::after{
  content: '';
  display: block;
  height: clamp(15px, 2vh, 25px);
  width: 100%;
  background-color: var(--lcars-bar-color);
  border-right: .8vh solid black;
  border-left: .8vh solid black;
  position: absolute;
  top: 0;
  left: 0;
}
.lcars-home .lcars-text-bar{
  display: flex;
  position: relative;
  height: clamp(16px, 4vh, 41px);
  margin-block: 60.5px;
  overflow: visible;
  border-radius: 100vmax;
  background-color: var(--lcars-bar-color);
  border-right: clamp(16px, 4vh, 43px) solid var(--lcars-bar-end-color);
  border-left: clamp(16px, 4vh, 43px) solid var(--lcars-bar-start-color);
}
.lcars-home .the-end{
  justify-content: flex-end;
}
.lcars-home .lcars-text-bar h2,
.lcars-home .lcars-text-bar h3,
.lcars-home .lcars-text-bar h4,
.lcars-home .lcars-text-bar span{
  margin-block: 0;
  background-color: black;
  height: clamp(20px, 5.5vh, 60px);
  overflow: visible;
  border-top: 1px solid black;
  padding-inline: 1vh;
  font-size: clamp(17px, 4.5vh, 46px);
  line-height: 1;
  text-transform: uppercase;
  color: var(--lcars-bar-text-color);
  z-index: 1;
  text-box: trim-both cap alphabetic;
}
.lcars-home .lcars-text-bar::before{
  content: '';
  background-color: black;
  display: block;
  width: 1vh;
  height: 6vh;
  position: absolute;
  top: 0;
  left: 0;
  overflow: hidden;
}
.lcars-home .lcars-text-bar::after{
  content: '';
  background-color: black;
  display: block;
  width: 1vh;
  height: 6vh;
  position: absolute;
  top: 0;
  right: 0;
  overflow: hidden;
}
.lcars-home .image-frame{
  margin: 60.5px auto;
  width: fit-content;
  background: linear-gradient(var(--primary-color) 56%, var(--secondary-color) 44%);
  border-radius: 50px 25px 0 50px;
  position: relative;
}
.lcars-home .image-frame::before{
  content: '';
  display: block;
  width: 40px;
  height: 40px;
  background-color: black;
  position: absolute;
  right: 0;
  top: 0;
}
.lcars-home .image-frame::after{
  content: '';
  display: block;
  border-top: var(--spacers) solid black;
  border-bottom: var(--spacers) solid black;
  width: 45px;
  height: 80px;
  background-color: var(--secondary-color);
  position: absolute;
  left: 0;
  top: 56%;
}
.lcars-home .imgf-title{
  display: flex;
  justify-content: flex-end;
  height: 40px;
  border-right: 40px solid var(--secondary-color);
  border-radius: 25px 100vh 100vh 0;
  position: relative;
  z-index: 1;
  text-align: right;
}
.lcars-home .h4-wrapper{
  width: fit-content;
  height: var(--frame-height);
  background-color: black;
  border-right: var(--spacers) solid black;
}
.lcars-home .imgf-title h4{
  margin-block: 0;
  width: fit-content;
  background-color: black;
  padding-left: var(--spacers);
  font-size: 45.1px;
  color: var(--title-color);
  line-height: 40px;
  text-transform: uppercase;
}
.lcars-home .imgf-image-body{
  margin-left: 45px;
  background-color: black;
  width: fit-content;
  padding: 22px;
  border-radius: 28px 0 0 28px;
}
.lcars-home .image-holder{
  width: fit-content;
  padding: 22px;
  border: 2px solid var(--image-border-color);
  border-radius: 20px;
}
.lcars-home .imgf-base{
  display: grid;
  grid-template-columns: 20% 13% 35px 15% 1fr;
  margin-left: 80px;
  border-left: var(--spacers) solid black;
}
.lcars-home .imgf-block-1{
  height: var(--frame-height);
  background-color: var(--accent-color);
  border-right: var(--spacers) solid black;
}
.lcars-home .imgf-block-2{
  height: var(--frame-height);
  background-color: var(--secondary-color);
  border-right: var(--spacers) solid black;
}
.lcars-home .imgf-block-3{
  height: var(--frame-height);
  background-color: black;
  border-right: 10px solid var(--secondary-color);
  border-left: 10px solid var(--accent-color);
}
.lcars-home .imgf-block-4{
  height: var(--frame-height);
  background-color: var(--secondary-color);
  border-left: var(--spacers) solid black;
}
.lcars-home .imgf-block-5{
  height: var(--frame-height);
  background-color: black;
}
@media (max-width: 750px){
.lcars-home .image-frame{
    border-radius: 40px 25px 0 40px;
  }
.lcars-home .image-frame::after{
    width: 25px;
    height: 60px;
    top: 50%;
  }
.lcars-home .imgf-title{
    height: 25px;
    border-right: 24px solid var(--secondary-color);
  }
.lcars-home .h4-wrapper{
    width: fit-content;
    height: var(--frame-height);
    background-color: black;
  }
.lcars-home .imgf-title h4{
    font-size: 31.9px;
  }
.lcars-home .imgf-image-body{
    margin-left: 25px;
    padding: 16.5px;
    border-radius: 20px 0 0 20px;
  }
.lcars-home .image-holder{
    padding: 16.5px;
    border-radius: 10px;
  }
}
.lcars-home .font-alpha-blue{
  color: var(--alpha-blue) !important;
}
.lcars-home .button-alpha-blue,
.lcars-home .background-alpha-blue,
.lcars-home .bullet-alpha-blue::before{
  background-color: var(--alpha-blue) !important;
}
.lcars-home .font-arctic-ice{
  color: var(--arctic-ice) !important;
}
.lcars-home .button-arctic-ice,
.lcars-home .background-arctic-ice,
.lcars-home .bullet-arctic-ice::before{
  background-color: var(--arctic-ice) !important;
}
.lcars-home .font-arctic-snow{
  color: var(--arctic-snow) !important;
}
.lcars-home .button-arctic-snow,
.lcars-home .background-snow,
.lcars-home .bullet-arctic-snow::before{
  background-color: var(--arctic-snow) !important;
}
.lcars-home .font-radioactive{
  color: var(--radioactive) !important;
}
.lcars-home .button-radioactive,
.lcars-home .background-radioactive,
.lcars-home .bullet-radioactive::before{
  background-color: var(--radioactive) !important;
}
.lcars-home .font-beta-blue{
  color: var(--beta-blue) !important;
}
.lcars-home .button-beta-blue,
.lcars-home .background-beta-blue,
.lcars-home .bullet-beta-blue::before{
  background-color: var(--beta-blue) !important;
}
.lcars-home .font-night-cloud{
  color: var(--night-cloud) !important;
}
.lcars-home .button-night-cloud,
.lcars-home .background-night-cloud,
.lcars-home .bullet-night-cloud::before{
  background-color: var(--night-cloud) !important;
}
.lcars-home .font-night-rain{
  color: var(--night-rain) !important;
}
.lcars-home .button-night-rain,
.lcars-home .background-night-rain,
.lcars-home .bullet-night-rain::before{
  background-color: var(--night-rain) !important;
}
.lcars-home .font-sunset-red{
  color: var(--sunset-red) !important;
}
.lcars-home .button-sunset-red,
.lcars-home .background-sunset-red,
.lcars-home .bullet-sunset-red::before{
  background-color: var(--sunset-red) !important;
}
.lcars-home footer{
  margin-top: 2.5vw;
  padding-bottom: 66px;
  padding-left: clamp(20px, 3vw, 50px);
  font-size: 19.25px;
}
.lcars-home .headtrim{
  height: 10px;
  width: 100%;
  background-color: black;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 999;
}
.lcars-home .baseboard{
  height: 10px;
  width: 100%;
  background-color: black;
  position: fixed;
  bottom: 0;
  left: 0;
  z-index: 999;
}
@media (max-width: 650px){
.lcars-home .first-bar-panel{
    margin-top: 16.5px;
  }
.lcars-home .bar-4::before{
    height: 5px;
    top: -12px;
  }
.lcars-home .bar-9::before{
    height: 5px;
    bottom: -12px;
  }
}
@media (max-width: 525px){
.lcars-home{
    padding: 5.5px;
  }
.lcars-home .baseboard{
    display: none;
  }
.lcars-home .wrap{
    padding-left: 0;
    padding-right: 5.5px;
  }
.lcars-home .left-frame{
    padding-top: 8vh;
  }
.lcars-home .divider{
    padding-right: 10px;
  }
.lcars-home .block-row{
    padding-right: 0;
    padding-left: 5.5px;
  }
.lcars-home .floor-heading{
    bottom: 0;
  }
.lcars-home .hop{
    display: none;
  }
.lcars-home blockquote{
    margin-left: 16.5px;
  }
}
@-moz-document url-prefix(){
.lcars-home main{
    padding-top: clamp(22px, 4vw, 30px);
  }
.lcars-home h1,
.lcars-home h2,
.lcars-home h3,
.lcars-home h4,
.lcars-home p{
    margin-block: 25.3px;
   }
.lcars-home .postmeta{
    margin-top: 16.5px;
   }
.lcars-home .lcars-text-bar h2,
.lcars-home .lcars-text-bar h3,
.lcars-home .lcars-text-bar h4,
.lcars-home .lcars-text-bar span{
      position: absolute;
      top: -.7vh;
   }
}
/* Jonathan D'Ambra original card customizations (scoped). */
.lcars-home{

  --lfw: 240px;
  --clfw: 160px;

  --left-frame-padding: 16.5px;

  --bar-height: 28px;
  --c-bar-height: 44px;
  --bar-1-6-width: 40%;
  --bar-2-7-width: 4%;
  --bar-3-8-width: 17%;
  --bar-5-10-width: 4%;

  --radius-top: 0 0 0 160px;
  --radius-bottom: 160px 0 0 0;
  --radius-top-bottom: 160px 0 0 160px;
  --radius-content-top: 0 0 0 60px;
  --radius-content-bottom: 60px 0 0 0;

  --panel-border: 5.5px solid black;

  --bar-border: 5.5px solid black;
  --bar-cut-width: 34%;
  --bar-cut-out-width: 34%;

  --divider-height: 11px;



  --image-border-color: var(--almond-creme);
  --primary-color: var(--orange);
  --secondary-color: var(--moonlit-violet);
  --accent-color: var(--almond-creme);
  --title-color: var(--almond-creme);
  --spacers: 14.3px;
  --frame-height: 40px;
}
@media (max-width: 1500px){
.lcars-home{
    --lfw: 200px;
    --radius-top: 0 0 0 130px;
    --radius-bottom: 130px 0 0 0;
    --radius-top-bottom: 130px 0 0 130px;
    --divider-height: 8.8px;
    --nav-width: 210px;
    --dc-font-size: 16.5px;
    --bar-height: 24px;
  }
}
@media (max-width: 1300px){
.lcars-home{

    --sub-fonts: 19.8px;
    --lfw: 180px;
    --nav-width: 180px;
    --radius-top: 0 0 0 100px;
    --radius-bottom: 100px 0 0 0;
    --radius-top-bottom: 100px 0 0 100px;
    --radius-content-top: 0 0 0 40px;
    --radius-content-bottom: 40px 0 0 0;
    --bar-height: 20px;
  }
}
@media (max-width: 950px){
.lcars-home{
    --lfw: 150px;
  }
}
@media (max-width: 750px){
.lcars-home{
    --panel-border: 5.5px solid black;
    --bar-border: 5.5px solid black;
    --lfw: 120px;
    --radius-top: 0 0 0 80px;
    --radius-bottom: 80px 0 0 0;
      --radius-top-bottom: 80px 0 0 90px;
    --radius-content-top: 0 0 0 34px;
    --radius-content-bottom: 34px 0 0 0;
    --nav-width: 174px;
    --bar-height: 16px;
    --spacers: 11px;
    --frame-height: 25px;
  }
}
@media (max-width: 525px){
.lcars-home{
    --lfw: 62px;
    --left-frame-padding: 11px;
    --radius-top: 0 0 0 40px;
    --radius-bottom: 40px 0 0 0;
    --radius-top-bottom: 40px 0 0 40px;
    --bar-height: 10px;
    --divider-height: 6.6px;
  }
}
@media (max-width: 450px){
.lcars-home{
    --nav-width: 48%;
  }
}
.lcars-home .card .left-frame-top,
.lcars-home .card .left-frame{
  width: var(--clfw);
  text-align: right;
  font-size: clamp(19.25px, 2vw, 22px);
  line-height: 1.2;
  font-weight: bold;
  color: black;
  transition: width 1s;
}
.lcars-home .card .left-frame{
  border-radius: var(--radius-top-bottom);
}
.lcars-home .card .left-frame .panel-7{
  border-radius: var(--radius-top);
  height: 200px;
}
.lcars-home .left-frame-top{
  border-radius: var(--radius-top);
}
.lcars-home .right-frame-top{
  flex: 1;
  align-content: flex-end;
  position: relative;
}
.lcars-home .card{
  margin-top: 100px;
}
.lcars-home .card .right-frame .bottom-bar{
  flex: 1;
  position: absolute;
  width: 100%;
  bottom: 0;
  height: 20px;
  background-color: var(--panel-7-color);
  border-radius: 0 20px 20px 0;
}
.lcars-home .card .right-frame .bottom-bar::before{
  content: '';
  display: block;
  width: 60px;
  height: 60px;

  background-color: var(--panel-7-color);
  position: absolute;
  left: 0;

  bottom: 20px;
  z-index: -1;
}
.lcars-home .card .right-frame .bottom-bar::after{
  content: '';
  display: block;
  width: 60px;
  height: 60px;
  background-color: black;
  border-radius: var(--radius-content-top);
  position: absolute;
  left: 0;

  bottom: 20px;
  z-index: -1;
}
.lcars-home .card .right-frame .bar-panel{
  height: var(--c-bar-height);
}
.lcars-home .card .right-frame::before,
.lcars-home .card .right-frame::after{
  top: var(--c-bar-height);
}
.lcars-home .card .right-frame .bar-panel .bar-1,
.lcars-home .card .right-frame .bar-panel .bar-2,
.lcars-home .card .right-frame .bar-panel .bar-3,
.lcars-home .card .right-frame .bar-panel .bar-4,
.lcars-home .card .right-frame .bar-panel .bar-5,
.lcars-home .card .right-frame .bar-panel .bar-6,
.lcars-home .card .right-frame .bar-panel .bar-7,
.lcars-home .card .right-frame .bar-panel .bar-8{
  height: var(--c-bar-height);
}
.lcars-home .card .right-frame .bar-panel .bar-6{
  flex: 1;
}
.lcars-home .card .right-frame .bar-panel .bar-7{
  width: fit-content;
  background-color: transparent;
}
.lcars-home .card .right-frame .bar-panel .bar-7 h2{
  margin: 0;
  padding: 0;
  line-height: 37px;
}
.lcars-home .card .right-frame .bar-panel .bar-8{
  width: 60px;
  border-radius: 0 22px 22px 0;
}
.lcars-home .right-frame-top:before{
  content: '';
  display: block;
  width: 60px;
  height: 60px;
  background: linear-gradient(to top right, var(--corner-color-top) 50%, black 50%);
  position: absolute;
  left: 0;
  bottom: var(--bar-height);
  z-index: -1;
}
.lcars-home .card main{
  padding-top: clamp(20px, 3vw, 50px);
  padding-bottom: 22px;
}
.lcars-home .card img{
  border-radius: 36px;
}
.lcars-home .right-frame-top:after{
  content: '';
  display: block;
  width: 60px;
  height: 60px;
  background-color: black;
  border-radius: var(--radius-content-top);
  position: absolute;
  left: 0;
  bottom: var(--bar-height);
  z-index: -1;
}
@media (max-width: 650px){
.lcars-home .right-frame-top:before{
    bottom: 16px;
  }
.lcars-home .right-frame-top:after{
    bottom: 16px;
  }
}
@media (max-width: 525px){
.lcars-home .right-frame-top:before{
    bottom: 10px;
  }
.lcars-home .right-frame-top:after{
    bottom: 10px;
  }
}

/* ================================================================
   ASTRO INTEGRATION AND RESPONSIVE REFINEMENTS
   Standard portfolio selectors are never restyled here.
   ================================================================ */
.lcars-home { display: none; }
html[data-theme="lcars"]:has(.lcars-home) .home-shell { display: none; }
html[data-theme="lcars"] .lcars-home {
  display: block;
  width: 100%;
  padding: 10px 0 10px 5px;
  background: #000;
  color: var(--font-color);
  font: 400 22px/1.5 "LCARS Antonio", "Arial Narrow", sans-serif;
  isolation: isolate;
  --image-border-color: var(--beta-blue);
  --primary-color: var(--night-rain);
  --secondary-color: var(--beta-blue);
  --accent-color: var(--arctic-snow);
  --title-color: var(--arctic-snow);
}
html[data-theme="lcars"] { background: #000; color-scheme: dark; }
html[data-theme="lcars"] body { background: #000; }
html[data-theme="lcars"]::after { background: #000; }
/* LCARS content remains in normal document flow, as in the supplied reference. */
.lcars-home .wrap { overflow: visible; min-width: 0; }
.lcars-home .left-frame,
.lcars-home .left-frame-top { flex-shrink: 0; }
.lcars-home .right-frame,
.lcars-home .right-frame-top { min-width: 0; isolation: isolate; }
.lcars-home .banner {
  margin: 0 0 22px;
  padding-top: 4px;
  color: var(--radioactive);
  font: 400 clamp(32px, 5.4vw, 88px)/1.15 "LCARS Antonio", sans-serif;
  text-align: right;
}
.lcars-home :is(h1,h2,h3,h4,p,a,button,span,div) { font-family: inherit; }
.lcars-home :is(p,ul li,ol li) { max-width: none; font-size: inherit; line-height: 1.5; }
.lcars-home :is(h1,h2,h3,h4) { font-weight: 400; }
.lcars-home :is(a,button):focus-visible { outline: 3px solid var(--radioactive); outline-offset: 5px; }
.lcars-home a:focus-visible { filter: none; }
.lcars-home :is(button,a) { -webkit-tap-highlight-color: transparent; }
.lcars-home .panel-1-button { cursor: pointer; font-size: inherit; font-weight: 700; }
/* Retain the custom history readout and its row colors; suppress continuous flashing. */
.lcars-home .data-wrapper { animation: none; }
.lcars-home .data-column > div { animation: none; }
.lcars-home .data-cascade-button-group { align-items: end; }
.lcars-home nav a { font-size: 22px; border-bottom: none; }
.lcars-home .lcars-home-content { padding-bottom: 64px; }
/* The header owns the name. The shared bio owns the current role and paragraphs. */
.lcars-home .lcars-bio > h1 { display: none; }
.lcars-home .lcars-bio > h3 {
  color: var(--arctic-ice);
  font-size: clamp(28px, 3vw, 48px);
  line-height: 1.25;
  margin: 0 0 24px;
}
.lcars-home .lcars-bio > hr { display: none; }
.lcars-home .lcars-bio > p { margin: 24px 0; color: var(--beta-blue); }
/* These controls exist in the shared bio; LCARS puts the same destinations in its header. */
.lcars-home .lcars-bio .portfolio-button-group { display: none; }
.lcars-home .lcars-home-content > section > h2 { margin: 64px 0 0; }
.lcars-home .lcars-exit-panel {
  position: sticky;
  top: 24px;
  width: 100%;
  padding: 24px 16px;
  min-height: 72px;
  border-block: 6px solid #000;
  background: var(--arctic-ice);
  color: #000;
  text-align: right;
  text-transform: uppercase;
  font-size: 20px;
  font-weight: 700;
}
.lcars-home .lcars-page-rail > .panel-7 { margin-top: auto; }
/* Each card follows Jonathan's original nested frame structure. */
.lcars-home .lcars-case-card {
  padding: 0;
  margin-top: 64px;
  color: var(--font-color);
  text-decoration: none;
  border: 0;
  cursor: pointer;
  filter: none;
}
.lcars-home .lcars-case-card:hover { filter: none; }
.lcars-home .lcars-case-card:hover .bar-8 { background: var(--radioactive); }
.lcars-home .lcars-case-card .left-frame { padding-top: 100px; width: var(--clfw); }
.lcars-home .lcars-case-card :is(.panel-3,.panel-4,.panel-6) {
  min-height: 78px;
  height: auto;
  display: block;
  overflow-wrap: anywhere;
  padding: 20px 12px;
}
.lcars-home .lcars-case-card .panel-7 { min-height: 90px; height: auto; flex: 1; }
.lcars-home .lcars-case-card .lcars-card-title {
  height: auto;
  min-height: var(--c-bar-height);
  gap: 0;
  align-items: start;
}
.lcars-home .lcars-case-card .lcars-card-title .bar-6 { flex: 1 1 80px; min-width: 18px; }
.lcars-home .lcars-case-card .lcars-card-title .bar-7 {
  flex: 0 1 auto;
  min-width: 0;
  width: auto;
  height: auto;
  padding: 0 8px;
  border: 0;
}
.lcars-home .lcars-case-card .lcars-card-title h3 {
  margin: -5px 0 0;
  padding: 0;
  color: var(--arctic-ice);
  font-size: clamp(25px, 2.7vw, 44px);
  line-height: 1.2;
  text-align: right;
  overflow-wrap: anywhere;
}
.lcars-home .lcars-case-card .lcars-card-title .bar-8 { flex: 0 0 42px; border: 0; }
.lcars-home .lcars-card-body {
  padding: clamp(24px, 3vw, 50px) 0 56px clamp(20px, 3vw, 50px);
}
.lcars-home .lcars-card-body img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  object-fit: contain;
  border: 2px solid var(--beta-blue);
  border-radius: 20px;
  background: transparent;
}
.lcars-home .lcars-card-body p { margin: 28px 0 0; color: var(--beta-blue); }
.lcars-home .lcars-case-card .bottom-bar { left: 0; right: 0; width: 100%; }
.lcars-home .lcars-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 20px;
  padding-left: clamp(20px, 3vw, 50px);
  margin: 0 0 20px;
  color: var(--beta-blue);
  font-size: 18px;
  text-transform: uppercase;
}
.lcars-home .lcars-footer button {
  background: var(--arctic-ice);
  border-radius: 30px;
  padding: 14px 24px;
  min-height: 44px;
  font-size: 18px;
  color: #000;
}
/* Compact Easter egg next to LinkedIn; width grows with the revealed label. */
.lcars-social-controls {
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
  gap: 10px;
  min-width: 180px; /* Reserve reveal space so hover cannot wrap its own row. */
}
.lcars-toggle {
  position: relative;
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: flex-start;
  gap: 0;
  width: auto;
  min-width: 48px;
  height: 48px;
  padding: 0 11px;
  margin: 0;
  border: 1px solid transparent;
  border-radius: 12px;
  background: #edf4fc;
  color: #20518a;
  font: 600 16px/1 "Plus Jakarta Sans", sans-serif;
  letter-spacing: -.01em;
  cursor: pointer;
  transition: background-color 180ms ease, color 180ms ease;
}
.lcars-toggle__icon {
  display: block;
  flex: 0 0 24px;
  width: 24px;
  height: 24px;
  background-color: currentColor;
  -webkit-mask: url("/img/star-trek-logo.svg") center / contain no-repeat;
  mask: url("/img/star-trek-logo.svg") center / contain no-repeat;
}
.lcars-toggle[hidden] { display: none; }
.lcars-toggle:focus-visible { outline: 3px solid #0f77f6; outline-offset: 4px; }
.lcars-toggle:is(:hover, :focus-visible) { background: #dfecfa; color: #174678; }
.lcars-toggle__label {
  display: block;
  flex: 0 0 auto;
  max-width: 0;
  /*overflow: hidden;*/
  margin-left: 0;
  opacity: 0;
  transform: translateX(-8px);
  white-space: nowrap;
  transition: max-width 280ms cubic-bezier(.2,.8,.2,1),
    margin-left 280ms cubic-bezier(.2,.8,.2,1),
    transform 280ms ease, opacity 160ms ease;
}
.lcars-toggle:is(:hover, :focus-visible) .lcars-toggle__label {
  max-width: 88px;
  margin-left: 10px;
  opacity: 1;
  transform: translateX(0);
  transition: max-width 280ms cubic-bezier(.2,.8,.2,1),
    margin-left 280ms cubic-bezier(.2,.8,.2,1),
    transform 280ms ease, opacity 180ms ease 55ms;
}
@media (max-width: 717px) {
  .home-shell .lcars-social-controls { width: 100%; min-width: 0; }
  .home-shell .lcars-social-controls .portfolio-button--icon { flex: 1 1 0; width: auto; min-width: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .lcars-toggle, .lcars-toggle__label,
  .lcars-toggle:is(:hover, :focus-visible) .lcars-toggle__label { transition: none; }
}
html[data-theme="lcars"] .lcars-toggle {
  position: fixed;
  z-index: 10002;
  left: auto;
  right: 18px;
  bottom: 18px;
  width: auto;
  padding: 10px 18px;
  border-radius: 28px;
  background: #6cf;
  color: #000;
  font: 400 18px/1 "LCARS Antonio", sans-serif;
}
html[data-theme="lcars"] .lcars-toggle__label {
  display: block;
  max-width: 120px;
  margin-left: 8px;
  opacity: 1;
  transform: none;
}
html[data-theme="lcars"] .lcars-toggle:hover { background: #8ff; }
.lcars-status { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
@media (max-width: 1100px) {
  .lcars-home .data-cascade-button-group { gap: 22px; }
  .lcars-home .data-wrapper { flex-basis: 100%; padding-right: 0; justify-content: start; }
  .lcars-home nav { margin-left: auto; }
}
@media (max-width: 750px) {
  html[data-theme="lcars"] .lcars-home { --clfw: 78px; --c-bar-height: 28px; font-size: 19px; }
  .lcars-home .banner { font-size: clamp(28px, 6.5vw, 48px); }
  .lcars-home .data-wrapper {
    display: flex;
    flex-wrap: nowrap;
    justify-content: start;
    overflow-x: auto;
    height: auto;
    min-height: 126px;
    padding-left: 16px;
    padding-bottom: 8px;
  }
  .lcars-home .data-column { flex-shrink: 0; font-size: 16px; --dc-row-height: 28px; }
  .lcars-home .left-frame-top { font-size: 15px; }
  .lcars-home nav { width: 100%; gap: 8px; padding-left: 16px; }
  .lcars-home nav a { width: calc(50% - 4px); min-height: 48px; height: auto; padding: 12px 18px; font-size: 17px; }
  .lcars-home .lcars-bio > h3 { font-size: 28px; }
  .lcars-home .lcars-case-card .left-frame { padding-top: 72px; font-size: 15px; }
  .lcars-home .lcars-case-card :is(.panel-3,.panel-4,.panel-6) { min-height: 64px; padding: 16px 8px; }
  .lcars-home .lcars-case-card .lcars-card-title h3 { margin-top: -3px; font-size: 27px; }
  .lcars-home .lcars-case-card .lcars-card-title .bar-8 { flex-basis: 22px; }
  .lcars-home .lcars-card-body { padding: 26px 0 44px 20px; }
  .lcars-home .lcars-card-body img { border-radius: 20px; }
  .lcars-home .lcars-exit-panel { font-size: 16px; padding-inline: 8px; }
}
@media (max-width: 525px) {
  html[data-theme="lcars"] .lcars-home { --lfw: 34px; --clfw: 28px; --c-bar-height: 20px; }
  .lcars-home .wrap { padding-inline: 0 10px; }
  .lcars-home .left-frame-top { width: 34px; }
  .lcars-home .left-frame-top .panel-1-button { width: 34px; padding: 8px; min-height: 84px; font-size: 0; }
  .lcars-home .left-frame-top .panel-1-button::after { content: "JD"; font-size: 15px; }
  .lcars-home .left-frame-top .panel-2 { font-size: 0; padding: 0; }
  .lcars-home .banner { padding-left: 10px; margin-bottom: 16px; font-size: clamp(27px, 7vw, 36px); }
  .lcars-home .data-cascade-button-group { gap: 16px; }
  .lcars-home .data-wrapper { padding-left: 12px; }
  .lcars-home nav { padding-left: 12px; }
  .lcars-home .lcars-page-rail :is(.panel-3,.panel-4,.panel-5,.panel-6,.panel-7) { font-size: 0; padding: 0; }
  .lcars-home .lcars-page-rail .panel-3 { min-height: 100px; }
  .lcars-home .lcars-exit-panel { font-size: 0; padding: 0; min-height: 64px; }
  .lcars-home .lcars-exit-panel::after { content: "EXIT"; writing-mode: vertical-rl; font-size: 14px; }
  .lcars-home .lcars-home-content { padding-left: 16px; }
  .lcars-home .lcars-bio > h3 { font-size: 25px; }
  .lcars-home .lcars-home-content > section > h2 { font-size: 27px; }
  .lcars-home .lcars-case-card { margin-top: 44px; }
  .lcars-home .lcars-case-card .left-frame { padding-top: 54px; }
  .lcars-home .lcars-case-card .left-frame :is(.panel-3,.panel-4,.panel-6) { font-size: 0; padding: 0; min-height: 52px; }
  .lcars-home .lcars-case-card .lcars-card-title h3 { font-size: 23px; }
  .lcars-home .lcars-case-card .lcars-card-title .bar-6 { flex-basis: 10px; min-width: 6px; }
  .lcars-home .lcars-case-card .lcars-card-title .bar-8 { flex-basis: 16px; }
  .lcars-home .lcars-card-body { padding-left: 12px; padding-top: 22px; }
  .lcars-home .lcars-card-body img { border-radius: 20px; }
  .lcars-home .lcars-card-body p { font-size: 18px; }
  .lcars-home .lcars-footer { padding-left: 16px; font-size: 15px; }
}
@media (prefers-reduced-motion: reduce) {
  .lcars-home *, .lcars-home *::before, .lcars-home *::after { animation: none !important; transition: none !important; scroll-behavior: auto; }
}
/* Avoid delayed frame-width transitions while the viewport changes. */
.lcars-home :is(.left-frame,.left-frame-top,.panel-1-button,.panel-1 a,nav a,nav button) { transition: none; }
.lcars-home .data-wrapper { min-width: 0; }
.lcars-home .card .left-frame { transition: none; }
/* Clear two generic rules inherited from the standard portfolio. */
.lcars-home nav { height: auto; padding-block: 0; }
.lcars-home .divider { width: 100%; background: #000; }
.lcars-home a { border-bottom: 0; }
/* Wrapped titles must increase the card header height instead of overlapping its image. */
.lcars-home .card .right-frame .bar-panel.lcars-card-title { height: auto; min-height: var(--c-bar-height); }
.lcars-home .card .right-frame .bar-panel.lcars-card-title .bar-7 { height: auto; width: auto; }

/* Subspace interference: active only during an explicit theme switch. */
.lcars-interference {
  position: fixed;
  inset: 0;
  display: block;
  width: 100vw;
  height: 100vh;
  margin: 0;
  padding: 0;
  border: 0;
  z-index: 100000;
  pointer-events: auto;
  touch-action: none;
}
html.lcars-shifting .home-shell,
html.lcars-shifting .lcars-home {
  filter: blur(calc(var(--lcars-interference, 0) * 4px))
    saturate(calc(1 - var(--lcars-interference, 0) * .65));
  pointer-events: none;
}
html.lcars-shifting .lcars-toggle { visibility: hidden; }
@media (prefers-reduced-motion: reduce) {
  .lcars-interference { display: none; }
  html.lcars-shifting .home-shell,
  html.lcars-shifting .lcars-home { filter: none; }
}

/* Two-column case studies, following the framework's flexbox / col pattern. */
.lcars-home .lcars-card-grid {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  gap: 48px 32px;
  margin-top: 40px;
}
.lcars-home .lcars-card-grid > .col {
  display: flex;
  flex: 1 1 calc(50% - 16px);
  min-width: min(100%, 480px);
  container: lcars-card / inline-size;
}
.lcars-home .lcars-card-grid .lcars-case-card {
  flex: 1;
  margin-top: 0;
}
/* Each card adapts to its own width, rather than the browser width. */
@container lcars-card (max-width: 650px) {
  .lcars-home .lcars-card-grid .lcars-case-card {
    --clfw: 84px;
    --c-bar-height: 28px;
    --radius-top-bottom: 80px 0 0 80px;
    --radius-content-top: 0 0 0 32px;
    --radius-content-bottom: 32px 0 0 0;
  }
  .lcars-home .lcars-card-grid .lcars-case-card .left-frame {
    padding-top: 72px;
    font-size: 15px;
  }
  .lcars-home .lcars-card-grid .lcars-case-card :is(.panel-3,.panel-4,.panel-6) {
    min-height: 64px;
    padding: 16px 8px;
  }
  .lcars-home .lcars-card-grid .lcars-case-card .lcars-card-title h3 {
    margin-top: -3px;
    font-size: 28px;
  }
  .lcars-home .lcars-card-grid .lcars-case-card .lcars-card-title .bar-6 {
    flex-basis: 24px;
    min-width: 10px;
  }
  .lcars-home .lcars-card-grid .lcars-case-card .lcars-card-title .bar-8 { flex-basis: 24px; }
  .lcars-home .lcars-card-grid .lcars-card-body { padding: 26px 0 44px 24px; }
  .lcars-home .lcars-card-grid .lcars-card-body img { border-radius: 12px; }
  .lcars-home .lcars-card-grid .lcars-card-body p { font-size: 20px; }
}
@container lcars-card (max-width: 360px) {
  .lcars-home .lcars-card-grid .lcars-case-card {
    --clfw: 28px;
    --c-bar-height: 20px;
    --radius-top-bottom: 40px 0 0 40px;
    --radius-content-top: 0 0 0 24px;
    --radius-content-bottom: 24px 0 0 0;
  }
  .lcars-home .lcars-card-grid .lcars-case-card .left-frame { padding-top: 54px; }
  .lcars-home .lcars-card-grid .lcars-case-card :is(.panel-3,.panel-4,.panel-6) {
    min-height: 52px;
    padding: 0;
    font-size: 0;
  }
  .lcars-home .lcars-card-grid .lcars-case-card .lcars-card-title h3 { font-size: 23px; }
  .lcars-home .lcars-card-grid .lcars-case-card .lcars-card-title .bar-6 { flex-basis: 10px; min-width: 6px; }
  .lcars-home .lcars-card-grid .lcars-case-card .lcars-card-title .bar-8 { flex-basis: 16px; }
  .lcars-home .lcars-card-grid .lcars-card-body { padding-left: 12px; padding-top: 22px; }
  .lcars-home .lcars-card-grid .lcars-card-body img { border-radius: 8px; }
  .lcars-home .lcars-card-grid .lcars-card-body p { font-size: 18px; }
}

/* Keep the original template credit visible at the very bottom of LCARS. */
.lcars-home .lcars-footer { flex-wrap: wrap; padding-bottom: 48px; }
.lcars-home .lcars-footer .lcars-attribution {
  flex: 0 0 100%;
  max-width: none;
  margin: 16px 0 0;
  color: var(--beta-blue);
  font-size: 16px;
  line-height: 1.6;
  text-transform: none;
}
.lcars-home .lcars-footer .lcars-attribution a { color: var(--arctic-ice); }

/* Let the complete title determine the height of both header bars. */
.lcars-home .lcars-card-grid .lcars-case-card {
  --card-gap: clamp(24px, 3vw, 50px);
  --card-inner-corner: 40px;
  --card-outer-corner: 160px;
}
.lcars-home .lcars-case-card > .right-frame {
  display: flex;
  flex-direction: column;
}
.lcars-home .card .right-frame .bar-panel.lcars-card-title {
  align-items: stretch;
  flex-shrink: 0;
}
.lcars-home .card .right-frame .bar-panel.lcars-card-title > :is(.bar-6,.bar-7,.bar-8) {
  height: auto;
  min-height: var(--c-bar-height);
}
.lcars-home .card .right-frame .bar-panel.lcars-card-title .bar-8 {
  border-radius: 0 100vmax 100vmax 0;
}
.lcars-home .lcars-card-grid .lcars-case-card .lcars-card-title h3 {
  margin: 0;
  text-wrap: balance;
  overflow-wrap: anywhere;
  word-break: normal;
  hyphens: none;
}
/* The inner top elbow follows the header, including multi-line titles. */
.lcars-home .card > .right-frame::before,
.lcars-home .card > .right-frame::after { content: none; }
.lcars-home .lcars-card-grid .lcars-card-body {
  position: relative;
  flex: 1;
  padding-top: var(--card-gap);
  padding-bottom: var(--card-gap);
}
.lcars-home .lcars-case-card .lcars-card-body::before,
.lcars-home .lcars-case-card .lcars-card-body::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: var(--card-inner-corner);
  height: var(--card-inner-corner);
  z-index: -1;
  background: var(--left-frame-color);
}
.lcars-home .lcars-case-card .lcars-card-body::after {
  background: #000;
  border-top-left-radius: var(--card-inner-corner);
}
/* Center image-only content so extra row height is shared above and below. */
.lcars-home .lcars-case-card:not(:has(.lcars-card-body > p)) .lcars-card-body {
  display: flex;
  flex-direction: column;
  justify-content: center;
}
/* Keep the rail separator above the bottom curve instead of cutting through it. */
.lcars-home .card .left-frame { overflow: hidden; }
.lcars-home .card .left-frame .panel-7 {
  flex: 1;
  height: auto;
  min-height: calc(var(--card-outer-corner) + 6px);
  border-radius: 0;
}
.lcars-home .card .right-frame .bottom-bar {
  position: relative;
  flex: 0 0 20px;
}
.lcars-home .card .right-frame .bottom-bar::before,
.lcars-home .card .right-frame .bottom-bar::after {
  width: var(--card-inner-corner);
  height: var(--card-inner-corner);
}
.lcars-home .card .right-frame .bottom-bar::after {
  border-radius: 0 0 0 var(--card-inner-corner);
}
@container lcars-card (max-width: 650px) {
  .lcars-home .lcars-card-grid .lcars-case-card {
    --card-gap: 26px;
    --card-inner-corner: 24px;
    --card-outer-corner: 80px;
  }
}
@container lcars-card (max-width: 360px) {
  .lcars-home .lcars-card-grid .lcars-case-card {
    --card-gap: 22px;
    --card-inner-corner: 12px;
    --card-outer-corner: 40px;
  }
}

/* Give unused title width back to the colored bar after measuring wrapped lines. */
.lcars-home .card .right-frame .bar-panel.lcars-card-title .bar-7 {
  flex: 0 1 var(--lcars-title-width, auto);
}
/* Image-only cards follow the image height; their rail cannot impose a minimum. */
.lcars-home .lcars-card-grid .lcars-case-card:not(:has(.lcars-card-body > p)) {
  position: relative;
  align-self: flex-start;
  --image-only-corner: min(80px, 12cqi);
}
.lcars-home .lcars-card-grid .lcars-case-card:not(:has(.lcars-card-body > p)) > .right-frame {
  margin-left: var(--clfw);
}
.lcars-home .lcars-card-grid .lcars-case-card:not(:has(.lcars-card-body > p)) > .left-frame {
  position: absolute;
  inset: 0 auto 0 0;
  padding-top: min(72px, 12cqi);
  border-radius: var(--image-only-corner) 0 0 var(--image-only-corner);
}
.lcars-home .lcars-card-grid .lcars-case-card:not(:has(.lcars-card-body > p)) .lcars-card-panels {
  display: grid;
  grid-template-rows: repeat(3, minmax(0, 1fr));
  flex: 1;
  min-height: 0;
}
.lcars-home .lcars-card-grid .lcars-case-card:not(:has(.lcars-card-body > p)) :is(.panel-3,.panel-4,.panel-6) {
  min-height: 0;
  padding: 4px 6px;
  overflow: hidden;
}
.lcars-home .lcars-card-grid .lcars-case-card:not(:has(.lcars-card-body > p)) .left-frame .panel-7 {
  flex: 0 0 calc(var(--image-only-corner) + 6px);
  min-height: 0;
  padding: 0;
}

@container lcars-card (min-width: 361px) and (max-width: 650px) {
  .lcars-home .lcars-card-grid .lcars-case-card:not(:has(.lcars-card-body > p)) :is(.panel-3,.panel-4,.panel-6) {
    font-size: clamp(11px, 2.6cqi, 15px);
    line-height: 1.15;
  }
}

@media (max-width: 717px) {
  .home-shell .lcars-social-controls {
    width: 100%;
    min-width: 0;
    flex-direction: column;
    align-items: stretch;
  }

  .home-shell .lcars-social-controls .portfolio-button--icon {
    flex: 0 0 auto;
    width: 100%;
    min-width: 0;
  }

  .home-shell .lcars-social-controls .lcars-toggle {
    width: 100%;
    justify-content: center;
  }

  .home-shell .lcars-social-controls .lcars-toggle__label {
    max-width: none;
    margin-left: 10px;
    opacity: 1;
    transform: none;
    transition: none;
  }
}