



:root {
        --navy: #020f26;
        --navy2: #071a3a;
        --blue: #407bff;
        --blue2: #2863e8;
        --pale: #cddcff;
        --soft: #edf3ff;
        --pink: #ff0045;
        --pinksoft: #fff0f4;
        --green: #25d366;
        --ink: #0b1930;
        --muted: #53627a;
        --border: #dce4f2;
        --surface: #f7f9fd;
        --shadow: 0 12px 35px rgba(2, 15, 38, 0.08);
        --shadow2: 0 30px 80px rgba(2, 15, 38, 0.17);
      }
      * {
        box-sizing: border-box;
      }
      html {
        scroll-behavior: smooth;
        scroll-padding-top: 110px;
      }
      body {
        margin: 0;
        background: #fff;
        color: var(--ink);
        font-family: Poppins, Arial, sans-serif;
        font-size: 16px;
        line-height: 1.65;
        -webkit-font-smoothing: antialiased;
      }
      a {
        color: inherit;
        text-decoration: none;
      }
      img,
      svg {
        display: block;
      }
      .container {
        width: min(1180px, calc(100% - 48px));
        margin: auto;
      }
      .section {
        padding: 110px 0;
      }
      .site-header {
        position: sticky;
        z-index: 100;
        top: 0;
        background: rgba(255, 255, 255, 0.95);
        border-bottom: 1px solid rgba(220, 228, 242, 0.9);
        backdrop-filter: blur(18px);
      }
      .topline {
        background: var(--navy);
        color: rgba(255, 255, 255, 0.76);
        font-size: 11px;
      }
      .top-inner {
        min-height: 34px;
        display: flex;
        align-items: center;
        justify-content: flex-end;
        gap: 28px;
      }
      .top-inner span {
        display: flex;
        align-items: center;
        gap: 7px;
      }
      .top-inner svg {
        width: 14px;
        color: #73a0ff;
      }
      .nav-wrap {
        min-height: 78px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 32px;
      }
      .brand img {
        width: 146px;
        height: 58px;
        object-fit: contain;
        object-position: left;
      }
      .nav-wrap nav {
        display: flex;
        gap: 28px;
        margin-left: auto;
      }
      .nav-wrap nav a {
        position: relative;
        color: #35445b;
        font-size: 13px;
        font-weight: 800;
      }
      .nav-wrap nav a:after {
        content: "";
        position: absolute;
        bottom: -8px;
        left: 0;
        right: 0;
        height: 2px;
        background: var(--blue);
        transform: scaleX(0);
        transition: 0.2s;
      }
      .nav-wrap nav a:hover:after {
        transform: scaleX(1);
      }
      .button {
        min-height: 54px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 10px;
        padding: 13px 22px;
        border: 1px solid transparent;
        border-radius: 14px;
        font-size: 13px;
        font-weight: 800;
        line-height: 1.25;
        text-align: center;
        transition: 0.2s;
      }
      .button svg {
        width: 19px;
        flex: none;
      }
      .button:hover {
        transform: translateY(-2px);
      }
      .button.primary {
        background: var(--blue);
        color: #fff;
        box-shadow: 0 14px 32px rgba(64, 123, 255, 0.28);
      }
      .button.primary:hover {
        background: var(--blue2);
        box-shadow: 0 18px 36px rgba(64, 123, 255, 0.38);
      }
      .button.secondary {
        background: #fff;
        color: var(--navy);
        border-color: var(--border);
        box-shadow: var(--shadow);
      }
      .button.secondary:hover {
        border-color: var(--blue);
        color: var(--blue2);
      }
      .button .arrow {
        width: 17px;
        transition: 0.2s;
      }
      .button:hover .arrow {
        transform: translateX(3px);
      }
      .header-cta {
        min-height: 44px;
        padding: 10px 17px;
        border-radius: 12px;
      }
      .header-cta .arrow {
        display: none;
      }
      .button:focus-visible,
      a:focus-visible,
      summary:focus-visible {
        outline: 3px solid rgba(64, 123, 255, 0.4);
        outline-offset: 3px;
      }
      .hero {
        position: relative;
        overflow: hidden;
        background: var(--navy);
        color: #fff;
      }
      .grid-bg {
        position: absolute;
        inset: 0;
        opacity: 0.08;
        background-image:
          linear-gradient(rgba(255, 255, 255, 0.5) 1px, transparent 1px),
          linear-gradient(90deg, rgba(255, 255, 255, 0.5) 1px, transparent 1px);
        background-size: 62px 62px;
        mask-image: linear-gradient(to right, #000, transparent 76%);
      }
      .glow {
        position: absolute;
        border-radius: 50%;
      }
      .glow.one {
        width: 620px;
        height: 620px;
        right: -180px;
        top: -210px;
        background: radial-gradient(
          circle,
          rgba(64, 123, 255, 0.25),
          transparent 67%
        );
      }
      .glow.two {
        width: 420px;
        height: 420px;
        left: -240px;
        bottom: -280px;
        background: radial-gradient(
          circle,
          rgba(255, 0, 69, 0.13),
          transparent 68%
        );
      }
      .hero-layout {
        position: relative;
        z-index: 2;
        min-height: 720px;
        display: grid;
        grid-template-columns: 1.06fr 0.94fr;
        align-items: center;
        gap: 64px;
        padding: 86px 0 92px;
      }
      .hero-copy {
        max-width: 620px;
      }
      .hero-kicker,
      .eyebrow {
        display: inline-flex;
        align-items: center;
        gap: 10px;
        margin-bottom: 18px;
        color: var(--blue);
        font-size: 11px;
        font-weight: 800;
        letter-spacing: 0.16em;
        line-height: 1.3;
        text-transform: uppercase;
      }
      .hero-kicker {
        color: #a9c1ff;
      }
      .hero-kicker > span {
        width: 30px;
        height: 30px;
        display: grid;
        place-items: center;
        border: 1px solid rgba(205, 220, 255, 0.18);
        border-radius: 9px;
        background: rgba(64, 123, 255, 0.13);
      }
      .hero-kicker svg {
        width: 15px;
      }
      .hero h1,
      .heading h2,
      .alert h2,
      .final-cta h2 {
        margin: 0;
        font-weight: 800;
        letter-spacing: -0.045em;
        line-height: 1.04;
      }
      .hero h1 {
        font-size: clamp(45px, 5vw, 72px);
      }
      .hero h1 em {
        display: block;
        margin-top: 6px;
        color: #83a8ff;
        font-family: Fraunces, Georgia, serif;
        font-size: 1.08em;
        font-weight: 550;
        letter-spacing: -0.035em;
      }
      .hero-lead {
        max-width: 610px;
        margin: 25px 0 23px;
        color: rgba(255, 255, 255, 0.72);
        font-size: 17px;
        line-height: 1.75;
      }
      .hero-points {
        display: grid;
        gap: 10px;
        margin: 0 0 28px;
        padding: 0;
        list-style: none;
      }
      .hero-points li {
        display: flex;
        align-items: flex-start;
        gap: 10px;
        color: rgba(255, 255, 255, 0.88);
        font-size: 13px;
      }
      .hero-points svg {
        width: 18px;
        margin-top: 3px;
        color: #83a8ff;
        flex: none;
      }
      .hero-actions {
        display: flex;
        align-items: center;
        gap: 22px;
      }
      .text-link {
        display: flex;
        align-items: center;
        gap: 8px;
        color: rgba(255, 255, 255, 0.85);
        font-size: 12px;
        font-weight: 800;
      }
      .text-link svg {
        width: 16px;
        transition: 0.2s;
      }
      .text-link:hover svg {
        transform: translateX(3px);
      }
      .micro {
        display: flex;
        align-items: center;
        gap: 7px;
        margin: 22px 0 0;
        color: rgba(255, 255, 255, 0.47);
        font-size: 10px;
      }
      .micro svg {
        width: 14px;
      }
      .inspection {
        position: relative;
        min-height: 545px;
      }
      .meter-panel {
        position: absolute;
        width: 88%;
        height: 320px;
        top: 26px;
        right: 0;
        padding: 50px 32px;
        border: 1px solid rgba(205, 220, 255, 0.15);
        border-radius: 30px;
        background: linear-gradient(
          145deg,
          rgba(205, 220, 255, 0.1),
          rgba(64, 123, 255, 0.03)
        );
        transform: rotate(2.5deg);
      }
      .pipe {
        height: 14px;
        border: 1px solid rgba(205, 220, 255, 0.14);
        border-radius: 99px;
        background: linear-gradient(#3d4c66, #1d2b44);
      }
      .meters {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 18px;
        margin: 28px 0;
      }
      .meter {
        display: grid;
        justify-items: center;
      }
      .meter > div {
        width: 76px;
        height: 76px;
        display: grid;
        place-items: center;
        border: 6px solid #4b5870;
        border-radius: 50%;
        background: #d5dce8;
        color: #2d3950;
        box-shadow: inset 0 0 0 2px #8995aa;
      }
      .meter svg {
        width: 34px;
      }
      .meter i {
        width: 12px;
        height: 36px;
        background: #3a4861;
      }
      .report {
        position: absolute;
        z-index: 4;
        width: 92%;
        left: 0;
        bottom: 22px;
        padding: 22px;
        border: 1px solid rgba(255, 255, 255, 0.7);
        border-radius: 24px;
        background: rgba(255, 255, 255, 0.98);
        color: var(--ink);
        box-shadow: 0 34px 80px rgba(0, 0, 0, 0.35);
        transform: rotate(-1.2deg);
      }
      .report-head,
      .report-brand,
      .progress > div,
      .report-item,
      .report-foot {
        display: flex;
        align-items: center;
      }
      .report-head {
        justify-content: space-between;
        padding-bottom: 17px;
        border-bottom: 1px solid var(--border);
      }
      .report-brand {
        gap: 10px;
      }
      .report-brand img {
        width: 27px;
        height: 36px;
      }
      .report-brand div {
        display: grid;
        line-height: 1.25;
      }
      .report-brand strong {
        font-size: 12px;
      }
      .report-brand span {
        color: var(--muted);
        font-size: 9px;
      }
      .report-head > b {
        padding: 5px 8px;
        border-radius: 7px;
        background: var(--soft);
        color: var(--blue2);
        font-size: 8px;
      }
      .progress {
        padding: 14px 0 9px;
      }
      .progress > div {
        justify-content: space-between;
        margin-bottom: 7px;
        font-size: 8px;
      }
      .progress span {
        color: var(--muted);
      }
      .progress > i {
        display: block;
        height: 6px;
        overflow: hidden;
        border-radius: 99px;
        background: #e9eef7;
      }
      .progress > i > b {
        display: block;
        width: 84%;
        height: 100%;
        border-radius: inherit;
        background: linear-gradient(90deg, var(--blue), #7aa2ff);
      }
      .report-list {
        display: grid;
        gap: 7px;
      }
      .report-item {
        gap: 10px;
        padding: 9px 10px;
        border: 1px solid var(--border);
        border-radius: 11px;
        background: var(--surface);
      }
      .report-item > span {
        width: 27px;
        height: 27px;
        display: grid;
        place-items: center;
        border-radius: 8px;
      }
      .report-item > span svg {
        width: 13px;
      }
      .report-item > div {
        display: grid;
        margin-right: auto;
        line-height: 1.2;
      }
      .report-item strong {
        font-size: 9px;
      }
      .report-item small {
        color: var(--muted);
        font-size: 7px;
      }
      .report-item > b {
        padding: 4px 7px;
        border-radius: 99px;
        font-size: 6px;
        text-transform: uppercase;
      }
      .report-item.ok > span,
      .report-item.ok > b {
        background: #e4f9ed;
        color: #108a45;
      }
      .report-item.attention > span,
      .report-item.attention > b {
        background: #fff5cf;
        color: #8e6500;
      }
      .report-item.danger > span,
      .report-item.danger > b {
        background: var(--pinksoft);
        color: var(--pink);
      }
      .report-foot {
        gap: 18px;
        margin-top: 13px;
        padding-top: 12px;
        border-top: 1px solid var(--border);
        color: var(--muted);
        font-size: 7px;
      }
      .report-foot span {
        display: flex;
        align-items: center;
        gap: 5px;
      }
      .report-foot svg {
        width: 11px;
        color: var(--blue);
      }
      .note {
        position: absolute;
        z-index: 6;
        display: flex;
        align-items: center;
        gap: 9px;
        padding: 10px 12px;
        border: 1px solid rgba(255, 255, 255, 0.8);
        border-radius: 13px;
        background: rgba(255, 255, 255, 0.98);
        color: var(--ink);
        box-shadow: var(--shadow2);
      }
      .note > svg {
        width: 20px;
      }
      .note > div {
        display: grid;
        line-height: 1.25;
      }
      .note strong {
        font-size: 8px;
      }
      .note span {
        color: var(--muted);
        font-size: 7px;
      }
      .note-alert {
        right: -15px;
        top: 190px;
      }
      .note-alert > svg {
        color: var(--pink);
      }
      .note-ok {
        left: -24px;
        bottom: -12px;
      }
      .note-ok > svg {
        color: var(--blue);
      }
      .trust {
        border-bottom: 1px solid var(--border);
      }
      .trust-grid {
        min-height: 96px;
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        align-items: center;
      }
      .trust-grid > div {
        min-height: 44px;
        display: flex;
        align-items: center;
        gap: 12px;
        padding: 0 24px;
        border-right: 1px solid var(--border);
      }
      .trust-grid > div:first-child {
        padding-left: 0;
      }
      .trust-grid > div:last-child {
        border: 0;
        padding-right: 0;
      }
      .trust-grid svg {
        width: 21px;
        color: var(--blue);
        flex: none;
      }
      .trust-grid span {
        color: var(--muted);
        font-size: 10px;
        line-height: 1.45;
      }
      .trust-grid strong {
        display: block;
        color: var(--ink);
        font-size: 11px;
      }
      .heading {
        max-width: 670px;
      }
      .heading.centered {
        margin: auto;
        text-align: center;
      }
      .heading h2,
      .alert h2,
      .final-cta h2 {
        font-size: clamp(36px, 4vw, 54px);
      }
      .heading p {
        margin: 20px 0 0;
        color: var(--muted);
        font-size: 15px;
        line-height: 1.85;
      }
      .split {
        display: grid;
      }
      .problem {
        background: var(--surface);
      }
      .problem-layout {
        grid-template-columns: 0.9fr 1.1fr;
        gap: 84px;
        align-items: center;
      }
      .quote {
        position: relative;
        margin-top: 35px;
        padding: 26px 28px 26px 36px;
        overflow: hidden;
        border-left: 4px solid var(--blue);
        border-radius: 0 18px 18px 0;
        background: #fff;
        box-shadow: var(--shadow);
      }
      .quote p {
        position: relative;
        margin: 0;
        color: #324158;
        font-family: Fraunces, Georgia, serif;
        font-size: 19px;
        font-style: italic;
        font-weight: 520;
      }
      .quote i {
        position: absolute;
        top: -32px;
        right: 14px;
        color: var(--soft);
        font-family: Fraunces;
        font-size: 130px;
        line-height: 1;
      }
      .pain-grid {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 16px;
      }
      .pain-grid article {
        min-height: 190px;
        padding: 26px;
        border: 1px solid var(--border);
        border-radius: 22px;
        background: #fff;
        box-shadow: 0 8px 24px rgba(2, 15, 38, 0.04);
        transition: 0.25s;
      }
      .pain-grid article:hover {
        transform: translateY(-4px);
        box-shadow: var(--shadow);
      }
      .pain-grid article:nth-child(even) {
        transform: translateY(28px);
      }
      .pain-grid article:nth-child(even):hover {
        transform: translateY(24px);
      }
      .pain-grid span {
        color: var(--blue);
        font-size: 11px;
        font-weight: 800;
        letter-spacing: 0.14em;
      }
      .pain-grid p {
        margin: 34px 0 0;
        color: #334158;
        font-size: 13px;
        font-weight: 800;
        line-height: 1.65;
      }
      .process {
        background: #fff;
      }
      .steps {
        position: relative;
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 22px;
        margin-top: 60px;
      }
      .steps:before {
        content: "";
        position: absolute;
        top: 54px;
        left: 18%;
        right: 18%;
        height: 2px;
        background: repeating-linear-gradient(
          90deg,
          var(--pale) 0 8px,
          transparent 8px 16px
        );
      }
      .steps article {
        position: relative;
        min-height: 290px;
        padding: 30px;
        border: 1px solid var(--border);
        border-radius: 24px;
        background: #fff;
        box-shadow: var(--shadow);
      }
      .steps article > span {
        position: absolute;
        top: 24px;
        right: 25px;
        color: #9cacbf;
        font-size: 11px;
        font-weight: 800;
      }
      .steps article > div,
      .feature-grid article > div,
      .process-callout > span,
      .alert-icon {
        display: grid;
        place-items: center;
      }
      .steps article > div {
        width: 58px;
        height: 58px;
        margin-bottom: 27px;
        border-radius: 17px;
        background: var(--soft);
        color: var(--blue);
      }
      .steps article > div svg {
        width: 26px;
      }
      .steps h3,
      .feature-grid h3 {
        margin: 0;
        font-size: 17px;
        font-weight: 800;
        letter-spacing: -0.025em;
      }
      .steps p,
      .feature-grid p {
        margin: 12px 0 0;
        color: var(--muted);
        font-size: 12px;
        line-height: 1.75;
      }
      .process-callout {
        display: grid;
        grid-template-columns: auto 1fr auto;
        align-items: center;
        gap: 22px;
        margin-top: 28px;
        padding: 22px 24px;
        border-radius: 20px;
        background: var(--navy);
        color: #fff;
      }
      .process-callout > span {
        width: 48px;
        height: 48px;
        border: 1px solid rgba(255, 255, 255, 0.12);
        border-radius: 14px;
        background: rgba(64, 123, 255, 0.15);
        color: #8aafff;
      }
      .process-callout p {
        margin: 0;
        color: rgba(255, 255, 255, 0.67);
        font-size: 12px;
      }
      .process-callout p strong {
        color: #fff;
      }
      .process-callout .button {
        min-height: 46px;
      }
      .solution {
        background: var(--soft);
      }
      .solution-layout {
        grid-template-columns: 0.92fr 1.08fr;
        align-items: center;
        gap: 90px;
      }
      .check-list {
        display: grid;
        gap: 12px;
        margin: 32px 0 0;
        padding: 0;
        list-style: none;
      }
      .check-list li {
        display: flex;
        align-items: flex-start;
        gap: 11px;
        color: #2e3d54;
        font-size: 12px;
        font-weight: 800;
      }
      .check-list svg {
        width: 18px;
        margin-top: 3px;
        color: var(--blue);
        flex: none;
      }
      .visual-check {
        padding: 34px;
        border: 1px solid rgba(64, 123, 255, 0.16);
        border-radius: 28px;
        background: #fff;
        box-shadow: 0 30px 70px rgba(40, 99, 232, 0.13);
      }
      .check-top {
        display: flex;
        justify-content: space-between;
        align-items: flex-start;
      }
      .check-top > div {
        display: grid;
      }
      .check-top span {
        color: var(--blue);
        font-size: 9px;
        font-weight: 800;
        letter-spacing: 0.12em;
        text-transform: uppercase;
      }
      .check-top strong {
        margin-top: 4px;
        font-size: 15px;
      }
      .check-top > b {
        color: var(--blue);
        font-family: Fraunces;
        font-size: 35px;
        line-height: 1;
      }
      .check-bar {
        height: 7px;
        margin: 22px 0 18px;
        border-radius: 99px;
        background: #e8eef8;
        overflow: hidden;
      }
      .check-bar span {
        display: block;
        width: 83%;
        height: 100%;
        background: var(--blue);
      }
      .check-items {
        display: grid;
        gap: 8px;
      }
      .check-items > div {
        display: grid;
        grid-template-columns: auto 1fr auto;
        align-items: center;
        gap: 13px;
        padding: 14px 15px;
        border: 1px solid var(--border);
        border-radius: 13px;
      }
      .check-items p {
        display: grid;
        margin: 0;
        line-height: 1.4;
      }
      .check-items strong {
        font-size: 10px;
      }
      .check-items small {
        color: var(--muted);
        font-size: 8px;
      }
      .check-items > div > svg {
        width: 16px;
        color: var(--muted);
      }
      .dot {
        width: 10px;
        height: 10px;
        display: inline-block;
        border-radius: 50%;
        flex: none;
      }
      .dot.green {
        background: #26b866;
        box-shadow: 0 0 0 4px #e3f8ec;
      }
      .dot.yellow {
        background: #e9a900;
        box-shadow: 0 0 0 4px #fff6d8;
      }
      .dot.red {
        background: var(--pink);
        box-shadow: 0 0 0 4px var(--pinksoft);
      }
      .legend {
        display: flex;
        gap: 25px;
        margin-top: 21px;
        color: var(--muted);
        font-size: 8px;
      }
      .legend span {
        display: flex;
        align-items: center;
        gap: 9px;
      }
      .legend .dot {
        width: 7px;
        height: 7px;
        box-shadow: none;
      }
      .deliverables {
        background: #fff;
      }
      .feature-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 18px;
        margin-top: 58px;
      }
      .feature-grid article {
        position: relative;
        min-height: 250px;
        padding: 28px;
        overflow: hidden;
        border: 1px solid var(--border);
        border-radius: 22px;
        background: #fff;
        transition: 0.25s;
      }
      .feature-grid article:after {
        content: "";
        position: absolute;
        width: 100px;
        height: 100px;
        right: -60px;
        bottom: -60px;
        border: 18px solid var(--soft);
        border-radius: 50%;
      }
      .feature-grid article:hover {
        transform: translateY(-5px);
        box-shadow: var(--shadow);
      }
      .feature-grid article.featured {
        background: var(--navy);
        color: #fff;
        border-color: var(--navy);
      }
      .feature-grid article.featured p {
        color: rgba(255, 255, 255, 0.64);
      }
      .feature-grid article > div {
        width: 50px;
        height: 50px;
        margin-bottom: 28px;
        border-radius: 15px;
        background: var(--soft);
        color: var(--blue);
      }
      .feature-grid article > div svg {
        width: 23px;
      }
      .feature-grid .featured > div {
        background: rgba(64, 123, 255, 0.15);
        color: #89acff;
      }
      .alert {
        background: var(--pinksoft);
      }
      .alert-layout {
        display: grid;
        grid-template-columns: auto 1fr 0.72fr;
        align-items: center;
        gap: 35px;
      }
      .alert-icon {
        width: 82px;
        height: 82px;
        border-radius: 24px;
        background: #fff;
        color: var(--pink);
        box-shadow: 0 18px 40px rgba(255, 0, 69, 0.12);
      }
      .alert-icon svg {
        width: 38px;
      }
      .alert-eye {
        color: var(--pink);
      }
      .alert h2 {
        font-size: clamp(34px, 3.8vw, 49px);
      }
      .alert-layout > div:nth-child(2) > p {
        margin: 17px 0 0;
        color: #614b54;
        font-size: 13px;
      }
      .safety {
        display: grid;
        grid-template-columns: auto 1fr;
        gap: 15px;
        padding: 24px;
        border: 1px solid rgba(255, 0, 69, 0.14);
        border-radius: 18px;
        background: #fff;
      }
      .safety > svg {
        width: 24px;
        color: var(--pink);
      }
      .safety p {
        display: grid;
        gap: 4px;
        margin: 0;
        color: #63515a;
        font-size: 10px;
      }
      .safety strong {
        color: var(--ink);
        font-size: 12px;
      }
      .scope {
        background: var(--surface);
      }
      .scope-grid {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 22px;
        margin-top: 58px;
      }
      .scope-card {
        padding: 34px;
        border: 1px solid var(--border);
        border-radius: 26px;
        background: #fff;
        box-shadow: var(--shadow);
      }
      .scope-card.included {
        border-top: 5px solid var(--blue);
      }
      .scope-card.excluded {
        border-top: 5px solid #aab6c8;
      }
      .scope-head {
        display: flex;
        align-items: center;
        gap: 16px;
        margin-bottom: 28px;
      }
      .scope-head > span {
        width: 49px;
        height: 49px;
        display: grid;
        place-items: center;
        border-radius: 15px;
      }
      .included .scope-head > span {
        background: var(--soft);
        color: var(--blue);
      }
      .excluded .scope-head > span {
        background: #edf0f5;
        color: #7e8ba0;
      }
      .scope-head > div {
        display: grid;
        line-height: 1.25;
      }
      .scope-head small {
        color: var(--muted);
        font-size: 9px;
      }
      .scope-head h3 {
        margin: 2px 0 0;
        font-size: 25px;
        font-weight: 800;
      }
      .scope-card ul {
        display: grid;
        gap: 13px;
        margin: 0;
        padding: 0;
        list-style: none;
      }
      .scope-card li {
        display: flex;
        align-items: flex-start;
        gap: 10px;
        color: #3c4b61;
        font-size: 11px;
      }
      .scope-card li svg {
        width: 17px;
        margin-top: 3px;
        flex: none;
      }
      .included li svg {
        color: var(--blue);
      }
      .excluded li svg {
        color: #95a1b3;
      }
      .scope-extra {
        display: grid;
        grid-template-columns: auto 1fr;
        gap: 11px;
        margin-top: 24px;
        padding: 15px;
        border-radius: 12px;
        background: var(--surface);
      }
      .scope-extra svg {
        width: 17px;
        color: var(--blue);
      }
      .scope-extra p {
        margin: 0;
        color: var(--muted);
        font-size: 9px;
      }
      .faq {
        background: #fff;
      }
      .faq-layout {
        display: grid;
        grid-template-columns: 0.72fr 1.28fr;
        align-items: start;
        gap: 88px;
      }
      .faq-intro {
        position: sticky;
        top: 150px;
      }
      .faq-intro .button {
        margin-top: 30px;
      }
      .faq-list {
        border-top: 1px solid var(--border);
      }
      .faq-list details {
        border-bottom: 1px solid var(--border);
      }
      .faq-list summary {
        min-height: 78px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 20px;
        padding: 20px 4px;
        cursor: pointer;
        font-size: 13px;
        font-weight: 800;
        list-style: none;
      }
      .faq-list summary::-webkit-details-marker {
        display: none;
      }
      .faq-list summary svg {
        width: 19px;
        color: var(--blue);
        transition: 0.25s;
      }
      .faq-list details[open] summary {
        color: var(--blue2);
      }
      .faq-list details[open] summary svg {
        transform: rotate(180deg);
      }
      .faq-list details p {
        margin: -4px 38px 24px 4px;
        color: var(--muted);
        font-size: 11px;
        line-height: 1.8;
      }
      .final-cta {
        position: relative;
        overflow: hidden;
        padding: 106px 0;
        background: linear-gradient(125deg, var(--blue2), var(--blue));
        color: #fff;
      }
      .final-cta .grid-bg {
        opacity: 0.12;
        mask-image: linear-gradient(to left, #000, transparent 90%);
      }
      .final-layout {
        position: relative;
        z-index: 2;
        display: grid;
        grid-template-columns: 1.25fr 0.75fr;
        align-items: center;
        gap: 90px;
      }
      .eyebrow.light {
        color: rgba(255, 255, 255, 0.72);
      }
      .final-layout > div > p {
        max-width: 670px;
        margin: 22px 0 28px;
        color: rgba(255, 255, 255, 0.76);
        font-size: 14px;
      }
      .final-cta .primary {
        background: #fff;
        color: var(--blue2);
      }
      .final-layout small {
        display: block;
        margin-top: 18px;
        color: rgba(255, 255, 255, 0.55);
        font-size: 9px;
      }
      .final-layout aside {
        position: relative;
        padding: 32px;
        overflow: hidden;
        border: 1px solid rgba(255, 255, 255, 0.18);
        border-radius: 26px;
        background: rgba(2, 15, 38, 0.22);
        box-shadow: 0 30px 70px rgba(2, 15, 38, 0.2);
        backdrop-filter: blur(12px);
      }
      .final-layout aside > img {
        position: absolute;
        width: 100px;
        height: 136px;
        right: -17px;
        bottom: -28px;
        opacity: 0.14;
      }
      .final-layout aside > span {
        color: rgba(255, 255, 255, 0.58);
        font-size: 9px;
        text-transform: uppercase;
        letter-spacing: 0.1em;
      }
      .final-layout aside h3 {
        max-width: 260px;
        margin: 7px 0 25px;
        font-size: 21px;
        line-height: 1.35;
      }
      .final-layout aside ul {
        display: grid;
        gap: 12px;
        margin: 0;
        padding: 0;
        list-style: none;
      }
      .final-layout aside li {
        display: flex;
        align-items: center;
        gap: 9px;
        color: rgba(255, 255, 255, 0.78);
        font-size: 10px;
      }
      .final-layout aside li svg {
        width: 17px;
        color: var(--pale);
      }
      footer {
        padding: 72px 0 26px;
        background: var(--navy);
        color: rgba(255, 255, 255, 0.65);
      }
      .footer-grid {
        display: grid;
        grid-template-columns: 1.2fr 0.7fr 1fr 1fr;
        gap: 60px;
      }
      .footer-brand img {
        width: 170px;
        height: 70px;
        object-fit: contain;
        object-position: left;
        margin-bottom: 18px;
      }
      .footer-brand p {
        max-width: 280px;
        margin: 0;
        font-size: 10px;
      }
      footer h3 {
        margin: 16px 0 21px;
        color: #fff;
        font-size: 11px;
        text-transform: uppercase;
        letter-spacing: 0.11em;
      }
      .footer-grid > div:not(:first-child) {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
      }
      footer a,
      footer .footer-grid p {
        display: flex;
        align-items: flex-start;
        gap: 8px;
        margin: 0 0 11px;
        font-size: 9px;
      }
      footer a:hover {
        color: #fff;
      }
      footer a svg,
      footer .footer-grid p svg {
        width: 15px;
        margin-top: 1px;
        color: #719bff;
        flex: none;
      }
      .cnpj {
        margin-top: 6px !important;
        color: rgba(255, 255, 255, 0.35);
      }
      .footer-bottom {
        display: flex;
        justify-content: space-between;
        gap: 20px;
        margin-top: 55px;
        padding-top: 22px;
        border-top: 1px solid rgba(255, 255, 255, 0.08);
        font-size: 8px;
      }
      .float-whats {
        position: fixed;
        z-index: 120;
        right: 22px;
        bottom: 22px;
        display: flex;
        align-items: center;
        gap: 9px;
        min-height: 50px;
        padding: 12px 17px;
        border: 2px solid rgba(255, 255, 255, 0.9);
        border-radius: 99px;
        background: var(--green);
        color: #062d15;
        box-shadow: 0 15px 38px rgba(18, 153, 71, 0.34);
        font-size: 11px;
        font-weight: 800;
        transition: 0.2s;
      }
      .float-whats:hover {
        transform: translateY(-3px);
      }
      .float-whats svg {
        width: 22px;
      }
      @media (max-width: 1060px) {
        .nav-wrap nav {
          display: none;
        }
        .hero-layout {
          grid-template-columns: 1fr 0.86fr;
          gap: 30px;
        }
        .inspection {
          transform: scale(0.9);
          transform-origin: center;
        }
        .problem-layout,
        .solution-layout {
          gap: 55px;
        }
        .alert-layout {
          grid-template-columns: auto 1fr;
        }
        .safety {
          grid-column: 2;
        }
        .footer-grid {
          grid-template-columns: 1.2fr 0.8fr 1fr;
        }
        .footer-grid > div:last-child {
          grid-column: 3;
        }
      }
      @media (max-width: 860px) {
        .section {
          padding: 88px 0;
        }
        .top-location {
          display: none !important;
        }
        .hero-layout {
          grid-template-columns: 1fr;
          padding-top: 76px;
        }
        .inspection {
          width: min(590px, 100%);
          margin: -10px auto 0;
          transform: none;
        }
        .trust-grid {
          grid-template-columns: 1fr 1fr;
        }
        .trust-grid > div {
          min-height: 76px;
          border-bottom: 1px solid var(--border);
        }
        .trust-grid > div:nth-child(2) {
          border-right: 0;
        }
        .trust-grid > div:nth-child(3),
        .trust-grid > div:nth-child(4) {
          border-bottom: 0;
        }
        .problem-layout,
        .solution-layout,
        .faq-layout,
        .final-layout {
          grid-template-columns: 1fr;
        }
        .problem-layout,
        .solution-layout,
        .faq-layout,
        .final-layout {
          gap: 55px;
        }
        .faq-intro {
          position: static;
        }
        .steps {
          grid-template-columns: 1fr;
        }
        .steps:before {
          display: none;
        }
        .steps article {
          min-height: auto;
        }
        .feature-grid {
          grid-template-columns: 1fr 1fr;
        }
        .scope-grid {
          grid-template-columns: 1fr;
        }
        .footer-grid {
          grid-template-columns: 1fr 1fr;
        }
        .footer-grid > div:last-child {
          grid-column: auto;
        }
      }
      @media (max-width: 620px) {
        .container {
          width: calc(100% - 32px);
        }
        .section {
          padding: 74px 0;
        }
        html {
          scroll-padding-top: 78px;
        }
        .topline {
          display: none;
        }
        .nav-wrap {
          min-height: 70px;
          gap: 14px;
        }
        .brand img {
          width: 112px;
          height: 49px;
        }
        .header-cta {
          min-height: 40px;
          padding: 9px 12px;
          font-size: 10px;
        }
        .header-cta > svg:first-child {
          display: none;
        }
        .hero-layout {
          min-height: auto;
          padding: 62px 0 72px;
        }
        .hero-kicker {
          font-size: 9px;
          letter-spacing: 0.11em;
        }
        .hero h1 {
          font-size: clamp(41px, 12vw, 55px);
        }
        .hero-lead {
          font-size: 14px;
        }
        .hero-actions {
          align-items: stretch;
          flex-direction: column;
          gap: 17px;
        }
        .hero-actions .button {
          width: 100%;
        }
        .text-link {
          justify-content: center;
        }
        .micro {
          align-items: flex-start;
          font-size: 9px;
        }
        .inspection {
          min-height: 475px;
          margin-top: 8px;
        }
        .meter-panel {
          width: 96%;
          height: 265px;
          padding: 42px 20px;
        }
        .meter > div {
          width: 57px;
          height: 57px;
          border-width: 5px;
        }
        .meter svg {
          width: 26px;
        }
        .report {
          width: 97%;
          padding: 16px;
          border-radius: 19px;
        }
        .note-alert {
          right: -5px;
          top: 164px;
        }
        .note-ok {
          left: -5px;
          bottom: -8px;
        }
        .note {
          padding: 8px 10px;
        }
        .heading h2,
        .alert h2,
        .final-cta h2 {
          font-size: 37px;
        }
        .heading p {
          font-size: 13px;
        }
        .pain-grid {
          grid-template-columns: 1fr;
        }
        .pain-grid article {
          min-height: 145px;
        }
        .pain-grid article:nth-child(even),
        .pain-grid article:nth-child(even):hover {
          transform: none;
        }
        .steps {
          margin-top: 42px;
        }
        .process-callout {
          grid-template-columns: auto 1fr;
        }
        .process-callout .button {
          grid-column: 1/-1;
        }
        .visual-check {
          padding: 23px 18px;
        }
        .check-top strong {
          font-size: 12px;
        }
        .feature-grid {
          grid-template-columns: 1fr;
          margin-top: 42px;
        }
        .feature-grid article {
          min-height: 220px;
        }
        .alert-layout {
          grid-template-columns: 1fr;
        }
        .alert-icon {
          width: 65px;
          height: 65px;
        }
        .safety {
          grid-column: auto;
        }
        .scope-grid {
          margin-top: 42px;
        }
        .scope-card {
          padding: 27px 21px;
        }
        .faq-list summary {
          font-size: 11px;
        }
        .final-cta {
          padding: 78px 0;
        }
        .final-layout aside {
          padding: 26px;
        }
        .footer-grid {
          grid-template-columns: 1fr;
          gap: 30px;
        }
        .footer-bottom {
          align-items: flex-start;
          flex-direction: column;
        }
        .float-whats {
          right: 14px;
          bottom: 14px;
          width: 54px;
          height: 54px;
          justify-content: center;
          padding: 0;
        }
        .float-whats span {
          display: none;
        }
      }
      @media (prefers-reduced-motion: reduce) {
        html {
          scroll-behavior: auto;
        }
        *,
        *:before,
        *:after {
          transition-duration: 0.01ms !important;
        }
      }

      /* Ajustes de conteúdo e responsividade: desktop, tablet e mobile */
      html {
        overflow-x: hidden;
      }
      body {
        overflow-x: hidden;
      }
      .section {
        padding: 92px 0;
      }
      .hero-layout {
        min-height: 680px;
        grid-template-columns: 1.22fr 0.78fr;
        gap: 40px;
        padding: 72px 0 78px;
      }
      .hero-copy {
        max-width: 720px;
      }
      .hero h1 {
        max-width: 720px;
        font-size: clamp(40px, 4vw, 56px);
        line-height: 1.06;
      }
      .hero-emotional {
        margin: 19px 0 0;
        color: #a9c1ff;
        font-family: Fraunces, Georgia, serif;
        font-size: clamp(25px, 2.3vw, 34px);
        font-style: italic;
        font-weight: 540;
        letter-spacing: -0.025em;
        line-height: 1.25;
      }
      .hero-lead {
        margin-top: 16px;
        font-size: 16px;
        line-height: 1.72;
      }
      .hero-points li {
        font-size: 14px;
      }
      .hero-secondary {
        min-height: 50px;
        border-color: rgba(255, 255, 255, 0.3);
        background: rgba(255, 255, 255, 0.08);
        color: #fff;
        box-shadow: none;
      }
      .hero-secondary:hover {
        border-color: rgba(255, 255, 255, 0.48);
        background: rgba(255, 255, 255, 0.14);
      }
      .topline,
      .hero-kicker,
      .eyebrow {
        font-size: 11.5px;
      }
      .button {
        font-size: 13.5px;
      }
      .micro {
        font-size: 11px;
      }
      .heading p {
        color: #46566e;
        font-size: 15.5px;
      }
      .trust-grid span {
        color: #46566e;
        font-size: 12.5px;
      }
      .trust-grid strong {
        font-size: 13.5px;
      }
      .pain-grid {
        gap: 14px;
        grid-auto-rows: 1fr;
      }
      .pain-grid article {
        min-height: 158px;
        padding: 22px;
      }
      .pain-grid p {
        margin-top: 22px;
        font-size: 14px;
      }
      .steps p,
      .feature-grid p,
      .process-callout p,
      .check-list li,
      .scope-card li {
        font-size: 13.5px;
      }
      .steps article,
      .feature-grid article {
        height: 100%;
      }
      .feature-grid {
        align-items: stretch;
      }
      .check-top span,
      .scope-head small,
      .final-layout aside > span {
        font-size: 10.5px;
      }
      .check-items strong {
        font-size: 12.5px;
      }
      .check-items small,
      .legend,
      .scope-extra p {
        font-size: 10.5px;
      }
      .alert-layout > div:nth-child(2) > p {
        font-size: 14px;
        line-height: 1.75;
      }
      .safety p {
        font-size: 12.5px;
      }
      .safety strong {
        font-size: 13.5px;
      }
      .faq-list summary {
        font-size: 15px;
      }
      .faq-list details p {
        color: #46566e;
        font-size: 14px;
        line-height: 1.75;
      }
      .final-cta {
        padding: 88px 0;
      }
      .final-layout > div > p {
        color: rgba(255, 255, 255, 0.84);
        font-size: 15px;
        line-height: 1.75;
      }
      .final-layout small {
        color: rgba(255, 255, 255, 0.76);
        font-size: 11.5px;
        line-height: 1.6;
      }
      .final-layout aside li {
        font-size: 12.5px;
      }
      .footer-brand p {
        font-size: 12.5px;
      }
      footer h3 {
        font-size: 11.5px;
      }
      footer a,
      footer .footer-grid p {
        font-size: 11.5px;
      }
      .footer-bottom {
        font-size: 10.5px;
      }
      .cnpj {
        color: rgba(255, 255, 255, 0.56);
      }
      .report-brand span,
      .report-head > b,
      .progress > div,
      .report-foot,
      .note span {
        font-size: 10px;
      }
      .report-brand strong {
        font-size: 12.5px;
      }
      .report-item strong,
      .note strong {
        font-size: 10px;
      }
      .report-item small {
        font-size: 9.5px;
      }
      .report-item > b {
        font-size: 9px;
      }
      .syndics {
        padding-top: 0;
        padding-bottom: 78px;
        background: var(--surface);
      }
      .syndic-card {
        display: grid;
        grid-template-columns: 0.82fr 1.18fr;
        align-items: center;
        gap: 70px;
        padding: 46px 50px;
        border-radius: 28px;
        background: var(--navy);
        color: #fff;
        box-shadow: 0 28px 70px rgba(2, 15, 38, 0.18);
      }
      .syndic-card .eyebrow {
        margin-bottom: 14px;
        color: #8faeff;
      }
      .syndic-card h2 {
        margin: 0;
        font-size: clamp(30px, 3vw, 43px);
        font-weight: 800;
        letter-spacing: -0.04em;
        line-height: 1.08;
      }
      .syndic-card > div > p {
        margin: 18px 0 0;
        color: rgba(255, 255, 255, 0.76);
        font-size: 14px;
        line-height: 1.8;
      }
      .syndic-card ul {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 12px;
        margin: 0;
        padding: 0;
        list-style: none;
      }
      .syndic-card li {
        display: flex;
        align-items: flex-start;
        gap: 10px;
        padding: 15px;
        border: 1px solid rgba(205, 220, 255, 0.12);
        border-radius: 13px;
        background: rgba(64, 123, 255, 0.08);
        color: rgba(255, 255, 255, 0.9);
        font-size: 13px;
        font-weight: 800;
        line-height: 1.55;
      }
      .syndic-card li:last-child {
        grid-column: 1/-1;
      }
      .syndic-card li svg {
        width: 17px;
        min-width: 17px;
        margin-top: 2px;
        color: #8faeff;
      }
      .proof {
        border-bottom: 1px solid var(--border);
        background: #fff;
      }
      .proof-layout {
        display: grid;
        grid-template-columns: 1.08fr 0.92fr;
        align-items: center;
        gap: 90px;
      }
      .proof-copy {
        max-width: 690px;
        margin: 27px 0 22px;
        color: #35445b;
        font-family: Fraunces, Georgia, serif;
        font-size: 21px;
        font-weight: 510;
        line-height: 1.7;
      }
      .anonymous {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        color: #7b899d;
        font-size: 10.5px;
        font-weight: 800;
        text-transform: uppercase;
        letter-spacing: 0.08em;
      }
      .anonymous svg {
        width: 16px;
        min-width: 16px;
        color: var(--blue);
      }
      .proof-card {
        padding: 30px;
        border: 1px solid var(--border);
        border-radius: 25px;
        background: var(--surface);
        box-shadow: var(--shadow);
      }
      .proof-head {
        display: flex;
        align-items: center;
        gap: 14px;
        padding-bottom: 21px;
        border-bottom: 1px solid var(--border);
      }
      .proof-head > span {
        width: 48px;
        height: 48px;
        display: grid;
        place-items: center;
        border-radius: 14px;
        background: var(--soft);
        color: var(--blue);
      }
      .proof-head > span svg {
        width: 23px;
      }
      .proof-head > div {
        display: grid;
        line-height: 1.45;
      }
      .proof-head small {
        color: var(--muted);
        font-size: 10.5px;
        text-transform: uppercase;
        letter-spacing: 0.08em;
      }
      .proof-head strong {
        font-size: 14px;
      }
      .proof-card ul {
        display: grid;
        gap: 9px;
        margin: 20px 0;
        padding: 0;
        list-style: none;
      }
      .proof-card li {
        display: flex;
        align-items: center;
        gap: 10px;
        padding: 12px 13px;
        border: 1px solid var(--border);
        border-radius: 11px;
        background: #fff;
        color: #3a4960;
        font-size: 13px;
        font-weight: 800;
      }
      .proof-card li svg {
        width: 16px;
        min-width: 16px;
        color: #d39200;
      }
      .proof-result {
        display: flex;
        align-items: center;
        gap: 12px;
        padding: 16px;
        border-radius: 13px;
        background: var(--navy);
        color: #fff;
      }
      .proof-result > svg {
        width: 23px;
        min-width: 23px;
        color: #8faeff;
      }
      .proof-result p {
        display: grid;
        margin: 0;
        line-height: 1.45;
      }
      .proof-result strong {
        font-size: 12.5px;
      }
      .proof-result span {
        color: rgba(255, 255, 255, 0.76);
        font-size: 11.5px;
      }
      .float-whats {
        display: none;
      }
      .float-whats.is-obscured {
        visibility: hidden;
        opacity: 0;
        pointer-events: none;
        transform: translateY(12px);
      }
      .problem {
        padding-bottom: 80px;
      }
      @media (min-width: 901px) {
        .inspection {
          transform: scale(0.9);
          transform-origin: center right;
        }
      }
      @media (min-width: 621px) {
        .pain-grid article:nth-child(even) {
          transform: translateY(18px);
        }
        .pain-grid article:nth-child(even):hover {
          transform: translateY(14px);
        }
      }
      .button,
      .nav-wrap a,
      .faq-list summary {
        touch-action: manipulation;
      }
      @media (max-width: 1060px) {
        .nav-wrap {
          gap: 20px;
        }
        .hero h1 {
          font-size: clamp(40px, 5.5vw, 56px);
        }
      }
      @media (max-width: 900px) {
        .hero-layout {
          min-height: auto;
          grid-template-columns: 1fr;
          gap: 28px;
          padding: 68px 0 72px;
        }
        .syndic-card,
        .proof-layout {
          grid-template-columns: 1fr;
          gap: 40px;
        }
        .syndic-card {
          padding: 40px;
        }
        .proof-layout {
          gap: 48px;
        }
      }
      @media (max-width: 620px) {
        .section {
          padding: 68px 0;
        }
        .problem {
          padding-bottom: 56px;
        }
        .pain-grid article {
          min-height: 124px;
          padding: 20px;
        }
        .pain-grid p {
          margin-top: 18px;
        }
        .syndics {
          padding-top: 0;
          padding-bottom: 60px;
        }
        .hero-layout {
          padding: 54px 0 64px;
        }
        .hero h1 {
          font-size: clamp(34px, 10vw, 43px);
          line-height: 1.08;
        }
        .hero-emotional {
          font-size: 24px;
        }
        .hero-lead {
          font-size: 15.5px;
        }
        .syndic-card {
          padding: 30px 23px;
        }
        .syndic-card ul {
          grid-template-columns: 1fr;
        }
        .syndic-card li:last-child {
          grid-column: auto;
        }
        .proof-copy {
          font-size: 18px;
        }
        .proof-card {
          padding: 23px 18px;
        }
        .float-whats {
          display: flex;
          width: 50px;
          height: 50px;
          right: 12px;
          bottom: max(14px, env(safe-area-inset-bottom));
        }
        .button {
          min-height: 52px;
        }
        .anonymous {
          align-items: flex-start;
          line-height: 1.5;
        }
      }
      @media (max-width: 420px) {
        .container {
          width: calc(100% - 28px);
        }
        .header-cta {
          width: 44px;
          min-width: 44px;
          padding: 0;
        }
        .header-cta > svg:first-child {
          display: block;
        }
        .header-cta span {
          display: none;
        }
        .hero-layout {
          padding-top: 54px;
        }
        .hero h1 {
          font-size: clamp(34px, 10vw, 42px);
        }
        .hero-emotional {
          font-size: 22px;
        }
        .inspection {
          min-height: 455px;
        }
        .report-item > b {
          display: none;
        }
        .proof-card li,
        .syndic-card li {
          font-size: 12.5px;
        }
        .final-layout aside {
          padding: 22px;
        }
        .footer-bottom {
          margin-top: 36px;
        }
      }

      /* Teste interativo de prontidão da gestão */
      .readiness-test {
        position: relative;
        overflow: hidden;
        background: linear-gradient(180deg, var(--surface) 0%, #fff 100%);
      }
      .readiness-test:before {
        content: "";
        position: absolute;
        width: 520px;
        height: 520px;
        right: -280px;
        top: -250px;
        border-radius: 50%;
        background: radial-gradient(circle, rgba(64, 123, 255, 0.13), transparent 68%);
        pointer-events: none;
      }
      .test-layout {
        position: relative;
        display: grid;
        grid-template-columns: 0.78fr 1.22fr;
        align-items: start;
        gap: 72px;
      }
      .test-intro {
        position: sticky;
        top: 145px;
      }
      .test-intro h2 {
        margin: 0;
        font-size: clamp(35px, 3.7vw, 50px);
        font-weight: 800;
        letter-spacing: -0.045em;
        line-height: 1.06;
      }
      .test-intro > p {
        margin: 20px 0 0;
        color: var(--muted);
        font-size: 14px;
        line-height: 1.8;
      }
      .test-benefits {
        display: grid;
        gap: 11px;
        margin: 27px 0 0;
        padding: 0;
        list-style: none;
      }
      .test-benefits li {
        display: flex;
        align-items: center;
        gap: 10px;
        color: #35445b;
        font-size: 12.5px;
        font-weight: 800;
      }
      .test-benefits svg {
        width: 17px;
        min-width: 17px;
        color: var(--blue);
      }
      .quiz-card {
        min-height: 490px;
        padding: 34px;
        border: 1px solid var(--border);
        border-radius: 28px;
        background: #fff;
        box-shadow: 0 30px 75px rgba(2, 15, 38, 0.12);
      }
      .quiz-top {
        display: grid;
        grid-template-columns: 1fr auto;
        align-items: center;
        gap: 18px;
        margin-bottom: 34px;
      }
      .quiz-progress-label {
        display: flex;
        justify-content: space-between;
        gap: 18px;
        margin-bottom: 9px;
        color: var(--muted);
        font-size: 10.5px;
        font-weight: 800;
        letter-spacing: 0.05em;
        text-transform: uppercase;
      }
      .quiz-progress {
        height: 8px;
        overflow: hidden;
        border-radius: 99px;
        background: #e8eef8;
      }
      .quiz-progress > span {
        display: block;
        width: 16.666%;
        height: 100%;
        border-radius: inherit;
        background: linear-gradient(90deg, var(--blue2), #78a0ff);
        transition: width 0.35s ease;
      }
      .quiz-back {
        min-width: 42px;
        height: 42px;
        display: grid;
        place-items: center;
        border: 1px solid var(--border);
        border-radius: 12px;
        background: #fff;
        color: var(--muted);
        cursor: pointer;
        transition: 0.2s;
      }
      .quiz-back:hover:not(:disabled) {
        border-color: var(--blue);
        color: var(--blue);
      }
      .quiz-back:disabled {
        opacity: 0.35;
        cursor: not-allowed;
      }
      .quiz-back svg {
        width: 18px;
      }
      .quiz-question {
        animation: quiz-in 0.35s ease both;
      }
      .quiz-question[hidden] {
        display: none;
      }
      .quiz-question small {
        color: var(--blue);
        font-size: 10.5px;
        font-weight: 800;
        letter-spacing: 0.1em;
        text-transform: uppercase;
      }
      .quiz-question h3 {
        max-width: 660px;
        margin: 12px 0 30px;
        color: var(--ink);
        font-size: clamp(23px, 2.5vw, 31px);
        font-weight: 800;
        letter-spacing: -0.035em;
        line-height: 1.28;
      }
      .quiz-options {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 12px;
      }
      .quiz-option {
        min-height: 92px;
        display: grid;
        place-items: center;
        gap: 6px;
        padding: 16px;
        border: 1px solid var(--border);
        border-radius: 17px;
        background: var(--surface);
        color: #35445b;
        font: inherit;
        font-size: 13px;
        font-weight: 800;
        cursor: pointer;
        transition: 0.2s;
      }
      .quiz-option span:first-child {
        width: 27px;
        height: 27px;
        display: grid;
        place-items: center;
        border-radius: 50%;
        background: #fff;
        color: var(--blue);
        box-shadow: 0 4px 12px rgba(2, 15, 38, 0.07);
      }
      .quiz-option:hover,
      .quiz-option:focus-visible {
        border-color: var(--blue);
        background: var(--soft);
        color: var(--blue2);
        transform: translateY(-2px);
      }
      .quiz-result {
        animation: quiz-in 0.45s ease both;
      }
      .quiz-result[hidden] {
        display: none;
      }
      .result-badge {
        display: inline-flex;
        align-items: center;
        gap: 9px;
        padding: 8px 12px;
        border-radius: 99px;
        background: var(--soft);
        color: var(--blue2);
        font-size: 10.5px;
        font-weight: 800;
        letter-spacing: 0.06em;
        text-transform: uppercase;
      }
      .result-badge svg {
        width: 16px;
      }
      .quiz-result h3 {
        margin: 18px 0 14px;
        font-size: clamp(29px, 3vw, 39px);
        font-weight: 800;
        letter-spacing: -0.04em;
        line-height: 1.1;
      }
      .quiz-result > p {
        margin: 0;
        color: var(--muted);
        font-size: 14px;
        line-height: 1.8;
      }
      .result-action {
        margin: 24px 0 18px;
        padding: 18px 20px;
        border-left: 4px solid var(--blue);
        border-radius: 0 15px 15px 0;
        background: var(--surface);
        color: #35445b;
        font-size: 13px;
        font-weight: 800;
        line-height: 1.65;
      }
      .result-buttons {
        display: flex;
        align-items: center;
        gap: 15px;
      }
      .quiz-restart {
        border: 0;
        background: transparent;
        color: var(--muted);
        font: inherit;
        font-size: 11.5px;
        font-weight: 800;
        cursor: pointer;
        text-decoration: underline;
        text-underline-offset: 4px;
      }
      .quiz-disclaimer {
        display: flex;
        align-items: flex-start;
        gap: 8px;
        margin: 26px 0 0;
        color: #7b899d;
        font-size: 10.5px;
        line-height: 1.6;
      }
      .quiz-disclaimer svg {
        width: 15px;
        min-width: 15px;
        margin-top: 1px;
      }
      @keyframes quiz-in {
        from { opacity: 0; transform: translateY(12px); }
        to { opacity: 1; transform: translateY(0); }
      }
      @media (max-width: 900px) {
        .test-layout {
          grid-template-columns: 1fr;
          gap: 42px;
        }
        .test-intro {
          position: static;
        }
      }
      @media (max-width: 620px) {
        .quiz-card {
          min-height: 520px;
          padding: 25px 19px;
          border-radius: 22px;
        }
        .quiz-options {
          grid-template-columns: 1fr;
        }
        .quiz-option {
          min-height: 58px;
          grid-template-columns: auto 1fr;
          justify-items: start;
          gap: 11px;
          padding: 12px 14px;
        }
        .result-buttons {
          align-items: stretch;
          flex-direction: column;
        }
        .result-buttons .button {
          width: 100%;
        }
      }
      @media (prefers-reduced-motion: reduce) {
        .quiz-question,
        .quiz-result {
          animation: none;
        }
      }

      /* Integração com o site: a landing já possui CTAs próprios de WhatsApp. */
      .qlwapp {
        display: none !important;
      }
      @media (max-width: 420px) {
        .hero-layout {
          padding-top: 48px;
        }
      }
    