/* Refined Catalog Cards Styles */
.catalog-card {
  background: #fff;
  border: 1px solid #eaeaea;
  border-radius: 12px;
  overflow: hidden;
  transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
  position: relative;
  box-shadow: 0 4px 15px rgba(0,0,0,0.03);
  margin-bottom: 30px;
  display: flex;
  flex-direction: column;
  height: calc(100% - 30px);
}
.catalog-card:hover {
  box-shadow: 0 15px 30px rgba(33, 168, 176, 0.15);
  transform: translateY(-8px);
  border-color: rgba(33, 168, 176, 0.3);
}
.catalog-card-img-wrap {
  display: block;
  position: relative;
  overflow: hidden;
  background: #fff;
  text-align: center;
  padding: 30px 20px;
  height: 220px;
  border-bottom: 1px solid #f5f5f5;
}
.catalog-card-img-wrap img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  transition: transform 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
}
.catalog-card:hover .catalog-card-img-wrap img {
  transform: scale(1.08);
}
.catalog-card-overlay {
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  background: rgba(255, 255, 255, 0.9);
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  transition: all 0.4s ease;
  backdrop-filter: blur(2px);
}
.catalog-card:hover .catalog-card-overlay {
  opacity: 1;
}
.catalog-card-overlay .btn {
  transform: translateY(20px);
  transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
  box-shadow: 0 5px 15px rgba(33, 168, 176, 0.3);
  border-radius: 25px;
  padding: 10px 25px;
  font-weight: 600;
  letter-spacing: 0.5px;
}
.catalog-card:hover .catalog-card-overlay .btn {
  transform: translateY(0);
}
.catalog-card-body {
  padding: 25px 20px;
  text-align: center;
  flex-grow: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  background: #fafafa;
  transition: background 0.4s ease;
}
.catalog-card:hover .catalog-card-body {
  background: #fff;
}
.catalog-card-title {
  font-size: 16px;
  font-weight: 700;
  margin-bottom: 0;
  line-height: 1.4;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}
.catalog-card-title a {
  color: #222;
  text-decoration: none;
  transition: color 0.3s;
}
.catalog-card:hover .catalog-card-title a {
  color: #21a8b0;
}
.catalog-card-desc {
  font-size: 13px;
  color: #777;
  margin-top: 15px;
  margin-bottom: 0;
  line-height: 1.5;
}

/* Product Cards specific tweaks */
.product-card .catalog-card-img-wrap {
  height: 200px;
  padding: 20px;
}
.product-card .catalog-card-title {
  font-size: 14px;
  text-transform: none;
}
.product-card .catalog-card-body {
  padding: 20px 15px;
}
/* Table Magic UI Styles */
.table-magic-wrapper {
  margin-top: 30px;
  margin-bottom: 30px;
}
.catalog-view-controls {
  display: flex;
  gap: 10px;
  margin-bottom: 20px;
  justify-content: flex-start;
  border-bottom: 2px solid #eee;
  padding-bottom: 15px;
}
.catalog-view-controls button {
  padding: 8px 20px;
  font-size: 14px;
  border-radius: 4px;
  font-weight: bold;
  text-transform: uppercase;
  transition: all 0.3s;
}
.catalog-view-controls button.active {
  background: #21a8b0;
  color: #fff;
  border-color: #21a8b0;
}
.view-configurator {
  background: #fdfdfd;
  padding: 25px;
  border-radius: 8px;
  border: 1px solid #eaeaea;
  box-shadow: 0 2px 15px rgba(0,0,0,0.03);
}
.config-filters {
  display: flex;
  gap: 20px;
  flex-wrap: wrap;
  margin-bottom: 25px;
  padding-bottom: 20px;
  border-bottom: 1px dashed #ddd;
}
.config-filter-group {
  flex: 1;
  min-width: 150px;
}
.config-filter-group label {
  display: block;
  font-size: 12px;
  font-weight: bold;
  color: #555;
  margin-bottom: 8px;
  text-transform: uppercase;
}
.config-filter-group select {
  width: 100%;
  padding: 10px;
  border-radius: 4px;
  border: 1px solid #ccc;
  font-size: 14px;
  background: #fff;
  transition: border-color 0.3s;
}
.config-filter-group select:focus {
  border-color: #21a8b0;
  outline: none;
}
.config-results-table {
  width: 100%;
  background: #fff;
  border-collapse: collapse;
}
.config-results-table th, .config-results-table td {
  padding: 12px 15px;
  border: 1px solid #eee;
  text-align: center;
  font-size: 14px;
}
.config-results-table th {
  background: #f5f5f5;
  font-weight: bold;
  color: #333;
}
.config-results-table tbody tr:hover {
  background: #f0f9fa;
}
.view-table table.dataTable {
  width: 100% !important;
  margin-top: 15px !important;
  margin-bottom: 15px !important;
}
.view-table table.dataTable thead th {
  background: #21a8b0;
  color: #fff;
  border: none;
  padding: 12px 10px;
}
.view-table table.dataTable tbody td {
  padding: 10px;
  vertical-align: middle;
  border-bottom: 1px solid #eee;
}
.view-table table.dataTable tbody tr:hover {
  background-color: #f0f9fa;
}
.dataTables_wrapper .dataTables_paginate .paginate_button.current, 
.dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
  background: #21a8b0 !important;
  color: #fff !important;
  border-color: #21a8b0 !important;
}

/* Sidebar Search Styles */
.sidebar-search-wrap {
  margin-bottom: 30px;
  position: relative;
  display: block;
  width: 100%;
}
.sidebar-search-form {
  position: relative;
  display: flex !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  align-items: center !important;
}
.sidebar-search-form input {
  width: 100% !important;
  height: 45px !important;
  padding: 0 45px 0 20px !important;
  border: 2px solid #e0e0e0 !important;
  border-radius: 25px !important;
  font-size: 14px !important;
  background-color: #fff !important;
  transition: all 0.3s ease !important;
  outline: none !important;
  color: #333 !important;
  box-shadow: none !important;
  margin: 0 !important;
  line-height: 41px !important;
  box-sizing: border-box !important;
}
.sidebar-search-form input:focus {
  border-color: #21a8b0 !important;
  box-shadow: 0 0 10px rgba(33, 168, 176, 0.15) !important;
}
.sidebar-search-form button {
  position: absolute !important;
  right: 5px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  background: none !important;
  border: none !important;
  width: 35px !important;
  height: 35px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  padding: 0 !important;
  margin: 0 !important;
  box-shadow: none !important;
  z-index: 2 !important;
}

/* Animated SVG Loupe */
.animated-loupe {
  width: 20px !important;
  height: 20px !important;
  stroke: #21a8b0 !important;
  stroke-width: 2.5 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
  fill: none !important;
  transition: stroke 0.3s ease !important;
  display: block !important;
}

/* The circle part of the loupe */
.animated-loupe circle {
  transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1) !important;
  transform-origin: center !important;
}

/* The handle part of the loupe */
.animated-loupe line {
  transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1) !important;
  stroke-dasharray: 10 !important;
  stroke-dashoffset: 0 !important;
}

/* Hover Animation */
.sidebar-search-form button:hover .animated-loupe {
  stroke: #167a80 !important;
}
.sidebar-search-form button:hover .animated-loupe circle {
  transform: scale(1.15) !important;
}
.sidebar-search-form button:hover .animated-loupe line {
  transform: translate(1px, 1px) !important;
}

/* Focus Animation (when typing) */
.sidebar-search-form input:focus + button .animated-loupe circle {
  stroke-dasharray: 40 !important;
  animation: spinLoupe 2s linear infinite !important;
}

@keyframes spinLoupe {
  0% { stroke-dashoffset: 40; }
  100% { stroke-dashoffset: 0; }
}

/* Magic Tables & Configurator Styles */
.table-magic-wrapper {
    margin-top: 40px;
    margin-bottom: 40px;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 5px 20px rgba(0,0,0,0.05);
    padding: 30px;
    border: 1px solid #eaeaea;
}

.catalog-view-controls {
    display: flex;
    gap: 15px;
    margin-bottom: 30px;
    border-bottom: 2px solid #f0f0f0;
    padding-bottom: 20px;
}

.catalog-view-controls .btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    border-radius: 30px;
    padding: 10px 25px;
    font-weight: 600;
    letter-spacing: 0.5px;
    transition: all 0.3s ease;
}

.catalog-view-controls .btn svg {
    margin-right: 5px;
    margin-top: -2px;
}

.catalog-view-controls .btn-default {
    background: #f8f9fa;
    color: #555;
    border-color: #e0e0e0;
}

.catalog-view-controls .btn-default:hover {
    background: #e9ecef;
    color: #333;
}

.catalog-view-controls .btn-primary {
    background: #21a8b0;
    border-color: #21a8b0;
    box-shadow: 0 4px 15px rgba(33, 168, 176, 0.3);
    color: #fff;
}

.view-configurator .config-title {
    font-size: 20px;
    font-weight: 700;
    color: #222;
    margin-bottom: 25px;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.config-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    margin-bottom: 30px;
    background: #f8f9fa;
    padding: 20px;
    border-radius: 8px;
    border: 1px solid #eee;
}

.config-filter-group {
    flex: 1;
    min-width: 150px;
}

.config-filter-group label {
    display: block;
    font-size: 13px;
    font-weight: 600;
    color: #666;
    margin-bottom: 8px;
    text-transform: uppercase;
}

.config-filter-group select {
    width: 100%;
    padding: 10px 15px;
    border: 1px solid #ccc;
    border-radius: 6px;
    background-color: #fff;
    font-size: 14px;
    color: #333;
    outline: none;
    transition: border-color 0.3s, box-shadow 0.3s;
    appearance: none;
    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23333' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right 10px center;
    background-size: 1em;
}

.config-filter-group select:focus {
    border-color: #21a8b0;
    box-shadow: 0 0 0 3px rgba(33, 168, 176, 0.1);
}

.config-results-table-wrap {
    overflow-x: auto;
    border-radius: 8px;
    border: 1px solid #eaeaea;
}

.config-results-table {
    width: 100%;
    border-collapse: collapse;
    text-align: left;
}

.config-results-table th {
    background: #f4f6f8;
    color: #333;
    font-weight: 700;
    padding: 15px;
    border-bottom: 2px solid #ddd;
    white-space: nowrap;
}

.config-results-table td {
    padding: 12px 15px;
    border-bottom: 1px solid #eee;
    color: #555;
    font-size: 14px;
}

.config-results-table tbody tr:hover {
    background: #fcfcfc;
}

/* DataTables Overrides */
.dataTables_wrapper .dataTables_filter input {
    border: 1px solid #ccc;
    border-radius: 20px;
    padding: 6px 15px;
    outline: none;
}
.dataTables_wrapper .dataTables_filter input:focus {
    border-color: #21a8b0;
}
table.dataTable.no-footer {
    border-bottom: 1px solid #eaeaea;
}
table.dataTable thead th {
    border-bottom: 2px solid #ddd;
    background: #f4f6f8;
}

