
/* v35: homepage section-specific refinement */
.homeHardwareVisual.assetPanel {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: clamp(250px, 34vw, 400px);
  padding: clamp(16px, 2vw, 24px);
  background: linear-gradient(180deg, rgba(255,255,255,.96), rgba(247,250,248,.92));
  border: 1px solid rgba(18,24,22,.08);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.7);
}
[data-theme="dark"] .homeHardwareVisual.assetPanel,
:root[data-theme="dark"] .homeHardwareVisual.assetPanel,
html[data-theme="dark"] .homeHardwareVisual.assetPanel,
body.dark .homeHardwareVisual.assetPanel {
  background: linear-gradient(180deg, rgba(245,247,246,.98), rgba(236,240,238,.96));
  border-color: rgba(255,255,255,.10);
}
.homeHardwareFigure {
  width: 100%;
  margin: 0;
  display: grid;
  gap: 12px;
  justify-items: center;
}
.homeHardwareFigure img {
  width: min(100%, 420px);
  height: auto;
  display: block;
  filter: drop-shadow(0 14px 30px rgba(10, 18, 14, .10));
}
.homeHardwareFigure figcaption {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  gap: 8px 10px;
  align-items: center;
  justify-content: center;
  text-align: center;
}
.homeHardwareFigure figcaption strong {
  color: #10231a;
  font-size: .98rem;
}
.homeHardwareFigure figcaption span {
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(16,35,26,.06);
  color: #315442;
  font-size: .82rem;
  font-weight: 600;
}

.whyEspflightSection {
  position: relative;
  overflow: clip;
}
.whyEspflightWrap {
  display: grid;
  gap: clamp(22px, 2.8vw, 34px);
}
.whyEspflightIntro {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(280px, .85fr);
  gap: clamp(18px, 3vw, 40px);
  align-items: start;
}
.whyEspflightIntro .sectionTitle,
.whyEspflightLeadCard { margin: 0; }
.whyEspflightLeadCard {
  padding: clamp(18px, 2.2vw, 24px);
  border-radius: 24px;
  background: linear-gradient(180deg, rgba(64,210,132,.14), rgba(64,210,132,.06));
  border: 1px solid rgba(64,210,132,.22);
  box-shadow: 0 18px 42px rgba(7, 12, 10, .10);
}
.whyEspflightLeadCard strong {
  display: block;
  margin-bottom: 10px;
  font-size: .82rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--accent, #40d284);
}
.whyEspflightLeadCard p {
  margin: 0;
  font-size: 1rem;
  line-height: 1.8;
}
.whyEspflightGrid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(14px, 1.6vw, 20px);
}
.whyCard {
  height: 100%;
  padding: clamp(18px, 2vw, 24px);
  border-radius: 24px;
  background: linear-gradient(180deg, rgba(255,255,255,.85), rgba(255,255,255,.72));
  border: 1px solid rgba(18,24,22,.08);
  box-shadow: 0 16px 38px rgba(10, 18, 14, .08);
}
[data-theme="dark"] .whyCard,
:root[data-theme="dark"] .whyCard,
html[data-theme="dark"] .whyCard,
body.dark .whyCard {
  background: linear-gradient(180deg, rgba(17,24,22,.92), rgba(13,18,16,.94));
  border-color: rgba(255,255,255,.08);
  box-shadow: 0 18px 42px rgba(0, 0, 0, .28);
}
.whyCardNumber {
  display: inline-flex;
  width: 38px;
  height: 38px;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: rgba(64,210,132,.14);
  color: var(--accent, #40d284);
  font-weight: 800;
  font-size: .9rem;
  margin-bottom: 16px;
}
.whyCard h3 {
  margin: 0 0 10px;
  font-size: 1.15rem;
  line-height: 1.35;
}
.whyCard p {
  margin: 0;
  color: var(--muted);
  line-height: 1.8;
}
.whyEspflightFoot {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr);
  gap: clamp(16px, 2vw, 24px);
  align-items: center;
  padding: clamp(18px, 2vw, 24px);
  border-radius: 28px;
  border: 1px solid rgba(18,24,22,.08);
  background: linear-gradient(180deg, rgba(255,255,255,.72), rgba(248,250,249,.85));
}
[data-theme="dark"] .whyEspflightFoot,
:root[data-theme="dark"] .whyEspflightFoot,
html[data-theme="dark"] .whyEspflightFoot,
body.dark .whyEspflightFoot {
  background: linear-gradient(180deg, rgba(14,20,18,.92), rgba(12,17,15,.96));
  border-color: rgba(255,255,255,.08);
}
.whyEspflightFoot p {
  margin: 0;
  color: var(--muted);
  line-height: 1.8;
}
.whyLicenseBadges {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: flex-start;
}
.whyLicenseBadges span {
  padding: 10px 12px;
  border-radius: 999px;
  font-size: .84rem;
  font-weight: 700;
  background: rgba(64,210,132,.10);
  color: var(--text);
  border: 1px solid rgba(64,210,132,.16);
}
@media (max-width: 1020px) {
  .whyEspflightIntro,
  .whyEspflightFoot,
  .whyEspflightGrid {
    grid-template-columns: 1fr;
  }
  .whyLicenseBadges { justify-content: flex-start; }
}


