/* Dark Launch inspired hero with animated KIC stack and dashboard preview. */
#section-hero.hero-launch-ui {
    min-height: 100vh;
    padding-top: 112px;
}

/* The home page sections share one uninterrupted white surface in light mode. */
body.light-mode #wrapper > .home-ribbon-section,
body.light-mode #wrapper > #section-about,
body.light-mode #wrapper > #section-services,
body.light-mode #wrapper > #section-experience,
body.light-mode #wrapper > #section-company-video,
body.light-mode #wrapper > #section-projects:not(.projects-page-listing),
body.light-mode #wrapper > #section-team,
body.light-mode #wrapper > #section-contact,
body.light-mode #wrapper > #section-faq {
    margin-block: 0 !important;
    border: 0;
}
body.light-mode #wrapper > #section-about,
body.light-mode #wrapper > #section-services,
body.light-mode #wrapper > #section-experience,
body.light-mode #wrapper > #section-company-video,
body.light-mode #wrapper > #section-projects:not(.projects-page-listing),
body.light-mode #wrapper > #section-team,
body.light-mode #wrapper > #section-contact,
body.light-mode #wrapper > #section-faq {
    background-color: #fff;
}
#section-hero .hero-project-pattern::before {
    background-image: linear-gradient(135deg, transparent 49.8%, rgba(255,255,255,.025) 50%, transparent 50.2%);
    background-size: 92px 92px;
}
#section-hero .hero-project-ornament { display: none; }
#section-hero .hero-launch-copy { max-width: 780px; }
#section-hero .hero-launch-title { max-width: 760px; margin-inline: auto; color: #f4f4f5; font-size: clamp(2.8rem, 5.5vw, 4.65rem); line-height: 1.12; }
#section-hero .hero-launch-subtitle { max-width: 560px; color: #a1a1aa; }
#section-hero .hero-launch-badge { margin-bottom: 2rem; }
#section-hero .hero-launch-actions { gap: .55rem; }
#section-hero .hero-launch-button { min-height: 38px; padding: .55rem .9rem; font-size: .7rem; }
#section-hero .hero-launch-button-primary { border-color: #f3f0ea; background: #f3f0ea; color: #161616; }
#section-hero .hero-launch-button-secondary { border-color: rgba(255,255,255,.15); background: rgba(255,255,255,.05); color: #f4f4f5; }
#section-hero .hero-launch-frame { border-color: rgba(255,255,255,.08); }
#section-hero .hero-dashboard-wrap {
    position: relative;
    z-index: 2;
    width: min(100%, 1240px);
    margin: 48px auto 0;
    padding: 5px 5px 0;
    border: 1px solid rgba(210, 150, 100, .2);
    border-bottom: 0;
    border-radius: 15px 15px 0 0;
    background: linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.01));
    box-shadow: 0 -30px 105px rgba(161,91,42,.16), 0 0 0 1px rgba(0,0,0,.35) inset;
    animation: launch-dashboard-in 1.1s .2s both;
}
#section-hero .hero-dashboard-window { overflow: hidden; width: 100%; aspect-ratio: 1.82 / 1; border: 1px solid rgba(255,255,255,.1); border-radius: 10px 10px 0 0; border-bottom-left-radius: 0 !important; border-bottom-right-radius: 0 !important; background: #111214; }
#section-hero .hero-dashboard-image,
#section-hero .hero-dashboard-video { border-radius: 0 !important; }
#section-hero .hero-dashboard-image { display: block; width: 100%; height: 100%; object-fit: cover; object-position: top center; }
#section-hero.hero-launch-ui { min-height: auto; padding-bottom: 0; }
#section-hero .hero-dashboard-wrap { margin-bottom: 0; }
@keyframes launch-dashboard-in { from { opacity: 0; transform: perspective(1200px) rotateX(8deg) translateY(45px); } to { opacity: 1; transform: perspective(1200px) rotateX(0) translateY(0); } }
@media (max-width: 767.98px) {
    #section-hero.hero-launch-ui { min-height: auto; padding-top: 125px; }
    #section-hero .hero-dashboard-wrap { margin-top: 38px; }
    #section-hero .hero-dashboard-window { aspect-ratio: 1.1 / 1; }
}
@media (max-width: 480px) {
    #section-hero .hero-launch-title { font-size: clamp(2.35rem, 10vw, 3.2rem); }
}
@media (prefers-reduced-motion: reduce) {
    #section-hero .hero-dashboard-wrap { animation: none; }
}