/* Product Page Layout Refinements */
.product-page-header {
    margin-bottom: 30px;
}
.product-page-header h1 {
    font-size: 32px;
    font-weight: 800;
    color: #222;
    line-height: 1.2;
    margin-bottom: 15px;
}
.product-page-content {
    font-size: 16px;
    line-height: 1.6;
    color: #555;
    margin-bottom: 30px;
}
.product-page-gallery {
    background: #fff;
    border: 1px solid #eaeaea;
    border-radius: 12px;
    padding: 20px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.03);
}
.btn-order-huge {
    display: inline-flex;
    align-items: center;
    padding: 15px 40px;
    font-size: 18px;
    font-weight: 700;
    border-radius: 30px;
    background: linear-gradient(135deg, #21a8b0 0%, #167a80 100%);
    color: #fff !important;
    box-shadow: 0 10px 20px rgba(33, 168, 176, 0.3);
    transition: all 0.3s ease;
    text-transform: uppercase;
    letter-spacing: 1px;
    border: none;
    text-decoration: none;
}
.btn-order-huge:hover {
    transform: translateY(-3px);
    box-shadow: 0 15px 25px rgba(33, 168, 176, 0.4);
    color: #fff !important;
}
/* Mobile Responsiveness for Magic Tables & Product Page */
@media (max-width: 767px) {
    .catalog-view-controls {
        flex-direction: column;
        gap: 10px;
    }
    .catalog-view-controls .btn {
        width: 100%;
        justify-content: center;
    }
    .btn-order-huge {
        width: 100%;
        justify-content: center;
        padding: 12px 20px;
        font-size: 16px;
    }
    .product-page-header h1 {
        font-size: 24px;
    }
    .table-magic-wrapper {
        padding: 15px;
    }
    .config-filter-group {
        min-width: 100%;
    }
}

/* Global Typography Fixes */
.page-content h1, 
.page-content h2, 
.page-content h3 {
    margin-bottom: 20px;
    line-height: 1.3;
}
.page-content h4, 
.page-content h5, 
.page-content h6 {
    margin-bottom: 15px;
    line-height: 1.4;
}
.page-content p {
    margin-bottom: 15px;
    line-height: 1.6;
}
/* Hide any remaining empty paragraphs that might have slipped through */
.page-content p:empty {
    display: none;
}
/* Ensure the first paragraph after a heading doesn't have a huge top margin */
.page-content h1 + p, 
.page-content h2 + p, 
.page-content h3 + p {
    margin-top: 0;
}

/* Footer Compact Styles */
.modern-footer {
    padding: 30px 0 20px 0 !important;
}
.modern-footer h4 {
    margin-bottom: 15px !important;
    padding-bottom: 10px !important;
    font-size: 16px !important;
}
.modern-footer .contact-info {
    margin-top: 10px !important;
}
.modern-footer .contact-info p {
    margin-bottom: 8px !important;
    margin-top: 0 !important;
    line-height: 1.4 !important;
    font-size: 13px !important;
    display: block !important;
    padding: 0 !important;
}
.modern-footer .contact-info p span {
    display: inline-block !important;
    vertical-align: middle !important;
    padding: 0 !important;
    margin: 0 !important;
}
.modern-footer .contact-info p a {
    font-size: 13px !important;
    font-weight: normal !important;
    line-height: 1.4 !important;
    display: inline !important;
    margin: 0 !important;
    padding: 0 !important;
    height: auto !important;
}
.modern-footer .contact-info p i {
    margin-right: 8px !important;
    font-size: 18px !important;
    line-height: 1 !important;
    vertical-align: middle !important;
    display: inline-block !important;
    padding: 0 !important;
}
.modern-footer .btn {
    text-transform: none !important;
    padding: 8px 20px !important;
    font-size: 14px !important;
    margin-top: 5px !important;
    display: inline-block !important;
}
.page-foot .section-45 {
    padding: 15px 0 !important;
}
.page-foot p {
    margin: 0 !important;
    font-size: 12px !important;
}


/* Search Results Styling */
.search-results-header {
    margin-bottom: 30px;
    padding-bottom: 15px;
    border-bottom: 2px solid #f0f0f0;
}
.search-results-header p {
    font-size: 18px;
    color: #555;
    margin: 0;
}
.search-results-header b {
    color: #21a8b0;
    font-weight: 700;
}
.search-empty-state {
    text-align: center;
    padding: 50px 20px;
    background: #f8f9fa;
    border-radius: 12px;
    border: 1px dashed #e0e0e0;
    margin-top: 30px;
}
.search-empty-state i {
    font-size: 48px;
    color: #ccc;
    margin-bottom: 15px;
    display: block;
}
.search-empty-state p {
    font-size: 18px;
    color: #666;
    margin: 0;
}
.search-empty-state b {
    color: #333;
}
/* Pagination Styling */
.pagination {
    margin-top: 40px;
    display: flex;
    justify-content: center;
    gap: 5px;
    padding: 0;
    list-style: none;
}
.pagination li a,
.pagination li span {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 40px;
    height: 40px;
    padding: 0 15px;
    border-radius: 20px;
    background: #f8f9fa;
    color: #555;
    font-weight: 600;
    text-decoration: none;
    transition: all 0.3s ease;
    border: 1px solid #eaeaea;
}
.pagination li a:hover {
    background: #e9ecef;
    color: #21a8b0;
    border-color: #21a8b0;
}
.pagination li.active span {
    background: #21a8b0;
    color: #fff;
    border-color: #21a8b0;
    box-shadow: 0 4px 10px rgba(33, 168, 176, 0.3);
}
.pagination li.disabled span {
    color: #aaa;
    background: #f5f5f5;
    border-color: #eee;
}

/* Search UX */
.sidebar-search-wrap {
    z-index: 30;
    margin-bottom: 24px !important;
}
.sidebar-search-form input {
    border-color: rgba(33, 168, 176, 0.55) !important;
    box-shadow: 0 10px 26px rgba(17, 116, 129, 0.08) !important;
}
.sidebar-search-form input:focus {
    border-color: #20b6bf !important;
    box-shadow: 0 12px 32px rgba(33, 168, 176, 0.18) !important;
}
.sidebar-search-hint {
    position: absolute;
    left: 12px;
    right: auto;
    top: calc(100% + 6px);
    display: flex;
    align-items: center;
    gap: 7px;
    width: max-content;
    max-width: 210px;
    padding: 6px 9px;
    border: 1px solid rgba(32, 182, 191, 0.24);
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.96);
    color: #28415c;
    font-size: 11px;
    line-height: 1.35;
    text-align: left;
    box-shadow: 0 14px 32px rgba(12, 58, 78, 0.12);
    opacity: 0;
    visibility: hidden;
    transform: translateY(-4px);
    transition: opacity 0.22s ease, transform 0.22s ease, visibility 0.22s ease;
    pointer-events: none;
    z-index: 40;
}
.sidebar-search-form:focus-within .sidebar-search-hint {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}
.search-hint-key {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 42px;
    height: 22px;
    padding: 0 8px;
    border-radius: 7px;
    background: linear-gradient(135deg, #25c0c8 0%, #087f8b 100%);
    color: #fff;
    font-weight: 800;
    letter-spacing: 0.02em;
    box-shadow: 0 8px 18px rgba(33, 168, 176, 0.22);
}
.search-page-modern {
    text-align: left;
    margin-top: 4px;
}
.search-page-hero {
    position: relative;
    overflow: hidden;
    padding: 30px 32px;
    border: 1px solid rgba(33, 168, 176, 0.2);
    border-radius: 16px;
    background:
        linear-gradient(135deg, rgba(240, 252, 253, 0.98) 0%, rgba(255, 255, 255, 0.98) 58%, rgba(232, 248, 250, 0.98) 100%);
    box-shadow: 0 18px 45px rgba(16, 84, 101, 0.08);
}
.search-page-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(rgba(33, 168, 176, 0.08) 1px, transparent 1px),
        linear-gradient(90deg, rgba(33, 168, 176, 0.08) 1px, transparent 1px);
    background-size: 28px 28px;
    opacity: 0.42;
    pointer-events: none;
}
.search-page-hero::after {
    content: "";
    position: absolute;
    right: -90px;
    top: -110px;
    width: 250px;
    height: 250px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(33, 168, 176, 0.18), rgba(33, 168, 176, 0));
    pointer-events: none;
}
.search-page-hero > * {
    position: relative;
    z-index: 1;
}
.search-page-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 12px;
    color: #078995;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}
