/* LingLink showcase UX correction — 2026-08-13. */

.ll-header {
    background: rgba(247, 251, 255, .96) !important;
    border-bottom-color: rgba(10, 57, 122, .14) !important;
    box-shadow: 0 12px 40px rgba(7, 37, 84, .08);
    color: #071b3e !important;
}

.ll-header .ll-logo img {
    filter: none !important;
}

.ll-nav--repaired .ll-nav-group--services .ll-nav-menu--mega {
    left: 50%;
    display: grid;
    grid-template-columns: repeat(2, minmax(230px, 1fr));
    width: min(940px, calc(100vw - 36px));
    padding: 14px;
    transform: translateX(-34%);
}

.ll-nav-menu--mega a {
    display: flex !important;
    justify-content: space-between;
    gap: 16px;
    border-radius: 10px;
}

.ll-nav-menu--mega .llx-nav-service-group {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto;
    align-content: start;
    padding: 14px 16px !important;
    border: 1px solid #d5e6f7;
    background: #f7fbff;
}

.llx-nav-service-group strong { color: #102f5b; font-size: 14px; line-height: 1.25; }
.llx-nav-service-group > small { color: #087dea; font-size: 14px; font-style: normal; }
.llx-nav-service-group em { display: flex; grid-column: 1 / -1; flex-wrap: wrap; gap: 5px 10px; margin-top: 9px; color: #58718e; font-size: 10px; font-style: normal; line-height: 1.35; }
.llx-nav-service-group em span { white-space: nowrap; }
.llx-nav-service-group em b { color: #147fdc; }

.ll-nav-menu--mega a small {
    color: #087dea;
    font-weight: 800;
}

.ll-nav-menu--mega .ll-nav-menu__all {
    grid-column: 1 / -1;
    background: #eaf4ff;
}

.llx-service-map { padding: clamp(66px, 8vw, 112px) 0; background: linear-gradient(145deg, #071b3e, #0b3267); color: #eaf5ff; }
.llx-service-map__heading { max-width: 850px; margin-bottom: 34px; }
.llx-service-map__heading h2 { margin: 10px 0 15px; color: #fff !important; font-size: clamp(34px, 4.5vw, 62px); line-height: 1.02; }
.llx-service-map__heading > p:last-child { color: #bdd6ee; font-size: 17px; }
.llx-service-map__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.llx-service-group { display: flex; min-height: 285px; flex-direction: column; padding: 24px; border: 1px solid #285784; border-radius: 22px; background: linear-gradient(150deg, #103b73, #0a264f); }
.llx-service-group header { display: grid; grid-template-columns: 52px 1fr; gap: 15px; align-items: center; }
.llx-service-group header > span { display: grid; width: 52px; height: 52px; place-items: center; border-radius: 15px; background: #137ee8; color: #fff; font-size: 18px; font-weight: 850; }
.llx-service-group h3 { margin: 0; color: #fff !important; font-size: 21px; line-height: 1.18; }
.llx-service-group__categories { display: flex; flex-wrap: wrap; gap: 8px; margin: 22px 0; }
.llx-service-group__categories button { display: flex; gap: 8px; align-items: center; min-height: 36px; padding: 7px 10px; border: 1px solid #3b6894; border-radius: 999px; background: #0c2e5b; color: #d9ebfa; font-size: 12px; }
.llx-service-group__categories button:hover, .llx-service-group__categories button:focus { border-color: #59cdf8; background: #124a86; color: #fff; }
.llx-service-group__categories small { color: #65d6ff; font-weight: 800; }
.llx-service-group__all { margin-top: auto; align-self: flex-start; border: 0; background: transparent; color: #69d8ff; font-weight: 800; }
.ll-service-directory__tools { position: sticky; z-index: 8; top: 84px; padding: 18px; border: 1px solid #d2e3f4; border-radius: 20px; background: rgba(244,249,255,.96); box-shadow: 0 16px 45px rgba(7,37,84,.1); backdrop-filter: blur(14px); }
.ll-service-filters { max-height: 176px; overflow: auto; }
.ll-service-filters button { text-align: left; }
.ll-service-directory__grid { align-items: stretch; }
.ll-service-item { border-radius: 18px !important; transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease; }
.ll-service-item:hover { transform: translateY(-3px); border-color: #77b9ec !important; box-shadow: 0 14px 30px rgba(12,71,139,.1); }

.llx-repaired body,
.llx-repaired .ll-main,
.llx-repaired .ll-page-hero,
.llx-repaired .ll-service-directory,
.llx-repaired .ll-about-page,
.llx-repaired .ll-service-page {
    color: #102b52;
}

.llx-repaired :where(.ll-page-hero, .ll-service-directory, .ll-about-page, .ll-service-page) :where(h1, h2, h3, h4, p, li) {
    text-shadow: none;
}

.llx-repaired :where(.ll-service-item, .ll-pillar-card, .ll-about-card, .ll-detail-card) {
    border-color: #c8def5 !important;
    background: #f4f9ff !important;
    color: #15345c !important;
}

.llx-repaired :where(.ll-service-item, .ll-pillar-card, .ll-about-card, .ll-detail-card) :where(h2, h3, h4, p, small) {
    color: inherit !important;
}

.llx-repaired [style*="#fff7e8"],
.llx-repaired [style*="#fdd79a"] {
    background: #eaf4ff !important;
}

.llx-repaired .ll-page-hero :where(h1, h2, p),
.llx-repaired :where(.ll-service-page, .ll-about-page) :where(.ll-dark, [class*="--dark"], [class*="hero"]) :where(h1, h2, h3, p) {
    color: #eff8ff !important;
}

.llx-repaired .ll-about-grid > div:first-child :where(h1, h2, h3, p),
.llx-repaired .ll-two-col > div:first-child :where(h1, h2, h3, p) {
    color: #eff8ff !important;
}

html.llx-repaired body .ll-section .ll-two-col > div:first-child h2 {
    color: #eff8ff !important;
}

.llx-repaired :where(.ll-form__notice, .ll-trust-chip) {
    border-color: #9bc8f4 !important;
    background: #e8f4ff !important;
    color: #104b86 !important;
}

@media (max-width: 430px) {
    .llx-repaired,
    .llx-repaired body,
    .llx-repaired .ll-site,
    .llx-repaired .ll-main {
        max-width: 100%;
        overflow-x: clip;
    }

    .llx-repaired .ll-language-switch {
        max-width: calc(100vw - 156px);
    }

    .llx-repaired :where(h1, h2, h3, p, a, button) {
        overflow-wrap: anywhere;
    }
}

.ll-header .ll-nav a,
html[data-ll-theme="dark"] .ll-header .ll-nav a {
    color: #233b5e !important;
}

.ll-header .ll-nav a:hover,
.ll-header .ll-nav a:focus,
.ll-header .ll-nav a[aria-current="page"] {
    color: #075fda !important;
}

.ll-header .ll-language-switch,
html[data-ll-theme="dark"] .ll-header .ll-language-switch {
    background: #eaf2fd !important;
    border-color: #cadcf2 !important;
}

.ll-header .ll-language-switch a,
html[data-ll-theme="dark"] .ll-header .ll-language-switch a {
    color: #49617e !important;
}

.ll-header .ll-language-switch a.is-active,
html[data-ll-theme="dark"] .ll-header .ll-language-switch a.is-active {
    background: #fff !important;
    box-shadow: 0 4px 14px rgba(9, 70, 151, .1) !important;
    color: #071b3e !important;
}

.ll-header .ll-nav-toggle,
html[data-ll-theme="dark"] .ll-header .ll-nav-toggle {
    background: #fff !important;
    border-color: #cadcf2 !important;
}

.ll-header .ll-nav-toggle span,
html[data-ll-theme="dark"] .ll-header .ll-nav-toggle span {
    background: #071b3e !important;
}

.ll-visual-project-card__preview img,
.ll-product-tile__media img {
    transition: transform .24s ease, object-position .24s ease !important;
    will-change: auto;
}

.ll-visual-project-card__preview.is-auto-panning img,
.ll-product-tile__media.is-auto-panning img {
    object-position: center var(--ll-preview-pan, 0%) !important;
    transform: none !important;
    will-change: object-position;
}

.ll-project-dialog__canvas {
    transform-origin: top left;
}

@media (max-width: 980px) {
    .ll-header .ll-nav {
        background: rgba(247, 251, 255, .99) !important;
        border-color: #cadcf2 !important;
        box-shadow: 0 24px 60px rgba(7, 37, 84, .18) !important;
    }

    .ll-header .ll-nav a,
    html[data-ll-theme="dark"] .ll-header .ll-nav a {
        color: #183254 !important;
    }

    .ll-nav--repaired .ll-nav-group--services .ll-nav-menu--mega {
        display: grid;
        grid-template-columns: 1fr;
        width: 100%;
        transform: none;
    }
    .llx-service-map__grid { grid-template-columns: 1fr; }
    .ll-service-directory__tools { position: static; }
}

@media (max-width: 620px) {
    .llx-service-group { min-height: 0; padding: 19px; }
    .llx-service-group header { grid-template-columns: 44px 1fr; }
    .llx-service-group header > span { width: 44px; height: 44px; font-size: 15px; }
    .llx-service-group h3 { font-size: 18px; }
    .llx-service-group__categories button { min-height: 44px; }
}

@media (prefers-reduced-motion: reduce) {
    .ll-visual-project-card__preview img,
    .ll-product-tile__media img {
        transition: none !important;
    }
}

/* Individual service proof experience — 299 stable routes. */
.llx-service-detail { background: #071b3e; color: #eaf5ff; }
.llx-service-hero { padding: clamp(72px, 8vw, 126px) 0; background: radial-gradient(circle at 82% 18%, rgba(23,151,255,.27), transparent 36%), linear-gradient(145deg, #06152f, #0a2a58); }
.llx-service-hero__grid { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(320px, .75fr); gap: clamp(44px, 7vw, 100px); align-items: center; }
.llx-service-hero h1 { max-width: 820px; margin: 16px 0 22px; color: #f3f9ff !important; font-size: clamp(42px, 6vw, 78px); line-height: .98; }
.llx-service-hero .ll-lede { max-width: 720px; color: #c7dcf5 !important; }
.llx-service-actions { display: flex; flex-wrap: wrap; gap: 20px; align-items: center; margin-top: 34px; }
.llx-text-link { color: #7bd6ff; font-weight: 780; }
.llx-proof-visual { min-height: 390px; display: flex; flex-direction: column; justify-content: space-between; padding: 34px; border: 1px solid rgba(115,210,255,.34); border-radius: 30px; background: linear-gradient(150deg, rgba(13,66,126,.9), rgba(6,27,62,.92)); box-shadow: 0 28px 80px rgba(0,10,32,.32); }
.llx-proof-visual > span { align-self: flex-start; padding: 7px 11px; border-radius: 999px; background: #137ee8; color: #fff; font-size: 12px; font-weight: 800; text-transform: uppercase; }
.llx-proof-visual strong { color: #fff; font-size: clamp(28px, 3.2vw, 46px); line-height: 1.04; }
.llx-proof-visual small { color: #9bdfff; font-weight: 750; }
.llx-proof-flow { display: grid; grid-template-columns: 1fr 1.5fr 1fr; gap: 10px; align-items: center; }
.llx-proof-flow i { display: block; height: 10px; border-radius: 99px; background: linear-gradient(90deg, #1b86f3, #20cef4); box-shadow: 0 0 22px rgba(32,206,244,.32); }
.llx-service-section { padding: clamp(76px, 9vw, 132px) 0; background: #0a2148; }
.llx-service-section--ice { background: #eaf4ff; color: #102f5b; }
.llx-section-heading { max-width: 820px; margin-bottom: 42px; }
.llx-section-heading h2, .llx-service-section:not(.llx-service-section--ice) h2 { color: #f3f9ff !important; }
.llx-section-heading > p:last-child { color: #bdd4ee; }
.llx-deliverable-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.llx-deliverable-grid article { min-height: 240px; padding: 28px; border: 1px solid #27517f; border-radius: 20px; background: #102f5b; color: #dceeff; }
.llx-deliverable-grid article span { color: #45cfff; font-weight: 850; }
.llx-deliverable-grid article h3 { margin: 48px 0 12px; color: #fff !important; }
.llx-deliverable-grid article p { color: #bfd5ed !important; }
.llx-sample-note { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px; margin-top: 22px; padding: 18px 22px; border-radius: 14px; background: #0d376d; color: #dceeff; }
.llx-sample-note strong { color: #74ddff; }
.llx-service-process { display: grid; grid-template-columns: .8fr 1.2fr; gap: clamp(40px, 8vw, 120px); }
.llx-service-process h2 { color: #0b2a54 !important; }
.llx-service-process ol { margin: 0; padding-left: 24px; }
.llx-service-process li { padding: 12px 0 22px 12px; border-bottom: 1px solid #c4dbf1; color: #294f78; font-weight: 650; }
@media (max-width: 820px) {
  .llx-service-hero__grid, .llx-service-process { grid-template-columns: 1fr; }
  .llx-deliverable-grid { grid-template-columns: 1fr; }
  .llx-proof-visual { min-height: 310px; }
}

.llx-samples { background: #071b3e; color: #eaf5ff; }
.llx-samples-hero { padding: clamp(78px, 9vw, 136px) 0; background: radial-gradient(circle at 78% 10%, rgba(26,158,255,.3), transparent 34%), linear-gradient(145deg, #06152f, #0b3267); }
.llx-samples-hero h1 { max-width: 980px; margin: 18px 0 24px; color: #f4faff !important; font-size: clamp(42px, 6.6vw, 82px); line-height: .98; }
.llx-samples-hero p:last-child { max-width: 820px; color: #c5daf1; font-size: 18px; }
.llx-samples-list { padding: 52px 0 120px; }
.llx-sample-filters { display: flex; gap: 18px; align-items: baseline; margin-bottom: 30px; }
.llx-sample-filters strong { color: #58d6ff; font-size: 34px; }
.llx-sample-filters span { color: #bcd4ee; }
.llx-samples-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.llx-sample-card { position: relative; display: flex; min-height: 320px; flex-direction: column; padding: 26px; overflow: hidden; border: 1px solid #275786; border-radius: 20px; background: linear-gradient(150deg, #0e3568, #0a244d); }
.llx-sample-card::before { content: ""; position: absolute; inset: 0 0 auto; height: 5px; background: linear-gradient(90deg, #167ff0, #24d0f2); }
.llx-sample-card > span { color: #73dcff; font-size: 12px; font-weight: 800; text-transform: uppercase; }
.llx-sample-card h2 { margin: 40px 0 14px; color: #fff !important; font-size: 23px; }
.llx-sample-card p { color: #c2d9ef !important; }
.llx-sample-card small { margin-top: auto; padding-top: 24px; color: #86c9ef; }
.llx-sample-card a { margin-top: 16px; color: #68d9ff; font-weight: 800; }
.llx-sample-card--ai-agents::before { background: linear-gradient(90deg, #1259df, #29d4ff); }
.llx-sample-card--growth::before { background: linear-gradient(90deg, #1879ef, #5cc7ff); }
.llx-sample-card--business::before { background: linear-gradient(90deg, #2059c9, #54a9f2); }
@media (max-width: 980px) { .llx-samples-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 620px) { .llx-samples-grid { grid-template-columns: 1fr; } .llx-sample-card { min-height: 280px; } }