/* Give the About image a larger, dimensional presence on desktop. */
#section-about .about-content { perspective: 1400px; }
#section-about .about-visual {
    min-width: 0;
    transform-style: preserve-3d;
    perspective: 1100px;
}
#section-about .about-image-frame {
    position: relative;
    min-height: 520px;
    overflow: visible;
    transform: rotateY(-8deg) rotateX(3deg) translateZ(0);
    transform-style: preserve-3d;
    box-shadow: 20px 28px 55px rgba(0, 0, 0, .3);
    transition: transform .65s cubic-bezier(.2, .75, .25, 1), box-shadow .65s ease;
    animation: about-image-float 7s ease-in-out infinite;
}
#section-about .about-image-frame::before {
    display: none;
}
#section-about .about-image-frame img {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 520px;
    object-fit: cover;
    transform: translateZ(28px);
    backface-visibility: hidden;
}
@keyframes about-image-float {
    0%, 100% { transform: rotateY(-8deg) rotateX(3deg) translateY(0); }
    50% { transform: rotateY(-5deg) rotateX(1deg) translateY(-10px); }
}
@media (max-width: 991.98px) {
    #section-about .about-image-frame,
    #section-about .about-image-frame img { min-height: 390px; }
}
@media (max-width: 767.98px) {
    #section-about .about-image-frame,
    #section-about .about-image-frame img { min-height: 300px; }
    #section-about .about-image-frame { transform: none; animation: none; }
}
@media (prefers-reduced-motion: reduce) {
    #section-about .about-image-frame { animation: none; transition: none; }
}