/* v36: keep hardware card height aligned with flight firmware card while using PNG artwork */
.homeHardwareVisual.assetPanel{height:100%;min-height:0;padding:18px;}
.homeHardwareFigure{height:100%;align-content:center;grid-template-rows:minmax(0,1fr) auto;}
.homeHardwareFigure img{max-width:min(100%, 350px);max-height:calc(100% - 42px);width:auto;height:auto;object-fit:contain;}
@media (max-width:1020px){.homeHardwareFigure img{max-width:min(100%,330px);}}
@media (max-width:700px){.homeHardwareVisual.assetPanel{padding:14px;}.homeHardwareFigure img{max-width:min(100%,300px);max-height:calc(100% - 38px);}}


/* v37: unified first-row visuals */
.homeBuildRow .homeBuildCard{display:flex;flex-direction:column;}
.homeBuildRow .homeBuildMedia{height:230px;position:relative;overflow:hidden;}
.homeBuildRow .homeBuildContent{flex:1;display:flex;flex-direction:column;}
.homeBuildRow .homeBuildContent .homeBuildLink{margin-top:auto;}

.firmwareCodeVisual,
.hardwareBoardVisual{
  background:
    radial-gradient(circle at 16% 16%, rgba(66,211,146,.16), transparent 28%),
    radial-gradient(circle at 85% 22%, rgba(31,118,255,.12), transparent 26%),
    radial-gradient(circle at 52% 76%, rgba(66,211,146,.12), transparent 30%),
    linear-gradient(180deg, rgba(14,17,22,.98), rgba(10,13,18,.98));
  border-bottom:1px solid rgba(255,255,255,.07);
}