.search-page-eyebrow::before {
    content: "";
    display: inline-block;
    width: 28px;
    height: 3px;
    border-radius: 99px;
    background: linear-gradient(90deg, #0bb9c5, #086f8e);
}
.search-page-hero h2 {
    max-width: 680px;
    margin: 0 0 12px;
    color: #09223f;
    font-size: 28px;
    line-height: 1.18;
    font-weight: 800;
}
.search-page-hero p {
    max-width: 720px;
    margin: 0 0 22px;
    color: #435c78;
    font-size: 15px;
    line-height: 1.65;
}
.search-page-form {
    display: flex;
    max-width: 680px;
    gap: 12px;
}
.search-page-form input {
    flex: 1 1 auto;
    height: 52px;
    padding: 0 18px;
    border: 1px solid rgba(33, 168, 176, 0.34);
    border-radius: 14px;
    background: #fff;
    color: #17324d;
    font-size: 15px;
    outline: none;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.85);
}
.search-page-form input:focus {
    border-color: #19aeb9;
    box-shadow: 0 0 0 4px rgba(33, 168, 176, 0.12);
}
.search-page-form button {
    flex: 0 0 auto;
    min-width: 126px;
    height: 52px;
    border: 0;
    border-radius: 14px;
    background: linear-gradient(135deg, #27bec7 0%, #07838f 100%);
    color: #fff;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    box-shadow: 0 12px 28px rgba(33, 168, 176, 0.24);
    transition: transform 0.22s ease, box-shadow 0.22s ease;
}
.search-page-form button:hover {
    transform: translateY(-2px);
    box-shadow: 0 16px 34px rgba(33, 168, 176, 0.3);
}
.search-results-modern-head {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    margin: 24px 0 22px;
}
.search-results-modern-head > div {
    min-width: 150px;
    padding: 14px 18px;
    border: 1px solid rgba(33, 168, 176, 0.2);
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 12px 28px rgba(13, 52, 72, 0.06);
}
.search-results-modern-head span {
    display: block;
    margin-bottom: 4px;
    color: #7890a8;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}
.search-results-modern-head strong {
    display: block;
    color: #09223f;
    font-size: 20px;
    line-height: 1.2;
}
.search-results-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 22px;
    margin-top: 18px;
}
.search-result-card {
    display: flex;
    min-width: 0;
    min-height: 100%;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid rgba(33, 168, 176, 0.18);
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 12px 30px rgba(13, 52, 72, 0.06);
    transition: transform 0.24s ease, box-shadow 0.24s ease, border-color 0.24s ease;
}
.search-result-card:hover {
    transform: translateY(-5px);
    border-color: rgba(33, 168, 176, 0.55);
    box-shadow: 0 20px 42px rgba(13, 52, 72, 0.12);
}
.search-result-media {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 190px;
    aspect-ratio: 4 / 3;
    padding: 22px;
    background:
        radial-gradient(circle at 20% 0%, rgba(33, 168, 176, 0.12), transparent 34%),
        linear-gradient(135deg, #f7fbfc 0%, #ffffff 100%);
    text-decoration: none;
}
.search-result-media img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    transition: transform 0.28s ease;
}
.search-result-card:hover .search-result-media img {
    transform: scale(1.04);
}
.search-result-type {
    position: absolute;
    left: 14px;
    top: 14px;
    padding: 5px 9px;
    border-radius: 999px;
    background: rgba(8, 129, 139, 0.92);
    color: #fff;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    z-index: 1;
}
.search-result-placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    border: 1px dashed rgba(33, 168, 176, 0.3);
    border-radius: 12px;
    color: #0f8f9b;
    font-size: 28px;
    font-weight: 900;
    letter-spacing: 0.08em;
}
.search-result-body {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    padding: 20px 20px 22px;
}
.search-result-category {
    margin-bottom: 10px;
    color: #078995;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}
.search-result-body h3 {
    margin: 0 0 12px;
    color: #09223f;
    font-size: 16px;
    line-height: 1.35;
    font-weight: 800;
    letter-spacing: 0;
}
.search-result-body h3 a {
    color: inherit;
    text-decoration: none;
}
.search-result-body h3 a:hover {
    color: #078995;
}
.search-result-body p {
    margin: 0 0 18px;
    color: #435c78;
    font-size: 13px;
    line-height: 1.65;
}
.search-result-body mark {
    padding: 0 3px;
    border-radius: 4px;
    background: rgba(33, 168, 176, 0.16);
    color: #056e78;
}
.search-result-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: fit-content;
    min-height: 40px;
    margin-top: auto;
    padding: 0 16px;
    border-radius: 12px;
    background: linear-gradient(135deg, #25c0c8 0%, #087f8b 100%);
    color: #fff !important;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-decoration: none !important;
    text-transform: uppercase;
    box-shadow: 0 10px 24px rgba(33, 168, 176, 0.22);
}
.search-result-action:hover {
    background: linear-gradient(135deg, #31cbd3 0%, #096f82 100%);
}
.search-limit-note {
    margin: 24px 0 0;
    color: #607890;
    font-size: 14px;
    text-align: center;
}
.search-empty-modern {
    margin-top: 24px;
    border-color: rgba(33, 168, 176, 0.28);
    background: linear-gradient(135deg, #f7fcfd 0%, #ffffff 100%);
}
@media (max-width: 1199px) {
    .search-results-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
@media (max-width: 767px) {
    .search-page-hero {
        padding: 24px 18px;
    }
    .search-page-hero h2 {
        font-size: 23px;
    }
    .search-page-form {
        flex-direction: column;
    }
    .search-page-form button {
        width: 100%;
    }
    .search-results-grid {
        grid-template-columns: 1fr;
    }
    .search-result-media {
        min-height: 170px;
    }
}


/* ============================================================
   GLOBAL WOW PAGE STYLES (Light Theme + Parallax)
   ============================================================ */

.amu-hero {
    position: relative;
    min-height: 500px;
    border-radius: 16px;
    overflow: hidden;
    margin-bottom: 56px;
    display: flex;
    align-items: center;
    background: #f8f9fa;
    box-shadow: 0 10px 30px rgba(0,0,0,0.08);
    color: #333;
}
.amu-hero-bg {
    position: absolute;
    inset: 0;
    /* Parallax effect */
    background-attachment: fixed !important;
    background-position: center !important;
    background-size: cover !important;
}
.amu-hero-bg::after {
    content: '';
    position: absolute;
    inset: 0;
    /* White gradient overlay to make text readable */
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.95) 0%, rgba(255, 255, 255, 0.8) 50%, rgba(255, 255, 255, 0.4) 100%);
}
.amu-hero-content {
    position: relative;
    z-index: 2;
    padding: 60px 48px;
    width: 100%;
}
.amu-hero::before {
    content: '';
    position: absolute;
    left: 0; top: 0; bottom: 0; width: 6px;
    background: #21a8b0;
    z-index: 5;
}
.amu-badge {
    display: inline-block;
    background: rgba(33, 168, 176, 0.1);
    color: #167a80;
    padding: 6px 16px;
    border-radius: 20px;
    font-size: 0.85rem;
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;
    margin-bottom: 24px;
    border: 1px solid rgba(33, 168, 176, 0.2);
}
.amu-title {
    font-size: 3.2rem;
    font-weight: 900;
    margin: 0 0 16px;
    line-height: 1.1;
    text-transform: uppercase;
    letter-spacing: -1px;
    color: #222 !important;
}
.amu-sub {
    font-size: 1.15rem;
    color: #555;
    max-width: 700px;
    line-height: 1.6;
    margin: 0;
}

/* CARDS */
.amu-section { margin-bottom: 64px; }
.amu-section-title {
    font-size: 2rem;
    font-weight: 900;
    color: #222;
    margin-bottom: 40px;
    text-transform: uppercase;
    letter-spacing: 1px;
}
.amu-section-title span { color: #21a8b0; }

.amu-tech-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 32px;
}
.amu-tech-card {
    background: #fff;
    border: 1px solid #eaeaea;
    border-radius: 12px;
    padding: 40px;
    box-shadow: 0 5px 15px rgba(0,0,0,0.03);
    position: relative;
    overflow: hidden;
    transition: all 0.3s;
    color: #333;
}
.amu-tech-card:hover {
    transform: translateY(-5px);
    border-color: rgba(33, 168, 176, 0.3);
    box-shadow: 0 15px 30px rgba(33, 168, 176, 0.1);
}
.amu-tech-icon {
    font-size: 3rem;
    color: #21a8b0;
    margin-bottom: 24px;
}
.amu-tech-card h3 {
    font-size: 1.4rem;
    color: #222;
    font-weight: 800;
    margin: 0 0 16px;
}
.amu-tech-card p {
    color: #666;
    line-height: 1.6;
    margin: 0;
}

/* STATS BAR */
.amu-stats-bar {
    display: flex;
    justify-content: space-between;
    background: #fff;
    border-radius: 12px;
    padding: 40px 60px;
    color: #333;
    margin-bottom: 64px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.05);
    border: 1px solid #eaeaea;
    position: relative;
    overflow: hidden;
}
.amu-stats-bar::after {
    content: '';
    position: absolute;
    top: 0; right: 0; bottom: 0; left: 0;
    background: linear-gradient(90deg, rgba(33,168,176,0.05) 0%, transparent 100%);
    pointer-events: none;
}
.amu-stat { text-align: center; position: relative; z-index: 2; }
.amu-stat-num {
    display: block;
    font-size: 2.5rem;
    font-weight: 900;
    color: #21a8b0;
    margin-bottom: 8px;
}
.amu-stat-text {
    font-size: 0.85rem;
    color: #777;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-weight: 600;
}

/* BOSS */
.amu-profile {
    display: flex;
    align-items: center;
    background: #fdfaf6;
    border-left: 6px solid #21a8b0;
    padding: 40px;
    border-radius: 0 12px 12px 0;
    color: #333;
    box-shadow: 0 5px 15px rgba(0,0,0,0.03);
}
.content-left { flex: 1; }
.amu-profile h3 { font-size: 1.5rem; margin: 0 0 8px; color: #222; }
.amu-profile p.role { color: #21a8b0; font-weight: 700; margin: 0 0 16px; text-transform: uppercase; font-size: 0.85rem;}
.amu-profile p.bio { color: #555; line-height: 1.6; margin-bottom: 12px; }

.amu-contacts {
    margin-top: 40px;
    margin-bottom: 80px;
    padding: 32px;
    background: #fff;
    border: 1px solid #eaeaea;
    border-radius: 12px;
    display: flex;
    justify-content: space-between;
    color: #555;
    box-shadow: 0 5px 15px rgba(0,0,0,0.02);
}
.amu-contacts div { color: #666; }
.amu-contacts strong { color: #222; }
.amu-contacts a { color: #21a8b0; text-decoration: none; font-weight: 700; }
.amu-contacts a:hover { color: #167a80; }

@media (max-width: 900px) {
    .amu-tech-grid { grid-template-columns: 1fr; }
    .amu-stats-bar { flex-direction: column; gap: 32px; }
    .amu-contacts { flex-direction: column; gap: 16px; }
    .amu-title { font-size: 2.4rem; }
    .amu-hero-bg { background-attachment: scroll !important; } /* Disable parallax on mobile for performance */
}

/* Floating elements in hero */
.amu-anim { position: absolute; font-size: 6rem; opacity: 0.1; z-index: 1; animation: amuFloat 5s ease-in-out infinite; color: #21a8b0; } 
.amu-anim-1 { bottom: 10%; right: 15%; } 
.amu-anim-2 { top: 20%; right: 35%; font-size: 4rem; animation-delay: -2.5s; } 
@keyframes amuFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-25px); } }

/* --- BUGFIX: SANITIZE CUSTOM TITLES FROM THEME STYLES --- */
h1[class*="-title"] {
    text-decoration: none !important;
    border: none !important;
    outline: none !important;
}
h1[class*="-title"]::before, 
h1[class*="-title"]::after {
    display: none !important;
    content: none !important;
}




/* Theme C: Pan (Horizontal scroll) */
.amu-hero-pan .amu-hero-bg {
    background-attachment: scroll !important;
    background-size: 130% !important;
    background-position: 0% 50% !important;
    animation: panBg 25s linear infinite alternate;
}
@keyframes panBg {
    0% { background-position: 0% 50% !important; }
    100% { background-position: 100% 50% !important; }
}

/* Theme D: Gradient Shift */
.amu-hero-gradient .amu-hero-bg {
    background-attachment: scroll !important;
}
.amu-hero-gradient::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(255,255,255,0.95) 0%, rgba(255,255,255,0.7) 50%, rgba(33,168,176,0.3) 100%);
    background-size: 200% 200%;
    animation: gradientShift 8s ease infinite;
    z-index: 1;
}
@keyframes gradientShift {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}

/* NEW ICON ANIMATIONS */
.amu-anim.anim-pulse { 
    animation: iconPulse 4s ease-in-out infinite; 
}
@keyframes iconPulse {
    0%, 100% { transform: scale(1); opacity: 0.1; }
    50% { transform: scale(1.3); opacity: 0.25; }
}

.amu-anim.anim-rotate { 
    animation: iconRotate 20s linear infinite; 
}
@keyframes iconRotate {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.amu-anim.anim-sway { 
    animation: iconSway 6s ease-in-out infinite; 
    transform-origin: bottom center; 
}
@keyframes iconSway {
    0%, 100% { transform: rotate(-20deg); }
    50% { transform: rotate(20deg); }
}

/* ============================================================
   Real Estate Section
   ============================================================ */
.real-estate-page {
    background: #f5f7f8;
    color: #1c2730;
}

.real-estate-page .shell {
    max-width: 1170px;
}

.real-estate-hero,
.real-estate-object-hero {
    padding: 58px 0 46px;
    background: #ffffff;
    border-bottom: 1px solid #e3e8eb;
}

.real-estate-hero-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 320px;
    gap: 36px;
    align-items: start;
}

.real-estate-object-hero {
    padding-top: 96px;
}

.real-estate-object-head {
    max-width: 900px;
}

.real-estate-eyebrow {
    margin-bottom: 12px;
    color: #20a8b0;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.4;
    text-transform: uppercase;
}

.real-estate-page h1 {
    margin: 0;
    color: #111820;
    font-size: 40px;
    font-weight: 800;
    line-height: 1.15;
}

.real-estate-lead,
.real-estate-object-desc {
    max-width: 760px;
    margin: 20px 0 0;
    color: #55636f;
    font-size: 18px;
    line-height: 1.65;
}

.real-estate-main,
.real-estate-object-main {
    padding: 42px 0 64px;
}

.real-estate-intro {
    margin-bottom: 30px;
    padding: 24px 28px;
    background: #ffffff;
    border: 1px solid #e2e8eb;
    border-radius: 8px;
}

.real-estate-text p,
.real-estate-object-content p {
    color: #4d5b66;
    font-size: 16px;
    line-height: 1.75;
}

.real-estate-text ul,
.real-estate-object-content ul {
    margin: 14px 0 18px;
    padding-left: 22px;
}

.real-estate-text li,
.real-estate-object-content li {
    margin-bottom: 8px;
    color: #4d5b66;
    line-height: 1.65;
}

.real-estate-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 24px;
}

.real-estate-card {
    display: flex;
    min-width: 0;
    min-height: 100%;
    flex-direction: column;
    overflow: hidden;
    background: #ffffff;
    border: 1px solid #dfe7eb;
    border-radius: 8px;
    box-shadow: 0 12px 30px rgba(17, 24, 32, 0.07);
}

.real-estate-card-media {
    position: relative;
    display: block;
    aspect-ratio: 16 / 11;
    overflow: hidden;
    background: #e8eef0;
}

.real-estate-card-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.28s ease;
}

.real-estate-card:hover .real-estate-card-media img {
    transform: scale(1.04);
}

.real-estate-card-badge {
    position: absolute;
    top: 12px;
    left: 12px;
    padding: 6px 10px;
    background: #ffffff;
    border-radius: 4px;
    color: #1b7980;
    font-size: 12px;
    font-weight: 800;
    line-height: 1;
    text-transform: uppercase;
}

.real-estate-card-body {
    display: flex;
    flex: 1;
    flex-direction: column;
    padding: 20px;
}

.real-estate-card-type {
    margin-bottom: 8px;
    color: #20a8b0;
    font-size: 12px;
    font-weight: 800;
    line-height: 1.35;
    text-transform: uppercase;
}

.real-estate-card h3 {
    margin: 0 0 12px;
    font-size: 20px;
    font-weight: 800;
    line-height: 1.3;
}

.real-estate-card h3 a {
    color: #111820;
}

.real-estate-card h3 a:hover {
    color: #178f97;
}

.real-estate-card p {
    margin: 0 0 18px;
    color: #5c6973;
    font-size: 15px;
    line-height: 1.6;
}

.real-estate-card-link {
    display: inline-flex;
    width: fit-content;
    margin-top: auto;
    padding: 10px 15px;
    background: #20a8b0;
    border-radius: 4px;
    color: #ffffff;
    font-size: 14px;
    font-weight: 800;
    line-height: 1;
    text-transform: uppercase;
}

.real-estate-card-link:hover,
.real-estate-card-link:focus {
    background: #178f97;
    color: #ffffff;
}

.real-estate-sidebar {
    position: sticky;
    top: 18px;
    padding: 18px;
    background: #ffffff;
    border: 1px solid #dde6ea;
    border-radius: 8px;
}

.real-estate-sidebar-title {
    margin-bottom: 12px;
    color: #111820;
    font-size: 15px;
    font-weight: 800;
    text-transform: uppercase;
}

.real-estate-sidebar-link {
    display: block;
    padding: 12px 0;
    border-top: 1px solid #edf2f4;
    color: #34424d;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.35;
}

.real-estate-sidebar-link:hover,
.real-estate-sidebar-link:focus {
    color: #178f97;
}

.real-estate-contact-card {
    padding: 22px;
    background: linear-gradient(180deg, #ffffff 0%, #f2fbfc 100%);
    border: 1px solid rgba(32, 168, 176, .24);
    border-radius: 8px;
    color: #132b3a;
    box-shadow: 0 16px 34px rgba(12, 55, 72, .09);
}

.real-estate-contact-label {
    margin-bottom: 14px;
    color: #078c99;
    font-size: 13px;
    font-weight: 800;
    line-height: 1.45;
    text-transform: uppercase;
}

.real-estate-contact-phone,
.real-estate-contact-mobile {
    display: block;
    color: #132b3a;
    font-size: 22px;
    font-weight: 800;
    line-height: 1.25;
}

.real-estate-contact-phone:hover,
.real-estate-contact-mobile:hover,
.real-estate-contact-phone:focus,
.real-estate-contact-mobile:focus {
    color: #078c99;
}

.real-estate-contact-note {
    margin: 4px 0 12px;
    color: #687f91;
    font-size: 14px;
    line-height: 1.4;
}

.real-estate-contact-button,
.real-estate-primary-action {
    display: inline-flex;
    justify-content: center;
    width: 100%;
    margin-top: 18px;
    padding: 14px 18px;
    background: #20a8b0;
    border-radius: 4px;
    color: #ffffff;
    font-size: 14px;
    font-weight: 800;
    line-height: 1;
    text-transform: uppercase;
}

.real-estate-contact-button:hover,
.real-estate-contact-button:focus,
.real-estate-primary-action:hover,
.real-estate-primary-action:focus {
    background: #27bec7;
    color: #ffffff;
}

.real-estate-back-link {
    display: inline-flex;
    margin-bottom: 20px;
    color: #178f97;
    font-size: 14px;
    font-weight: 800;
    text-transform: uppercase;
}

.real-estate-back-link:hover,
.real-estate-back-link:focus {
    color: #111820;
}

.real-estate-object-gallery {
    overflow: hidden;
    margin-bottom: 30px;
    background: #ffffff;
    border: 1px solid #dfe7eb;
    border-radius: 8px;
}

.real-estate-object-gallery .owl-carousel,
.real-estate-object-gallery .thumb-wrap {
    margin: 0;
}

.real-estate-object-gallery img {
    width: 100%;
    max-height: 520px;
    object-fit: cover;
}

.real-estate-object-gallery--single img {
    display: block;
    height: auto;
}

.real-estate-gallery-link {
    position: relative;
    display: block;
    cursor: zoom-in;
}

.real-estate-gallery-link .thumb_overlay {
    border-radius: 8px;
}

.real-estate-object-content {
    max-width: 820px;
    padding: 30px;
    background: #ffffff;
    border: 1px solid #dfe7eb;
    border-radius: 8px;
}

.real-estate-object-content h2,
.real-estate-object-content h3,
.real-estate-object-content h4 {
    color: #111820;
    font-weight: 800;
    line-height: 1.25;
}

.real-estate-object-panel {
    position: sticky;
    top: 18px;
    padding: 22px;
    background: #ffffff;
    border: 1px solid #dfe7eb;
    border-radius: 8px;
}

.real-estate-object-panel h3 {
    margin: 0 0 16px;
    color: #111820;
    font-size: 22px;
    font-weight: 800;
    line-height: 1.25;
}

.real-estate-object-panel .real-estate-contact-card {
    margin-bottom: 0;
}

@media (max-width: 1199px) {
    .real-estate-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 991px) {
    .real-estate-hero-grid {
        grid-template-columns: 1fr;
    }

    .real-estate-sidebar,
    .real-estate-object-panel {
        position: static;
        margin-bottom: 28px;
    }
}

@media (max-width: 767px) {
    .real-estate-hero,
    .real-estate-object-hero {
        padding: 38px 0 32px;
    }

    .real-estate-page h1 {
        font-size: 30px;
    }

    .real-estate-lead,
    .real-estate-object-desc {
        font-size: 16px;
    }

    .real-estate-grid {
        grid-template-columns: 1fr;
        gap: 18px;
    }

    .real-estate-intro,
    .real-estate-object-content {
        padding: 20px;
    }

    .real-estate-contact-phone,
    .real-estate-contact-mobile {
        font-size: 19px;
    }
}

/* ============================================================
   KMU-1 Light Page
   ============================================================ */
.kmu1-template-page {
    background: #f3f6f7;
}

.kmu1-page {
    color: #182631;
}

.kmu1-page a {
    color: #168f97;
}

.kmu1-page a:hover,
.kmu1-page a:focus {
    color: #0f6f76;
}

.kmu1-hero {
    position: relative;
    overflow: hidden;
    min-height: 500px;
    margin: 0 0 44px;
    border-radius: 8px;
    background: #ffffff;
    border: 1px solid #dfe8ec;
    box-shadow: 0 18px 46px rgba(17, 24, 32, 0.08);
}

.kmu1-hero::before {
    content: "";
    position: absolute;
    inset: 0 0 0 48%;
    background: url("/assets/images/resources/361/i-1747831488304.webp") center / cover no-repeat;
}

.kmu1-hero::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, #ffffff 0%, rgba(255,255,255,0.96) 42%, rgba(255,255,255,0.7) 68%, rgba(255,255,255,0.18) 100%);
}

.kmu1-hero-content {
    position: relative;
    z-index: 1;
    max-width: 760px;
    padding: 62px 52px;
}

.kmu1-kicker {
    display: inline-flex;
    margin-bottom: 18px;
    padding: 7px 12px;
    background: #e9f7f8;
    border: 1px solid #c7eef0;
    border-radius: 4px;
    color: #168f97;
    font-size: 12px;
    font-weight: 800;
    line-height: 1.3;
    text-transform: uppercase;
}

.kmu1-title {
    margin: 0;
    color: #111820;
    font-size: 48px;
    font-weight: 900;
    line-height: 1.08;
}

.kmu1-sub {
    max-width: 680px;
    margin: 22px 0 0;
    color: #51606b;
    font-size: 18px;
    line-height: 1.72;
}

.kmu1-toolbar {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 30px;
}

.kmu1-mini-nav {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 22px;
}

.kmu1-mini-nav a {
    display: inline-flex;
    padding: 8px 11px;
    background: rgba(255,255,255,0.82);
    border: 1px solid #dce8ec;
    border-radius: 4px;
    color: #3d4b55;
    font-size: 12px;
    font-weight: 800;
    line-height: 1;
    text-transform: uppercase;
}

.kmu1-mini-nav a:hover,
.kmu1-mini-nav a:focus {
    background: #e9f7f8;
    border-color: #b9e8eb;
    color: #168f97;
}

.kmu1-focus-toggle,
.kmu1-contact-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: 0 18px;
    border-radius: 4px;
    font-size: 13px;
    font-weight: 800;
    line-height: 1;
    text-transform: uppercase;
}

.kmu1-focus-toggle {
    background: #111820;
    border: 1px solid #111820;
    color: #ffffff;
}

.kmu1-focus-toggle:hover,
.kmu1-focus-toggle:focus {
    background: #25323d;
    border-color: #25323d;
}

.kmu1-contact-link {
    background: #20a8b0;
    border: 1px solid #20a8b0;
    color: #ffffff !important;
}

.kmu1-contact-link:hover,
.kmu1-contact-link:focus {
    background: #178f97;
    border-color: #178f97;
}

.kmu1-stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
    margin: 34px 0 0;
}