/* Clean orange glow, tuned to the active site theme. */
#section-hero.hero-launch-ui {
    isolation: isolate;
    overflow: hidden;
    background-color: #05070c !important;
    background-image:
        radial-gradient(ellipse 72% 54% at 50% 78%, rgba(245, 83, 28, .20), transparent 100%),
        radial-gradient(ellipse 56% 46% at 50% 38%, rgba(190, 67, 36, .09), transparent 100%);
}
#section-hero.hero-launch-ui::before,
#section-hero.hero-launch-ui::after {
    position: absolute;
    z-index: 0;
    inset: 0;
    content: "";
    pointer-events: none;
}
#section-hero.hero-launch-ui::before {
    background-image: linear-gradient(rgba(246, 238, 231, .045) 1px, transparent 1px), linear-gradient(90deg, rgba(246, 238, 231, .045) 1px, transparent 1px);
    background-size: 72px 72px;
    -webkit-mask-image: linear-gradient(to bottom, rgba(0,0,0,.12), #000 16%, #000 72%, transparent 100%);
    mask-image: linear-gradient(to bottom, rgba(0,0,0,.12), #000 16%, #000 72%, transparent 100%);
}
#section-hero.hero-launch-ui::after {
    inset: auto 0 0;
    height: 60%;
    background: radial-gradient(ellipse 62% 82% at 50% 100%, rgba(240, 89, 38, .16), transparent 100%);
    animation: hero-ambient-breathe 12s ease-in-out infinite alternate;
}
#section-hero .hero-launch-glow,
#section-hero .hero-project-pattern,
#section-hero .hero-launch-frame { display: none !important; }
#section-hero .hero-energy-lines {
    position: absolute;
    z-index: 1;
    inset: 0;
    width: 100%;
    height: 78%;
    overflow: visible;
    pointer-events: none;
    opacity: .82;
    -webkit-mask-image: linear-gradient(to bottom, transparent 0%, #000 13%, #000 72%, transparent 100%);
    mask-image: linear-gradient(to bottom, transparent 0%, #000 13%, #000 72%, transparent 100%);
}
#section-hero .hero-energy-line-tracks { opacity: .5; }
#section-hero .hero-energy-line-pulses path {
    stroke-dasharray: 2 155;
    stroke-dashoffset: 0;
    filter: drop-shadow(0 0 4px rgba(251, 146, 60, .9));
    animation: hero-line-rise 8s linear infinite;
}
#section-hero .hero-energy-line-pulses path:nth-child(2) { animation-delay: -2s; }
#section-hero .hero-energy-line-pulses path:nth-child(3) { animation-delay: -4s; }
#section-hero .hero-energy-line-pulses path:nth-child(4) { animation-delay: -6s; }
#section-hero .hero-launch-copy,
#section-hero .hero-dashboard-wrap { z-index: 2; }
#section-hero .hero-launch-title { color: #f7f5f2 !important; }
#section-hero .hero-launch-subtitle { color: #bcb5af !important; }
#section-hero .hero-launch-badge {
    border-color: rgba(255,255,255,.18);
    background: rgba(20,18,17,.76);
    color: #ddd6d0;
    backdrop-filter: blur(12px);
}
#section-hero .hero-launch-badge a { background: #f4eee8; color: #201914; }
#section-hero .hero-launch-button {
    position: relative;
    isolation: isolate;
    min-height: 44px;
    padding: .72rem 1.2rem;
    overflow: hidden;
    border-radius: 9px;
    font-size: .78rem;
    font-weight: 650;
    transition: transform .24s cubic-bezier(.2,.8,.2,1), color .24s ease, background-color .24s ease, border-color .24s ease, box-shadow .24s ease;
}
#section-hero .hero-launch-button::before {
    position: absolute;
    z-index: -1;
    inset: 0;
    content: "";
    background: linear-gradient(110deg, transparent 20%, rgba(255,255,255,.34) 48%, transparent 76%);
    transform: translateX(-130%);
    transition: transform .55s ease;
}
#section-hero .hero-launch-button:hover::before { transform: translateX(130%); }
#section-hero .hero-launch-button:focus-visible { outline: 3px solid rgba(251,146,60,.55); outline-offset: 3px; }
#section-hero .hero-launch-button-primary {
    border: 1px solid #ff9a5c;
    background: linear-gradient(135deg, #ff8b45, #e95b20);
    color: #fffaf6;
    box-shadow: 0 5px 18px rgba(226, 87, 27, .23), 0 1px 0 rgba(255,255,255,.24) inset;
}
#section-hero .hero-launch-button-primary:hover {
    transform: translateY(-3px);
    border-color: #ffc08d;
    background: linear-gradient(135deg, #ffa463, #f36a2d);
    color: #fff;
    box-shadow: 0 10px 28px rgba(226, 87, 27, .38), 0 0 0 1px rgba(255,173,112,.2);
}
#section-hero .hero-launch-button-secondary {
    border: 1px solid rgba(255,255,255,.2);
    background: rgba(255,255,255,.055);
    color: #f5f1ed;
    backdrop-filter: blur(10px);
}
#section-hero .hero-launch-button-secondary:hover {
    transform: translateY(-3px);
    border-color: rgba(255,157,94,.65);
    background: rgba(236,111,51,.14);
    color: #ffd0af;
    box-shadow: 0 9px 25px rgba(0,0,0,.2), 0 0 22px rgba(235,112,52,.13);
}
#section-hero .hero-launch-button:active { transform: translateY(-1px) scale(.98); }
#section-hero .hero-dashboard-wrap {
    border-color: rgba(239, 92, 102, .32);
    background: linear-gradient(155deg, rgba(255,255,255,.085), rgba(255,255,255,.018));
    backdrop-filter: blur(18px) saturate(125%);
    box-shadow: 0 -32px 110px rgba(222, 83, 40, .18), 0 -10px 76px rgba(161, 70, 39, .08), 0 0 0 1px rgba(255,255,255,.035) inset;
}
#section-hero .hero-dashboard-window {
    border-color: rgba(239, 215, 222, .17);
    box-shadow: 0 24px 64px rgba(0,0,0,.36), 0 0 32px rgba(132, 67, 123, .08);
}