.codePanelHome{
  width:min(100%, 470px);
  margin:auto;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.08);
  background:linear-gradient(180deg, rgba(13,17,24,.92), rgba(11,14,20,.96));
  box-shadow:0 18px 44px rgba(0,0,0,.26), inset 0 0 0 1px rgba(255,255,255,.03);
  overflow:hidden;
}
.codePanelBar{
  display:flex; align-items:center; gap:8px;
  padding:10px 14px;
  background:rgba(255,255,255,.04);
  border-bottom:1px solid rgba(255,255,255,.06);
}
.codePanelBar span{width:9px;height:9px;border-radius:50%;background:rgba(255,255,255,.28);display:inline-block;}
.codePanelBar span:nth-child(1){background:#ff6b6b;}
.codePanelBar span:nth-child(2){background:#ffd166;}
.codePanelBar span:nth-child(3){background:#40d284;}
.codePanelBar b{font-size:.8rem;color:rgba(255,255,255,.82);font-weight:700;margin-inline-start:6px;}
.codePanelBody{padding:14px 16px 12px;display:grid;gap:6px;}
.codeLine{font-family:ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;font-size:.8rem;line-height:1.45;color:rgba(235,243,255,.90);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.codeIndent{padding-inline-start:18px;}
.codeKw{color:#64c7ff;font-style:normal;}
.codeFn{color:#40d284;font-style:normal;}
.codeVar{color:#ffd38a;font-style:normal;}
.codeBrace{color:rgba(255,255,255,.72);font-style:normal;}
.codePanelTags{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;padding:0 14px 14px;}
.codePanelTags span{padding:8px 12px;border-radius:12px;background:rgba(255,255,255,.04);border:1px solid rgba(64,210,132,.20);color:#eef4ff;font-size:.78rem;font-weight:700;}

.hardwareBoardVisual{display:flex;align-items:center;justify-content:center;padding:18px;}
.hardwareGlow{position:absolute;inset:auto 12% 8% 12%;height:58%;border-radius:50%;filter:blur(48px);background:radial-gradient(circle, rgba(66,211,146,.22), rgba(66,211,146,.05) 48%, transparent 72%);pointer-events:none;}
.hardwareBoardVisual .homeHardwareFigure{height:100%;width:100%;display:flex;align-items:center;justify-content:center;margin:0;position:relative;z-index:1;}
.hardwareBoardVisual .homeHardwareFigure img{max-width:min(100%, 340px);max-height:100%;width:auto;height:auto;object-fit:contain;filter:drop-shadow(0 14px 34px rgba(0,0,0,.42));}
.hardwareBoardVisual .homeHardwareFigure figcaption{display:none;}

@media (max-width:1020px){
  .homeBuildRow .homeBuildMedia{height:224px;}
  .hardwareBoardVisual .homeHardwareFigure img{max-width:min(100%,320px);}
}
@media (max-width:700px){
  .homeBuildRow .homeBuildMedia{height:195px;}
  .codePanelBody{padding:12px 14px 10px;}
  .codeLine{font-size:.74rem;}
  .codePanelTags span{font-size:.72rem;padding:7px 10px;}
  .hardwareBoardVisual{padding:12px;}
  .hardwareBoardVisual .homeHardwareFigure img{max-width:min(100%,270px);}
}

/* v38: actual firmware visual replacement and slightly taller first-row visuals */
.homeBuildRow .homeBuildMedia, .homeBuildGrid .homeBuildMedia{height:252px !important;}
.homeFirmwareCard .firmwareCodeVisual{display:flex !important;align-items:center;justify-content:center;padding:18px !important;}
.homeFirmwareCard .firmwareCodeVisual .codePanelHome{display:block;width:min(100%,470px);margin:auto;}
@media (max-width:1020px){.homeBuildRow .homeBuildMedia, .homeBuildGrid .homeBuildMedia{height:244px !important;}}
@media (max-width:700px){.homeBuildRow .homeBuildMedia, .homeBuildGrid .homeBuildMedia{height:210px !important;}.homeFirmwareCard .firmwareCodeVisual{padding:12px !important;}}

/* v39: noticeably taller first-row visuals */
.homeBuildGrid .homeBuildMedia{height:294px !important;}
.homeBuildCard.homeFirmwareCard .firmwareCodeVisual{padding:20px !important;}
.homeBuildCard.homeFirmwareCard .codePanelHome{height:calc(100% - 4px);display:flex;flex-direction:column;}
.homeBuildCard.homeFirmwareCard .codePanelBody{flex:1;align-content:start;}
.homeBuildCard.homeHardwareCard .hardwareBoardVisual{padding:20px !important;}
.homeBuildCard.homeHardwareCard .homeHardwareFigure img{max-width:min(100%, 390px);max-height:100%;}
@media (max-width:1020px){.homeBuildGrid .homeBuildMedia{height:278px !important;}.homeBuildCard.homeHardwareCard .homeHardwareFigure img{max-width:min(100%, 360px);}}
@media (max-width:700px){.homeBuildGrid .homeBuildMedia{height:236px !important;}.homeBuildCard.homeFirmwareCard .firmwareCodeVisual{padding:14px !important;}.homeBuildCard.homeHardwareCard .hardwareBoardVisual{padding:14px !important;}.homeBuildCard.homeHardwareCard .homeHardwareFigure img{max-width:min(100%, 300px);}}


/* v40: redesigned Why ESPFlight section */
.whyEspflightSection{position:relative;overflow:clip;}
.whyEspflightShell{display:grid;gap:clamp(22px,2.8vw,34px);}
.whyHeroPanel{
  display:grid;
  grid-template-columns:minmax(0,1.12fr) minmax(290px,.88fr);
  gap:clamp(18px,2.5vw,28px);
  align-items:stretch;
}
.whyHeroCopy,
.whyHeroAside,
.whyValueCard,
.whyPlatformStrip,
.whyPlatformItem{
  border:1px solid rgba(255,255,255,.08);
  background:linear-gradient(180deg, rgba(19,24,29,.92), rgba(13,17,21,.94));
  box-shadow:0 20px 44px rgba(0,0,0,.18);
}
.whyHeroCopy{
  padding:clamp(22px,2.6vw,34px);
  border-radius:28px;
  position:relative;
  overflow:hidden;
}
.whyHeroCopy::before,
.whyHeroAside::before,
.whyPlatformStrip::before{
  content:"";
  position:absolute;
  inset:auto auto 0 0;
  width:42%; height:58%;
  background:radial-gradient(circle, rgba(66,211,146,.12), transparent 72%);
  filter:blur(18px);
  pointer-events:none;
}
.whyHeroCopy .eyebrow{margin-bottom:14px;}
.whyHeroCopy h2{margin:0 0 14px;}
.whyHeroCopy p{margin:0; max-width:62ch; line-height:1.9; color:var(--muted);}
.whyHeroCopy .textLink{display:inline-flex;margin-top:18px;}

.whyHeroAside{
  padding:clamp(18px,2.2vw,24px);
  border-radius:28px;
  display:grid;
  gap:16px;
  position:relative;
  overflow:hidden;
}
.whySignalCard{
  padding:18px 18px 16px;
  border-radius:22px;
  background:linear-gradient(180deg, rgba(64,210,132,.14), rgba(64,210,132,.05));
  border:1px solid rgba(64,210,132,.18);
}
.whySignalCard small{display:block;margin-bottom:10px;font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);font-weight:800;}
.whySignalCard strong{display:block;font-size:1.08rem;line-height:1.5;margin-bottom:10px;color:var(--text);}
.whySignalCard p{margin:0;color:var(--muted);line-height:1.8;}
.whyQuickList{list-style:none;margin:0;padding:0;display:grid;gap:12px;}
.whyQuickList li{display:grid;grid-template-columns:46px 1fr;gap:14px;align-items:start;padding:12px 0;border-top:1px solid rgba(255,255,255,.06);}
.whyQuickList li:first-child{border-top:none;padding-top:0;}
.whyQuickList span{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;background:rgba(64,210,132,.13);color:var(--accent);font-weight:800;font-size:.85rem;}
.whyQuickList strong{display:block;margin-bottom:4px;font-size:.98rem;}
.whyQuickList p{margin:0;color:var(--muted);line-height:1.7;}

.whyValueGrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,1.7vw,20px);}
.whyValueCard{padding:22px;border-radius:24px;position:relative;overflow:hidden;}
.whyValueCard::after{content:"";position:absolute;inset:auto 18px 0 auto;width:80px;height:80px;border-radius:50%;background:radial-gradient(circle, rgba(66,211,146,.12), transparent 68%);filter:blur(10px);pointer-events:none;}
.whyValueLabel{display:inline-flex;padding:7px 11px;border-radius:999px;background:rgba(255,255,255,.05);border:1px solid rgba(64,210,132,.16);color:var(--accent);font-size:.76rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;}
.whyValueCard h3{margin:16px 0 10px;font-size:1.18rem;line-height:1.4;}
.whyValueCard p{margin:0;color:var(--muted);line-height:1.85;}

.whyPlatformStrip{padding:24px;border-radius:28px;position:relative;overflow:hidden;display:grid;gap:18px;}
.whyPlatformIntro h3{margin:8px 0 10px;font-size:clamp(1.32rem,2vw,1.8rem);}
.whyPlatformIntro p{margin:0;color:var(--muted);line-height:1.85;max-width:66ch;}
.whyPlatformItems{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;}
.whyPlatformItem{padding:18px;border-radius:20px;display:grid;gap:10px;background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02));}
.whyPlatformItem strong{font-size:1rem;}
.whyPlatformItem p{margin:0;color:var(--muted);line-height:1.75;font-size:.95rem;}
.whyPlatformItem span{display:inline-flex;align-self:start;width:max-content;padding:7px 10px;border-radius:999px;background:rgba(64,210,132,.12);border:1px solid rgba(64,210,132,.16);color:var(--text);font-size:.78rem;font-weight:800;}

@media (max-width:1100px){
  .whyHeroPanel{grid-template-columns:1fr;}
  .whyValueGrid{grid-template-columns:1fr;}
  .whyPlatformItems{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media (max-width:700px){
  .whyHeroCopy,.whyHeroAside,.whyValueCard,.whyPlatformStrip{padding:18px; border-radius:22px;}
  .whyQuickList li{grid-template-columns:40px 1fr;gap:12px;}
  .whyQuickList span{width:36px;height:36px;font-size:.8rem;}
  .whyPlatformItems{grid-template-columns:1fr;}
}