.kmu1-stat {
    min-width: 0;
    padding: 18px;
    background: rgba(255,255,255,0.9);
    border: 1px solid #dce8ec;
    border-radius: 8px;
}

.kmu1-stat-num {
    display: block;
    color: #168f97;
    font-size: 30px;
    font-weight: 900;
    line-height: 1;
}

.kmu1-stat-label {
    display: block;
    margin-top: 8px;
    color: #5f6c76;
    font-size: 12px;
    font-weight: 800;
    line-height: 1.35;
    text-transform: uppercase;
}

.kmu1-section {
    margin-bottom: 42px;
}

.kmu1-strip {
    overflow: hidden;
    margin: -14px 0 46px;
    padding: 12px 0;
    background: #111820;
    border-radius: 6px;
    color: #ffffff;
}

.kmu1-strip-track {
    display: flex;
    width: max-content;
    gap: 28px;
    animation: kmu1Strip 34s linear infinite;
    white-space: nowrap;
}

.kmu1-strip span {
    color: #cbd6dc;
    font-size: 13px;
    font-weight: 800;
    text-transform: uppercase;
}

.kmu1-strip b {
    color: #65d4da;
}

@keyframes kmu1Strip {
    from { transform: translateX(0); }
    to { transform: translateX(-50%); }
}

.kmu1-section-title {
    margin: 0 0 22px;
    color: #111820;
    font-size: 30px;
    font-weight: 900;
    line-height: 1.2;
}

.kmu1-project-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 22px;
}

.kmu1-about-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.25fr) minmax(280px, 0.75fr);
    gap: 24px;
}

.kmu1-about-copy,
.kmu1-passport {
    padding: 28px;
    background: #ffffff;
    border: 1px solid #dfe8ec;
    border-radius: 8px;
}

.kmu1-about-copy p,
.kmu1-passport p {
    color: #52616c;
    font-size: 16px;
    line-height: 1.72;
}

.kmu1-about-list {
    margin: 20px 0 0;
    padding-left: 20px;
}

.kmu1-about-list li {
    margin-bottom: 9px;
    color: #52616c;
    line-height: 1.65;
}

.kmu1-passport h3 {
    margin: 0 0 16px;
    color: #111820;
    font-size: 23px;
    font-weight: 900;
}

.kmu1-passport-row {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    padding: 12px 0;
    border-top: 1px solid #edf2f4;
}

.kmu1-passport-row span {
    color: #71808b;
    font-size: 13px;
    font-weight: 800;
    text-transform: uppercase;
}

.kmu1-passport-row b {
    color: #111820;
    text-align: right;
}

.kmu1-services {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 22px;
}

.kmu1-card {
    min-width: 0;
    padding: 26px;
    background: #ffffff;
    border: 1px solid #dfe8ec;
    border-radius: 8px;
    box-shadow: 0 12px 32px rgba(17, 24, 32, 0.05);
}

.kmu1-card-label {
    display: inline-flex;
    margin-bottom: 14px;
    color: #168f97;
    font-size: 12px;
    font-weight: 900;
    line-height: 1.35;
    text-transform: uppercase;
}

.kmu1-card h3,
.kmu1-person h3 {
    margin: 0 0 12px;
    color: #111820;
    font-size: 22px;
    font-weight: 900;
    line-height: 1.25;
}

.kmu1-service-num {
    display: block;
    margin-bottom: 18px;
    color: #b3c0c7;
    font-size: 34px;
    font-weight: 900;
    line-height: 1;
}

.kmu1-card p,
.kmu1-person p,
.kmu1-history p,
.kmu1-history li {
    color: #52616c;
    font-size: 16px;
    line-height: 1.72;
}

.kmu1-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 18px;
}

.kmu1-tag {
    display: inline-flex;
    padding: 6px 10px;
    background: #eef7f8;
    border-radius: 4px;
    color: #167d84;
    font-size: 12px;
    font-weight: 800;
    line-height: 1;
}

.kmu1-person {
    display: grid;
    grid-template-columns: minmax(240px, 0.72fr) minmax(0, 1.28fr);
    gap: 30px;
    align-items: start;
    padding: 34px;
    background: #ffffff;
    border: 1px solid #dfe8ec;
    border-radius: 8px;
    box-shadow: 0 12px 32px rgba(17, 24, 32, 0.05);
}

.kmu1-person-photo {
    overflow: hidden;
    margin-bottom: 16px;
    background: #eef2f4;
    border-radius: 8px;
    aspect-ratio: 4 / 5;
}

.kmu1-person-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.kmu1-person-meta {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin: 18px 0 22px;
}

.kmu1-person-meta div {
    padding: 14px;
    background: #f3f7f8;
    border-radius: 6px;
}

.kmu1-person-meta span {
    display: block;
    margin-bottom: 6px;
    color: #71808b;
    font-size: 11px;
    font-weight: 900;
    text-transform: uppercase;
}

.kmu1-person-meta b {
    color: #111820;
    font-size: 13px;
    line-height: 1.35;
}

.kmu1-person-role {
    margin: 0 0 18px;
    color: #168f97;
    font-size: 13px;
    font-weight: 900;
    line-height: 1.45;
    text-transform: uppercase;
}

.kmu1-awards {
    margin: 18px 0 0;
    padding-left: 20px;
}

.kmu1-awards li {
    margin-bottom: 8px;
}

.kmu1-timeline {
    margin: 18px 0 0;
    padding: 0;
    list-style: none;
}

.kmu1-timeline li {
    display: grid;
    grid-template-columns: 110px minmax(0, 1fr);
    gap: 14px;
    padding: 12px 0;
    border-top: 1px solid #edf2f4;
    color: #52616c;
    line-height: 1.55;
}

.kmu1-timeline .year {
    color: #168f97;
    font-size: 13px;
    font-weight: 900;
}

.kmu1-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 18px;
}

.kmu1-tab {
    padding: 10px 14px;
    background: #ffffff;
    border: 1px solid #dfe8ec;
    border-radius: 4px;
    color: #34434e;
    font-size: 13px;
    font-weight: 900;
    text-transform: uppercase;
}

.kmu1-tab.is-active,
.kmu1-tab:hover,
.kmu1-tab:focus {
    background: #111820;
    border-color: #111820;
    color: #ffffff;
}

.kmu1-pane {
    display: none;
}

.kmu1-pane.is-active {
    display: block;
}

