
html, body { margin: 0 !important; padding: 0 !important; }
body.tanager-landing-active { overflow-x: hidden; background: #fff; }
body.tanager-landing-active #wpadminbar { z-index: 99999; }
.tlp-hero-visual-placeholder {
    min-height: 390px;
    border: 0 !important;
    border-radius: 18px;
    background:
      radial-gradient(circle at 68% 34%, rgba(40,111,197,.12), transparent 30%),
      radial-gradient(circle at 38% 67%, rgba(40,111,197,.08), transparent 24%),
      linear-gradient(135deg,#f8fbff,#eef5fc);
    box-shadow: inset 0 0 0 1px rgba(111,145,184,.18);
}
.tlp-hero-visual-placeholder::before {
    content: "";
    position: absolute;
    inset: 15% 10%;
    background-image:
      linear-gradient(rgba(39,100,168,.10) 1px, transparent 1px),
      linear-gradient(90deg, rgba(39,100,168,.10) 1px, transparent 1px);
    background-size: 28px 28px;
    mask-image: linear-gradient(135deg, transparent, black 30%, black 70%, transparent);
}
.tlp-result-placeholder {
    position: relative;
    width: 100%; height: 125px; border-radius: 6px; overflow: hidden;
    background: linear-gradient(135deg,#f7faff,#edf3f9);
    box-shadow: inset 0 0 0 1px rgba(118,143,170,.16);
}
.tlp-result-placeholder::before {
    content: ""; position:absolute; inset:18%;
    background-image:
      linear-gradient(rgba(69,110,158,.10) 1px, transparent 1px),
      linear-gradient(90deg, rgba(69,110,158,.10) 1px, transparent 1px);
    background-size:18px 18px;
}
/* Tanager landing page v1.1: isolate Lightning and use true full width */
body.tanager-landing-active .siteHeader,
body.tanager-landing-active header.siteHeader,
body.tanager-landing-active .page-header,
body.tanager-landing-active .page-header-inner,
body.tanager-landing-active .entry-header,
body.tanager-landing-active .vk_post_title,
body.tanager-landing-active .breadcrumb,
body.tanager-landing-active .siteFooter,
body.tanager-landing-active footer.siteFooter,
body.tanager-landing-active footer.site-footer,
body.tanager-landing-active #vk-mobile-nav-menu-btn,
body.tanager-landing-active .vk-mobile-nav-menu-btn,
body.tanager-landing-active .siteContent_before,
body.tanager-landing-active .siteContent_after { display:none !important; }

body.tanager-landing-active,
body.tanager-landing-active #page,
body.tanager-landing-active .site,
body.tanager-landing-active .siteContent,
body.tanager-landing-active .siteContent > .container,
body.tanager-landing-active .siteContent .container,
body.tanager-landing-active .mainSection,
body.tanager-landing-active .entry-body,
body.tanager-landing-active article,
body.tanager-landing-active main {
    width:100% !important; max-width:none !important;
    margin-left:0 !important; margin-right:0 !important;
    padding-left:0 !important; padding-right:0 !important;
}
body.tanager-landing-active .siteContent { padding-top:0 !important; padding-bottom:0 !important; }
.tanager-landing-page { width:100% !important; max-width:none !important; margin:0 !important; }

.tlp-hero-photo-wrap { position:relative; min-height:455px; display:flex; align-items:center; justify-content:center; }
.tlp-hero-photo { width:100%; height:390px; display:block; object-fit:cover; object-position:center; border-radius:16px; box-shadow:0 28px 55px rgba(8,26,52,.20); }
.tlp-hero-photo-accent { position:absolute; inset:55px -28px 20px 40px; z-index:-1; border-radius:18px; background:linear-gradient(135deg,rgba(9,101,213,.11),rgba(9,101,213,.02)); }
.tlp-hero-visual-placeholder { min-height:390px; display:grid; place-items:center; border:1px dashed #b7c8da; border-radius:16px; background:linear-gradient(135deg,#f7fbff,#eaf4ff); }
.tlp-visual-placeholder-copy { display:flex; flex-direction:column; gap:6px; color:#51657e; text-align:center; }
.tlp-result-image { width:100%; height:125px; display:block; object-fit:cover; border-radius:6px; }
.tlp-result-placeholder { width:100%; height:125px; border-radius:6px; background:linear-gradient(135deg,rgba(9,101,213,.08),rgba(9,101,213,.015)),repeating-linear-gradient(45deg,#f1f6fb 0 12px,#e7eff7 12px 24px); }
.tlp-footer { padding:28px 0; color:#718096; background:#fff; border-top:1px solid #e4ebf2; font-size:13px; }
@media (max-width:900px){ .tlp-hero-photo-wrap{min-height:auto}.tlp-hero-photo{height:330px} }
@media (max-width:650px){ .tlp-hero-photo{height:250px} }


:root {
    --tlp-navy: #081a34;
    --tlp-blue: #0965d5;
    --tlp-blue-dark: #034aa5;
    --tlp-light-blue: #edf6ff;
    --tlp-text: #263650;
    --tlp-muted: #607089;
    --tlp-border: #dfe7f1;
    --tlp-white: #ffffff;
}

.tanager-landing-page,
.tanager-landing-page * {
    box-sizing: border-box;
}

.tanager-landing-page {
    width: 100%;
    max-width: none;
    margin: 0;
    overflow: hidden;
    background: #fff;
    color: var(--tlp-text);
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans JP",
                 "Hiragino Kaku Gothic ProN", "Yu Gothic", Meiryo, sans-serif;
    line-height: 1.75;
}

.tanager-landing-page svg {
    display: block;
}

.tlp-container {
    width: min(1240px, calc(100% - 48px));
    margin: 0 auto;
}

.tlp-header {
    position: relative;
    top: 0;
    z-index: 1000;
    background: rgba(255,255,255,.96);
    border-bottom: 1px solid rgba(192,204,220,.8);
    box-shadow: 0 5px 20px rgba(8,26,52,.045);
    backdrop-filter: blur(14px);
}

.tlp-header-inner {
    min-height: 78px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.tlp-brand {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: var(--tlp-navy) !important;
    text-decoration: none !important;
    font-size: 29px;
    font-weight: 800;
    letter-spacing: .02em;
}

.tlp-bird {
    width: 48px;
    color: var(--tlp-blue);
}

.tlp-bird svg {
    width: 100%;
    fill: currentColor;
}

.tlp-nav {
    display: flex;
    align-items: stretch;
    gap: 38px;
    min-height: 78px;
}

.tlp-nav a {
    position: relative;
    display: flex;
    align-items: center;
    color: var(--tlp-navy) !important;
    text-decoration: none !important;
    font-size: 15px;
    font-weight: 700;
    white-space: nowrap;
}

.tlp-nav a::after {
    content: "";
    position: absolute;
    left: 50%;
    right: 50%;
    bottom: 0;
    height: 3px;
    background: var(--tlp-blue);
    transition: left .2s ease, right .2s ease;
}

.tlp-nav a:hover::after,
.tlp-nav a.active::after {
    left: 0;
    right: 0;
}

.tlp-language {
    gap: 6px;
}

.tlp-menu-toggle {
    display: none;
    width: 44px;
    height: 44px;
    padding: 10px;
    border: 0;
    border-radius: 8px;
    background: transparent;
}

.tlp-menu-toggle span:not(.screen-reader-text) {
    display: block;
    height: 2px;
    margin: 5px 0;
    background: var(--tlp-navy);
}

.tlp-hero {
    position: relative;
    padding: 64px 0 0;
    background:
        radial-gradient(circle at 74% 37%, rgba(170,217,255,.28), transparent 28%),
        linear-gradient(120deg, #fff 0%, #fff 54%, #f1f8ff 100%);
}

.tlp-hero::after {
    content: "";
    position: absolute;
    top: 0;
    right: -80px;
    width: 520px;
    height: 520px;
    opacity: .23;
    background-image: repeating-radial-gradient(ellipse at center, transparent 0 12px, rgba(9,101,213,.22) 13px 14px);
    transform: rotate(-20deg);
    pointer-events: none;
}

.tlp-hero-grid {
    min-height: 470px;
    display: grid;
    grid-template-columns: 1.05fr .95fr;
    align-items: center;
    gap: 40px;
}

.tlp-hero-copy {
    position: relative;
    z-index: 3;
    padding-bottom: 55px;
}

.tlp-eyebrow {
    margin: 0 0 12px;
    color: var(--tlp-blue);
    font-size: 14px;
    font-weight: 800;
    letter-spacing: .03em;
}

.tlp-hero h1 {
    margin: 0;
    color: var(--tlp-navy);
    font-size: clamp(38px, 4vw, 62px);
    line-height: 1.28;
    letter-spacing: -.035em;
    font-weight: 800;
}

.tlp-lead {
    max-width: 690px;
    margin: 24px 0 0;
    color: #3a4960;
    font-size: 17px;
    line-height: 2;
}

.tlp-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    margin-top: 28px;
}

.tlp-button {
    min-height: 54px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 24px;
    padding: 12px 26px;
    border-radius: 5px;
    text-decoration: none !important;
    font-size: 15px;
    font-weight: 750;
    transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}

.tlp-button svg,
.tlp-text-link svg {
    width: 19px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
}

.tlp-button:hover {
    transform: translateY(-2px);
}

.tlp-button-primary {
    min-width: 255px;
    color: #fff !important;
    background: linear-gradient(135deg, #0b70e6, #0459bf);
    box-shadow: 0 13px 28px rgba(9,101,213,.22);
}

.tlp-button-primary:hover {
    background: linear-gradient(135deg, #095fc5, #03479a);
}

.tlp-button-secondary {
    min-width: 255px;
    color: var(--tlp-blue) !important;
    border: 2px solid var(--tlp-blue);
    background: rgba(255,255,255,.84);
}

.tlp-hero-visual {
    position: relative;
    z-index: 2;
    min-height: 455px;
    perspective: 1200px;
}

.tlp-grid-lines {
    position: absolute;
    inset: 20px -150px 0 80px;
    opacity: .22;
    background-image:
        linear-gradient(rgba(9,101,213,.15) 1px, transparent 1px),
        linear-gradient(90deg, rgba(9,101,213,.15) 1px, transparent 1px);
    background-size: 25px 25px;
    transform: skewY(-8deg);
    mask-image: linear-gradient(to left, black, transparent);
}

.tlp-laptop {
    position: absolute;
    top: 24px;
    right: 18px;
    width: 390px;
    transform: rotateY(-8deg) rotateX(3deg) rotateZ(5deg);
    filter: drop-shadow(0 28px 25px rgba(5,22,48,.24));
}

.tlp-screen {
    position: relative;
    height: 250px;
    overflow: hidden;
    border: 11px solid #172231;
    border-bottom-width: 16px;
    border-radius: 13px 13px 5px 5px;
    background:
        linear-gradient(rgba(29,55,86,.35) 1px, transparent 1px),
        linear-gradient(90deg, rgba(29,55,86,.35) 1px, transparent 1px),
        #07111f;
    background-size: 24px 24px;
}

.tlp-appbar {
    position: absolute;
    inset: 0 0 auto;
    height: 25px;
    background: #111d2c;
}

.tlp-field-map {
    position: absolute;
    left: 60px;
    top: 62px;
    width: 245px;
    height: 145px;
    border: 1px solid rgba(121,181,255,.38);
    transform: perspective(600px) rotateX(58deg) rotateZ(-7deg);
    background:
        radial-gradient(circle at 55% 48%, #ff3122 0 8%, #ffb000 18%, #37dbef 34%, #233ef2 53%, transparent 63%),
        linear-gradient(135deg, rgba(255,193,0,.2), rgba(0,127,255,.16));
    box-shadow: inset 0 0 25px rgba(41,161,255,.25);
}

.tlp-field-map span {
    position: absolute;
    border: 1px solid rgba(255,196,0,.45);
}

.tlp-field-map span:nth-child(1){inset:12px}
.tlp-field-map span:nth-child(2){inset:28px}
.tlp-field-map span:nth-child(3){left:50%;top:0;bottom:0}
.tlp-field-map span:nth-child(4){top:50%;left:0;right:0}
.tlp-field-map span:nth-child(5){left:18%;top:13%;right:16%;bottom:18%;border-radius:50%}

.tlp-colorbar {
    position: absolute;
    right: 20px;
    top: 50px;
    width: 11px;
    height: 150px;
    background: linear-gradient(#ff3020,#ffc400,#53df65,#21b7e5,#1829e8);
}

.tlp-keyboard {
    width: 440px;
    height: 28px;
    margin-left: -24px;
    border-radius: 2px 2px 18px 18px;
    background: linear-gradient(#c4ccd5,#6f7d8d);
    transform: perspective(400px) rotateX(63deg);
    transform-origin: top;
}

.tlp-board {
    position: absolute;
    right: -25px;
    bottom: 20px;
    width: 425px;
    height: 155px;
    border: 3px solid #74869b;
    border-radius: 2px;
    background:
        linear-gradient(125deg, transparent 45%, rgba(227,168,32,.9) 46% 47%, transparent 48%),
        linear-gradient(35deg, transparent 54%, rgba(227,168,32,.85) 55% 56%, transparent 57%),
        #1a4d55;
    transform: rotateX(65deg) rotateZ(-3deg);
    box-shadow: 0 27px 22px rgba(6,25,50,.23), inset 0 0 0 8px #2e6c71;
}

.tlp-chip {
    position: absolute;
    display: block;
    background: #18222d;
    box-shadow: 0 5px 0 #0c1117;
}

.tlp-chip-1 { width: 90px;height:50px;right:70px;top:48px }
.tlp-chip-2 { width: 54px;height:35px;left:75px;top:42px }
.tlp-chip-3 { width: 38px;height:28px;left:180px;bottom:24px }

.tlp-trace {
    position: absolute;
    display: block;
    height: 3px;
    background: #d8aa36;
    transform-origin: left;
}
.tlp-trace-1 { width:160px;left:24px;top:25px;transform:rotate(17deg)}
.tlp-trace-2 { width:190px;left:30px;bottom:34px;transform:rotate(-12deg)}
.tlp-trace-3 { width:120px;right:18px;top:35px;transform:rotate(-25deg)}
.tlp-trace-4 { width:130px;left:128px;top:90px;transform:rotate(28deg)}
.tlp-trace-5 { width:105px;left:18px;top:88px;transform:rotate(-31deg)}

.tlp-radiation {
    position: absolute;
    z-index: 5;
    left: -20px;
    top: 125px;
    width: 180px;
    height: 180px;
}

.tlp-radiation-core,
.tlp-mini-core {
    position: absolute;
    left: 50%;
    top: 50%;
    border-radius: 46% 54% 52% 48%;
    transform: translate(-50%,-50%);
    background: radial-gradient(circle at 35% 25%, #ffd737 0 12%, #ff931e 27%, #ef3829 45%, #4fd1bf 69%, #2a6fe3 100%);
    box-shadow: 0 0 25px rgba(255,121,23,.35);
}

.tlp-radiation-core {
    width: 115px;
    height: 108px;
}

.tlp-orbit,
.tlp-mini-orbit {
    position: absolute;
    left: 50%;
    top: 50%;
    border-radius: 50%;
    transform: translate(-50%,-50%);
}

.tlp-orbit-x {
    width: 170px;height:80px;border:2px solid #204dff;transform:translate(-50%,-50%) rotate(5deg)
}
.tlp-orbit-y {
    width: 165px;height:75px;border:2px solid #21a93e;transform:translate(-50%,-50%) rotate(63deg)
}
.tlp-orbit-z {
    width: 160px;height:72px;border:2px solid #ed3030;transform:translate(-50%,-50%) rotate(118deg)
}

.tlp-axis {
    position: absolute;
    font-size: 13px;
    font-weight: 800;
}
.tlp-axis-x { color:#173eff;left:-2px;bottom:17px }
.tlp-axis-y { color:#15942f;left:-8px;top:43px }
.tlp-axis-z { color:#e92f2f;left:88px;top:-10px }

.tlp-benefit-panel {
    position: relative;
    z-index: 7;
    display: grid;
    grid-template-columns: repeat(4,1fr);
    padding: 26px 22px;
    border: 1px solid rgba(217,227,239,.95);
    border-radius: 16px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 16px 45px rgba(12,39,78,.09);
    transform: translateY(28px);
}

.tlp-benefit {
    display: grid;
    grid-template-columns: 54px 1fr;
    gap: 16px;
    align-items: start;
    padding: 8px 26px;
}

.tlp-benefit + .tlp-benefit {
    border-left: 1px solid var(--tlp-border);
}

.tlp-benefit-icon {
    width: 52px;
    height: 52px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    color: var(--tlp-blue);
}

.tlp-benefit-icon svg {
    width: 43px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.9;
}

.tlp-benefit h3 {
    margin: 0 0 4px;
    color: var(--tlp-navy);
    font-size: 16px;
    line-height: 1.5;
}

.tlp-benefit p {
    margin: 0;
    color: var(--tlp-muted);
    font-size: 12.5px;
    line-height: 1.65;
}

.tlp-product-section {
    padding: 115px 0 45px;
    background: linear-gradient(180deg,#f1f8ff,#fff);
}

.tlp-product-grid {
    display: grid;
    grid-template-columns: .92fr 1.08fr;
    gap: 70px;
    align-items: center;
}

.tlp-product-copy h2,
.tlp-section-heading h2,
.tlp-final-cta h2 {
    margin: 0;
    color: var(--tlp-navy);
    font-size: clamp(34px,3.2vw,50px);
    line-height: 1.25;
    letter-spacing: -.025em;
}

.tlp-product-copy > p:not(.tlp-eyebrow) {
    margin: 20px 0 0;
    color: #45546b;
    font-size: 16px;
}

.tlp-feature-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0,1fr));
    gap: 18px 35px;
    margin: 28px 0;
}

.tlp-feature-list span {
    display: flex;
    align-items: center;
    gap: 12px;
    color: #253751;
    font-weight: 650;
}

.tlp-feature-list svg {
    flex: 0 0 22px;
    width: 22px;
    height: 22px;
    padding: 4px;
    border-radius: 50%;
    color: #fff;
    background: var(--tlp-blue);
    fill: none;
    stroke: currentColor;
    stroke-width: 3;
}

.tlp-text-link {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: var(--tlp-blue) !important;
    text-decoration: none !important;
    font-weight: 750;
}

.tlp-product-visual {
    display: grid;
    grid-template-columns: 1fr 1.15fr;
    grid-template-rows: 1fr 1fr;
    gap: 18px;
    padding: 28px;
    border: 1px solid #dfe9f4;
    border-radius: 11px;
    background: rgba(255,255,255,.92);
    box-shadow: 0 18px 45px rgba(8,39,78,.09);
}

.tlp-result-card {
    min-height: 165px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 8px;
    color: #24354e;
    font-size: 12px;
    font-weight: 650;
}

.tlp-heatmap {
    width: 100%;
    height: 88px;
    background:
        radial-gradient(circle at 76% 20%, #ff1800 0 4%, #ffb000 11%, #40da8d 20%, transparent 29%),
        radial-gradient(circle at 48% 75%, #ff2818 0 5%, #ffd000 12%, #33d2a5 22%, transparent 31%),
        radial-gradient(circle at 15% 18%, #ffb000 0 6%, #32ceae 16%, transparent 28%),
        linear-gradient(90deg,#0618a5,#009ae0,#0bccae,#ffc000,#eb2222);
    filter: saturate(1.15);
}

.tlp-chart-title {
    align-self: flex-start;
    color: var(--tlp-navy);
    font-size: 12px;
    font-weight: 750;
}

.tlp-chart-result svg {
    width: 100%;
    height: 110px;
}

.tlp-chart-result .grid {
    fill:none;stroke:#c8d4e1;stroke-width:1
}
.tlp-chart-result .curve {
    fill:none;stroke-width:2
}
.tlp-chart-result .curve-a {stroke:#1683cf}
.tlp-chart-result .curve-b {stroke:#2a9b65}
.tlp-chart-result .curve-c {stroke:#f07325}

.tlp-mini-pattern {
    position: relative;
    width: 115px;
    height: 115px;
}

.tlp-mini-core {
    width: 72px;
    height: 65px;
}

.tlp-mini-orbit.one {
    width:110px;height:42px;border:1.5px solid #1647dd;transform:translate(-50%,-50%) rotate(18deg)
}
.tlp-mini-orbit.two {
    width:105px;height:39px;border:1.5px solid #e83232;transform:translate(-50%,-50%) rotate(104deg)
}

.tlp-mini-board {
    position: relative;
    width: 150px;
    height: 90px;
    transform: rotateX(50deg) rotateZ(-12deg);
    background: #215d54;
    border: 2px solid #d9ae46;
    box-shadow: 0 12px 12px rgba(7,31,47,.18);
}
.tlp-mini-board::before,
.tlp-mini-board::after {
    content:"";position:absolute;background:#d9ae46;height:2px;width:100px;left:15px;top:25px;transform:rotate(18deg)
}
.tlp-mini-board::after {top:62px;transform:rotate(-14deg)}
.tlp-mini-board i {
    position:absolute;width:25px;height:18px;background:#1a222b
}
.tlp-mini-board i:nth-child(1){left:25px;top:18px}
.tlp-mini-board i:nth-child(2){right:24px;top:38px}
.tlp-mini-board i:nth-child(3){left:65px;bottom:12px}
.tlp-mini-board i:nth-child(4){right:10px;top:10px}

.tlp-credibility {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 22px;
    margin-top: 42px;
    padding: 17px 28px;
    border: 1px solid #dce7f3;
    border-radius: 5px;
    background: rgba(255,255,255,.78);
    color: #354760;
}

.tlp-credibility p {
    margin: 0;
}

.tlp-cap {
    color: var(--tlp-blue);
}

.tlp-cap svg {
    width: 30px;
    fill:none;
    stroke:currentColor;
    stroke-width:2;
}

.tlp-history {
    color: var(--tlp-blue);
    font-size: 14px;
}

.tlp-applications,
.tlp-examples {
    padding: 96px 0;
}

.tlp-applications {
    background: #fff;
}

.tlp-section-heading {
    max-width: 760px;
    margin-bottom: 38px;
}

.tlp-section-heading > p:last-child {
    margin: 14px 0 0;
    color: var(--tlp-muted);
}

.tlp-application-grid {
    display: grid;
    grid-template-columns: repeat(4,1fr);
    gap: 20px;
}

.tlp-application-grid article {
    position: relative;
    min-height: 260px;
    padding: 28px 24px;
    overflow: hidden;
    border: 1px solid var(--tlp-border);
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 12px 28px rgba(19,47,81,.055);
    transition: transform .2s ease, box-shadow .2s ease;
}

.tlp-application-grid article:hover {
    transform: translateY(-5px);
    box-shadow: 0 18px 38px rgba(19,47,81,.10);
}

.tlp-application-grid article > span {
    position: absolute;
    right: 22px;
    top: 14px;
    color: #e1ebf6;
    font-size: 48px;
    font-weight: 800;
}

.tlp-application-grid h3 {
    position: relative;
    margin: 50px 0 18px;
    color: var(--tlp-navy);
    font-size: 22px;
	line-height: 1.4;
	text-align: center;
}

.tlp-application-grid ul {
    position: relative;
    margin: 0 auto;
    padding-left: 18px;
    width: fit-content;
    max-width: 100%;
    color: var(--tlp-muted);
    text-align: left;
}

.tlp-application-grid li {
    margin: 6px 0;
    line-height: 1.5;
}

.tlp-examples {
    background: #f5f9fd;
}

.tlp-example-grid {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 24px;
}

.tlp-example-grid article {
    overflow: hidden;
    border: 1px solid #dfe7f0;
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 12px 30px rgba(14,42,78,.065);
}

.tlp-example-graphic {
    position: relative;
    height: 210px;
    overflow: hidden;
    background: #0a1830;
}

.tlp-example-pcb {
    background:
        radial-gradient(circle at 35% 45%,rgba(255,86,27,.9),transparent 10%),
        radial-gradient(circle at 58% 50%,rgba(255,204,0,.8),transparent 16%),
        linear-gradient(180deg,#042768,#036db5 44%,#01aaad 66%,#f4c322 85%,#e85626);
}
.tlp-example-pcb span {
    position:absolute;left:13%;right:13%;height:5px;background:#d1a849;box-shadow:0 8px 0 rgba(255,255,255,.2)
}
.tlp-example-pcb span:nth-child(1){top:30%}
.tlp-example-pcb span:nth-child(2){top:50%;left:24%;right:24%}
.tlp-example-pcb span:nth-child(3){top:70%}

.tlp-example-antenna {
    background: radial-gradient(circle at center,#f4f9ff,#dcecff);
}
.tlp-example-antenna::before,
.tlp-example-antenna::after {
    content:"";position:absolute;left:50%;top:50%;border-radius:50%;transform:translate(-50%,-50%)
}
.tlp-example-antenna::before {
    width:145px;height:125px;background:radial-gradient(circle at 35% 20%,#ffe12c,#f28e17 30%,#e02d28 50%,#22bcbe 75%,#245fe7)
}
.tlp-example-antenna::after {
    width:185px;height:80px;border:2px solid #1350df;transform:translate(-50%,-50%) rotate(26deg)
}
.tlp-example-antenna span:nth-child(1),
.tlp-example-antenna span:nth-child(2) {
    position:absolute;left:50%;top:50%;width:180px;height:75px;border:2px solid #e73535;border-radius:50%;transform:translate(-50%,-50%) rotate(94deg)
}
.tlp-example-antenna span:nth-child(2){border-color:#25a244;transform:translate(-50%,-50%) rotate(150deg)}

.tlp-example-emc {
    background:linear-gradient(145deg,#0b1e37,#102e4a);
}
.tlp-example-emc::before {
    content:"";position:absolute;left:14%;right:14%;top:25%;bottom:18%;border:2px solid #d0a337;background:#1d5b55;transform:perspective(300px) rotateX(50deg) rotateZ(-6deg);box-shadow:0 25px 25px rgba(0,0,0,.3)
}
.tlp-example-emc span {
    position:absolute;z-index:2;width:70px;height:38px;background:#101923;transform:skewY(-8deg)
}
.tlp-example-emc span:nth-child(1){left:28%;top:40%}
.tlp-example-emc span:nth-child(2){right:24%;top:48%;width:48px}
.tlp-example-emc span:nth-child(3){left:45%;bottom:23%;width:42px}

.tlp-example-body {
    padding: 25px 27px 28px;
}

.tlp-example-body p {
    margin: 0 0 6px;
    color: var(--tlp-blue);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .12em;
}

.tlp-example-body h3 {
    margin: 0 0 7px;
    color: var(--tlp-navy);
    font-size: 23px;
}

.tlp-example-body span {
    color: var(--tlp-muted);
    font-size: 14px;
}

.tlp-examples-link {
    display: flex;
    justify-content: flex-end;
    margin-top: 32px;
}

.tlp-final-cta {
    padding: 65px 0;
    color: #fff;
    background:
        radial-gradient(circle at 85% 30%,rgba(58,151,255,.45),transparent 35%),
        linear-gradient(135deg,#071a36,#064a9d);
}

.tlp-final-cta .tlp-container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 36px;
}

.tlp-final-cta .tlp-eyebrow {
    color: #93c7ff;
}

.tlp-final-cta h2 {
    color: #fff;
    font-size: clamp(30px,3vw,44px);
}

.tlp-button-light {
    min-width: 220px;
    color: var(--tlp-blue) !important;
    background: #fff;
}

@media (max-width: 1100px) {
    .tlp-nav {gap:20px}
    .tlp-laptop {right:-40px;width:350px}
    .tlp-board {right:-60px;width:380px}
    .tlp-radiation {left:-45px}
    .tlp-benefit {padding:8px 16px}
}

@media (max-width: 900px) {
    .tlp-container {width:min(100% - 34px,760px)}
    .tlp-menu-toggle {display:block}
    .tlp-nav {
        position:absolute;
        left:0;
        right:0;
        top:78px;
        display:none;
        min-height:0;
        padding:15px 22px 22px;
        flex-direction:column;
        gap:0;
        border-top:1px solid var(--tlp-border);
        background:#fff;
        box-shadow:0 18px 30px rgba(8,26,52,.12);
    }
    .tlp-nav.is-open {display:flex}
    .tlp-nav a {min-height:48px}
    .tlp-nav a::after {display:none}
    .tlp-hero {padding-top:52px}
    .tlp-hero-grid,
    .tlp-product-grid {grid-template-columns:1fr}
    .tlp-hero-copy {padding-bottom:0}
    .tlp-hero-visual {min-height:430px;margin-top:-10px}
    .tlp-benefit-panel {grid-template-columns:repeat(2,1fr)}
    .tlp-benefit + .tlp-benefit {border-left:0}
    .tlp-benefit:nth-child(even){border-left:1px solid var(--tlp-border)}
    .tlp-benefit:nth-child(n+3){border-top:1px solid var(--tlp-border);padding-top:22px}
    .tlp-product-grid {gap:45px}
    .tlp-application-grid {grid-template-columns:repeat(2,1fr)}
    .tlp-credibility {flex-wrap:wrap;text-align:center}
}

@media (max-width: 650px) {
    .tlp-container {width:min(100% - 28px,560px)}
    .tlp-header-inner {min-height:68px}
    .tlp-nav {top:68px}
    .tlp-brand {font-size:24px}
    .tlp-bird {width:41px}
    .tlp-hero h1 {font-size:37px}
    .tlp-lead {font-size:15px}
    .tlp-actions,
    .tlp-button {width:100%}
    .tlp-hero-visual {min-height:325px;transform:scale(.8);transform-origin:top center;margin-bottom:-60px}
    .tlp-laptop {right:-50px}
    .tlp-board {right:-75px}
    .tlp-radiation {left:-55px}
    .tlp-benefit-panel {grid-template-columns:1fr;padding:15px 20px}
    .tlp-benefit {grid-template-columns:45px 1fr;padding:18px 4px}
    .tlp-benefit:nth-child(even){border-left:0}
    .tlp-benefit:nth-child(n+2){border-top:1px solid var(--tlp-border)}
    .tlp-benefit-icon {width:42px;height:42px}
    .tlp-benefit-icon svg {width:36px}
    .tlp-product-section {padding-top:90px}
    .tlp-feature-list,
    .tlp-product-visual,
    .tlp-application-grid,
    .tlp-example-grid {grid-template-columns:1fr}
    .tlp-product-visual {grid-template-rows:auto}
    .tlp-result-card {min-height:145px}
    .tlp-applications,.tlp-examples {padding:72px 0}
    .tlp-application-grid article {min-height:220px}
    .tlp-final-cta .tlp-container {align-items:flex-start;flex-direction:column}
    .tlp-final-cta .tlp-button {width:auto}
}