body.light-mode #section-hero.hero-launch-ui {
    background-color: #fcfaf8 !important;
    background-image:
        radial-gradient(ellipse 68% 48% at 50% 82%, rgba(245, 126, 68, .23), transparent 100%),
        radial-gradient(ellipse 48% 36% at 52% 72%, rgba(240, 203, 183, .2), transparent 100%);
    color: #211b17 !important;
}
body.light-mode #section-hero.hero-launch-ui::before {
    background-image: linear-gradient(rgba(67, 48, 37, .06) 1px, transparent 1px), linear-gradient(90deg, rgba(67, 48, 37, .06) 1px, transparent 1px);
}
body.light-mode #section-hero .hero-launch-title { color: #211b17 !important; }
body.light-mode #section-hero .hero-launch-subtitle { color: #71665e !important; }
body.light-mode #section-hero .hero-launch-badge {
    border-color: rgba(83,57,39,.16);
    background: rgba(255,255,255,.78);
    color: #65584f;
}
body.light-mode #section-hero .hero-launch-badge a { background: #ed6b2d; color: #fff; }
body.light-mode #section-hero .hero-launch-button-primary { border-color: #ed6b2d; background: linear-gradient(135deg, #f47d3d, #df561d); color: #fff; box-shadow: 0 5px 17px rgba(213, 92, 36, .2), 0 1px 0 rgba(255,255,255,.28) inset; }
body.light-mode #section-hero .hero-launch-button-primary:hover { border-color: #f28a50; background: linear-gradient(135deg, #fa9254, #e9682c); color: #fff; box-shadow: 0 10px 26px rgba(213, 92, 36, .3); }
body.light-mode #section-hero .hero-launch-button-secondary { border-color: rgba(83,57,39,.2); background: rgba(255,255,255,.72); color: #302720; }
body.light-mode #section-hero .hero-launch-button-secondary:hover { border-color: rgba(224,101,43,.48); background: rgba(255,255,255,.94); color: #c9501d; box-shadow: 0 9px 24px rgba(109,67,39,.12), 0 0 0 3px rgba(235,121,63,.08); }
body.light-mode #section-hero .hero-dashboard-wrap {
    border-color: rgba(193, 73, 84, .31);
    background: linear-gradient(155deg, rgba(255,255,255,.66), rgba(255,255,255,.25));
    box-shadow: 0 -28px 95px rgba(208, 91, 47, .14), 0 -10px 72px rgba(222, 133, 87, .08), 0 0 0 1px rgba(92,52,25,.08) inset;
}

@keyframes hero-line-rise {
    to { stroke-dashoffset: -470; }
}
@keyframes hero-ambient-breathe {
    from { opacity: .64; transform: scale(1); }
    to { opacity: 1; transform: scale(1.045); }
}
@media (max-width: 767.98px) {
    #section-hero .hero-energy-lines { height: 66%; opacity: .65; }
}
@media (prefers-reduced-motion: reduce) {
    #section-hero.hero-launch-ui::after { animation: none; }
    #section-hero .hero-launch-button,
    #section-hero .hero-launch-button::before { transition: none; }
    #section-hero .hero-energy-line-pulses path { animation: none; }
}