.kmu1-project-list {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

.kmu1-project {
    min-width: 0;
    padding: 16px;
    background: #ffffff;
    border: 1px solid #dfe8ec;
    border-radius: 6px;
}

.kmu1-project .cat {
    display: block;
    margin-bottom: 7px;
    color: #168f97;
    font-size: 11px;
    font-weight: 900;
    text-transform: uppercase;
}

.kmu1-project .name {
    display: block;
    color: #111820;
    font-size: 15px;
    font-weight: 900;
    line-height: 1.3;
}

.kmu1-project .loc {
    display: block;
    margin-top: 8px;
    color: #71808b;
    font-size: 13px;
    font-weight: 700;
}

.kmu1-cta-strip {
    display: flex;
    justify-content: space-between;
    gap: 24px;
    align-items: center;
    padding: 30px;
    background: #111820;
    border-radius: 8px;
    color: #ffffff;
}

.kmu1-cta-strip h3 {
    margin: 0;
    color: #ffffff;
    font-size: 28px;
    font-weight: 900;
    line-height: 1.2;
}

.kmu1-cta-strip p {
    margin: 8px 0 0;
    color: #b9c6cc;
}

.kmu1-history {
    background: #ffffff;
    border: 1px solid #dfe8ec;
    border-radius: 8px;
}

.kmu1-history summary {
    display: flex;
    justify-content: space-between;
    gap: 18px;
    padding: 22px 26px;
    color: #111820;
    cursor: pointer;
    font-size: 19px;
    font-weight: 900;
    line-height: 1.3;
}

.kmu1-history summary::-webkit-details-marker {
    display: none;
}

.kmu1-history summary::after {
    content: "+";
    color: #20a8b0;
    font-size: 28px;
    line-height: 1;
}

.kmu1-history[open] summary::after {
    content: "-";
}

.kmu1-history-body {
    padding: 0 26px 26px;
    border-top: 1px solid #edf2f4;
}

.kmu1-contacts {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
    margin-bottom: 58px;
}

.kmu1-contact-item {
    min-width: 0;
    padding: 22px;
    background: #111820;
    border-radius: 8px;
    color: #ffffff;
}

.kmu1-contact-item span {
    display: block;
    margin-bottom: 8px;
    color: #aebbc4;
    font-size: 12px;
    font-weight: 900;
    line-height: 1.35;
    text-transform: uppercase;
}

.kmu1-contact-item strong,
.kmu1-contact-item a {
    color: #ffffff;
    font-size: 17px;
    font-weight: 800;
    line-height: 1.45;
}

.kmu1-focus-mode .kmu1-hero {
    min-height: 0;
    background: #ffffff;
}

.kmu1-focus-mode .kmu1-hero::before,
.kmu1-focus-mode .kmu1-hero::after,
.kmu1-focus-mode .kmu1-stats,
.kmu1-focus-mode .kmu1-tags,
.kmu1-focus-mode .kmu1-strip,
.kmu1-focus-mode .kmu1-mini-nav,
.kmu1-focus-mode .kmu1-person-photo,
.kmu1-focus-mode .kmu1-cta-strip {
    display: none;
}

.kmu1-focus-mode .kmu1-hero-content {
    max-width: 840px;
    margin: 0 auto;
    padding: 44px 34px;
}

.kmu1-focus-mode .kmu1-project-grid,
.kmu1-focus-mode .kmu1-about-grid,
.kmu1-focus-mode .kmu1-services,
.kmu1-focus-mode .kmu1-person,
.kmu1-focus-mode .kmu1-contacts,
.kmu1-focus-mode .kmu1-project-list {
    grid-template-columns: 1fr;
    max-width: 840px;
    margin-left: auto;
    margin-right: auto;
}

.kmu1-focus-mode .kmu1-section-title {
    max-width: 840px;
    margin-left: auto;
    margin-right: auto;
}

.kmu1-focus-mode .kmu1-card,
.kmu1-focus-mode .kmu1-person,
.kmu1-focus-mode .kmu1-history {
    box-shadow: none;
}

@media (max-width: 991px) {
    .kmu1-hero::before {
        inset: 46% 0 0;
    }

    .kmu1-hero::after {
        background: linear-gradient(180deg, #ffffff 0%, rgba(255,255,255,0.98) 54%, rgba(255,255,255,0.25) 100%);
    }

    .kmu1-hero-content {
        padding: 42px 30px 260px;
    }

    .kmu1-title {
        font-size: 38px;
    }

    .kmu1-person,
    .kmu1-contacts,
    .kmu1-about-grid,
    .kmu1-services {
        grid-template-columns: 1fr;
    }

    .kmu1-project-list {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 767px) {
    .kmu1-hero {
        border-radius: 0;
        margin-left: -15px;
        margin-right: -15px;
    }

    .kmu1-hero-content {
        padding: 34px 22px 220px;
    }

    .kmu1-title {
        font-size: 31px;
    }

    .kmu1-sub {
        font-size: 16px;
    }

    .kmu1-stats,
    .kmu1-project-grid,
    .kmu1-project-list,
    .kmu1-person-meta {
        grid-template-columns: 1fr;
    }

    .kmu1-timeline li {
        grid-template-columns: 1fr;
    }

    .kmu1-cta-strip {
        display: block;
    }

    .kmu1-card,
    .kmu1-person {
        padding: 22px;
    }

    .kmu1-focus-mode .kmu1-hero-content {
        padding: 30px 22px;
    }
}


/* ============================================================
   VARIED HERO EFFECTS (Zoom, Pan, Gradient)
   ============================================================ */

/* Theme B: Zoom (Ken Burns) */
.amu-hero-zoom .amu-hero-bg {
    background-attachment: scroll !important; /* Override parallax */
    transform: scale(1);
    animation: kenBurns 20s ease-in-out infinite alternate;
}
@keyframes kenBurns {
    0% { transform: scale(1); }
    100% { transform: scale(1.15); }
}

/* Theme C: Pan (Horizontal scroll) */
.amu-hero-pan .amu-hero-bg {
    background-attachment: scroll !important;
    background-size: 130% !important;
    background-position: 0% 50% !important;
    animation: panBg 25s linear infinite alternate;
}
@keyframes panBg {
    0% { background-position: 0% 50% !important; }
    100% { background-position: 100% 50% !important; }
}

/* Theme D: Gradient Shift */
.amu-hero-gradient .amu-hero-bg {
    background-attachment: scroll !important;
}
.amu-hero-gradient::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(255,255,255,0.95) 0%, rgba(255,255,255,0.7) 50%, rgba(33,168,176,0.3) 100%);
    background-size: 200% 200%;
    animation: gradientShift 8s ease infinite;
    z-index: 1;
}
@keyframes gradientShift {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}

/* NEW ICON ANIMATIONS */
.amu-anim.anim-pulse { 
    animation: iconPulse 4s ease-in-out infinite; 
}
@keyframes iconPulse {
    0%, 100% { transform: scale(1); opacity: 0.1; }
    50% { transform: scale(1.3); opacity: 0.25; }
}

.amu-anim.anim-rotate { 
    animation: iconRotate 20s linear infinite; 
}
@keyframes iconRotate {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.amu-anim.anim-sway { 
    animation: iconSway 6s ease-in-out infinite; 
    transform-origin: bottom center; 
}
@keyframes iconSway {
    0%, 100% { transform: rotate(-20deg); }
    50% { transform: rotate(20deg); }
}

/* ============================================================
   KMU-1 Full Package Light Port
   ============================================================ */

/* ==========================================================
   КМУ-1 · standalone page · drop-in HTML+CSS+JS
   Палитра: deep navy + electric amber + steel
   ========================================================== */
.kmu1{
  --bg:           #F4F7F8;
  --bg-2:         #FFFFFF;
  --surface:      #FFFFFF;
  --surface-2:    #EEF4F6;
  --line:         #DCE8EC;
  --text:         #111820;
  --text-dim:     #52616C;
  --text-mute:    #71808B;
  --amber:        #20A8B0;
  --amber-2:      #178F97;
  --electric:     #4BA3C7;
  --danger:       #D94862;
  --success:      #2E9E70;
  --grid:         rgba(17,24,32,0.055);

  --container:    1280px;
  --radius:       4px;
  --radius-lg:    8px;

  --ease:         cubic-bezier(.2,.7,.2,1);
}

.kmu1,.kmu1 *{box-sizing:border-box}.kmu1 *{margin:0;padding:0}
.kmu1{background:var(--bg);color:var(--text);font-family:"IBM Plex Sans",Arial,system-ui,-apple-system,Segoe UI,sans-serif;font-weight:400;line-height:1.55;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;}
.kmu1-template-page{overflow-x:hidden}
.kmu1 img{max-width:100%;display:block}
.kmu1 a{color:inherit;text-decoration:none}
.kmu1 button{font:inherit;cursor:pointer;border:0;background:none;color:inherit}
.kmu1 ::selection{background:var(--amber);color:#fff}

.kmu1 *{box-sizing:border-box}

/* containers */
.kmu1__wrap{max-width:var(--container);margin:0 auto;padding:0 32px}

/* === GRID BG (industrial blueprint feel) === */
.kmu1{
  position:relative;
  background:
    linear-gradient(180deg,#F7FAFB 0%, #F4F7F8 46%, #FFFFFF 100%);
  color:var(--text);
}
.kmu1::before{
  content:"";
  position:absolute;inset:0;
  background-image:
    linear-gradient(var(--grid) 1px, transparent 1px),
    linear-gradient(90deg,var(--grid) 1px, transparent 1px);
  background-size: 64px 64px;
  pointer-events:none;
  mask-image: radial-gradient(ellipse at center, #000 30%, transparent 80%);
  -webkit-mask-image: radial-gradient(ellipse at center, #000 30%, transparent 80%);
}

/* === TOP BAR === */
.kmu1__top{
  position:relative;z-index:5;
  border-bottom:1px solid var(--line);
  background:rgba(255,255,255,.88);
  backdrop-filter:blur(14px);box-shadow:0 10px 30px rgba(17,24,32,.06);
  -webkit-backdrop-filter:blur(14px);box-shadow:0 10px 30px rgba(17,24,32,.06);
}
.kmu1__top-inner{display:flex;align-items:center;justify-content:space-between;height:72px;gap:24px}
.kmu1__brand{display:flex;align-items:center;gap:14px}
.kmu1__logo{
  width:42px;height:42px;flex:none;
  background:linear-gradient(135deg,var(--amber),var(--amber-2));
  display:grid;place-items:center;border-radius:2px;
  box-shadow:0 8px 24px rgba(32,168,176,.22), inset 0 0 0 1px rgba(255,255,255,.35);
}
.kmu1__logo svg{width:22px;height:22px;color:#FFFFFF}
.kmu1__brand-text{display:flex;flex-direction:column;line-height:1.05}
.kmu1__brand-text b{font-family:"Unbounded",sans-serif;font-weight:800;letter-spacing:.02em;font-size:14px}
.kmu1__brand-text span{font-family:"IBM Plex Mono",monospace;font-size:11px;color:var(--text-mute);letter-spacing:.18em;text-transform:uppercase}

.kmu1__nav{display:flex;gap:28px}
.kmu1__nav a{font-size:13.5px;color:var(--text-dim);font-weight:500;letter-spacing:.02em;position:relative;padding:6px 0;transition:color .25s var(--ease)}
.kmu1__nav a:hover{color:var(--text)}
.kmu1__nav a::after{content:"";position:absolute;bottom:0;left:0;width:0;height:2px;background:var(--amber);transition:width .35s var(--ease)}
.kmu1__nav a:hover::after{width:100%}

.kmu1__cta{
  display:inline-flex;align-items:center;gap:10px;
  padding:12px 22px;
  background:var(--amber);color:#FFFFFF;
  font-weight:700;font-size:13px;letter-spacing:.03em;text-transform:uppercase;
  border-radius:2px;
  transition:transform .25s var(--ease), box-shadow .25s var(--ease), background .2s;
  box-shadow:0 8px 22px rgba(32,168,176,.2);
}
.kmu1__cta:hover{transform:translateY(-2px);box-shadow:0 12px 28px rgba(32,168,176,.26);background:var(--amber-2)}
.kmu1__cta svg{width:14px;height:14px}

/* === HERO === */
.kmu1__hero{position:relative;padding:80px 0 100px;overflow:hidden}
.kmu1__hero-grid{display:grid;grid-template-columns: 1.15fr 1fr;gap:64px;align-items:center;position:relative;z-index:2}

.kmu1__eyebrow{
  display:inline-flex;align-items:center;gap:10px;
  font-family:"IBM Plex Mono",monospace;font-size:12px;color:var(--amber);
  letter-spacing:.22em;text-transform:uppercase;margin-bottom:28px
}
.kmu1__eyebrow::before{
  content:"";width:34px;height:1px;background:var(--amber);
}

.kmu1__hero h1{
  font-family:"Unbounded",sans-serif;font-weight:800;
  font-size:clamp(40px, 6.2vw, 88px);
  line-height:.95;letter-spacing:-.02em;
  margin-bottom:28px;
}
.kmu1__hero h1 em{font-style:normal;color:var(--amber);position:relative;display:inline-block}
.kmu1__hero h1 em::after{
  content:"";position:absolute;left:0;right:0;bottom:6px;height:6px;
  background:rgba(32,168,176,.18);z-index:-1;
}
.kmu1__hero p.lead{font-size:18px;color:var(--text-dim);max-width:520px;margin-bottom:40px;line-height:1.6}

.kmu1__hero-meta{display:flex;gap:48px;flex-wrap:wrap;margin-bottom:44px}
.kmu1__hero-meta div{display:flex;flex-direction:column;gap:4px}
.kmu1__hero-meta span{font-family:"IBM Plex Mono",monospace;font-size:11px;color:var(--text-mute);letter-spacing:.2em;text-transform:uppercase}
.kmu1__hero-meta b{font-family:"Unbounded",sans-serif;font-weight:700;font-size:22px;color:var(--text)}

.kmu1__hero-actions{display:flex;gap:16px;flex-wrap:wrap}
.btn-ghost{
  display:inline-flex;align-items:center;gap:10px;
  padding:14px 24px;border:1px solid var(--line);border-radius:2px;
  color:var(--text);font-size:13px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;
  transition:border-color .25s var(--ease), background .25s var(--ease);
}
.btn-ghost:hover{border-color:var(--amber);background:rgba(32,168,176,.06)}
.btn-ghost svg{width:14px;height:14px;transition:transform .3s var(--ease)}
.btn-ghost:hover svg{transform:translateX(4px)}

/* hero visual */
.kmu1__hero-visual{position:relative;aspect-ratio: 4/5;}
.kmu1__hero-img{
  position:absolute;inset:0;
  background-image:url("/assets/images/bufer/kmu1-hero.webp");
  background-size:cover;background-position:center;
  border:1px solid var(--line);
  filter:contrast(1.05) saturate(.95);
  transition:transform 1.2s var(--ease);
}
.kmu1__hero-visual:hover .kmu1__hero-img{transform:scale(1.03)}
.kmu1__hero-visual::before{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg, rgba(255,255,255,0) 28%, rgba(255,255,255,.88) 100%);
  z-index:1;pointer-events:none;
}
.kmu1__hero-visual::after{
  content:"";position:absolute;inset:0;
  border:1px solid rgba(32,168,176,.0);
  pointer-events:none;
}
.kmu1__hero-tag{
  position:absolute;left:-12px;bottom:24px;z-index:2;
  background:var(--amber);color:#FFFFFF;
  padding:14px 20px;font-family:"Unbounded",sans-serif;font-weight:800;
  font-size:13px;letter-spacing:.08em;text-transform:uppercase;
  box-shadow:0 14px 32px rgba(32,168,176,.25);
}
.kmu1__hero-corner{
  position:absolute;top:-1px;right:-1px;width:80px;height:80px;
  border-top:2px solid var(--amber);
  border-right:2px solid var(--amber);
  pointer-events:none;
}
.kmu1__hero-corner.bl{top:auto;right:auto;bottom:-1px;left:-1px;
  border-top:0;border-right:0;
  border-bottom:2px solid var(--amber);border-left:2px solid var(--amber)}

/* hero number deco */
.kmu1__hero-bignum{
  position:absolute;right:0;top:14%;
  font-family:"Unbounded",sans-serif;font-weight:900;
  font-size: clamp(140px, 22vw, 320px);
  color:transparent;
  -webkit-text-stroke:1px rgba(32,168,176,.08);
  pointer-events:none;line-height:.85;letter-spacing:-.04em;
  z-index:1;
}

/* === MARQUEE STRIP === */
.kmu1__strip{
  position:relative;z-index:3;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
  background:#FFFFFF;
  overflow:hidden;
}
.kmu1__strip-track{
  display:flex;gap:60px;align-items:center;
  padding:18px 0;
  animation: kmuMarquee 50s linear infinite;
  white-space:nowrap;
  width:max-content;
}
.kmu1__strip-track span{
  display:inline-flex;align-items:center;gap:12px;
  font-family:"IBM Plex Mono",monospace;font-size:13px;letter-spacing:.18em;
  color:var(--text-dim);text-transform:uppercase;
}
.kmu1__strip-track span::before{
  content:"";width:8px;height:8px;background:var(--amber);transform:rotate(45deg);
}
@keyframes kmuMarquee{
  from{transform:translateX(0)}
  to  {transform:translateX(-50%)}
}

/* === SECTION === */
.kmu1__section{position:relative;z-index:2;padding:120px 0}
.kmu1__section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:48px;margin-bottom:64px;flex-wrap:wrap}
.kmu1__section-head h2{
  font-family:"Unbounded",sans-serif;font-weight:800;
  font-size:clamp(32px, 4.4vw, 60px);line-height:1;letter-spacing:-.02em;
  max-width:780px;
}
.kmu1__section-head h2 em{font-style:normal;color:var(--amber)}
.kmu1__section-head .num{
  font-family:"IBM Plex Mono",monospace;font-size:12px;color:var(--text-mute);
  letter-spacing:.2em;text-transform:uppercase;display:flex;align-items:center;gap:14px;flex:none;
}
.kmu1__section-head .num::before{content:"";width:48px;height:1px;background:var(--text-mute)}

/* === STATS === */
.kmu1__stats{
  display:grid;grid-template-columns:repeat(4,1fr);gap:1px;
  background:var(--line);
  border:1px solid var(--line);
}
.kmu1__stat{
  background:var(--bg-2);
  padding:40px 32px;
  display:flex;flex-direction:column;gap:14px;
  position:relative;overflow:hidden;
  transition:background .35s var(--ease);
}
.kmu1__stat:hover{background:var(--surface)}
.kmu1__stat::before{
  content:"";position:absolute;inset:auto 0 0 0;height:2px;background:var(--amber);
  transform:scaleX(0);transform-origin:left;transition:transform .5s var(--ease);
}
.kmu1__stat:hover::before{transform:scaleX(1)}
.kmu1__stat .v{
  font-family:"Unbounded",sans-serif;font-weight:800;
  font-size:clamp(40px, 4.5vw, 64px);line-height:1;letter-spacing:-.02em;
  color:var(--text);
}
.kmu1__stat .v sup{color:var(--amber);font-size:.5em;vertical-align:top;margin-left:4px}
.kmu1__stat .l{
  font-family:"IBM Plex Mono",monospace;font-size:11.5px;
  color:var(--text-mute);letter-spacing:.18em;text-transform:uppercase;
}
.kmu1__stat .d{color:var(--text-dim);font-size:14px;line-height:1.5;margin-top:4px}

/* === ABOUT split === */
.kmu1__about{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:start}
.kmu1__about-text p{font-size:17px;color:var(--text-dim);margin-bottom:18px;line-height:1.65}
.kmu1__about-text p strong{color:var(--text);font-weight:600}
.kmu1__about-list{list-style:none;display:flex;flex-direction:column;gap:14px;margin-top:28px}
.kmu1__about-list li{
  display:grid;grid-template-columns:32px 1fr;gap:14px;align-items:start;
  padding-bottom:14px;border-bottom:1px dashed var(--line);
}
.kmu1__about-list li:last-child{border-bottom:0}
.kmu1__about-list li b{font-family:"IBM Plex Mono",monospace;font-size:12px;color:var(--amber);letter-spacing:.1em}
.kmu1__about-list li span{color:var(--text-dim);font-size:15px;line-height:1.5}

.kmu1__about-card{
  position:sticky;top:24px;
  background:var(--surface);
  border:1px solid var(--line);
  padding:36px;
  border-radius:var(--radius);
  position:relative;
}
.kmu1__about-card h3{font-family:"Unbounded",sans-serif;font-weight:700;font-size:22px;margin-bottom:20px;letter-spacing:-.01em}
.kmu1__about-card .row{display:flex;justify-content:space-between;padding:14px 0;border-bottom:1px solid var(--line);font-size:14px}
.kmu1__about-card .row:last-child{border-bottom:0}
.kmu1__about-card .row span{color:var(--text-mute);font-family:"IBM Plex Mono",monospace;font-size:12px;letter-spacing:.05em}
.kmu1__about-card .row b{color:var(--text);text-align:right}
.kmu1__about-card-corner{position:absolute;top:-1px;left:-1px;width:60px;height:60px;border-top:2px solid var(--amber);border-left:2px solid var(--amber)}

/* === SERVICES === */
.kmu1__services{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.kmu1__service{
  background:var(--surface);border:1px solid var(--line);
  padding:36px 32px 40px;border-radius:var(--radius);
  position:relative;overflow:hidden;
  transition:transform .4s var(--ease), border-color .3s var(--ease);
}
.kmu1__service:hover{transform:translateY(-6px);border-color:var(--amber)}
.kmu1__service-icon{
  width:54px;height:54px;display:grid;place-items:center;
  background:rgba(32,168,176,.1);border:1px solid rgba(32,168,176,.25);
  margin-bottom:24px;color:var(--amber);
}
.kmu1__service-icon svg{width:26px;height:26px}
.kmu1__service h3{font-family:"Unbounded",sans-serif;font-weight:700;font-size:20px;line-height:1.2;margin-bottom:14px;letter-spacing:-.01em}
.kmu1__service p{color:var(--text-dim);font-size:15px;line-height:1.6}
.kmu1__service-num{
  position:absolute;top:24px;right:28px;
  font-family:"IBM Plex Mono",monospace;color:var(--text-mute);font-size:12px;letter-spacing:.1em;
}
.kmu1__service::after{
  content:"";position:absolute;left:0;bottom:0;height:2px;width:0;background:var(--amber);
  transition:width .5s var(--ease);
}
.kmu1__service:hover::after{width:100%}

/* === PROJECTS === */
.kmu1__tabs{display:flex;gap:0;border-bottom:1px solid var(--line);margin-bottom:40px;flex-wrap:wrap}
.kmu1__tab{
  padding:16px 22px;font-family:"IBM Plex Mono",monospace;font-size:12px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--text-mute);border-bottom:2px solid transparent;margin-bottom:-1px;
  transition:color .25s var(--ease), border-color .25s var(--ease);
}
.kmu1__tab:hover{color:var(--text)}
.kmu1__tab.is-active{color:var(--amber);border-bottom-color:var(--amber)}

.kmu1__projects-pane{display:none;animation:fade .4s var(--ease)}
.kmu1__projects-pane.is-active{display:block}
@keyframes fade{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

.kmu1__proj-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.kmu1__proj{
  background:var(--surface);border:1px solid var(--line);
  padding:22px 22px 24px;
  display:flex;flex-direction:column;gap:8px;
  position:relative;overflow:hidden;
  transition:background .25s var(--ease), border-color .25s var(--ease);
}
.kmu1__proj:hover{background:var(--surface-2);border-color:var(--amber)}
.kmu1__proj .cat{font-family:"IBM Plex Mono",monospace;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--amber)}
.kmu1__proj .name{font-family:"Unbounded",sans-serif;font-weight:600;font-size:17px;line-height:1.25;color:var(--text)}
.kmu1__proj .loc{font-size:13px;color:var(--text-mute);display:flex;align-items:center;gap:6px;margin-top:auto;padding-top:14px}
.kmu1__proj .loc svg{width:12px;height:12px;color:var(--amber)}

.kmu1__proj-list{display:grid;grid-template-columns:1fr;gap:0;border-top:1px solid var(--line)}
.kmu1__proj-list .row{
  display:grid;grid-template-columns: 60px 1fr auto;gap:24px;align-items:center;
  padding:22px 4px;border-bottom:1px solid var(--line);
  transition:background .25s var(--ease), padding .25s var(--ease);
}
.kmu1__proj-list .row:hover{background:rgba(32,168,176,.03);padding-left:16px}
.kmu1__proj-list .row .idx{font-family:"IBM Plex Mono",monospace;color:var(--text-mute);font-size:12px;letter-spacing:.1em}
.kmu1__proj-list .row .ttl{font-size:16px;color:var(--text);line-height:1.4}
.kmu1__proj-list .row .ttl b{font-weight:600;color:var(--amber);margin-right:8px;font-family:"Unbounded",sans-serif}
.kmu1__proj-list .row .city{font-family:"IBM Plex Mono",monospace;font-size:11px;color:var(--text-mute);letter-spacing:.14em;text-transform:uppercase}

/* === LEADER === */
.kmu1__leader{
  display:grid;grid-template-columns: 380px 1fr;gap:64px;align-items:start;
  background:linear-gradient(180deg, var(--bg-2), var(--bg));
  border:1px solid var(--line);
  padding:56px;
  border-radius:var(--radius-lg);
  position:relative;overflow:hidden;
}
.kmu1__leader-side{position:relative}
.kmu1__leader-photo{
  position:relative;
  aspect-ratio: 3/4;
  background:var(--surface);
  border:1px solid var(--line);
  overflow:hidden;
}
.kmu1__leader-photo img{
  width:100%;height:100%;object-fit:cover;
  filter:contrast(1.05) saturate(.92);
  transition:transform .8s var(--ease);
}
.kmu1__leader:hover .kmu1__leader-photo img{transform:scale(1.04)}
.kmu1__leader-tag{
  position:absolute;left:-10px;bottom:24px;
  background:var(--amber);color:#FFFFFF;
  padding:10px 16px;font-family:"IBM Plex Mono",monospace;
  font-size:11px;letter-spacing:.18em;text-transform:uppercase;font-weight:700;
}

.kmu1__leader h3{
  font-family:"Unbounded",sans-serif;font-weight:800;
  font-size:clamp(28px, 3vw, 40px);line-height:1.05;letter-spacing:-.01em;margin-bottom:8px;
}
.kmu1__leader-role{font-family:"IBM Plex Mono",monospace;font-size:13px;color:var(--amber);letter-spacing:.16em;text-transform:uppercase;margin-bottom:32px}

.kmu1__leader-meta{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-bottom:36px;padding-bottom:28px;border-bottom:1px solid var(--line)}
.kmu1__leader-meta div span{font-family:"IBM Plex Mono",monospace;font-size:11px;color:var(--text-mute);letter-spacing:.14em;text-transform:uppercase;display:block;margin-bottom:6px}
.kmu1__leader-meta div b{font-size:14px;color:var(--text);font-weight:500}

.kmu1__bio-block{margin-bottom:24px}
.kmu1__bio-block h4{
  font-family:"Unbounded",sans-serif;font-weight:600;font-size:14px;
  letter-spacing:.04em;color:var(--text);margin-bottom:14px;
  display:flex;align-items:center;gap:12px;
}
.kmu1__bio-block h4::before{
  content:"";width:24px;height:2px;background:var(--amber);
}
.kmu1__bio-block p, .kmu1__bio-block li{color:var(--text-dim);font-size:14.5px;line-height:1.65}
.kmu1__bio-timeline{list-style:none;display:flex;flex-direction:column;gap:0}
.kmu1__bio-timeline li{
  display:grid;grid-template-columns: 110px 1fr;gap:20px;
  padding:14px 0;border-bottom:1px dashed var(--line);
}
.kmu1__bio-timeline li:last-child{border-bottom:0}
.kmu1__bio-timeline li .y{font-family:"IBM Plex Mono",monospace;font-size:12px;color:var(--amber);letter-spacing:.06em;font-weight:500;padding-top:2px}

.kmu1__awards{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.kmu1__award{
  font-family:"IBM Plex Mono",monospace;font-size:11.5px;
  background:rgba(32,168,176,.08);color:var(--amber);
  border:1px solid rgba(32,168,176,.25);
  padding:8px 12px;letter-spacing:.04em;
  display:inline-flex;align-items:center;gap:8px;
  transition:background .25s var(--ease), color .25s var(--ease);
}
.kmu1__award:hover{background:var(--amber);color:#FFFFFF}
.kmu1__award svg{width:12px;height:12px}

/* === CHIEF ENGINEER + Contacts === */
.kmu1__contacts{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.kmu1__contact-card{
  background:var(--surface);border:1px solid var(--line);
  padding:40px 36px;border-radius:var(--radius);
  position:relative;overflow:hidden;
  transition:transform .4s var(--ease), border-color .3s var(--ease);
}
.kmu1__contact-card:hover{transform:translateY(-4px);border-color:var(--amber)}
.kmu1__contact-card .role{font-family:"IBM Plex Mono",monospace;font-size:12px;color:var(--amber);letter-spacing:.18em;text-transform:uppercase;margin-bottom:14px}
.kmu1__contact-card h3{font-family:"Unbounded",sans-serif;font-weight:700;font-size:24px;margin-bottom:24px;line-height:1.2}
.kmu1__contact-card .lines{display:flex;flex-direction:column;gap:14px}
.kmu1__contact-line{
  display:grid;grid-template-columns:24px 1fr;gap:14px;align-items:start;
  padding:12px 0;border-top:1px solid var(--line);
}
.kmu1__contact-line:first-child{border-top:0}
.kmu1__contact-line svg{width:18px;height:18px;color:var(--amber);margin-top:2px}
.kmu1__contact-line a, .kmu1__contact-line span{font-size:15px;color:var(--text);line-height:1.5;word-break:break-word}
.kmu1__contact-line a:hover{color:var(--amber)}
.kmu1__contact-line .lbl{display:block;font-family:"IBM Plex Mono",monospace;font-size:11px;color:var(--text-mute);letter-spacing:.14em;text-transform:uppercase;margin-bottom:4px}

/* === CTA STRIP === */
.kmu1__ctastrip{
  position:relative;z-index:2;
  margin: 60px 0 0;padding:80px 0;
  background:
    radial-gradient(ellipse at 20% 50%, rgba(32,168,176,.12), transparent 50%),
    linear-gradient(180deg, var(--bg-2), var(--bg));
  border-top:1px solid var(--line);border-bottom:1px solid var(--line);
}
.kmu1__ctastrip-inner{display:grid;grid-template-columns: 1.4fr 1fr;gap:48px;align-items:center}
.kmu1__ctastrip h3{font-family:"Unbounded",sans-serif;font-weight:800;font-size:clamp(28px,3.5vw,46px);line-height:1.05;letter-spacing:-.02em}
.kmu1__ctastrip h3 em{font-style:normal;color:var(--amber)}
.kmu1__ctastrip p{color:var(--text-dim);font-size:16px;margin-top:20px;max-width:520px}
.kmu1__ctastrip-actions{display:flex;flex-direction:column;gap:14px;align-items:flex-end}
.kmu1__ctastrip-actions .kmu1__cta{padding:18px 28px;font-size:14px}

/* === FOOTER === */
.kmu1__footer{position:relative;z-index:2;padding:48px 0;border-top:1px solid var(--line);background:#FFFFFF}
.kmu1__footer-inner{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:18px}
.kmu1__footer p{font-family:"IBM Plex Mono",monospace;font-size:12px;color:var(--text-mute);letter-spacing:.1em}

/* === RESPONSIVE === */
@media (max-width: 1100px){
  .kmu1__hero-grid{grid-template-columns:1fr;gap:48px}
  .kmu1__about{grid-template-columns:1fr;gap:48px}
  .kmu1__stats{grid-template-columns:repeat(2,1fr)}
  .kmu1__services{grid-template-columns:1fr 1fr}
  .kmu1__proj-grid{grid-template-columns:1fr 1fr}
  .kmu1__leader{grid-template-columns:1fr;padding:36px;gap:36px}
  .kmu1__leader-side{max-width:380px}
  .kmu1__contacts{grid-template-columns:1fr}
  .kmu1__ctastrip-inner{grid-template-columns:1fr}
  .kmu1__ctastrip-actions{align-items:flex-start}
}
@media (max-width: 720px){
  .kmu1__wrap{padding:0 20px}
  .kmu1__nav{display:none}
  .kmu1__section{padding:80px 0}
  .kmu1__hero{padding:48px 0 70px}
  .kmu1__stats{grid-template-columns:1fr}
  .kmu1__services{grid-template-columns:1fr}
  .kmu1__proj-grid{grid-template-columns:1fr}
  .kmu1__leader-meta{grid-template-columns:1fr 1fr}
  .kmu1__bio-timeline li{grid-template-columns:1fr;gap:4px}
  .kmu1__leader{padding:24px}
  .kmu1__hero-meta{gap:28px}
}

/* reveal animation */
.kmu-reveal{opacity:0;transform:translateY(24px);transition:opacity .9s var(--ease), transform .9s var(--ease)}
.kmu-reveal.is-in{opacity:1;transform:none}

/* Light overrides for full package port */
.kmu1-template-page .page-content { background:#f4f7f8; }
.kmu1__top { color:var(--text); }
.kmu1__logo svg { color:#fff; }
.kmu1__brand-text strong,
.kmu1__section-head h2,
.kmu1__about-card h3,
.kmu1__service h3,
.kmu1__leader-content h3,
.kmu1__contact-card h3,
.kmu1__ctastrip h3 { color:var(--text) !important; }
.kmu1__hero-text h1 { color:var(--text); }
.kmu1__hero-text h1 em,
.kmu1__section-head h2 em,
.kmu1__ctastrip h3 em { color:var(--amber); }
.kmu1__hero-meta .m,
.kmu1__stat,
.kmu1__about-card,
.kmu1__service,
.kmu1__proj,
.kmu1__contact-card { box-shadow:0 16px 38px rgba(17,24,32,.06); }
.kmu1__leader { background:linear-gradient(180deg,#ffffff,#f5f9fa); }
.kmu1__leader-photo { background:#e9eff2; }
.kmu1__bio-block p strong { color:var(--text) !important; }
.kmu1__contact-line a:hover { color:var(--amber); }
.kmu1__ctastrip { background:linear-gradient(135deg,#ffffff,#edf7f8); border:1px solid var(--line); }
.kmu1__footer { color:var(--text-dim); }
.kmu1-theme-toggle {
    position: fixed;
    right: 0;
    top: 44%;
    z-index: 9999;
    min-height: 46px;
    padding: 12px 14px;
    border: 0;
    border-radius: 8px 0 0 8px;
    background: #111820;
    color: #fff;
    box-shadow: 0 14px 36px rgba(17,24,32,.22);
    font: 800 12px/1.2 Arial, sans-serif;
    letter-spacing: .02em;
    text-transform: uppercase;
    cursor: pointer;
}
.kmu1-theme-toggle:hover,
.kmu1-theme-toggle:focus { background:#20a8b0; outline:none; }

/* KMU-1 polish: align full package with the main site typography */
.kmu1 {
    --container: 1160px;
    font-family: "Open Sans", Arial, sans-serif !important;
    text-align: left !important;
}

.kmu1 * {
    letter-spacing: 0;
}

.kmu1__brand-text b,
.kmu1__brand-text span,
.kmu1__eyebrow,
.kmu1__hero h1,
.kmu1__hero-meta span,
.kmu1__hero-meta b,
.kmu1__hero-tag,
.kmu1__strip span,
.kmu1__section-head h2,
.kmu1__section-head .num,
.kmu1__stat .v,
.kmu1__stat .l,
.kmu1__about-card h3,
.kmu1__about-card .row span,
.kmu1__service h3,
.kmu1__service-num,
.kmu1__tab,
.kmu1__proj .cat,
.kmu1__proj .name,
.kmu1__proj-list .row .idx,
.kmu1__proj-list .row .ttl b,
.kmu1__proj-list .row .city,
.kmu1__leader-content h3,
.kmu1__leader-role,
.kmu1__leader-meta span,
.kmu1__bio-block h4,
.kmu1__bio-timeline .y,
.kmu1__award,
.kmu1__contact-card .role,
.kmu1__contact-card h3,
.kmu1__contact-line .lbl,
.kmu1__ctastrip h3,
.kmu1__cta,
.btn-ghost {
    font-family: "Open Sans", Arial, sans-serif !important;
}

.kmu1__wrap {
    max-width: 1160px;
    padding-left: 24px;
    padding-right: 24px;
}

.kmu1__top {
    min-height: auto;
}

.kmu1__top-inner {
    min-height: 58px;
}

.kmu1__brand-text b {
    font-size: 13px;
    font-weight: 800;
}

.kmu1__brand-text span,
.kmu1__nav a,
.kmu1__eyebrow,
.kmu1__section-head .num,
.kmu1__stat .l,
.kmu1__proj .cat,
.kmu1__proj-list .row .idx,
.kmu1__proj-list .row .city,
.kmu1__contact-line .lbl {
    letter-spacing: .08em;
}

.kmu1__hero {
    padding: 52px 0 64px;
}

.kmu1__hero-grid {
    grid-template-columns: 1.05fr .9fr;
    gap: 42px;
}

.kmu1__hero h1 {
    max-width: 650px;
    margin-bottom: 20px;
    font-size: clamp(30px, 3.7vw, 48px);
    line-height: 1.12;
    font-weight: 800;
}

.kmu1__hero h1 em::after {
    bottom: 4px;
    height: 4px;
}

.kmu1__hero p.lead {
    max-width: 620px;
    margin-bottom: 28px;
    font-size: 16px;
    line-height: 1.65;
}

.kmu1__hero-meta {
    gap: 28px;
    margin-bottom: 30px;
}

.kmu1__hero-meta b {
    font-size: 18px;
}

.kmu1__hero-visual {
    width: 100%;
    max-width: 390px;
    justify-self: end;
}

.kmu1__hero-bignum {
    font-size: clamp(90px, 15vw, 210px);
}

.kmu1__strip {
    padding: 14px 0;
}

.kmu1__strip-track {
    gap: 28px;
}

.kmu1__section {
    padding: 56px 0;
}

.kmu1__section-head {
    gap: 24px;
    margin-bottom: 36px;
}

.kmu1__section-head h2 {
    max-width: 650px;
    font-size: clamp(25px, 2.8vw, 36px);
    line-height: 1.14;
    font-weight: 800;
}

.kmu1__stats {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.kmu1__stat {
    min-height: 160px;
    padding: 24px;
}

.kmu1__stat .v {
    font-size: clamp(30px, 3vw, 42px);
}

.kmu1__about {
    gap: 34px;
}

.kmu1__about-text p,
.kmu1__service p,
.kmu1__bio-block p,
.kmu1__contact-line,
.kmu1__proj-list .row .ttl {
    font-size: 15px;
    line-height: 1.62;
}

.kmu1__about-card,
.kmu1__service,
.kmu1__contact-card {
    padding: 26px;
}

.kmu1__service h3 {
    font-size: 18px;
}

.kmu1__proj {
    min-height: 118px;
    padding: 18px;
}

.kmu1__proj .name {
    font-size: 15px;
}

.kmu1__leader {
    grid-template-columns: 300px 1fr;
    gap: 34px;
    padding: 34px;
}

.kmu1__leader-content h3 {
    font-size: clamp(26px, 2.7vw, 34px);
    line-height: 1.14;
}

.kmu1__leader-meta {
    gap: 10px;
}

.kmu1__bio-block {
    margin-top: 22px;
}

.kmu1__bio-timeline li {
    gap: 14px;
}

.kmu1__contacts {
    gap: 22px;
}

.kmu1__ctastrip {
    padding: 34px;
}

.kmu1__ctastrip h3 {
    font-size: clamp(24px, 2.6vw, 34px);
    line-height: 1.14;
}

.kmu1-theme-toggle {
    top: 50%;
    padding: 10px 12px;
    font-size: 11px;
}

@media (max-width: 1100px) {
    .kmu1__hero-grid {
        grid-template-columns: 1fr;
    }

    .kmu1__hero-visual {
        max-width: 520px;
        justify-self: start;
        aspect-ratio: 16 / 9;
    }

    .kmu1__stats,
    .kmu1__services,
    .kmu1__contacts {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .kmu1__leader {
        grid-template-columns: 260px 1fr;
    }
}

@media (max-width: 720px) {
    body:has(.kmu1) {
        overflow-x: hidden;
    }

    body:has(.kmu1) .shell,
    body:has(.kmu1) .range,
    body:has(.kmu1) .cell-md-12 {
        box-sizing: border-box;
        width: 100%;
        max-width: 100%;
        min-width: 0;
        overflow-x: hidden;
    }

    .kmu1 {
        width: 100%;
        max-width: 100%;
        overflow-x: hidden;
    }

    .kmu1__wrap {
        box-sizing: border-box;
        width: 100%;
        max-width: 100%;
        min-width: 0;
        padding-left: 16px;
        padding-right: 16px;
    }

    .kmu1__top {
        display: none;
    }

    .kmu1__hero {
        padding: 34px 0 44px;
    }

    .kmu1__hero-grid,
    .kmu1__hero-text {
        width: 100%;
        max-width: 100%;
        min-width: 0;
    }

    .kmu1__hero h1 {
        font-size: 26px;
        line-height: 1.12;
        max-width: 100%;
        overflow-wrap: break-word;
    }

    .kmu1__hero p.lead {
        font-size: 15px;
        max-width: 100%;
        overflow-wrap: break-word;
    }

    .kmu1__hero-meta,
    .kmu1__hero-actions {
        gap: 12px;
    }

    .kmu1__hero-meta {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .kmu1__hero-actions {
        display: grid;
        grid-template-columns: 1fr;
    }

    .kmu1__hero-actions .kmu1__cta,
    .kmu1__hero-actions .btn-ghost {
        width: 100%;
        max-width: 100%;
        justify-content: center;
    }

    .kmu1__hero-meta b {
        font-size: 16px;
    }

    .kmu1__hero-visual,
    .kmu1__hero-bignum {
        display: none;
    }

    .kmu1__section {
        padding: 46px 0;
    }

    .kmu1__strip {
        width: 100%;
        max-width: 100vw;
        overflow: hidden;
    }

    .kmu1__section-head {
        margin-bottom: 24px;
    }

    .kmu1__section-head h2 {
        font-size: 24px;
        line-height: 1.1;
    }

    .kmu1__stats,
    .kmu1__services,
    .kmu1__contacts,
    .kmu1__leader {
        grid-template-columns: 1fr;
    }

    .kmu1__stat {
        min-height: 0;
    }

    .kmu1__about-card,
    .kmu1__service,
    .kmu1__leader,
    .kmu1__contact-card,
    .kmu1__ctastrip {
        padding: 20px;
    }

    .kmu1__leader-side {
        max-width: 260px;
    }

    .kmu1__leader-content h3 {
        font-size: 24px;
    }

    .kmu1__leader-meta {
        grid-template-columns: 1fr;
    }

    .kmu1__proj-grid {
        grid-template-columns: 1fr;
    }

    .kmu1__ctastrip-inner {
        gap: 20px;
    }

    .kmu1-theme-toggle {
        top: auto !important;
        right: 12px !important;
        bottom: 14px !important;
        left: auto !important;
        width: 44px !important;
        max-width: 44px !important;
        height: 44px;
        min-height: 44px;
        padding: 0;
        border-radius: 50%;
        font-size: 0;
        line-height: 1;
        white-space: nowrap;
        transform: none !important;
    }

    .kmu1-theme-toggle::before {
        content: "Aa";
        font-size: 13px;
        font-weight: 800;
        line-height: 44px;
    }
}

/* KMU-1 original dark design toggle */
.kmu1.kmu1-dark-mode {
    --bg: #0A1020;
    --bg-2: #0E1830;
    --surface: #121E3A;
    --surface-2: #182648;
    --line: #243559;
    --text: #E6ECF7;
    --text-dim: #97A4C2;
    --text-mute: #6B7997;
    --amber: #FFC83D;
    --amber-2: #FFA600;
    --electric: #36B6FF;
    --grid: rgba(255,255,255,0.04);
    background: linear-gradient(180deg,#070C1A 0%, #0A1020 30%, #0A1020 70%, #060A16 100%);
    color: var(--text);
}

.kmu1.kmu1-dark-mode .kmu1__top {
    background: rgba(8,13,28,.72);
    border-bottom-color: var(--line);
    box-shadow: none;
    color: var(--text);
}

.kmu1.kmu1-dark-mode .kmu1__brand-text strong,
.kmu1.kmu1-dark-mode .kmu1__section-head h2,
.kmu1.kmu1-dark-mode .kmu1__about-card h3,
.kmu1.kmu1-dark-mode .kmu1__service h3,
.kmu1.kmu1-dark-mode .kmu1__leader-content h3,
.kmu1.kmu1-dark-mode .kmu1__contact-card h3,
.kmu1.kmu1-dark-mode .kmu1__ctastrip h3,
.kmu1.kmu1-dark-mode .kmu1__hero-text h1,
.kmu1.kmu1-dark-mode .kmu1__stat .v,
.kmu1.kmu1-dark-mode .kmu1__proj .name,
.kmu1.kmu1-dark-mode .kmu1__proj-list .row .ttl,
.kmu1.kmu1-dark-mode .kmu1__about-card .row b {
    color: var(--text) !important;
}

.kmu1.kmu1-dark-mode .kmu1__hero-text h1 em,
.kmu1.kmu1-dark-mode .kmu1__section-head h2 em,
.kmu1.kmu1-dark-mode .kmu1__ctastrip h3 em,
.kmu1.kmu1-dark-mode .kmu1__eyebrow,
.kmu1.kmu1-dark-mode .kmu1__proj .cat,
.kmu1.kmu1-dark-mode .kmu1__proj .loc svg,
.kmu1.kmu1-dark-mode .kmu1__contact-line svg,
.kmu1.kmu1-dark-mode .kmu1__hero-meta b {
    color: var(--amber) !important;
}

.kmu1.kmu1-dark-mode .kmu1__hero h1 em::after {
    background: rgba(255,200,61,.18);
}

.kmu1.kmu1-dark-mode .kmu1__cta,
.kmu1.kmu1-dark-mode .kmu1__hero-tag {
    background: var(--amber);
    color: #0A1020 !important;
    box-shadow: 0 14px 32px rgba(255,200,61,.25);
}

.kmu1.kmu1-dark-mode .kmu1__cta:hover,
.kmu1.kmu1-dark-mode .kmu1__cta:focus {
    background: #FFD45F;
}

.kmu1.kmu1-dark-mode .btn-ghost {
    color: var(--text);
    border-color: var(--line);
}

.kmu1.kmu1-dark-mode .btn-ghost:hover,
.kmu1.kmu1-dark-mode .btn-ghost:focus {
    background: rgba(255,200,61,.06);
    border-color: var(--amber);
}

.kmu1.kmu1-dark-mode .kmu1__hero-visual::before {
    background: linear-gradient(180deg, rgba(10,16,32,0) 30%, rgba(10,16,32,.85) 100%);
}

.kmu1.kmu1-dark-mode .kmu1__hero-img,
.kmu1.kmu1-dark-mode .kmu1__leader-photo img {
    filter: contrast(1.05) saturate(.95);
}

.kmu1.kmu1-dark-mode .kmu1__strip,
.kmu1.kmu1-dark-mode .kmu1__stat,
.kmu1.kmu1-dark-mode .kmu1__about-card,
.kmu1.kmu1-dark-mode .kmu1__service,
.kmu1.kmu1-dark-mode .kmu1__proj,
.kmu1.kmu1-dark-mode .kmu1__proj-list .row,
.kmu1.kmu1-dark-mode .kmu1__contact-card {
    background: var(--surface);
    border-color: var(--line);
}

.kmu1.kmu1-dark-mode .kmu1__leader {
    background: linear-gradient(180deg, var(--bg-2), var(--bg));
    border-color: var(--line);
}

.kmu1.kmu1-dark-mode .kmu1__leader-photo {
    background: var(--surface);
}

.kmu1.kmu1-dark-mode .kmu1__tabs {
    border-bottom-color: var(--line);
}

.kmu1.kmu1-dark-mode .kmu1__tab {
    color: var(--text-mute);
}

.kmu1.kmu1-dark-mode .kmu1__tab.is-active,
.kmu1.kmu1-dark-mode .kmu1__tab:hover,
.kmu1.kmu1-dark-mode .kmu1__tab:focus {
    color: var(--amber);
    border-color: var(--amber);
}

.kmu1.kmu1-dark-mode .kmu1__proj:hover {
    background: var(--surface-2);
    border-color: var(--amber);
}

.kmu1.kmu1-dark-mode .kmu1__about-card .row,
.kmu1.kmu1-dark-mode .kmu1__bio-timeline li,
.kmu1.kmu1-dark-mode .kmu1__contact-line {
    border-color: var(--line);
}

.kmu1.kmu1-dark-mode .kmu1__award {
    background: rgba(255,200,61,.08);
    color: var(--amber);
}

.kmu1.kmu1-dark-mode .kmu1__award:hover {
    background: var(--amber);
    color: #0A1020;
}

.kmu1.kmu1-dark-mode .kmu1__ctastrip {
    background: linear-gradient(135deg, rgba(18,30,58,.96), rgba(24,38,72,.96));
    border-color: var(--line);
}

.kmu1.kmu1-dark-mode .kmu1__footer {
    background: #070C1A;
    border-top-color: var(--line);
}

.kmu1.kmu1-dark-mode .kmu1__section-head .num::before,
.kmu1.kmu1-dark-mode .kmu1__service::after,
.kmu1.kmu1-dark-mode .kmu1__stat::after {
    background: var(--amber);
}

.kmu1.kmu1-dark-mode + .kmu1-theme-toggle,
.kmu1-dark-mode ~ .kmu1-theme-toggle {
    background: var(--amber);
    color: #0A1020;
}

.kmu1-theme-toggle.is-dark {
    background: #FFC83D;
    color: #0A1020;
}

.kmu1-theme-toggle.is-dark:hover,
.kmu1-theme-toggle.is-dark:focus {
    background: #FFD45F;
    color: #0A1020;
}