button, input, textarea { font: inherit; }

    .section { position: relative; padding: 64px 0; }
    .section.pattern::before {
      content: "";
      position: absolute;
      inset: 0;
      pointer-events: none;
      opacity: .045;
      background-image: radial-gradient(#8dad94 .8px, transparent .8px);
      background-size: 28px 28px;
    }

    #applications,#contact-reasons,#faq{background-color:#f5f6f4}

    .card {
      background: #fff;
      box-shadow: 0 10px 35px rgba(17,24,39,.04);
      border: 1px solid #E3E8E3;
    }

    .eyebrow-line { width: 64px; height: 4px; background: #367766; margin-bottom: 12px; }
    .eyebrow {
      margin: 0;
      color: #367766;
      font-size: 11px;
      font-weight: 700;
      letter-spacing: .22em;
      text-transform: uppercase;
    }
    .section-title {
      margin: 8px 0 0;
      font-size: clamp(30px, 4vw, 42px);
      line-height: 1.05;
      font-weight: 900;
      letter-spacing: -.04em;
      color: #121212;
    }
    .section-desc {
      margin: 16px 0 0;
      max-width: 780px;
      font-size: 15px;
      line-height: 1.9;
      color: #666666;
    }



    .btn {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 10px;
      height: 44px;
      padding: 0 26px;
      border: 0;
      font-size: 10px;
      font-weight: 700;
      letter-spacing: .17em;
      text-transform: uppercase;
      transition: .2s ease;
      white-space: nowrap;
      cursor: pointer;
    }
    .btn-primary { background: #367766; color: #fff; }
    .btn-primary:hover { background: #367766; }
    .btn-ghost { background: rgba(255,255,255,.10); color: #fff; border: 1px solid rgba(255,255,255,.28); }
    .btn-ghost:hover { background: rgba(255,255,255,.15); }

    header {
      position: sticky;
      top: 0;
      z-index: 50;
      box-shadow: 0 1px 0 rgba(255,255,255,.08);
    }
    .nav-bar {
      background: #367766;
      border-bottom: 1px solid rgba(255,255,255,.10);
      color: #fff;
    }
    .nav-inner {
      min-height: var(--header-h);
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 24px;
      padding: 12px 0;
    }
    .logo {
      font-size: 34px;
      line-height: 1;
      font-weight: 900;
      letter-spacing: -.03em;
      white-space: nowrap;
    }
    .logo .bella { color: #fff; }
    .logo .ex { color: #367766; }
    .nav-bar .logo { padding: 0; }

    .nav-links {
      display: flex;
      align-items: center;
      gap: 20px;
      font-size: 10px;
      font-weight: 700;
      letter-spacing: .16em;
      text-transform: uppercase;
      color: rgba(255,255,255,.95);
    }
    .nav-links a:hover { opacity: .78; }

    .nav-right {
      position: relative;
      display: flex;
      align-items: center;
      gap: 12px;
    }
    .search-btn {
      width: 36px;
      height: 36px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      border: 1px solid rgba(255,255,255,.25);
      background: transparent;
      color: #fff;
      cursor: pointer;
      transition: .2s ease;
    }
    .search-btn:hover { background: rgba(255,255,255,.10); }
    .search-btn svg { width: 16px; height: 16px; }

    .search-panel {
      position: absolute;
      top: calc(100% + 12px);
      right: 0;
      z-index: 60;
      width: 320px;
      display: none;
      border: 1px solid #DCE7DE;
      background: #fff;
      color: #121212;
      box-shadow: 0 18px 40px rgba(17,24,39,.14);
      padding: 16px;
    }
    .search-panel.open { display: block; }

    .search-results {
      margin-top: 12px;
      max-height: 280px;
      overflow: auto;
      display: grid;
      gap: 8px;
    }
    .search-result {
      width: 100%;
      display: flex;
      align-items: center;
      justify-content: space-between;
      border: 1px solid #E2E8F0;
      background: #fff;
      padding: 12px;
      font-size: 14px;
      color: #666666;
      cursor: pointer;
      transition: .2s ease;
    }
    .search-result:hover {
      border-color: #B7D9C0;
      background: #F8FBF9;
      color: #367766;
    }

    .hero {
      position: relative;
      overflow: hidden;
      border-bottom: 1px solid rgba(255,255,255,.10);
      background: linear-gradient(90deg,rgba(19,29,37,.94),rgba(26,37,46,.84)), linear-gradient(135deg,#495762 0%,#8e9498 55%,#b9b9b9 100%);
      color: #fff;
    }
    .hero::before {
      content: "";
      position: absolute;
      inset: 0;
      background: radial-gradient(circle at top left,rgba(16,149,60,.24),transparent 28%), radial-gradient(circle at top right,rgba(255,216,76,.10),transparent 20%);
    }
    .hero-grid {
      position: relative;
      display: grid;
      gap: 40px;
      padding: 48px 15px 64px;
      grid-template-columns: 1.08fr .92fr;
    }
    .hero-tag {
      display: inline-block;
      margin-bottom: 20px;
      padding: 6px 12px;
      background: #367766;
      font-size: 10px;
      font-weight: 700;
      letter-spacing: .14em;
      text-transform: uppercase;
    }
    .hero h1 {
      margin: 0;
      max-width: 660px;
      font-size: clamp(34px, 4.8vw, 35px);
      line-height: 1.02;
      font-weight: 900;
      letter-spacing: -.035em;
      color: #fff;
    }
    .hero-copy {
      margin: 24px 0 0;
      max-width: 700px;
      font-size: 15px;
      line-height: 2.1;
      color: rgba(255,255,255,.84);
    }
    .hero-copy br { display: none; }

    .quick-grid {
      display: grid;
      max-width: 760px;
      gap: 8px;
      grid-template-columns: repeat(4, 1fr);
      margin-top: 24px;
    }
    .quick-link {
      position: relative;
      overflow: hidden;
      display: flex;
      align-items: center;
      min-height: 60px;
      padding: 12px 16px;
      border: 1px solid rgba(255,255,255,.10);
      background: rgba(255,255,255,.08);
      backdrop-filter: blur(2px);
      transition: .2s ease;
    }
    .quick-link:hover {
      border-color: rgba(255,255,255,.18);
      background: rgba(255,255,255,.12);
    }
    .quick-link p {
      position: relative;
      margin: 0;
      font-size: 13px;
      font-weight: 600;
      line-height: 1.45;
      color: rgba(255,255,255,.88);
    }
    .quick-link::after {
      content: "";
      position: absolute;
      left: 0;
      right: 0;
      bottom: 0;
      height: 2px;
      background: #367766;
    }
    .hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 24px; }

    .hero-form-wrap { display: flex; align-items: flex-start; justify-content: flex-end; }
    .hero-form {
      width: 100%;
      max-width: 420px;
      border: 1px solid rgba(255,255,255,.20);
      box-shadow: 0 20px 50px rgba(0,0,0,.18);
      background: #fff;
      color: #121212;
    }
    .hero-form-head {
      display: flex;
      align-items: flex-start;
      justify-content: space-between;
      gap: 16px;
      padding: 24px 24px 16px;
    }
    .hero-form-head h3 {
      margin: 0;
      font-size: 22px;
      font-weight: 900;
      letter-spacing: -.03em;
      text-transform: uppercase;
      line-height: 1.35;
    }
    .short-tag {
      min-width: 78px;
      padding: 8px 12px;
      background: #367766;
      color: #fff;
      font-size: 10px;
      font-weight: 700;
      letter-spacing: .14em;
      text-transform: uppercase;
      line-height: 1.4;
      text-align: center;
    }
    .hero-form-body { padding: 0 24px 24px; display: grid; gap: 14px; }

	.hero-form-body > div{position: relative;}


    .field, .textarea {
      width: 100%;
      border: 1px solid #CBD5E1;
      background: #fff;
      color: #121212;
      padding: 12px 14px;
      outline: 0;
      font-size: 14px;
    }
    .field:focus, .textarea:focus {
      border-color: #9DCAB1;
      box-shadow: 0 0 0 3px rgba(16,149,60,.08);
    }
    .textarea { min-height: 112px; resize: vertical; }

    .stats-band {background: #367766;color: #fff;padding: 16px 0;}
    .stats-grid {
      margin: 0 auto;
      display: grid;
      gap: 16px;
      grid-template-columns: repeat(5, 1fr);
    }
    .stat-card {
      min-height: 92px;
      border: 1px solid rgba(255,255,255,.08);
      background: #41907c;
      padding: 16px 32px;
      box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
    }
    .stat-value {
      font-size: 24px;
      line-height: 1;
      font-weight: 900;
      letter-spacing: -.03em;
      color: #fff;
    }
    .stat-label {
      margin-top: 12px;
      font-size: 14px;
      line-height: 1.45;
      color: rgba(255,255,255,.88);
    }

    .fit-grid {
      display: grid;
      gap: 24px;
      margin-top: 40px;
      grid-template-columns: repeat(4, 1fr);
    }
    .fit-card { padding: 28px; }
    .thumb-btn {
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 0;
      overflow: hidden;
      border: 1px solid #D8E5DC;
      background: #EEF5F0;
      box-shadow: 0 4px 14px rgba(17,24,39,.04);
      transition: .2s ease;
      cursor: pointer;
      appearance: none;
      -webkit-appearance: none;
      line-height: 0;
    }
    .thumb-btn:hover { border-color: #9DCCB0; }
    .thumb-btn img {
      display: block;
      width: 100%;
      height: 100%;
      object-fit: contain;
      object-position: center;
      background: #EEF5F0;
      transition: transform .2s ease;
    }
    .thumb-btn:hover img { transform: scale(1.02); }
    .fit-thumb { width: 132px;  margin-bottom: 20px; }
    .fit-card h3 {
      margin: 0;
      font-size: 24px;
      line-height: 1.15;
      font-weight: 900;
      letter-spacing: -.03em;
      color: #121212;
    }
    .fit-card p {
      margin: 16px 0 0;
      font-size: 14px;
      line-height: 2;
      color: #666666;
    }
    .fit-note { margin-top: 16px; font-size: 12px; font-weight: 700; color: #367766; }

    .materials-box {
      margin-top: 28px;
      padding: 32px 48px;
      border: 1px solid #BFE8D1;
      background: #EAF6EF;
      box-shadow: 0 10px 30px rgba(17,24,39,.03);
    }
    .materials-grid {
      display: grid;
      gap: 16px 32px;
      grid-template-columns: 1.15fr .85fr;
      align-items: center;
    }
    .materials-box h3 {
      margin: 0;
      font-size: 34px;
      line-height: 1.05;
      font-weight: 900;
      letter-spacing: -.03em;
    }
    .materials-box p {
      margin: 20px 0 0;
      max-width: 48rem;
      font-size: 15px;
      line-height: 1.9;
      color: #666666;
    }
    .material-wrap {
      display: flex;
      flex-wrap: wrap;
      gap: 12px;
      justify-content: flex-end;
    }
    .material-chip {
      padding: 12px 24px;
      border: 1px solid #8DE3B0;
      background: rgba(255,255,255,.65);
      color: #187F4A;
      font-size: 15px;
      font-weight: 700;
      letter-spacing: -.01em;
      box-shadow: 0 2px 10px rgba(16,149,60,.04);
      cursor: pointer;
      transition: .2s ease;
    }
    .material-chip:hover { border-color: #58C57F; background: #fff; transform: translateY(-2px) scale(1.02); }
    .material-chip:active { transform: scale(.98); }
    .material-chip.active {
      border-color: #367766;
      background: #367766;
      color: #fff;
      box-shadow: 0 8px 18px rgba(16,149,60,.18);
    }
    .material-note {
      margin: 0;
      font-size: 12px;
      font-weight: 500;
      color: #4F7A60;
      text-align: right;
    }

    .process-grid {
      display: grid;
      gap: 32px;
      align-items: stretch;
      grid-template-columns: .88fr 1.12fr;
    }
    .process-left { display: flex; flex-direction: column; }
    .process-list { margin-top: 32px; display: grid; gap: 12px; }
    .process-link {
      display: flex;
      align-items: center;
      gap: 16px;
      padding: 16px;
      border: 1px solid #E2E8E3;
      background: #fff;
      box-shadow: 0 8px 20px rgba(17,24,39,.03);
      transition: .2s ease;
    }
    .process-link:hover { border-color: #B7D9C0; background: #FAFCFA; }
    .process-num {
      width: 32px;
      height: 32px;
      display: flex;
      align-items: center;
      justify-content: center;
      background: #367766;
      color: #fff;
      font-size: 14px;
      font-weight: 700;
      flex: 0 0 auto;
    }
    .process-name { flex: 1; font-size: 14px; font-weight: 500; color: #1F2937; }
    .chev { width: 16px; height: 16px; color: #94A3B8; }

    .process-right { display: flex; flex-direction: column; gap: 16px; height: 100%; }
    .process-preview {
      position: relative;
      height: 260px;
      overflow: hidden;
      border: 1px solid #CFE3D5;
      background: #F2F7F3;
      box-shadow: 0 10px 30px rgba(17,24,39,.03);
      cursor: pointer;
      transition: .2s ease;
    }
    .process-preview:hover { border-color: #9DCCB0; }
    .process-preview img { width: 100%; height: 100%; object-fit: contain; object-position: center; background: #FFFFFF; transition: transform .3s ease; }
    .process-preview:hover img { transform: scale(1.02); }
    .process-preview::after {
      content: "";
      position: absolute;
      inset: 0;
      background: linear-gradient(180deg, rgba(255,255,255,.08), rgba(15,23,42,.04));
    }
    .process-overlay {
      position: absolute;
      left: 0;
      right: 0;
      bottom: 0;
      z-index: 2;
      padding: 20px 24px;
      color: #fff;
      background: linear-gradient(180deg, transparent, rgba(15,23,42,.48));
      text-align: left;
    }
    .process-overlay .small {
      font-size: 11px;
      font-weight: 700;
      letter-spacing: .18em;
      text-transform: uppercase;
      color: rgba(255,255,255,.8);
    }
    .process-overlay .title {
      margin-top: 8px;
      font-size: 14px;
      font-weight: 600;
      line-height: 1.6;
      color: rgba(255,255,255,.95);
    }
    .proof-heading {
      margin: 8px 0 0;
      font-size: 28px;
      line-height: 1.15;
      font-weight: 900;
      font-style: italic;
      letter-spacing: -.03em;
      color: #64748B;
    }
    .machine-grid {
      display: grid;
      gap: 20px;
      grid-template-columns: repeat(2, 1fr);
      /* grid-auto-rows: 1fr; */
      flex: 1;
    }
    .machine-card {
      height: 100%;
      padding: 28px;
      border: 1px solid #E2E8E3;
      background: #F8FBF9;
      box-shadow: 0 10px 30px rgba(17,24,39,.03);
    }
    .machine-card.primary {
      border-color: #367766;
      background: #367766;
      color: #fff;
    }
    .machine-head { display: flex; align-items: flex-start; gap: 20px; margin-bottom: 24px; }
    .machine-thumb { width: 132px; height: 88px; flex: 0 0 auto; }
    .machine-card h4 {
      margin: 4px 0 0;
      font-size: 20px;
      line-height: 1.15;
      font-weight: 900;
      letter-spacing: -.03em;
      color:#333
    }
    .machine-card.primary h4{color:#fff}
    .machine-card p {
      margin: 24px 0 0;
      font-size: 15px;
      line-height: 2;
      color: #666666;
    }
    .machine-card.primary p { color: rgba(255,255,255,.80); }

    .why-section {
      background: #102821;
      color: #fff;
    }
    .why-grid {
      min-height: 360px;
      display: grid;
      grid-template-columns: .4fr .6fr;
    }
    .why-left {
      position: relative;
      overflow: hidden;
      background: #367766;
    }
    .why-left::before {
      
    }
    .why-left::after {
      
    }
    .why-left-inner {
      position: relative;
      height: 100%;
      display: flex;
      align-items: center;
      justify-content: flex-start;
      padding: 56px 64px;
    }
    .why-left p {
      margin: 0;
      font-size: 44px;
      line-height: 1;
      font-weight: 500;
      letter-spacing: -.03em;
      text-transform: uppercase;
    }
    .why-right {
      position: relative;
      min-height: 360px;
      overflow: hidden;
      background: #E5EBE6;
    }
    .why-video-label {
      position: absolute;
      left: 20px;
      top: 16px;
      z-index: 10;
      color: rgba(255,255,255,.90);
    }
    .why-video-label p { margin: 0; font-size: 13px; font-weight: 600; }
    .why-video-label small { display: block; margin-top: 2px; font-size: 12px; color: rgba(255,255,255,.72); }
    .why-right iframe {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      border: 0;
      background: #E5EBE6;
    }
    .vertical-links {
      position: absolute;
      top: 16px;
      right: 12px;
      z-index: 10;
      display: flex;
      flex-direction: column;
      gap: 8px;
    }
    .vertical-links a {
      padding: 12px 8px;
      font-size: 10px;
      font-weight: 700;
      letter-spacing: .16em;
      text-transform: uppercase;
      writing-mode: vertical-rl;
      text-orientation: mixed;
      transition: .2s ease;
    }
    .vertical-links a:first-child { background: rgba(0,0,0,.70); color: #fff; }
    .vertical-links a:first-child:hover { background: rgba(0,0,0,.80); }
    .vertical-links a:last-child { background: #ff2a24; color: #fff; }
    .vertical-links a:last-child:hover { background: #e12621; }

    .benefit-grid {
      display: grid;
      gap: 24px;
      margin-top: 40px;
      grid-template-columns: repeat(4, 1fr);
    }
    .benefit-card { padding: 24px; }
    .benefit-icon {
      width: 40px;
      height: 40px;
      display: flex;
      align-items: center;
      justify-content: center;
      border-radius: 999px;
      background: #E8F6EC;
      color: #367766;
      margin-bottom: 20px;
    }
    .benefit-card h3 { margin: 0; font-size: 18px; font-weight: 900; color: #121212; }
    .benefit-card p { margin: 16px 0 0; font-size: 14px; line-height: 2; color: #666666; }

    .proof-grid {
      display: grid;
      gap: 24px;
      margin-top: 40px;
      grid-template-columns: repeat(2, 1fr);
    }
    .proof-card-link {
      display: block;
      overflow: hidden;
      border: 1px solid #E3E8E3;
      background: #fff;
      box-shadow: 0 12px 35px rgba(17,24,39,.04);
      transition: .2s ease;
    }
    .proof-card-link:hover {
      transform: translateY(-1px);
      box-shadow: 0 16px 40px rgba(17,24,39,.07);
    }
    .proof-card {
      display: grid;
      min-height: 218px;
      grid-template-columns: 78px 1fr;
      height: 100%;
    }
    .proof-side {
      display: flex;
      align-items: center;
      justify-content: center;
      color: #fff;
    }
    .proof-side.green { background: linear-gradient(180deg,#367766,#367766); }
    .proof-side.deep { background: linear-gradient(180deg,#367766,#367766); }
    .proof-side svg { width: 28px; height: 28px; }
    .proof-body { padding: 28px; }
    .proof-body h3 {
      margin: 0;
      font-size: 24px;
      line-height: 1.15;
      font-weight: 900;
      letter-spacing: -.03em;
      color: #163129;
    }
    .proof-sub {
      margin: 12px 0 0;
      font-size: 13px;
      font-weight: 600;
      line-height: 1.7;
      color: #367766;
    }
    .proof-list { display: grid; gap: 10px; margin-top: 18px; }
    .proof-item {
      display: flex;
      align-items: flex-start;
      gap: 10px;
      font-size: 14px;
      line-height: 1.8;
      color: #666666;
    }
    .proof-item svg { flex: 0 0 auto; width: 16px; height: 16px; margin-top: 6px; color: #367766; }

    .cases-grid {
      display: grid;
      gap: 24px;
      margin-top: 40px;
      grid-template-columns: .95fr 1.05fr;
      align-items: start;
    }
    .project-video-card { overflow: hidden; }
    .project-video-inner {
      position: relative;
      min-height: 430px;
      overflow: hidden;
      border: 1px solid #DDEFE2;
      background: #000;
    }
    .project-video-label {
      position: absolute;
      left: 20px;
      top: 20px;
      z-index: 10;
      padding: 14px 18px;
      background: rgba(255,255,255,.92);
      color: #64748B;
      font-size: 18px;
      font-weight: 600;
      box-shadow: 0 4px 12px rgba(17,24,39,.06);
      backdrop-filter: blur(4px);
    }
    .project-video-label p { margin: 0; font-size: 18px; font-weight: 600; color: #64748B; }
    .project-video-label small { display: block; margin-top: 4px; font-size: 12px; font-weight: 500; color: #64748B; opacity: .82; line-height: 1.35; }
    .project-video-inner iframe {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      border: 0;
    }

    .case-stack { display: grid; gap: 20px; }
    .case-card { overflow: hidden; }
    .case-grid {
      display: grid;
      gap: 20px;
      padding: 24px;
      grid-template-columns: 240px 1fr;
      align-items: start;
    }
    .case-thumb {
      width: 100%;
      height: 168px;
    }
    .badge {
      display: inline-flex;
      padding: 8px 16px;
      border-radius: 999px;
      background: #E8F6EC;
      font-size: 14px;
      font-weight: 700;
      letter-spacing: -.01em;
      color: #367766;
    }
    .case-card h3 {
      margin: 16px 0 0;
      font-size: 24px;
      line-height: 1.12;
      font-weight: 900;
      letter-spacing: -.03em;
      color: #163129;
    }
    .case-card p {
      margin: 14px 0 0;
      font-size: 16px;
      line-height: 1.7;
      color: var(--slate);
    }
    .case-link {
      margin-top: 20px;
      display: inline-flex;
      align-items: center;
      gap: 8px;
      font-size: 15px;
      font-weight: 900;
      color: #367766;
      transition: .2s ease;
    }
    .case-link:hover { color: #367766; }

    .faq-grid {
      display: grid;
      gap: 24px;
      margin-top: 40px;
      grid-template-columns: .92fr 1.08fr;
    }
    .faq-list { display: grid; gap: 16px; }
    .faq-card { padding: 20px; }
    .faq-row { display: flex; gap: 16px; }
    .faq-num {
      width: 32px;
      height: 32px;
      flex: 0 0 auto;
      display: flex;
      align-items: center;
      justify-content: center;
      border-radius: 999px;
      background: #367766;
      color: #fff;
      font-size: 14px;
      font-weight: 700;
    }
    .faq-card h3 {
      margin: 0;
      font-size: 14px;
      line-height: 1.7;
      font-weight: 900;
      color: #121212;
    }
    .faq-card p {
      margin: 10px 0 0;
      font-size: 14px;
      line-height: 1.95;
      color: #666666;
    }

    .downloads-card { overflow: hidden; }
    .downloads-head {
      padding: 20px 24px;
      background: #367766;
      color: #fff;
    }
    .downloads-head h3 {
      margin: 0;
      font-size: 30px;
      line-height: 1.05;
      font-weight: 900;
      letter-spacing: -.03em;
      color: #fff;
    }
    .downloads-head p {
      margin: 10px 0 0;
      font-size: 14px;
      line-height: 1.7;
      color: rgba(255,255,255,.85);
    }
    .download-link {
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 16px 20px;
      border-top: 1px solid #E2E8F0;
      font-size: 14px;
      color: #666666;
      transition: .2s ease;
    }
    .download-link:hover { background: #F8FBF9; color: #367766; }
    .download-bottom { padding: 16px; }
    .download-round {
      width: 32px;
      height: 32px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      border-radius: 999px;
      background: #367766;
      color: #fff;
      transition: .2s ease;
    }
    .download-round:hover { background: #367766; }

    .final-section { background: #ECEDEC; }
    .final-wrap {
      overflow: hidden;
      background: #367766;
      box-shadow: 0 15px 45px rgba(16,149,60,.12);
    }
    .final-grid {
      display: grid;
      gap: 24px;
      padding: 40px;
      color: #fff;
      grid-template-columns: 1fr .8fr;
    }
    .final-label {
      margin: 0;
      font-size: 10px;
      font-weight: 700;
      letter-spacing: .18em;
      text-transform: uppercase;
      color: rgba(255,255,255,.70);
    }
    .final-title {
      margin: 12px 0 0;
      font-size: clamp(34px, 4vw, 44px);
      line-height: 1.05;
      font-weight: 900;
      letter-spacing: -.04em;
      color: #fff;
    }
    .final-copy {
      margin: 16px 0 0;
      font-size: 14px;
      line-height: 1.9;
      color: rgba(255,255,255,.90);
    }
    .contact-list { display: grid; gap: 12px; margin-top: 24px; }
    .contact-link {
      display: inline-flex;
      align-items: center;
      gap: 10px;
      font-size: 14px;
      color: rgba(255,255,255,.92);
      transition: .2s ease;
    }
    .contact-link:hover { color: #fff; }
    .contact-link svg { width: 16px; height: 16px; }

    .final-form {
      background: #fff;
      color: #121212;
      padding: 30px;
      box-shadow: 0 12px 30px rgba(17,24,39,.06);
    }
    .final-form-grid {
      display: grid;
      gap: 20px;
      grid-template-columns: repeat(2, 1fr);
      margin-bottom: 20px;
    }

    .final-form-grid > div{position: relative;}


    .tags { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 16px; }
    .tag {
      padding: 6px 12px;
      border: 1px solid #E2E8F0;
      background: #fff;
      font-size: 12px;
      font-family: inherit;
      color: #666666;
      cursor: pointer;
      appearance: none;
      -webkit-appearance: none;
    }
    .tag.active {
      border-color: #367766;
      background: #367766;
      color: #fff;
    }



 

    .modal {
      position: fixed;
      inset: 0;
      z-index: 120;
      display: none;
      align-items: center;
      justify-content: center;
      padding: 40px 24px;
      background: rgba(0,0,0,.70);
      backdrop-filter: blur(2px);
    }
    .modal.open { display: flex; }
    .modal-panel {
      position: relative;
      width: min(760px, 100%);
      background: #fff;
      box-shadow: 0 24px 60px rgba(0,0,0,.28);
    }
    .modal-close {
      position: absolute;
      top: 12px;
      right: 12px;
      z-index: 2;
      width: 40px;
      height: 40px;
      display: flex;
      align-items: center;
      justify-content: center;
      border: 1px solid #E2E8F0;
      background: #fff;
      color: #64748B;
      cursor: pointer;
      transition: .2s ease;
    }
    .modal-close:hover { border-color: #CBD5E1; color: #0F172A; }
    .modal-head {
      padding: 16px 24px;
      padding-right: 64px;
      border-bottom: 1px solid #E2E8F0;
    }
    .modal-head p {
      margin: 0;
      font-size: 18px;
      font-weight: 900;
      letter-spacing: -.02em;
      color: #121212;
    }
    .modal-body {
      padding: 24px;
      background: #F3F7F4;
    }
    .modal-image-wrap {
      overflow: hidden;
      border: 1px solid #D8E5DC;
      background: #fff;
    }
    .modal-image-wrap img {
      width: 100%;
      height: auto;
      object-fit: contain;
    }

    .icon { width: 16px; height: 16px; display: inline-block; }
    .icon-20 { width: 20px; height: 20px; }
    .icon-28 { width: 28px; height: 28px; }
    .icon-4 { width: 16px; height: 16px; }

    @media (max-width: 1200px) {
      .hero-grid,
      .materials-grid,
      .process-grid,
      .why-grid,
      .cases-grid,
      .faq-grid,
      .final-grid {
        grid-template-columns: 1fr;
      }
      .hero-form-wrap { justify-content: flex-start; }
      .material-wrap { justify-content: flex-start; }
      .material-note { text-align: left; }
    }

    @media (max-width: 980px) {
      .nav-links { display: none; }
      .stats-grid,
      .fit-grid,
      .benefit-grid,
      .proof-grid { grid-template-columns: 1fr 1fr; }
      .quick-grid { grid-template-columns: 1fr 1fr; }
      .case-grid,
      .final-form-grid { grid-template-columns: 1fr; }
      .vertical-links { display: none; }
      .search-btn { display: none; }

      .final-form-grid {margin-bottom: 10px;gap: 10px;}
      .hero-form {max-width: none;}
    }

    @media (max-width: 720px) {

      .section { padding: 56px 0; }
      .hero-grid {padding: 36px 15px 48px;}
      .hero h1 { font-size: 32px; max-width: 100%; }
      .stats-grid,
      .fit-grid,
      .benefit-grid,
      .proof-grid,
      .quick-grid,
      .machine-grid { grid-template-columns: 1fr; }
      .why-left-inner { padding: 44px 28px; }
      .why-left p { font-size: 34px; }

      .hero-copy { line-height: 1.9; }
      .materials-box { padding: 28px; }
      .final-grid { padding: 15px; }
      .final-form {padding: 15px;}
    }

    .floating-contact {
      position: fixed;
      right: 18px;
      bottom: 18%;
      z-index: 75;
      display: none;
      width: 56px;
    }
    .floating-contact-toggle {
      position: relative;
      width: 56px;
      height: 56px;
      border-radius: 50%;
      border: 1px solid #dbe3dd;
      background: #fff;
      box-shadow: 0 6px 14px rgba(15, 23, 42, .14);
      display: flex;
      align-items: center;
      justify-content: center;
      cursor: pointer;
      overflow: hidden;
      transition: transform .2s ease, box-shadow .2s ease;
    }
    .floating-contact-toggle:active {
      transform: scale(.92);
    }
    .floating-contact-toggle::before {
      content: "";
      position: absolute;
      inset: 0;
      background: linear-gradient(90deg, #22c55e, #367766);
      transform: translateX(-105%);
      transition: transform .24s ease;
    }
    .floating-contact-toggle .wa-icon {
      position: relative;
      z-index: 1;
      width: 24px;
      height: 24px;
      color: #1fb860;
      transition: color .24s ease;
    }
    .floating-contact-menu {
      position: absolute;
      top: 66px;
      right: 0;
      width: 220px;
      margin-top: 0;
      display: grid;
      gap: 8px;
      opacity: 0;
      transform: translateY(-8px);
      pointer-events: none;
      transition: opacity .2s ease, transform .2s ease;
    }
    .floating-contact.is-open .floating-contact-menu {
      opacity: 1;
      transform: translateY(0);
      pointer-events: auto;
    }
    .floating-contact-link {
      display: block;
      padding: 10px 12px;
      border: 1px solid #dde5ec;
      border-radius: 18px;
      color: #153148;
      font-size: 13px;
      text-decoration: none;
      background: #fff;
      box-shadow: 0 4px 10px rgba(15, 23, 42, .08);
      transition: background .2s ease;
    }
    .floating-contact-link:hover { background: #f5f8fb; }

    .mobile-contact-bar {
      position: fixed;
      left: 10px;
      right: 10px;
      bottom: calc(8px + env(safe-area-inset-bottom, 0px));
      z-index: 82;
      display: none;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 8px;
      padding: 6px;
      background: rgba(255, 255, 255, .96);
      border: 1px solid #e3e8ee;
      box-shadow: 0 -2px 10px rgba(15, 23, 42, .08);
    }
    .mobile-contact-bar a {
      min-height: 36px;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 10px;
      font-weight: 700;
      letter-spacing: .09em;
      text-transform: uppercase;
      text-decoration: none;
    }
    .mobile-contact-bar a:first-child {
      color: #fff;
      background: #367766;
      border: 1px solid #367766;
    }
    .mobile-contact-bar a:last-child {
      color: #367766;
      background: #fff;
      border: 1px solid #b9d8c3;
    }

    @media (hover: hover) and (pointer: fine) {
      .floating-contact-toggle:hover {
        transform: scale(1.06);
        box-shadow: 0 10px 18px rgba(16, 149, 60, .25);
      }
      .floating-contact-toggle:hover::before { transform: translateX(0); }
      .floating-contact-toggle:hover .wa-icon { color: #fff; }
    }
    .floating-contact.is-open .floating-contact-toggle {
      animation: floatingTap .2s ease;
    }
    @keyframes floatingTap {
      0% { transform: scale(1); }
      50% { transform: scale(.92); }
      100% { transform: scale(1); }
    }
    @media (min-width: 980px) {
      .floating-contact { display: block; }
    }
    @media (max-width: 979px) {

      .floating-contact { display: none !important; }
      .mobile-contact-bar { display: grid; }
      

    }