/* Keep the hero media clean and let the animated lines read in both themes. */
#section-hero .hero-dashboard-wrap {
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
}
#section-hero .hero-dashboard-window {
    border: 0 !important;
    border-radius: 18px 18px 0 0 !important;
    overflow: hidden;
    box-shadow: none !important;
    background: transparent;
}
#section-hero .hero-dashboard-video { border: 0; outline: 0; }
#section-hero .hero-dashboard-wrap {
    position: relative;
    isolation: isolate;
}
#section-hero .hero-dashboard-wrap::before { content: none !important; }
#section-hero .hero-dashboard-wrap::before {
    position: absolute;
    z-index: -1;
    inset: 8% 7% -10%;
    border-radius: 50%;
    background: radial-gradient(ellipse at center, rgba(255, 91, 31, .23), rgba(202, 65, 27, .1) 42%, transparent 72%);
    filter: blur(48px);
    content: "";
    pointer-events: none;
}
#section-hero.hero-launch-ui::after {
    inset: 0;
    height: 100%;
    background:
        radial-gradient(ellipse 64% 47% at 50% 4%, rgba(255, 112, 52, .18), transparent 100%),
        radial-gradient(ellipse 76% 68% at 50% 76%, rgba(255, 91, 31, .24), rgba(205, 69, 35, .09) 58%, transparent 100%);
}
body.light-mode #section-hero.hero-launch-ui::after {
    background:
        radial-gradient(ellipse 64% 47% at 50% 4%, rgba(220, 83, 29, .14), transparent 100%),
        radial-gradient(ellipse 76% 68% at 50% 76%, rgba(225, 79, 25, .19), rgba(220, 112, 67, .07) 58%, transparent 100%);
}
body.light-mode #section-hero .hero-dashboard-wrap::before {
    background: radial-gradient(ellipse at center, rgba(220, 83, 29, .18), rgba(224, 130, 85, .07) 42%, transparent 72%);
}
#section-hero .hero-energy-lines { opacity: .76; }
#section-hero .hero-energy-line-tracks { opacity: .52; }
#section-hero .hero-energy-line-pulses path {
    stroke: #9c4b28;
    stroke-width: 2;
    opacity: .62;
    filter: drop-shadow(0 0 3px rgba(130, 58, 28, .38));
}
body.light-mode #section-hero .hero-energy-line-tracks { opacity: .58; }
body.light-mode #section-hero .hero-energy-line-pulses path {
    stroke: #76391f;
    opacity: .55;
    filter: drop-shadow(0 0 2px rgba(105, 48, 24, .3));
}
@media (max-width: 767.98px) {
    #section-hero .hero-energy-lines { opacity: .72; }
}

/* Let a muted orange glow rise from behind the media into the hero. */
#section-hero.hero-launch-ui::after {
    inset: 0;
    height: 100%;
    background: radial-gradient(ellipse 95% 138% at 50% 100%, rgba(218, 89, 43, .34) 0%, rgba(178, 66, 34, .21) 34%, rgba(135, 55, 31, .1) 64%, transparent 100%) !important;
    animation: hero-ambient-breathe 10s ease-in-out infinite alternate;
}
body.light-mode #section-hero.hero-launch-ui::after {
    background: radial-gradient(ellipse 95% 138% at 50% 100%, rgba(215, 86, 38, .27) 0%, rgba(181, 72, 39, .16) 34%, rgba(151, 66, 38, .075) 64%, transparent 100%) !important;
}
#section-hero .hero-energy-lines {
    inset: 0;
    width: 100%;
    height: 100%;
    opacity: .88;
    mask-image: linear-gradient(to bottom, transparent 0%, #000 9%, #000 82%, transparent 100%);
}
#section-hero .hero-energy-line-tracks { opacity: .32; }
#section-hero .hero-energy-line-pulses path {
    stroke: #f17a3b;
    stroke-width: 1.45;
    stroke-dasharray: 6 142;
    opacity: .98;
    filter: drop-shadow(0 0 5px rgba(241, 122, 59, .82));
    animation: hero-line-rise 15s ease-in-out infinite;
}
#section-hero .hero-energy-line-pulses path:nth-child(2) { animation-delay: -3.75s; }
#section-hero .hero-energy-line-pulses path:nth-child(3) { animation-delay: -7.5s; }
#section-hero .hero-energy-line-pulses path:nth-child(4) { animation-delay: -11.25s; }
body.light-mode #section-hero .hero-energy-line-pulses path {
    stroke: #d85a25;
    opacity: .98;
    filter: drop-shadow(0 0 4px rgba(216, 90, 37, .68));
}
@keyframes hero-line-rise {
    0% { stroke-dashoffset: 0; opacity: .4; }
    18% { opacity: .95; }
    82% { opacity: .95; }
    100% { stroke-dashoffset: -820; opacity: .4; }
}
@media (max-width: 767.98px) {
    #section-hero .hero-energy-lines { opacity: .78; }
}
@media (prefers-reduced-motion: reduce) {
    #section-hero.hero-launch-ui::after { animation: none; }
    #section-hero .hero-energy-line-pulses path { animation: none; }
}