/* =========================================================
       QUANTOFATTURA
       DESIGN SYSTEM
       ========================================================= */

    :root {

      --coral: #E85D4A;
      --coral-deep: #C6432F;
      --coral-light: #F17B69;

      --coral-soft: #FBE9E5;
      --coral-mist: #FFF5F2;

      --ink: #22252B;
      --ink-soft: #6B625F;
      --ink-muted: #958D88;

      --bg: #FFFDF9;

      --surface: #F7F1E9;
      --surface-strong: #EFE4D8;

      --line: #E8DED5;

      --gold: #D9A441;
      --gold-deep: #8A6420;
      --gold-soft: #FBF3DF;

      --positive: #34785A;
      --positive-soft: #EAF4EE;

      --site-width: 1460px;

      --ease:
        cubic-bezier(.22,.8,.22,1);

      --ease-out:
        cubic-bezier(.16,1,.3,1);

    }


    /* =========================================================
       RESET
       ========================================================= */

    *,
    *::before,
    *::after {
      box-sizing: border-box;
    }


    html {
      scroll-behavior: smooth;
    }


    body {
      margin: 0;

      overflow-x: hidden;

      background:
        var(--bg);

      color:
        var(--ink);

      font-family:
        Inter,
        ui-sans-serif,
        system-ui,
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        sans-serif;

      -webkit-font-smoothing:
        antialiased;

      text-rendering:
        optimizeLegibility;
    }


    button,
    input {
      font: inherit;
    }


    button,
    a {
      -webkit-tap-highlight-color:
        transparent;
    }


    a {
      color: inherit;
    }


    /* =========================================================
       GLOBAL CONTAINER
       ========================================================= */

    .site-container,
    .header-inner {

      width:
        min(
          var(--site-width),
          calc(100% - 48px)
        );

      margin-inline:
        auto;

    }


    /* =========================================================
       HEADER
       ========================================================= */

    .qf-header {

      position:
        sticky;

      top:
        0;

      z-index:
        1000;

      width:
        100%;

      border-bottom:
        1px solid rgba(232,222,213,.68);

      background:
        rgba(255,253,249,.92);

      backdrop-filter:
        blur(18px)
        saturate(140%);

      -webkit-backdrop-filter:
        blur(18px)
        saturate(140%);

      transition:
        background 220ms ease,
        border-color 220ms ease,
        box-shadow 220ms ease;

    }


    .qf-header::before {

      content:
        "";

      position:
        absolute;

      top:
        0;

      left:
        0;

      right:
        0;

      height:
        3px;

      background:
        linear-gradient(
          90deg,
          var(--coral-deep),
          var(--coral),
          #F28A78
        );

    }


    .qf-header.is-scrolled {

      background:
        rgba(255,253,249,.98);

      border-bottom-color:
        var(--line);

      box-shadow:
        0 12px 36px rgba(34,37,43,.055);

    }


    .header-inner {

      height:
        76px;

      display:
        flex;

      align-items:
        center;

      gap:
        18px;

    }


    /* =========================================================
       LOGO
       ========================================================= */

    .logo {

      flex:
        0 0 auto;

      display:
        inline-flex;

      align-items:
        center;

      text-decoration:
        none;

      transition:
        transform 180ms var(--ease);

    }


    .logo:hover {

      transform:
        translateY(-1px);

    }


    .logo-placeholder {

      display:
        flex;

      align-items:
        center;

      gap:
        9px;

      font-size:
        21px;

      font-weight:
        790;

      letter-spacing:
        -.045em;

    }


    .logo-mark {

      width:
        35px;

      height:
        35px;

      display:
        grid;

      place-items:
        center;

      border-radius:
        10px;

      background:
        linear-gradient(
          145deg,
          var(--coral),
          var(--coral-deep)
        );

      color:
        #fff;

      font-size:
        12px;

      font-weight:
        850;

      box-shadow:
        0 6px 17px rgba(232,93,74,.21);

    }


    .logo-placeholder strong {
      color:
        var(--coral);
    }


    /* =========================================================
       NAV
       ========================================================= */

    .main-nav {

      margin-left:
        auto;

      display:
        flex;

      align-items:
        center;

      gap:
        3px;

    }


    .nav-link {

      position:
        relative;

      min-height:
        42px;

      padding:
        0 11px;

      display:
        inline-flex;

      align-items:
        center;

      border-radius:
        10px;

      color:
        var(--ink-soft);

      text-decoration:
        none;

      font-size:
        14px;

      font-weight:
        590;

      white-space:
        nowrap;

      transition:
        background 170ms ease,
        color 170ms ease;

    }


    .nav-link::after {

      content:
        "";

      position:
        absolute;

      left:
        12px;

      right:
        12px;

      bottom:
        4px;

      height:
        2px;

      border-radius:
        99px;

      background:
        var(--coral);

      transform:
        scaleX(0);

      transition:
        transform 220ms var(--ease);

    }


    .nav-link:hover {

      background:
        var(--coral-mist);

      color:
        var(--ink);

    }


    .nav-link:hover::after {

      transform:
        scaleX(1);

    }


    .header-divider {

      width:
        1px;

      height:
        25px;

      margin-inline:
        3px;

      background:
        var(--line);

    }


    /* =========================================================
       HEADER ACTIONS
       ========================================================= */

    .header-search {

      min-height:
        44px;

      padding:
        0 14px;

      display:
        inline-flex;

      align-items:
        center;

      gap:
        8px;

      border:
        1px solid rgba(232,93,74,.24);

      border-radius:
        12px;

      background:
        var(--coral-mist);

      color:
        var(--coral-deep);

      text-decoration:
        none;

      font-size:
        13px;

      font-weight:
        700;

      transition:
        background 180ms ease,
        transform 180ms var(--ease),
        box-shadow 180ms ease;

    }


    .header-search:hover {

      transform:
        translateY(-1px);

      background:
        var(--coral-soft);

      box-shadow:
        0 7px 20px rgba(232,93,74,.11);

    }


    .header-login {

      min-height:
        44px;

      padding:
        0 11px;

      display:
        inline-flex;

      align-items:
        center;

      text-decoration:
        none;

      font-size:
        13px;

      font-weight:
        650;

    }


    .header-register {

      min-height:
        46px;

      padding:
        0 17px;

      display:
        inline-flex;

      align-items:
        center;

      border-radius:
        12px;

      background:
        var(--coral);

      color:
        #fff;

      text-decoration:
        none;

      font-size:
        13px;

      font-weight:
        730;

      box-shadow:
        0 7px 20px rgba(232,93,74,.18);

      transition:
        transform 180ms var(--ease),
        background 180ms ease,
        box-shadow 180ms ease;

    }


    .header-register:hover {

      transform:
        translateY(-2px);

      background:
        var(--coral-deep);

      box-shadow:
        0 11px 26px rgba(198,67,47,.22);

    }


    /* =========================================================
       MOBILE HEADER
       ========================================================= */

    .mobile-toggle {

      display:
        none;

      position:
        relative;

      width:
        44px;

      height:
        44px;

      margin-left:
        auto;

      border:
        0;

      border-radius:
        11px;

      background:
        transparent;

      cursor:
        pointer;

    }


    .mobile-toggle span {

      position:
        absolute;

      left:
        11px;

      width:
        22px;

      height:
        2px;

      border-radius:
        99px;

      background:
        var(--ink);

      transition:
        top 220ms var(--ease),
        transform 220ms var(--ease);

    }


    .mobile-toggle span:first-child {
      top: 17px;
    }


    .mobile-toggle span:last-child {
      top: 25px;
    }


    .mobile-toggle.open
    span:first-child {

      top:
        21px;

      transform:
        rotate(45deg);

    }


    .mobile-toggle.open
    span:last-child {

      top:
        21px;

      transform:
        rotate(-45deg);

    }


    .mobile-menu {
      display:
        none;
    }


    /* =========================================================
       HERO
       ========================================================= */

    .hero {

      position:
        relative;

      overflow:
        hidden;

      min-height:
        calc(100vh - 76px);

      display:
        flex;

      align-items:
        center;

      padding:
        74px 0 94px;

      background:
        linear-gradient(
          180deg,
          #FFF4F0 0%,
          #FFF9F6 47%,
          var(--bg) 100%
        );

    }


    .hero::before {

      content:
        "";

      position:
        absolute;

      width:
        900px;

      height:
        900px;

      top:
        -530px;

      right:
        -250px;

      border-radius:
        50%;

      background:
        radial-gradient(
          circle,
          rgba(232,93,74,.17),
          rgba(232,93,74,.04) 45%,
          transparent 72%
        );

      pointer-events:
        none;

    }


    .hero::after {

      content:
        "";

      position:
        absolute;

      width:
        530px;

      height:
        530px;

      left:
        -270px;

      bottom:
        -270px;

      border-radius:
        50%;

      background:
        radial-gradient(
          circle,
          rgba(217,164,65,.10),
          transparent 70%
        );

      pointer-events:
        none;

    }


    .hero-grid {

      position:
        relative;

      z-index:
        2;

      display:
        grid;

      grid-template-columns:
        minmax(0,1fr)
        minmax(500px,.8fr);

      align-items:
        center;

      gap:
        clamp(60px,7vw,120px);

    }


    /* =========================================================
       HERO COPY
       ========================================================= */

    .hero-eyebrow {

      margin-bottom:
        21px;

      display:
        inline-flex;

      align-items:
        center;

      gap:
        9px;

      padding:
        7px 11px;

      border:
        1px solid rgba(232,93,74,.17);

      border-radius:
        999px;

      background:
        rgba(255,255,255,.72);

      color:
        var(--coral-deep);

      font-size:
        11px;

      font-weight:
        790;

      letter-spacing:
        .075em;

      text-transform:
        uppercase;

    }


    .hero-dot {

      width:
        7px;

      height:
        7px;

      border-radius:
        50%;

      background:
        var(--coral);

      box-shadow:
        0 0 0 5px rgba(232,93,74,.09);

    }


    .hero-title {

      max-width:
        850px;

      margin:
        0;

      font-size:
        clamp(58px,5.9vw,94px);

      line-height:
        .97;

      font-weight:
        795;

      letter-spacing:
        -.069em;

    }


    .hero-title em {

      position:
        relative;

      color:
        var(--coral);

      font-style:
        normal;

    }


    .hero-title em::after {

      content:
        "";

      position:
        absolute;

      left:
        3px;

      right:
        0;

      bottom:
        -6px;

      height:
        8px;

      border-radius:
        999px;

      background:
        linear-gradient(
          90deg,
          var(--coral),
          transparent
        );

      opacity:
        .24;

    }


    .hero-description {

      max-width:
        700px;

      margin:
        28px 0 0;

      color:
        var(--ink-soft);

      font-size:
        clamp(16px,1.4vw,19px);

      line-height:
        1.72;

    }


    .hero-description strong {

      color:
        var(--ink);

      font-weight:
        700;

    }


    /* =========================================================
       MAIN SEARCH
       ========================================================= */

    .hero-search {

      max-width:
        760px;

      margin-top:
        34px;

    }


    .search-shell {

      padding:
        8px;

      display:
        flex;

      align-items:
        center;

      gap:
        7px;

      border:
        1px solid rgba(232,93,74,.26);

      border-radius:
        16px;

      background:
        rgba(255,255,255,.96);

      box-shadow:
        0 14px 40px rgba(34,37,43,.08),
        0 0 0 5px rgba(232,93,74,.035);

      transition:
        border-color 180ms ease,
        box-shadow 180ms ease,
        transform 180ms var(--ease);

    }


    .search-shell:focus-within {

      border-color:
        rgba(232,93,74,.55);

      box-shadow:
        0 17px 45px rgba(34,37,43,.10),
        0 0 0 5px rgba(232,93,74,.07);

      transform:
        translateY(-1px);

    }


    .search-icon {

      width:
        45px;

      height:
        45px;

      display:
        grid;

      place-items:
        center;

      flex:
        0 0 auto;

      color:
        var(--coral);

      font-size:
        17px;

    }


    .search-input {

      min-width:
        0;

      flex:
        1;

      height:
        52px;

      border:
        0;

      outline:
        0;

      background:
        transparent;

      color:
        var(--ink);

      font-size:
        15px;

    }


    .search-input::placeholder {

      color:
        #AAA29D;

    }


    .search-submit {

      min-height:
        50px;

      padding:
        0 21px;

      border:
        0;

      border-radius:
        12px;

      background:
        var(--coral);

      color:
        #fff;

      cursor:
        pointer;

      font-size:
        13px;

      font-weight:
        740;

      white-space:
        nowrap;

      box-shadow:
        0 7px 17px rgba(232,93,74,.18);

      transition:
        background 180ms ease,
        transform 180ms var(--ease);

    }


    .search-submit:hover {

      transform:
        translateY(-1px);

      background:
        var(--coral-deep);

    }


    .search-help {

      margin:
        9px 0 0 5px;

      display:
        flex;

      align-items:
        center;

      gap:
        6px;

      color:
        var(--ink-muted);

      font-size:
        10px;

    }


    .search-help i {

      color:
        var(--coral);

    }


    /* =========================================================
       HERO TRUST
       ========================================================= */

    .hero-trust {

      margin-top:
        30px;

      display:
        flex;

      flex-wrap:
        wrap;

      gap:
        8px;

    }


    .hero-trust-item {

      min-height:
        34px;

      padding:
        0 11px;

      display:
        inline-flex;

      align-items:
        center;

      gap:
        7px;

      border:
        1px solid var(--line);

      border-radius:
        10px;

      background:
        rgba(255,255,255,.66);

      color:
        var(--ink-soft);

      font-size:
        10px;

      font-weight:
        650;

    }


    .hero-trust-item i {

      color:
        var(--coral);

    }


    /* =========================================================
       HERO VISUAL
       ========================================================= */

    .hero-product {

      position:
        relative;

      min-height:
        610px;

    }


    .product-window {

      position:
        absolute;

      top:
        35px;

      left:
        0;

      right:
        25px;

      bottom:
        25px;

      overflow:
        hidden;

      border:
        1px solid rgba(232,222,213,.9);

      border-radius:
        28px;

      background:
        rgba(255,255,255,.96);

      box-shadow:
        0 35px 85px rgba(34,37,43,.14);

      transform:
        rotate(1.7deg);

      transition:
        transform 600ms var(--ease-out);

    }


    .product-window:hover {

      transform:
        rotate(0deg)
        translateY(-5px);

    }


    .window-top {

      height:
        45px;

      padding:
        0 16px;

      display:
        flex;

      align-items:
        center;

      gap:
        6px;

      border-bottom:
        1px solid var(--line);

      background:
        #FBF9F6;

    }


    .window-dot {

      width:
        8px;

      height:
        8px;

      border-radius:
        50%;

      background:
        #D8D1CB;

    }


    .window-address {

      width:
        43%;

      height:
        23px;

      margin-left:
        8px;

      border-radius:
        7px;

      background:
        var(--surface);

    }


    .window-body {

      padding:
        25px;

    }


    .preview-heading {

      color:
        var(--ink-soft);

      font-size:
        9px;

      font-weight:
        760;

      letter-spacing:
        .07em;

      text-transform:
        uppercase;

    }


    .preview-company {

      margin-top:
        14px;

      padding-bottom:
        20px;

      display:
        flex;

      align-items:
        flex-start;

      gap:
        12px;

      border-bottom:
        1px solid var(--line);

    }


    .preview-company-icon {

      width:
        43px;

      height:
        43px;

      display:
        grid;

      place-items:
        center;

      border-radius:
        12px;

      background:
        var(--coral-soft);

      color:
        var(--coral-deep);

    }


    .preview-company-main {

      flex:
        1;

    }


    .preview-company-main h3 {

      margin:
        0;

      font-size:
        15px;

    }


    .preview-company-main p {

      margin:
        4px 0 0;

      color:
        var(--ink-soft);

      font-size:
        9px;

    }


    .active-tag {

      padding:
        5px 8px;

      border-radius:
        7px;

      background:
        var(--positive-soft);

      color:
        var(--positive);

      font-size:
        9px;

      font-weight:
        760;

    }


    .preview-kpis {

      margin-top:
        16px;

      display:
        grid;

      grid-template-columns:
        repeat(3,1fr);

      gap:
        8px;

    }


    .preview-kpi {

      padding:
        12px;

      border-radius:
        10px;

      background:
        var(--surface);

    }


    .preview-kpi small {

      display:
        block;

      color:
        var(--ink-soft);

      font-size:
        8px;

      text-transform:
        uppercase;

    }


    .preview-kpi strong {

      display:
        block;

      margin-top:
        4px;

      font-size:
        13px;

    }


    .preview-chart {

      margin-top:
        17px;

      padding:
        14px;

      border:
        1px solid var(--line);

      border-radius:
        12px;

    }


    .preview-chart-top {

      display:
        flex;

      align-items:
        center;

      justify-content:
        space-between;

      gap:
        10px;

    }


    .preview-chart-top strong {

      font-size:
        10px;

    }


    .preview-chart-top span {

      color:
        var(--positive);

      font-size:
        8px;

      font-weight:
        700;

    }


    .chart-bars {

      height:
        105px;

      margin-top:
        13px;

      display:
        flex;

      align-items:
        flex-end;

      gap:
        9px;

      border-bottom:
        1px solid var(--line);

    }


    .chart-bar {

      flex:
        1;

      min-width:
        10px;

      border-radius:
        5px 5px 0 0;

      background:
        var(--coral-soft);

    }


    .chart-bar:nth-child(1) {
      height: 43%;
    }

    .chart-bar:nth-child(2) {
      height: 50%;
    }

    .chart-bar:nth-child(3) {
      height: 61%;
    }

    .chart-bar:nth-child(4) {
      height: 68%;

      background:
        #F4B2A8;
    }

    .chart-bar:nth-child(5) {
      height: 78%;

      background:
        var(--coral-light);
    }

    .chart-bar:nth-child(6) {
      height: 92%;

      background:
        var(--coral);
    }


    /* FLOATING DATA */

    .float-data {

      position:
        absolute;

      z-index:
        5;

      right:
        -5px;

      top:
        0;

      width:
        192px;

      padding:
        16px;

      border:
        1px solid rgba(255,255,255,.75);

      border-radius:
        17px;

      background:
        rgba(255,253,249,.93);

      backdrop-filter:
        blur(16px);

      box-shadow:
        0 17px 45px rgba(34,37,43,.13);

      animation:
        floatingCard 5.7s ease-in-out infinite;

    }


    @keyframes floatingCard {

      0%,
      100% {
        transform:
          translateY(0)
          rotate(-1deg);
      }

      50% {
        transform:
          translateY(-10px)
          rotate(1deg);
      }

    }


    .float-data-icon {

      width:
        36px;

      height:
        36px;

      display:
        grid;

      place-items:
        center;

      border-radius:
        10px;

      background:
        var(--gold-soft);

      color:
        var(--gold-deep);

    }


    .float-data small {

      display:
        block;

      margin-top:
        11px;

      color:
        var(--ink-soft);

      font-size:
        9px;

      text-transform:
        uppercase;

    }


    .float-data strong {

      display:
        block;

      margin-top:
        3px;

      font-size:
        16px;

    }


    /* =========================================================
       DATA STRIP
       ========================================================= */

    .data-strip {

      padding:
        31px 0;

      border-top:
        1px solid var(--line);

      border-bottom:
        1px solid var(--line);

      background:
        #fff;

    }


    .data-strip-grid {

      display:
        grid;

      grid-template-columns:
        repeat(3,1fr);

    }


    .data-strip-item {

      position:
        relative;

      padding:
        8px 40px;

      display:
        flex;

      align-items:
        center;

      gap:
        15px;

    }


    .data-strip-item:first-child {
      padding-left:
        0;
    }


    .data-strip-item:not(:last-child)::after {

      content:
        "";

      position:
        absolute;

      top:
        5px;

      right:
        0;

      bottom:
        5px;

      width:
        1px;

      background:
        var(--line);

    }


    .strip-icon {

      width:
        45px;

      height:
        45px;

      display:
        grid;

      place-items:
        center;

      flex:
        0 0 auto;

      border-radius:
        12px;

      background:
        var(--coral-soft);

      color:
        var(--coral-deep);

    }


    .strip-value {

      display:
        block;

      font-size:
        25px;

      font-weight:
        790;

      letter-spacing:
        -.04em;

    }


    .strip-label {

      display:
        block;

      margin-top:
        2px;

      color:
        var(--ink-soft);

      font-size:
        11px;

    }


    /* =========================================================
       COMMON SECTION
       ========================================================= */

    .section {

      position:
        relative;

      padding:
        120px 0;

    }


    .section-kicker {

      margin-bottom:
        15px;

      display:
        inline-flex;

      align-items:
        center;

      gap:
        8px;

      color:
        var(--coral-deep);

      font-size:
        11px;

      font-weight:
        790;

      letter-spacing:
        .08em;

      text-transform:
        uppercase;

    }


    .section-kicker i {

      font-size:
        7px;

    }


    .section-title {

      max-width:
        900px;

      margin:
        0;

      font-size:
        clamp(40px,4.5vw,69px);

      line-height:
        1.03;

      letter-spacing:
        -.057em;

      font-weight:
        770;

    }


    .section-title em {

      color:
        var(--coral);

      font-style:
        normal;

    }


    .section-description {

      max-width:
        720px;

      margin:
        21px 0 0;

      color:
        var(--ink-soft);

      font-size:
        16px;

      line-height:
        1.72;

    }


    /* =========================================================
       WHAT YOU GET
       ========================================================= */

    .what-section {

      background:
        var(--bg);

    }


    .what-head {

      margin-bottom:
        55px;

    }


    .what-grid {

      display:
        grid;

      grid-template-columns:
        repeat(12,1fr);

      grid-auto-rows:
        minmax(250px,auto);

      gap:
        15px;

    }


    .what-card {

      position:
        relative;

      overflow:
        hidden;

      padding:
        27px;

      border:
        1px solid var(--line);

      border-radius:
        22px;

      background:
        #fff;

      text-decoration:
        none;

      transition:
        transform 270ms var(--ease-out),
        border-color 270ms ease,
        box-shadow 270ms ease;

    }


    .what-card:hover {

      transform:
        translateY(-6px);

      border-color:
        rgba(232,93,74,.26);

      box-shadow:
        0 18px 45px rgba(34,37,43,.07);

    }


    .what-card:nth-child(1) {

      grid-column:
        span 7;

    }


    .what-card:nth-child(2) {

      grid-column:
        span 5;

      background:
        var(--coral);

      color:
        #fff;

      border-color:
        var(--coral);

    }


    .what-card:nth-child(3) {

      grid-column:
        span 5;

      background:
        var(--gold-soft);

    }


    .what-card:nth-child(4) {

      grid-column:
        span 7;

    }


    .what-icon {

      width:
        46px;

      height:
        46px;

      display:
        grid;

      place-items:
        center;

      border-radius:
        13px;

      background:
        var(--coral-soft);

      color:
        var(--coral-deep);

      font-size:
        17px;

    }


    .what-card:nth-child(2)
    .what-icon {

      background:
        rgba(255,255,255,.16);

      color:
        #fff;

    }


    .what-card:nth-child(3)
    .what-icon {

      background:
        rgba(217,164,65,.16);

      color:
        var(--gold-deep);

    }


    .what-card h3 {

      max-width:
        520px;

      margin:
        34px 0 0;

      font-size:
        27px;

      line-height:
        1.15;

      letter-spacing:
        -.04em;

    }


    .what-card p {

      max-width:
        570px;

      margin:
        11px 0 0;

      color:
        var(--ink-soft);

      font-size:
        13px;

      line-height:
        1.65;

    }


    .what-card:nth-child(2)
    p {

      color:
        rgba(255,255,255,.78);

    }


    .what-link {

      position:
        absolute;

      right:
        25px;

      bottom:
        24px;

      width:
        37px;

      height:
        37px;

      display:
        grid;

      place-items:
        center;

      border-radius:
        10px;

      background:
        var(--coral-mist);

      color:
        var(--coral-deep);

      transition:
        transform 200ms var(--ease);

    }


    .what-card:hover
    .what-link {

      transform:
        translate(3px,-3px);

    }


    .what-card:nth-child(2)
    .what-link {

      background:
        rgba(255,255,255,.14);

      color:
        #fff;

    }


    /* =========================================================
       BIG COMPANIES
       ========================================================= */

    .companies-section {

      overflow:
        hidden;

      background:
        var(--ink);

      color:
        #fff;

    }


    .companies-section::before {

      content:
        "";

      position:
        absolute;

      width:
        750px;

      height:
        750px;

      top:
        -380px;

      right:
        -280px;

      border-radius:
        50%;

      background:
        radial-gradient(
          circle,
          rgba(232,93,74,.22),
          transparent 70%
        );

    }


    .companies-head {

      position:
        relative;

      z-index:
        2;

      margin-bottom:
        52px;

      display:
        flex;

      align-items:
        flex-end;

      justify-content:
        space-between;

      gap:
        50px;

    }


    .companies-section
    .section-title {

      color:
        #fff;

    }


    .companies-intro {

      max-width:
        470px;

      color:
        rgba(255,255,255,.58);

      font-size:
        13px;

      line-height:
        1.65;

    }


    .company-showcase {

      position:
        relative;

      z-index:
        2;

      display:
        grid;

      grid-template-columns:
        repeat(5,minmax(0,1fr));

      gap:
        12px;

    }


    .company-showcase-card {

      position:
        relative;

      overflow:
        hidden;

      min-height:
        305px;

      padding:
        22px;

      display:
        flex;

      flex-direction:
        column;

      border:
        1px solid rgba(255,255,255,.09);

      border-radius:
        20px;

      background:
        rgba(255,255,255,.045);

      text-decoration:
        none;

      transition:
        background 260ms ease,
        border-color 260ms ease,
        transform 260ms var(--ease-out);

    }


    .company-showcase-card:hover {

      transform:
        translateY(-6px);

      background:
        rgba(255,255,255,.075);

      border-color:
        rgba(232,93,74,.35);

    }


    .company-brand {

      width:
        43px;

      height:
        43px;

      display:
        grid;

      place-items:
        center;

      border-radius:
        12px;

      background:
        rgba(232,93,74,.13);

      color:
        #F18877;

      font-size:
        11px;

      font-weight:
        820;

      letter-spacing:
        -.02em;

    }


    .company-name {

      margin:
        22px 0 0;

      font-size:
        21px;

      letter-spacing:
        -.035em;

    }


    .company-year {

      margin-top:
        4px;

      color:
        rgba(255,255,255,.38);

      font-size:
        9px;

      text-transform:
        uppercase;

      letter-spacing:
        .06em;

    }


    .company-metrics {

      margin-top:
        auto;

      display:
        grid;

      gap:
        10px;

    }


    .company-metric {

      padding-top:
        11px;

      border-top:
        1px solid rgba(255,255,255,.08);

    }


    .company-metric span {

      display:
        block;

      color:
        rgba(255,255,255,.45);

      font-size:
        9px;

      text-transform:
        uppercase;

      letter-spacing:
        .05em;

    }


    .company-metric strong {

      display:
        block;

      margin-top:
        4px;

      font-size:
        17px;

      font-weight:
        690;

    }


    .company-card-arrow {

      position:
        absolute;

      top:
        21px;

      right:
        20px;

      color:
        rgba(255,255,255,.34);

      transition:
        color 180ms ease,
        transform 180ms var(--ease);

    }


    .company-showcase-card:hover
    .company-card-arrow {

      color:
        #fff;

      transform:
        translate(2px,-2px);

    }


    .company-source-note {

      position:
        relative;

      z-index:
        2;

      margin-top:
        17px;

      color:
        rgba(255,255,255,.38);

      font-size:
        9px;

      line-height:
        1.5;

    }


    /* =========================================================
       WHY US
       ========================================================= */

    .why-section {

      background:
        #FFF9F6;

    }


    .why-layout {

      display:
        grid;

      grid-template-columns:
        .75fr 1.25fr;

      gap:
        clamp(60px,8vw,130px);

      align-items:
        start;

    }


    .why-sticky {

      position:
        sticky;

      top:
        130px;

    }


    .why-grid {

      display:
        grid;

      grid-template-columns:
        repeat(2,1fr);

      gap:
        13px;

    }


    .why-card {

      min-height:
        245px;

      padding:
        24px;

      border:
        1px solid var(--line);

      border-radius:
        19px;

      background:
        #fff;

      transition:
        transform 230ms var(--ease-out),
        border-color 230ms ease,
        box-shadow 230ms ease;

    }


    .why-card:hover {

      transform:
        translateY(-5px);

      border-color:
        rgba(232,93,74,.24);

      box-shadow:
        0 16px 40px rgba(34,37,43,.055);

    }


    .why-icon {

      width:
        42px;

      height:
        42px;

      display:
        grid;

      place-items:
        center;

      border-radius:
        12px;

      background:
        var(--coral-soft);

      color:
        var(--coral-deep);

    }


    .why-card h3 {

      margin:
        28px 0 0;

      font-size:
        20px;

      letter-spacing:
        -.03em;

    }


    .why-card p {

      margin:
        9px 0 0;

      color:
        var(--ink-soft);

      font-size:
        12px;

      line-height:
        1.65;

    }


    /* =========================================================
       EXPLORE SITE
       ========================================================= */

    .explore-section {

      background:
        var(--bg);

    }


    .explore-head {

      margin-bottom:
        52px;

    }


    .explore-grid {

      display:
        grid;

      grid-template-columns:
        repeat(3,1fr);

      gap:
        14px;

    }


    .explore-card {

      position:
        relative;

      overflow:
        hidden;

      min-height:
        360px;

      padding:
        29px;

      display:
        flex;

      flex-direction:
        column;

      border:
        1px solid var(--line);

      border-radius:
        23px;

      background:
        #fff;

      text-decoration:
        none;

      transition:
        transform 280ms var(--ease-out),
        box-shadow 280ms ease,
        border-color 280ms ease;

    }


    .explore-card:hover {

      transform:
        translateY(-7px);

      border-color:
        rgba(232,93,74,.24);

      box-shadow:
        0 20px 50px rgba(34,37,43,.07);

    }


    .explore-card:nth-child(2) {

      background:
        var(--surface);

    }


    .explore-card:nth-child(3) {

      background:
        var(--coral-mist);

    }


    .explore-number {

      color:
        var(--ink-muted);

      font-size:
        10px;

      font-weight:
        800;

      letter-spacing:
        .09em;

    }


    .explore-icon {

      width:
        49px;

      height:
        49px;

      margin-top:
        30px;

      display:
        grid;

      place-items:
        center;

      border-radius:
        14px;

      background:
        var(--coral-soft);

      color:
        var(--coral-deep);

      font-size:
        17px;

    }


    .explore-card h3 {

      margin:
        auto 0 0;

      font-size:
        29px;

      letter-spacing:
        -.045em;

    }


    .explore-card p {

      margin:
        10px 0 0;

      color:
        var(--ink-soft);

      font-size:
        13px;

      line-height:
        1.6;

    }


    .explore-bottom {

      margin-top:
        24px;

      display:
        flex;

      align-items:
        center;

      justify-content:
        space-between;

      gap:
        15px;

      color:
        var(--coral-deep);

      font-size:
        12px;

      font-weight:
        720;

    }


    .explore-arrow {

      width:
        36px;

      height:
        36px;

      display:
        grid;

      place-items:
        center;

      border-radius:
        10px;

      background:
        var(--coral-soft);

      transition:
        transform 200ms var(--ease);

    }


    .explore-card:hover
    .explore-arrow {

      transform:
        translate(3px,-3px);

    }


    /* =========================================================
       SECOND SEARCH CTA
       ========================================================= */

    .search-cta-section {

      padding:
        20px 0 105px;

      background:
        var(--bg);

    }


    .search-cta {

      position:
        relative;

      overflow:
        hidden;

      padding:
        clamp(45px,6vw,78px);

      display:
        grid;

      grid-template-columns:
        .85fr 1.15fr;

      align-items:
        center;

      gap:
        60px;

      border:
        1px solid var(--line);

      border-radius:
        29px;

      background:
        #fff;

    }


    .search-cta::before {

      content:
        "";

      position:
        absolute;

      width:
        470px;

      height:
        470px;

      top:
        -300px;

      left:
        -180px;

      border-radius:
        50%;

      background:
        radial-gradient(
          circle,
          rgba(232,93,74,.12),
          transparent 70%
        );

    }


    .search-cta-copy,
    .search-cta-action {

      position:
        relative;

      z-index:
        2;

    }


    .search-cta h2 {

      margin:
        0;

      font-size:
        clamp(35px,3.8vw,57px);

      line-height:
        1.04;

      letter-spacing:
        -.052em;

    }


    .search-cta p {

      max-width:
        550px;

      margin:
        15px 0 0;

      color:
        var(--ink-soft);

      font-size:
        14px;

      line-height:
        1.65;

    }


    /* =========================================================
       CONTACT FINAL
       ========================================================= */

    .contact-section {

      padding:
        0 0 95px;

      background:
        var(--bg);

    }


    .contact-card {

      position:
        relative;

      overflow:
        hidden;

      padding:
        clamp(50px,7vw,92px);

      display:
        grid;

      grid-template-columns:
        1.2fr .8fr;

      align-items:
        center;

      gap:
        60px;

      border-radius:
        32px;

      background:
        var(--coral);

      color:
        #fff;

      box-shadow:
        0 28px 70px rgba(198,67,47,.20);

    }


    .contact-card::before {

      content:
        "";

      position:
        absolute;

      width:
        630px;

      height:
        630px;

      top:
        -320px;

      right:
        -260px;

      border-radius:
        50%;

      background:
        rgba(255,255,255,.09);

    }


    .contact-card::after {

      content:
        "";

      position:
        absolute;

      width:
        350px;

      height:
        350px;

      right:
        110px;

      bottom:
        -260px;

      border:
        1px solid rgba(255,255,255,.17);

      border-radius:
        50%;

    }


    .contact-copy,
    .contact-actions {

      position:
        relative;

      z-index:
        2;

    }


    .contact-card h2 {

      max-width:
        790px;

      margin:
        0;

      font-size:
        clamp(40px,4.8vw,70px);

      line-height:
        1.02;

      letter-spacing:
        -.058em;

    }


    .contact-card p {

      max-width:
        650px;

      margin:
        18px 0 0;

      color:
        rgba(255,255,255,.80);

      font-size:
        15px;

      line-height:
        1.65;

    }


    .contact-actions {

      display:
        flex;

      flex-direction:
        column;

      align-items:
        flex-end;

      gap:
        11px;

    }


    .contact-button {

      min-height:
        54px;

      padding:
        0 22px;

      display:
        inline-flex;

      align-items:
        center;

      justify-content:
        center;

      gap:
        9px;

      border-radius:
        13px;

      background:
        #fff;

      color:
        var(--coral-deep);

      text-decoration:
        none;

      font-size:
        14px;

      font-weight:
        760;

      box-shadow:
        0 10px 27px rgba(111,36,25,.14);

      transition:
        transform 190ms var(--ease);

    }


    .contact-button:hover {

      transform:
        translateY(-3px);

    }


    .contact-small {

      color:
        rgba(255,255,255,.72);

      font-size:
        11px;

    }


    /* =========================================================
       REVEAL ANIMATIONS
       ========================================================= */

    .reveal {

      opacity:
        0;

      transform:
        translateY(38px);

      transition:
        opacity 850ms var(--ease-out),
        transform 850ms var(--ease-out);

    }


    .reveal-left {

      transform:
        translateX(-44px);

    }


    .reveal-right {

      transform:
        translateX(44px);

    }


    .reveal-scale {

      transform:
        translateY(20px)
        scale(.96);

    }


    .reveal.visible {

      opacity:
        1;

      transform:
        translate(0,0)
        scale(1);

    }


    .delay-1 {
      transition-delay:
        80ms;
    }

    .delay-2 {
      transition-delay:
        150ms;
    }

    .delay-3 {
      transition-delay:
        220ms;
    }

    .delay-4 {
      transition-delay:
        290ms;
    }


    /* =========================================================
       HEADER RESPONSIVE
       ========================================================= */

    @media (max-width: 1220px) {

      .site-container,
      .header-inner {

        width:
          calc(100% - 32px);

      }


      .main-nav,
      .header-divider,
      .header-search,
      .header-login,
      .header-register {

        display:
          none;

      }


      .mobile-toggle {
        display:
          block;
      }


      .mobile-menu {

        display:
          grid;

        grid-template-rows:
          0fr;

        width:
          calc(100% - 24px);

        margin:
          0 auto;

        opacity:
          0;

        visibility:
          hidden;

        transition:
          grid-template-rows 280ms var(--ease),
          opacity 180ms ease,
          visibility 180ms ease,
          padding 180ms ease;

      }


      .mobile-menu.open {

        grid-template-rows:
          1fr;

        padding-bottom:
          13px;

        opacity:
          1;

        visibility:
          visible;

      }


      .mobile-menu-inner {
        overflow:
          hidden;
      }


      .mobile-menu-card {

        max-width:
          720px;

        margin:
          0 auto;

        padding:
          11px;

        border:
          1px solid var(--line);

        border-radius:
          17px;

        background:
          var(--bg);

        box-shadow:
          0 20px 45px rgba(34,37,43,.10);

      }


      .mobile-nav {

        display:
          grid;

      }


      .mobile-nav a {

        min-height:
          47px;

        padding:
          0 12px;

        display:
          flex;

        align-items:
          center;

        border-radius:
          10px;

        text-decoration:
          none;

        font-size:
          13px;

        font-weight:
          620;

      }


      .mobile-nav a:hover {

        background:
          var(--coral-mist);

        color:
          var(--coral-deep);

      }


      .mobile-actions {

        margin-top:
          8px;

        padding-top:
          10px;

        display:
          grid;

        grid-template-columns:
          1fr 1fr;

        gap:
          8px;

        border-top:
          1px solid var(--line);

      }


      .mobile-actions a {

        min-height:
          47px;

        display:
          flex;

        align-items:
          center;

        justify-content:
          center;

        border-radius:
          10px;

        text-decoration:
          none;

        font-size:
          13px;

        font-weight:
          710;

      }


      .mobile-login {

        border:
          1px solid var(--line);

        background:
          #fff;

      }


      .mobile-register {

        background:
          var(--coral);

        color:
          #fff;

      }

    }


    /* =========================================================
       TABLET
       ========================================================= */

    @media (max-width: 1050px) {

      .hero {

        min-height:
          auto;

      }


      .hero-grid {

        grid-template-columns:
          1fr;

        gap:
          60px;

      }


      .hero-copy {

        max-width:
          830px;

      }


      .hero-product {

        width:
          min(720px,100%);

        min-height:
          570px;

        margin-inline:
          auto;

      }


      .company-showcase {

        grid-template-columns:
          repeat(2,1fr);

      }


      .company-showcase-card:last-child {

        grid-column:
          span 2;

      }


      .why-layout {

        grid-template-columns:
          1fr;

        gap:
          50px;

      }


      .why-sticky {

        position:
          static;

      }


      .explore-grid {

        grid-template-columns:
          1fr;

      }


      .explore-card {

        min-height:
          300px;

      }


      .search-cta,
      .contact-card {

        grid-template-columns:
          1fr;

        gap:
          33px;

      }


      .contact-actions {

        align-items:
          flex-start;

      }

    }


    /* =========================================================
       MOBILE
       ========================================================= */

    @media (max-width: 680px) {

      .site-container,
      .header-inner {

        width:
          calc(100% - 28px);

      }


      .header-inner {

        height:
          68px;

      }


      .logo-placeholder {

        font-size:
          18px;

      }


      .logo-mark {

        width:
          32px;

        height:
          32px;

        font-size:
          10px;

      }


      .hero {

        padding:
          48px 0 70px;

      }


      .hero-title {

        font-size:
          clamp(47px,13.5vw,66px);

      }


      .hero-description {

        font-size:
          15px;

      }


      .search-shell {

        display:
          grid;

        grid-template-columns:
          42px 1fr;

      }


      .search-submit {

        grid-column:
          1 / -1;

        width:
          100%;

      }


      .hero-product {

        min-height:
          450px;

      }


      .product-window {

        right:
          0;

        top:
          25px;

        bottom:
          10px;

      }


      .window-body {

        padding:
          17px;

      }


      .float-data {

        width:
          160px;

        padding:
          13px;

      }


      .preview-kpis {

        grid-template-columns:
          1fr 1fr;

      }


      .preview-kpi:last-child {

        grid-column:
          span 2;

      }


      .data-strip-grid {

        grid-template-columns:
          1fr;

      }


      .data-strip-item {

        padding:
          17px 0;

      }


      .data-strip-item:not(:last-child)::after {

        top:
          auto;

        left:
          0;

        right:
          0;

        bottom:
          0;

        width:
          auto;

        height:
          1px;

      }


      .section {

        padding:
          82px 0;

      }


      .what-grid {

        grid-template-columns:
          1fr;

        grid-auto-rows:
          auto;

      }


      .what-card:nth-child(1),
      .what-card:nth-child(2),
      .what-card:nth-child(3),
      .what-card:nth-child(4) {

        grid-column:
          auto;

      }


      .what-card {

        min-height:
          260px;

      }


      .companies-head {

        display:
          block;

      }


      .companies-intro {

        margin-top:
          20px;

      }


      .company-showcase {

        grid-template-columns:
          1fr;

      }


      .company-showcase-card:last-child {

        grid-column:
          auto;

      }


      .company-showcase-card {

        min-height:
          250px;

      }


      .why-grid {

        grid-template-columns:
          1fr;

      }


      .explore-card {

        min-height:
          280px;

      }


      .search-cta {

        padding:
          34px 20px;

        border-radius:
          22px;

      }


      .contact-section {

        padding-bottom:
          70px;

      }


      .contact-card {

        padding:
          40px 25px;

        border-radius:
          23px;

      }


      .contact-button {

        width:
          100%;

      }


      .mobile-actions {

        grid-template-columns:
          1fr;

      }

    }


    /* =========================================================
       REDUCED MOTION
       ========================================================= */

    @media (prefers-reduced-motion: reduce) {

      *,
      *::before,
      *::after {

        scroll-behavior:
          auto !important;

        animation-duration:
          .01ms !important;

        transition-duration:
          .01ms !important;

      }


      .reveal {

        opacity:
          1;

        transform:
          none;

      }

    }