@charset "utf-8";

/* =========================================================
   KITCHENKONTROL — INDUSTRIAL FOOD-AUTOMATION DESIGN SYSTEM
   Built on the supplied Embassy of Yah mobile template shell.
   ========================================================= */

:root {
  --ink: #111b22;
  --ink-2: #1a2a33;
  --ink-3: #273b45;
  --steel: #70858e;
  --steel-2: #9fb0b6;
  --line: #d7e0e3;
  --paper: #f7f9f9;
  --white: #ffffff;
  --orange: #f26b21;
  --orange-dark: #d9510f;
  --orange-soft: #fff0e7;
  --aqua: #21a4ad;
  --aqua-light: #65d1d7;
  --green: #45a83f;
  --green-dark: #287e2b;
  --red: #d84d43;
  --yellow: #e7a92f;
  --shadow-sm: 0 10px 30px rgba(17, 27, 34, 0.08);
  --shadow-md: 0 24px 65px rgba(17, 27, 34, 0.13);
  --shadow-lg: 0 38px 90px rgba(4, 12, 17, 0.22);
  --radius-sm: 12px;
  --radius: 20px;
  --radius-lg: 34px;
  --shell: 1240px;
  --header-height: 74px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--paper);
  color: var(--ink-2);
  font-family: "Segoe UI", Inter, Arial, Helvetica, sans-serif !important;
  font-size: 16px;
  line-height: 1.65;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}
body, input, select, textarea, button { font-family: "Segoe UI", Inter, Arial, Helvetica, sans-serif !important; }
h1, h2, h3, h4, h5, h6 { color: var(--ink); font-family: "Segoe UI", Inter, Arial, Helvetica, sans-serif !important; letter-spacing: -0.025em; }
p { color: #52666f; }
a { color: inherit; }
img { max-width: 100%; }
button, a { -webkit-tap-highlight-color: transparent; }

.site-shell { width: min(var(--shell), calc(100% - 48px)); margin: 0 auto; }
.kk-section { position: relative; padding: 108px 0; overflow: hidden; }
.section-heading { max-width: 820px; margin: 0 auto 54px; text-align: center; }
.section-heading h2, .machine-copy h2, .integrity-copy h2, .faq-intro h2 {
  margin: 8px 0 18px;
  font-size: clamp(34px, 4.2vw, 58px);
  line-height: 1.04;
  font-weight: 800;
}
.section-heading p { max-width: 760px; margin: 0 auto; font-size: 18px; line-height: 1.75; }
.section-heading-light h2, .section-heading-light p { color: var(--white); }
.section-heading-light p { color: rgba(232, 241, 243, 0.72); }
.section-kicker, .eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  margin: 0;
  color: var(--orange);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.18em;
  line-height: 1.2;
  text-transform: uppercase;
}
.section-kicker-green { color: var(--green); }

/* ---------- Template shell / preloader ---------- */
.menu-wrapper { display: none; }
#preloader {
  position: fixed;
  inset: 0;
  z-index: 999999999 !important;
  display: grid;
  place-content: center;
  background:
    radial-gradient(circle at 50% 35%, rgba(33, 164, 173, 0.18), transparent 28%),
    linear-gradient(145deg, #132129, #091116);
  pointer-events: none;
  opacity: 1;
  transition: opacity 480ms ease;
}
.hide-preloader { opacity: 0 !important; }
#preloader h1 {
  width: min(520px, 78vw);
  height: 118px;
  margin: 0 auto 20px;
  background: url(../images/kitchenkontrol-logo-dark.svg) center / contain no-repeat;
}
#preloader p {
  margin: 12px 0 0;
  color: #f4f8f9 !important;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.24em;
  text-align: center;
  text-transform: uppercase;
}
#preloader em {
  position: fixed;
  right: 0;
  bottom: 24px;
  left: 0;
  color: rgba(211, 228, 232, 0.58) !important;
  font-size: 12px;
  font-style: normal;
  letter-spacing: 0.12em;
  text-align: center;
}
#preload-spinner { width: 34px; height: 34px; margin: 0 auto; }
#preload-spinner:after, .preload-spinner:after { box-shadow: inset var(--orange) 0 0 0 2px !important; }


.page-change-preloader {
  position: fixed !important;
  top: 0 !important;
  right: 0 !important;
  left: 0 !important;
  z-index: 1000000000 !important;
  display: block !important;
  width: 100% !important;
  height: 3px !important;
  overflow: hidden !important;
  background: transparent !important;
  opacity: 0;
  pointer-events: none;
  transition: opacity 180ms ease;
}
.page-change-preloader::after {
  content: "";
  display: block;
  width: 38%;
  height: 3px;
  background: linear-gradient(90deg, var(--orange), var(--aqua));
  transform: translateX(-120%);
}
.page-change-preloader.show-change-preloader { opacity: 1; }
.page-change-preloader.show-change-preloader::after { animation: kk-progress 800ms ease forwards; }
@keyframes kk-progress { to { transform: translateX(280%); } }

/* ---------- Header ---------- */
#header {
  height: var(--header-height);
  line-height: var(--header-height);
  background: rgba(14, 24, 30, 0.94) !important;
  border-bottom: 1px solid rgba(130, 160, 170, 0.16);
  box-shadow: 0 10px 30px rgba(5, 13, 17, 0.12);
  backdrop-filter: blur(16px);
}
.page-content { padding-top: var(--header-height) !important; }
.header-logo {
  top: 12px;
  width: 280px;
  height: 50px;
  background: url(../images/kitchenkontrol-logo-dark.svg) left center / contain no-repeat !important;
}
.header-logo-left .header-logo { left: 28px; }
.desktop-nav {
  position: absolute;
  top: 0;
  left: 340px;
  height: var(--header-height);
  display: flex;
  align-items: center;
  gap: 30px;
}
.desktop-nav a {
  position: relative;
  color: rgba(235, 244, 246, 0.7);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.02em;
  line-height: var(--header-height);
  text-decoration: none;
  white-space: nowrap;
}
.desktop-nav a::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: 16px;
  left: 0;
  height: 2px;
  background: var(--orange);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 220ms ease;
}
.desktop-nav a:hover, .desktop-nav a.active { color: var(--white); }
.desktop-nav a:hover::after, .desktop-nav a.active::after { transform: scaleX(1); }
.header-contact {
  position: absolute;
  top: 15px;
  right: 24px;
  height: 44px;
  padding: 0 22px;
  border-radius: 23px;
  background: var(--orange);
  color: var(--white) !important;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.06em;
  line-height: 44px;
  text-decoration: none;
  text-transform: uppercase;
  box-shadow: 0 8px 20px rgba(242, 107, 33, 0.24);
}
.header-contact:hover { background: #ff7c32; transform: translateY(-1px); }
.header-icon { color: #e8f1f3 !important; border-color: rgba(255,255,255,.08) !important; }
.header-icon i { color: #f0f6f7 !important; }
.header-icon-1, .header-icon-2, .header-icon-3 { display: none; }

/* ---------- Menu ---------- */
.menu-dark { background: #0e181e !important; }
.menu-dark .menu-scroll { background: #0e181e; }
.menu-large .menu-logo {
  width: 260px;
  height: 68px;
  margin: 22px auto 4px;
  background: url(../images/kitchenkontrol-logo-dark.svg) center / contain no-repeat !important;
}
.menu-sub-logo {
  display: block;
  color: rgba(213, 230, 234, 0.56) !important;
  font-size: 11px !important;
  font-style: normal !important;
  letter-spacing: .08em;
  text-align: center;
}
.menu-divider { color: #77909a !important; font-size: 10px !important; letter-spacing: .18em; text-transform: uppercase; border-color: rgba(255,255,255,.08) !important; }
.menu-divider i { color: var(--orange) !important; }
.menu-item { color: #d6e3e6 !important; border-color: rgba(255,255,255,.06) !important; }
.menu-item i { color: var(--aqua-light) !important; }
.menu-item strong { font-size: 13px; font-weight: 700; }
.menu-item.active-item strong { color: var(--white); }
.menu-item.active-item i { color: var(--orange) !important; }
.menu-socials .close-menu i, .menu-item.close-menu i { color: var(--orange) !important; }
.product-summary-menu a i { color: var(--orange) !important; }
.product-summary-menu a strong { color: #f1f6f7 !important; font-size: 12px !important; letter-spacing: .08em; }
.product-summary-menu a em { color: rgba(214, 229, 233, .58) !important; font-size: 12px !important; }

/* ---------- Buttons ---------- */
.kk-button {
  display: inline-flex;
  min-height: 50px;
  align-items: center;
  justify-content: center;
  padding: 0 24px;
  border: 1px solid transparent;
  border-radius: 26px;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .07em;
  line-height: 1;
  text-decoration: none;
  text-transform: uppercase;
  transition: transform 180ms ease, box-shadow 180ms ease, background 180ms ease, border-color 180ms ease;
}
.kk-button:hover { transform: translateY(-2px); }
.kk-button-primary { background: var(--orange); color: var(--white) !important; box-shadow: 0 12px 28px rgba(242,107,33,.24); }
.kk-button-primary:hover { background: #ff7b2d; box-shadow: 0 16px 34px rgba(242,107,33,.3); }
.kk-button-ghost { border-color: rgba(231, 241, 243, .28); color: #eaf3f5 !important; background: rgba(255,255,255,.03); }
.kk-button-ghost:hover { border-color: rgba(231,241,243,.6); background: rgba(255,255,255,.08); }
.kk-text-link { display: inline-flex; align-items: center; gap: 10px; color: var(--orange); font-size: 13px; font-weight: 800; letter-spacing: .04em; text-decoration: none; text-transform: uppercase; }
.kk-text-link i { transition: transform 180ms ease; }
.kk-text-link:hover i { transform: translateX(5px); }
.green-link { color: var(--green-dark); }

/* ---------- Hero ---------- */
.kk-hero { position: relative; background: var(--ink); }
.kk-hero .owl-stage-outer { overflow: hidden; }
.kk-hero .owl-dots { position: absolute; z-index: 30; bottom: 24px; left: 50%; transform: translateX(-50%); }
.kk-hero .owl-dot span { width: 28px !important; height: 4px !important; margin: 4px !important; border-radius: 4px !important; background: rgba(255,255,255,.22) !important; }
.kk-hero .owl-dot.active span { background: var(--orange) !important; }
.hero-slide { position: relative; min-height: 650px; overflow: hidden; }
.hero-slide::before, .hero-slide::after { content:""; position:absolute; pointer-events:none; }
.hero-slide::before { width: 620px; height: 620px; top: -300px; right: -180px; border: 1px solid rgba(108, 204, 211, .16); border-radius: 50%; box-shadow: 0 0 0 90px rgba(108,204,211,.035), 0 0 0 180px rgba(108,204,211,.025); }
.hero-slide::after { width: 340px; height: 340px; bottom: -250px; left: 20%; border-radius: 50%; background: rgba(242,107,33,.12); filter: blur(18px); }
.hero-slide-platform { background: radial-gradient(circle at 72% 42%, rgba(33,164,173,.22), transparent 33%), linear-gradient(135deg,#111d24 0%,#0b1419 54%,#152832 100%); }
.hero-slide-bottle { background: radial-gradient(circle at 74% 45%, rgba(38,169,181,.2), transparent 33%), linear-gradient(135deg,#111b22,#172a34 62%,#0e181e); }
.hero-slide-veggie { background: radial-gradient(circle at 75% 48%, rgba(69,168,63,.22), transparent 34%), linear-gradient(135deg,#101b20,#173029 60%,#0c171c); }
.hero-slide-software { background: radial-gradient(circle at 75% 47%, rgba(242,107,33,.17), transparent 34%), linear-gradient(135deg,#101a20,#22262c 60%,#10171b); }
.hero-inner { position: relative; z-index: 2; width: min(1320px, calc(100% - 72px)); min-height: 650px; margin: 0 auto; display: grid; grid-template-columns: minmax(0, .92fr) minmax(480px, 1.08fr); align-items: center; gap: 38px; padding: 60px 0 74px; }
.hero-copy { max-width: 640px; }
.eyebrow { color: #8bdfe4; margin-bottom: 20px; }
.eyebrow i { color: var(--orange); font-size: 7px; }
.hero-copy h1 { margin: 0 0 24px; color: #f6fafb; font-size: clamp(48px, 6vw, 82px); font-weight: 850; line-height: .98; letter-spacing: -.055em; }
.hero-copy h1 span { color: var(--orange); }
.hero-slide-veggie .hero-copy h1 span { color: #7ad36c; }
.hero-slide-software .hero-copy h1 span { color: var(--aqua-light); }
.hero-copy > p { max-width: 610px; margin: 0 0 32px; color: rgba(222, 235, 238, .72); font-size: 18px; line-height: 1.72; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 13px; margin-bottom: 30px; }
.hero-proof { display: flex; flex-wrap: wrap; gap: 10px 18px; }
.hero-proof span { display: inline-flex; align-items: center; gap: 7px; color: rgba(231,240,242,.72); font-size: 12px; font-weight: 700; }
.hero-proof i { color: #67d58b; font-size: 10px; }
.hero-visual { position: relative; }
.hero-visual img { display: block; width: 100%; max-height: 550px; object-fit: contain; filter: drop-shadow(0 28px 45px rgba(0,0,0,.24)); }

/* ---------- Signal bar ---------- */
.signal-bar { position: relative; z-index: 3; background: #fff; border-bottom: 1px solid var(--line); box-shadow: 0 18px 45px rgba(17,27,34,.05); }
.signal-grid { display: grid; grid-template-columns: repeat(4, 1fr); }
.signal-grid > div { position: relative; padding: 25px 30px; border-right: 1px solid var(--line); }
.signal-grid > div:last-child { border-right: 0; }
.signal-grid strong { display: block; color: var(--ink); font-size: 15px; }
.signal-grid span { color: #72868e; font-size: 12px; }

/* ---------- Platform ---------- */
.platform-section { background: linear-gradient(180deg,#f7f9f9 0%,#eef3f4 100%); }
.platform-section::before { content:""; position:absolute; width:520px; height:520px; top:60px; left:-360px; border:1px solid rgba(33,164,173,.13); border-radius:50%; box-shadow:0 0 0 80px rgba(33,164,173,.025),0 0 0 160px rgba(33,164,173,.018); }
.audience-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 22px; }
.audience-card { position: relative; min-height: 310px; padding: 34px 32px; overflow: hidden; background: #fff; border: 1px solid #dbe4e6; border-radius: var(--radius); box-shadow: var(--shadow-sm); }
.audience-card::after { content:""; position:absolute; width:120px; height:120px; right:-55px; bottom:-55px; border:24px solid var(--orange-soft); border-radius:50%; }
.audience-card:nth-child(2)::after { border-color:#e8f7f8; }
.audience-card:nth-child(3)::after { border-color:#edf5e9; }
.card-number { position:absolute; top:24px; right:26px; color:#d5dfe2; font-size:44px; font-weight:900; letter-spacing:-.05em; }
.audience-card > i { display:grid; width:54px; height:54px; place-items:center; margin-bottom:26px; border-radius:16px; background:var(--orange-soft); color:var(--orange); font-size:22px; }
.audience-card:nth-child(2) > i { background:#e8f7f8; color:var(--aqua); }
.audience-card:nth-child(3) > i { background:#edf5e9; color:var(--green-dark); }
.audience-card h3 { margin:0 0 14px; font-size:24px; font-weight:800; }
.audience-card p { margin:0; font-size:15px; line-height:1.72; }
.platform-flow { margin-top: 34px; padding: 34px; background: var(--ink); border-radius: var(--radius); box-shadow: var(--shadow-md); }
.flow-title { display:flex; justify-content:space-between; gap:20px; align-items:baseline; margin-bottom:28px; }
.flow-title span { color:var(--orange); font-size:11px; font-weight:800; letter-spacing:.16em; text-transform:uppercase; }
.flow-title strong { color:#f3f8f9; font-size:20px; }
.flow-track { display:grid; grid-template-columns:1fr 38px 1fr 38px 1fr 38px 1fr; align-items:center; gap:4px; }
.flow-node { min-height:130px; padding:22px; border:1px solid rgba(173,204,212,.15); border-radius:16px; background:rgba(255,255,255,.035); }
.flow-node b { display:grid; width:30px; height:30px; place-items:center; margin-bottom:14px; border-radius:50%; background:var(--orange); color:#fff; font-size:12px; }
.flow-node:nth-of-type(3) b { background:var(--aqua); }
.flow-node:nth-of-type(5) b { background:var(--green); }
.flow-node:nth-of-type(7) b { background:#657f89; }
.flow-node span { display:block; color:#f3f8f9; font-size:15px; font-weight:800; }
.flow-node small { display:block; margin-top:6px; color:#81979f; font-size:12px; line-height:1.45; }
.flow-arrow { color:#59717b; text-align:center; }

/* ---------- Product family ---------- */
.product-family-section { background: radial-gradient(circle at 50% -20%, rgba(33,164,173,.23), transparent 35%), linear-gradient(145deg,#15242c,#0b1419 70%); }
.product-family-section::before { content:""; position:absolute; inset:0; opacity:.2; background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px); background-size:38px 38px; mask-image:linear-gradient(to bottom,rgba(0,0,0,.7),transparent 90%); }
.product-grid { position:relative; display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.product-card { position:relative; min-height:490px; padding:32px; overflow:hidden; border:1px solid rgba(202,223,228,.14); border-radius:var(--radius); background:rgba(255,255,255,.055); box-shadow:0 24px 60px rgba(0,0,0,.16); backdrop-filter:blur(14px); }
.product-card::before { content:""; position:absolute; top:0; left:0; width:100%; height:4px; background:var(--orange); }
.product-card-veggie::before { background:var(--green); }
.product-card-software::before { background:var(--aqua); }
.product-card-top { display:flex; align-items:center; justify-content:space-between; margin-bottom:38px; }
.product-card-top span { color:#8299a2; font-size:11px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; }
.product-card-top i { display:grid; width:52px; height:52px; place-items:center; border:1px solid rgba(255,255,255,.14); border-radius:16px; color:var(--orange); font-size:22px; background:rgba(255,255,255,.045); }
.product-card-veggie .product-card-top i { color:#74d267; }
.product-card-software .product-card-top i { color:#65d2d8; }
.product-card h3 { margin:0 0 16px; color:#fff; font-size:35px; font-weight:850; }
.product-card p { margin:0 0 22px; color:rgba(223,235,238,.68); font-size:15px; line-height:1.72; }
.product-card ul { min-height:128px; margin:0 0 24px; padding:0; list-style:none; }
.product-card li { position:relative; padding:7px 0 7px 22px; color:#c7d6da; font-size:13px; }
.product-card li::before { content:""; position:absolute; left:0; top:14px; width:8px; height:8px; border-radius:50%; background:var(--orange); }
.product-card-veggie li::before { background:var(--green); }
.product-card-software li::before { background:var(--aqua); }
.product-card > a { display:inline-flex; align-items:center; gap:10px; color:#fff; font-size:12px; font-weight:800; letter-spacing:.06em; text-decoration:none; text-transform:uppercase; }
.product-card > a i { color:var(--orange); transition:transform 180ms ease; }
.product-card-veggie > a i { color:#74d267; }
.product-card-software > a i { color:#65d2d8; }
.product-card > a:hover i { transform:translateX(5px); }

/* ---------- Machine sections ---------- */
.machine-section { background:#fff; }
.machine-bottle { background:linear-gradient(180deg,#fff 0%,#f7f9f9 100%); }
.machine-veggie { background:linear-gradient(180deg,#edf5ee 0%,#f8faf8 100%); }
.machine-layout { display:grid; grid-template-columns:minmax(0,.92fr) minmax(500px,1.08fr); gap:72px; align-items:center; }
.machine-layout-reverse { grid-template-columns:minmax(500px,1.08fr) minmax(0,.92fr); }
.machine-copy h2 { margin-top:10px; }
.machine-copy .lead { margin:0 0 32px; color:#5b6f78; font-size:18px; line-height:1.75; }
.feature-list { display:grid; gap:14px; margin-bottom:32px; }
.feature-list > div { display:grid; grid-template-columns:46px 1fr; gap:15px; align-items:start; padding:16px 18px; border:1px solid #dce5e7; border-radius:14px; background:rgba(255,255,255,.72); }
.feature-list i { display:grid; width:42px; height:42px; place-items:center; border-radius:12px; background:var(--orange-soft); color:var(--orange); }
.machine-veggie .feature-list i { background:#e6f3e5; color:var(--green-dark); }
.feature-list span { color:#5c7079; font-size:14px; line-height:1.62; }
.feature-list strong { display:block; margin-bottom:2px; color:var(--ink); font-size:15px; }
.cycle-panel { padding:28px; border-radius:var(--radius-lg); background:var(--ink); box-shadow:var(--shadow-lg); }
.cycle-panel-head { display:flex; justify-content:space-between; align-items:center; gap:20px; margin-bottom:22px; color:#eff6f7; }
.cycle-panel-head span { font-size:17px; font-weight:800; }
.cycle-panel-head strong { padding:7px 11px; border-radius:20px; background:rgba(242,107,33,.15); color:#ff975f; font-size:10px; letter-spacing:.12em; text-transform:uppercase; }
.cycle-steps { display:grid; gap:10px; }
.cycle-step { display:grid; grid-template-columns:34px 42px 1fr; grid-template-rows:auto auto; gap:0 12px; align-items:center; min-height:68px; padding:12px 14px; border:1px solid rgba(183,212,219,.13); border-radius:13px; background:rgba(255,255,255,.035); }
.cycle-step b { grid-row:1/3; display:grid; width:30px; height:30px; place-items:center; border-radius:50%; background:var(--orange); color:#fff; font-size:11px; }
.cycle-step i { grid-row:1/3; display:grid; width:40px; height:40px; place-items:center; border-radius:11px; background:rgba(33,164,173,.15); color:#6bd4da; }
.cycle-step span { color:#eff6f7; font-size:14px; font-weight:800; }
.cycle-step small { color:#7f969f; font-size:11px; }
.cycle-step-optional { border-style:dashed; background:rgba(69,168,63,.05); }
.cycle-step-optional b { background:var(--green); }
.cycle-note { display:flex; gap:10px; margin-top:16px; padding:13px 14px; border-radius:12px; background:rgba(33,164,173,.12); color:#a8c7cd; font-size:12px; line-height:1.5; }
.cycle-note i { color:#6bd4da; margin-top:3px; }
.produce-visual { position:relative; min-height:560px; border:1px solid #d8e6d7; border-radius:var(--radius-lg); background:radial-gradient(circle at center,#f8fcf8 0%,#ebf4eb 64%,#dcebdd 100%); box-shadow:var(--shadow-md); overflow:hidden; }
.produce-ring { position:absolute; border:1px solid rgba(69,168,63,.19); border-radius:50%; }
.ring-one { width:390px; height:390px; top:85px; left:50%; transform:translateX(-50%); }
.ring-two { width:500px; height:500px; top:30px; left:50%; transform:translateX(-50%); }
.ring-three { width:620px; height:620px; top:-30px; left:50%; transform:translateX(-50%); }
.produce-core { position:absolute; top:50%; left:50%; display:grid; width:190px; height:190px; place-items:center; padding:28px; border-radius:50%; background:linear-gradient(145deg,#459f3f,#23782a); box-shadow:0 24px 55px rgba(45,128,47,.27); transform:translate(-50%,-50%); color:#fff; text-align:center; }
.produce-core i { font-size:54px; }
.produce-core span { font-size:13px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.produce-tag { position:absolute; display:flex; align-items:center; gap:8px; padding:11px 14px; border:1px solid #d9e5d9; border-radius:24px; background:#fff; box-shadow:var(--shadow-sm); color:#3d5b43; font-size:12px; font-weight:800; }
.produce-tag i { color:var(--green); }
.tag-a { top:92px; left:45px; }.tag-b { top:92px; right:45px; }.tag-c { bottom:88px; left:42px; }.tag-d { right:42px; bottom:88px; }

/* ---------- Software ---------- */
.software-section { background:radial-gradient(circle at 50% 0,rgba(242,107,33,.18),transparent 26%),linear-gradient(145deg,#172730,#0b1419 70%); }
.interface-tabs { overflow:hidden; border:1px solid rgba(190,216,222,.15); border-radius:var(--radius-lg); background:rgba(255,255,255,.045); box-shadow:0 34px 80px rgba(0,0,0,.2); backdrop-filter:blur(16px); }
.tab-buttons { display:grid; grid-template-columns:repeat(3,1fr); padding:9px; border-bottom:1px solid rgba(185,213,219,.12); background:rgba(0,0,0,.16); }
.interface-tab { min-height:50px; border:0; border-radius:14px; background:transparent; color:#8199a2; font-size:12px; font-weight:800; letter-spacing:.07em; text-transform:uppercase; cursor:pointer; }
.interface-tab.active { background:#233842; color:#fff; box-shadow:0 10px 24px rgba(0,0,0,.16); }
.tab-panel { display:none; grid-template-columns:minmax(0,1.4fr) minmax(280px,.6fr); gap:28px; align-items:center; padding:34px; }
.tab-panel.active { display:grid; }
.tab-copy { padding:24px; }
.tab-copy h3 { margin:0 0 14px; color:#f4f8f9; font-size:28px; font-weight:800; }
.tab-copy p { margin:0; color:rgba(218,232,235,.64); font-size:14px; line-height:1.75; }
.dashboard-mockup { display:grid; grid-template-columns:150px 1fr; min-height:365px; overflow:hidden; border:1px solid #aebfc4; border-radius:20px; background:#e9eff0; box-shadow:0 22px 48px rgba(0,0,0,.22); }
.dashboard-sidebar { display:flex; flex-direction:column; align-items:center; padding:34px 18px; background:#13232b; text-align:center; }
.dashboard-sidebar img { width:82px; margin-bottom:26px; }
.dashboard-sidebar span { color:#fff; font-size:17px; font-weight:800; }
.dashboard-sidebar small { color:#7f969f; font-size:11px; }
.dashboard-main { padding:24px; }
.status-row { display:flex; align-items:center; justify-content:space-between; padding:18px; border-radius:14px; background:#13232b; }
.status-row > div { display:grid; grid-template-columns:14px 1fr; gap:0 9px; align-items:center; }
.status-dot { width:12px; height:12px; border-radius:50%; background:#35c56d; box-shadow:0 0 0 5px rgba(53,197,109,.12); }
.status-row strong { color:#fff; font-size:17px; }
.status-row small { grid-column:2; color:#8299a2; font-size:10px; }
.status-row > b { color:#6ed6dc; font-size:24px; }
.metric-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:12px; margin:16px 0; }
.metric-grid > div { min-height:76px; padding:15px; border:1px solid #ccd7da; border-radius:12px; background:#fff; }
.metric-grid small { display:block; color:#81939a; font-size:10px; font-weight:700; text-transform:uppercase; }
.metric-grid strong { display:block; margin-top:7px; color:#20343d; font-size:16px; }
.control-row { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; }
.control-row button { height:42px; border:0; border-radius:22px; color:#fff; font-size:11px; font-weight:800; text-transform:uppercase; }.control-row .start{background:#35b965}.control-row .pause{background:#21a4ad}.control-row .stop{background:#d84d43}
.log-mockup, .tech-mockup { min-height:365px; overflow:hidden; border:1px solid #aebfc4; border-radius:20px; background:#eff3f4; box-shadow:0 22px 48px rgba(0,0,0,.22); }
.log-head, .tech-head { display:flex; align-items:center; justify-content:space-between; padding:20px 22px; background:#13232b; color:#fff; }
.log-head span, .tech-head span { font-size:17px; font-weight:800; }.log-head small { color:#8299a2; }
.log-row { display:grid; grid-template-columns:90px 150px 1fr; gap:14px; align-items:center; padding:17px 20px; border-bottom:1px solid #d3dddf; }
.log-row:last-child { border-bottom:0; }.log-row time{color:#78909a;font-size:12px}.log-row b{color:#20343d;font-size:12px}.log-row span{color:#64777f;font-size:12px}
.tech-head i { color:var(--orange); }
.tech-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; padding:20px; }
.tech-grid > div { min-height:125px; padding:18px; border:1px solid #d2dcdf; border-radius:13px; background:#fff; }
.tech-grid small { display:block; color:#7d929a; font-size:10px; font-weight:800; text-transform:uppercase; }.tech-grid strong{display:block;margin:10px 0 3px;color:#20343d;font-size:22px}.tech-grid span{color:#81939a;font-size:10px}
.capability-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin-top:30px; }
.capability-grid article { min-height:230px; padding:28px; border:1px solid rgba(186,212,218,.13); border-radius:18px; background:rgba(255,255,255,.04); }
.capability-grid i { display:grid; width:48px; height:48px; place-items:center; margin-bottom:22px; border-radius:14px; background:rgba(242,107,33,.13); color:#ff8c4b; font-size:20px; }
.capability-grid article:nth-child(3n+2) i { background:rgba(33,164,173,.15); color:#65d2d8; }
.capability-grid article:nth-child(3n+3) i { background:rgba(69,168,63,.14); color:#78d56d; }
.capability-grid h3 { margin:0 0 11px; color:#f2f7f8; font-size:20px; }.capability-grid p{margin:0;color:rgba(214,229,233,.6);font-size:13px;line-height:1.7}

/* ---------- Integrity ---------- */
.integrity-section { background:#fff; }
.integrity-layout { display:grid; grid-template-columns:minmax(0,.82fr) minmax(560px,1.18fr); gap:70px; align-items:start; }
.integrity-copy { position:sticky; top:120px; }
.integrity-copy p { font-size:17px; line-height:1.75; }
.integrity-callout { display:grid; grid-template-columns:58px 1fr; gap:16px; margin-top:30px; padding:22px; border:1px solid #ffd6bf; border-radius:16px; background:var(--orange-soft); }
.integrity-callout i { display:grid; width:54px; height:54px; place-items:center; border-radius:15px; background:var(--orange); color:#fff; font-size:22px; }
.integrity-callout strong { display:block; color:#74310c; font-size:16px; }.integrity-callout span{display:block;margin-top:4px;color:#8e542f;font-size:13px;line-height:1.62}
.rule-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:16px; }
.rule-grid article { position:relative; min-height:220px; padding:28px; overflow:hidden; border:1px solid #dce5e7; border-radius:18px; background:#f8fafb; }
.rule-grid article::after { content:""; position:absolute; width:100px; height:100px; right:-42px; bottom:-42px; border:18px solid #eaf0f2; border-radius:50%; }
.rule-grid span { color:#c2cdd1; font-size:35px; font-weight:900; }
.rule-grid h3 { margin:14px 0 10px; font-size:20px; font-weight:800; }.rule-grid p{margin:0;font-size:13px;line-height:1.67}

/* ---------- Snapshot ---------- */
.snapshot-section { background:linear-gradient(180deg,#eef3f4,#f7f9f9); }
.snapshot-grid { display:grid; grid-template-columns:repeat(6,1fr); gap:12px; }
.snapshot-grid > div { min-height:150px; padding:22px 18px; border:1px solid #d7e1e3; border-radius:16px; background:#fff; text-align:center; box-shadow:0 10px 25px rgba(17,27,34,.045); }
.snapshot-grid small { display:block; color:#82949b; font-size:10px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; }
.snapshot-grid strong { display:block; margin:14px 0 5px; color:var(--ink); font-size:26px; font-weight:900; letter-spacing:-.04em; }
.snapshot-grid span { display:block; color:#81939a; font-size:11px; line-height:1.45; }
.architecture-strip { display:grid; grid-template-columns:repeat(4,1fr); margin-top:18px; overflow:hidden; border:1px solid #d5e0e2; border-radius:18px; background:#fff; }
.architecture-strip > div { display:grid; grid-template-columns:42px 1fr; grid-template-rows:auto auto; gap:0 12px; align-items:center; padding:22px; border-right:1px solid #dce5e7; }
.architecture-strip > div:last-child { border-right:0; }
.architecture-strip i { grid-row:1/3; display:grid; width:42px; height:42px; place-items:center; border-radius:12px; background:#e9f6f7; color:var(--aqua); }
.architecture-strip span { color:#82949b; font-size:10px; font-weight:800; text-transform:uppercase; }.architecture-strip strong{color:#253942;font-size:13px}

/* ---------- Service ---------- */
.service-section { background:radial-gradient(circle at 20% 0,rgba(33,164,173,.2),transparent 30%),linear-gradient(145deg,#162731,#0b1419 70%); }
.deployment-timeline { display:grid; grid-template-columns:repeat(4,1fr); gap:18px; counter-reset:service; }
.deployment-timeline article { position:relative; min-height:340px; padding:28px; border:1px solid rgba(190,216,222,.13); border-radius:18px; background:rgba(255,255,255,.045); }
.deployment-timeline b { position:absolute; top:22px; right:24px; color:rgba(204,222,226,.16); font-size:44px; font-weight:900; }
.deployment-timeline i { display:grid; width:54px; height:54px; place-items:center; margin-bottom:50px; border-radius:15px; background:rgba(242,107,33,.14); color:#ff8e4d; font-size:22px; }
.deployment-timeline article:nth-child(2) i { background:rgba(33,164,173,.15); color:#65d2d8; }.deployment-timeline article:nth-child(3) i{background:rgba(69,168,63,.15);color:#77d56d}.deployment-timeline article:nth-child(4) i{background:rgba(112,133,142,.2);color:#b8c8cd}
.deployment-timeline h3 { margin:0 0 14px; color:#f3f8f9; font-size:22px; font-weight:800; }.deployment-timeline p{margin:0;color:rgba(214,229,233,.62);font-size:13px;line-height:1.72}
.service-band { display:flex; align-items:center; justify-content:space-between; gap:35px; margin-top:28px; padding:34px; border:1px solid rgba(197,220,225,.13); border-radius:20px; background:linear-gradient(90deg,rgba(255,255,255,.06),rgba(255,255,255,.025)); }
.service-band h3 { max-width:740px; margin:8px 0 0; color:#fff; font-size:27px; font-weight:800; }

/* ---------- FAQ ---------- */
.faq-section { background:#fff; }
.faq-layout { display:grid; grid-template-columns:.72fr 1.28fr; gap:80px; align-items:start; }
.faq-intro { position:sticky; top:120px; }.faq-intro p{font-size:17px;line-height:1.75;margin-bottom:24px}
.faq-list { display:grid; gap:12px; }
.faq-item { overflow:hidden; border:1px solid #dbe4e6; border-radius:15px; background:#f8fafb; }
.faq-item button { display:flex; width:100%; min-height:72px; align-items:center; justify-content:space-between; gap:20px; padding:18px 22px; border:0; background:transparent; color:var(--ink); font-size:15px; font-weight:800; text-align:left; cursor:pointer; }
.faq-item button i { display:grid; width:30px; height:30px; flex:0 0 auto; place-items:center; border-radius:50%; background:#eaf0f2; color:#607780; font-size:11px; }
.faq-item > div { max-height:0; overflow:hidden; transition:max-height 280ms ease; }
.faq-item > div p { margin:0; padding:0 22px 22px; color:#60747d; font-size:14px; line-height:1.72; }
.faq-item.open { border-color:#ffcbaa; background:#fff8f4; }.faq-item.open button i{background:var(--orange);color:#fff}
.faq-item.open > div { max-height:220px; }

/* ---------- Closing CTA / footer ---------- */
.closing-cta { padding:78px 0; background:linear-gradient(135deg,#eaf2f3,#fff 58%,#fff0e7); border-top:1px solid #dbe4e6; }
.closing-layout { display:grid; grid-template-columns:150px 1fr auto; gap:42px; align-items:center; }
.closing-layout img { width:145px; }
.closing-layout h2 { margin:8px 0 12px; font-size:38px; font-weight:850; }.closing-layout p{max-width:720px;margin:0;font-size:15px;line-height:1.72}
.kk-footer { padding:70px 0 25px !important; background:#0b1419 !important; }
.footer-grid { display:grid; grid-template-columns:1.6fr repeat(3,1fr); gap:45px; padding-bottom:45px; }
.footer-brand .footer-logo { display:block; width:320px; height:74px; margin:0 0 16px; background:url(../images/kitchenkontrol-logo-dark.svg) left center / contain no-repeat !important; }
.footer-brand p { max-width:340px; margin:0; color:#6f8790; font-size:13px; }
.footer-grid h3 { margin:4px 0 18px; color:#fff; font-size:13px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; }
.footer-grid > div:not(.footer-brand) a { display:block; margin:9px 0; color:#80969e; font-size:13px; text-decoration:none; }.footer-grid a:hover{color:#fff!important}
.footer-bottom { display:flex; justify-content:space-between; gap:20px; padding-top:24px; border-top:1px solid rgba(255,255,255,.07); color:#587079; font-size:11px; }

/* ---------- Contact sheet ---------- */
.kk-contact-menu { background:#f6f8f8 !important; }
.kk-contact-menu .menu-scroll { padding:30px 32px 38px; background:#f6f8f8; }
.contact-form { max-width:900px; margin:0 auto; }
.menu-contact-title { margin-bottom:24px; }
.menu-contact-title h4 { margin:8px 0 10px; font-size:32px; font-weight:850; }.menu-contact-title p{margin:0;font-size:14px;line-height:1.65}
.contact-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:15px; }
.formFieldWrap, .formTextareaWrap { margin:0 0 15px; }
.formFieldWrap label, .formTextareaWrap label { display:block; margin:0 0 7px; color:#4f646c; font-size:11px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.contactField, .contactTextarea { width:100%; border:1px solid #cfdadd !important; border-radius:12px !important; background:#fff !important; color:#20343d !important; font-size:14px !important; outline:none; transition:border-color 180ms ease,box-shadow 180ms ease; }
.contactField { height:52px !important; padding:0 15px !important; }.contactTextarea{min-height:135px!important;padding:14px 15px!important;resize:vertical}
.contactField:focus, .contactTextarea:focus { border-color:var(--aqua)!important; box-shadow:0 0 0 4px rgba(33,164,173,.1); }
.contactField.invalid, .contactTextarea.invalid { border-color:var(--red)!important; box-shadow:0 0 0 4px rgba(216,77,67,.08); }
.contactFormButton { margin-top:5px; }.contactFormButton button{border:0;cursor:pointer}
.form-error-summary { min-height:20px; margin:-4px 0 10px; color:var(--red); font-size:12px; }
.formSuccessMessageWrap { display:none; padding:50px 20px; text-align:center; }
.formSuccessMessageWrap h4 { margin:12px 0; font-size:30px; }.formSuccessMessageWrap p{max-width:620px;margin:0 auto 24px;font-size:14px}
.contact-success-icon { display:grid; width:66px; height:66px; place-items:center; margin:0 auto; border-radius:50%; background:#e5f5e8; color:#38a95b; font-size:26px; }

/* ---------- Reveal ---------- */
.reveal-init [data-reveal] { opacity:0; transform:translateY(26px); transition:opacity 650ms ease,transform 650ms cubic-bezier(.2,.65,.2,1); }
.reveal-init [data-reveal].revealed { opacity:1; transform:none; }

/* ---------- Back to top ---------- */
.back-to-top-badge { background:var(--orange)!important;color:#fff!important;border-radius:24px!important;box-shadow:0 12px 28px rgba(242,107,33,.25)!important; }

/* ---------- Responsive ---------- */
@media (max-width: 1160px) {
  .desktop-nav { gap:20px; left:315px; }
  .desktop-nav a { font-size:12px; }
  .header-logo { width:250px; }
  .header-contact { display:none; }
  .header-icon-2 { display:block; right:50px !important; }
  .header-icon-1 { display:block; right:0 !important; }
  .header-icon-3 { display:none; }
  .hero-inner { grid-template-columns:minmax(0,.95fr) minmax(420px,1.05fr); }
  .snapshot-grid { grid-template-columns:repeat(3,1fr); }
}

@media (max-width: 980px) {
  :root { --header-height:64px; }
  #header { height:var(--header-height);line-height:var(--header-height); }
  .header-logo { top:9px;width:245px;height:46px; }
  .desktop-nav { display:none; }
  .header-icon { height:var(--header-height);line-height:var(--header-height); }
  .header-icon-1,.header-icon-2,.header-icon-3 { display:block; }
  .header-icon-3 { right:50px !important; }
  .header-icon-2 { right:100px !important; }
  .header-icon-1 { right:0 !important; }
  .hero-slide,.hero-inner { min-height:auto; }
  .hero-inner { grid-template-columns:1fr; gap:18px; padding:72px 0 90px; }
  .hero-copy { max-width:760px; text-align:center; margin:0 auto; }
  .hero-copy h1 { font-size:clamp(46px,9vw,72px); }
  .hero-copy > p { margin-right:auto;margin-left:auto; }
  .hero-actions,.hero-proof { justify-content:center; }
  .hero-visual { max-width:760px; margin:0 auto; }
  .hero-visual img { max-height:480px; }
  .signal-grid { grid-template-columns:repeat(2,1fr); }
  .signal-grid > div:nth-child(2) { border-right:0; }.signal-grid > div:nth-child(-n+2){border-bottom:1px solid var(--line)}
  .audience-grid,.product-grid,.capability-grid { grid-template-columns:1fr; }
  .audience-card { min-height:250px; }
  .product-card { min-height:auto; }
  .product-card ul { min-height:auto; }
  .flow-track { grid-template-columns:1fr; gap:10px; }
  .flow-arrow { transform:rotate(90deg); }
  .machine-layout,.machine-layout-reverse { grid-template-columns:1fr; gap:48px; }
  .machine-layout-reverse .produce-visual { order:2; }.machine-layout-reverse .machine-copy{order:1}
  .integrity-layout,.faq-layout { grid-template-columns:1fr; gap:48px; }
  .integrity-copy,.faq-intro { position:relative;top:auto; }
  .tab-panel { grid-template-columns:1fr; }
  .deployment-timeline { grid-template-columns:repeat(2,1fr); }
  .snapshot-grid { grid-template-columns:repeat(3,1fr); }
  .architecture-strip { grid-template-columns:repeat(2,1fr); }.architecture-strip>div:nth-child(2){border-right:0}.architecture-strip>div:nth-child(-n+2){border-bottom:1px solid #dce5e7}
  .closing-layout { grid-template-columns:120px 1fr; }.closing-layout>a{grid-column:2;justify-self:start}.closing-layout img{width:115px}
  .footer-grid { grid-template-columns:1.5fr repeat(2,1fr); }.footer-grid>div:last-child{grid-column:2}
}

@media (max-width: 680px) {
  .site-shell { width:min(100% - 30px, var(--shell)); }
  .kk-section { padding:78px 0; }
  .section-heading { margin-bottom:38px; text-align:left; }
  .section-heading h2,.machine-copy h2,.integrity-copy h2,.faq-intro h2 { font-size:36px;line-height:1.08; }
  .section-heading p { font-size:16px; }
  .header-logo-left .header-logo { left:15px; }.header-logo{width:205px}
  .header-icon-3 { display:none; }.header-icon-2{right:50px!important}.header-icon-1{right:0!important}
  #preloader h1 { height:92px; }
  .hero-inner { width:calc(100% - 30px); padding:58px 0 78px; }
  .hero-copy h1 { font-size:44px; }
  .hero-copy > p { font-size:16px; }
  .hero-actions { flex-direction:column;align-items:stretch; }.hero-actions .kk-button{width:100%}
  .hero-proof { display:grid;grid-template-columns:1fr;justify-items:start;max-width:320px;margin:0 auto;text-align:left; }
  .hero-visual img { max-height:340px; }
  .kk-hero .owl-dots { bottom:16px; }
  .signal-grid { grid-template-columns:1fr; }.signal-grid>div{border-right:0!important;border-bottom:1px solid var(--line)!important;padding:18px 20px}.signal-grid>div:last-child{border-bottom:0!important}
  .audience-card,.product-card { padding:27px 24px; }
  .platform-flow { padding:24px; }.flow-title{align-items:flex-start;flex-direction:column}.flow-node{min-height:110px}
  .cycle-panel { padding:19px; border-radius:22px; }.cycle-panel-head{align-items:flex-start;flex-direction:column}.cycle-step{grid-template-columns:30px 38px 1fr;padding:10px}.cycle-step i{width:36px;height:36px}
  .produce-visual { min-height:500px; }.ring-one{width:300px;height:300px;top:100px}.ring-two{width:400px;height:400px;top:50px}.ring-three{width:500px;height:500px;top:0}.produce-core{width:160px;height:160px}.produce-tag{font-size:10px;padding:9px 10px}.tag-a{top:52px;left:18px}.tag-b{top:52px;right:18px}.tag-c{bottom:55px;left:18px}.tag-d{right:18px;bottom:55px}
  .tab-buttons { grid-template-columns:1fr;gap:6px; }.tab-panel{padding:18px}.tab-copy{padding:10px 4px}.dashboard-mockup{grid-template-columns:1fr}.dashboard-sidebar{display:none}.dashboard-main{padding:16px}.status-row{align-items:flex-start;gap:10px}.metric-grid{grid-template-columns:1fr 1fr}.log-row{grid-template-columns:70px 1fr}.log-row span{grid-column:1/3}.tech-grid{grid-template-columns:repeat(2,1fr)}
  .capability-grid { margin-top:18px; }.capability-grid article{min-height:auto}
  .rule-grid { grid-template-columns:1fr; }.rule-grid article{min-height:190px}
  .snapshot-grid { grid-template-columns:repeat(2,1fr); }.architecture-strip{grid-template-columns:1fr}.architecture-strip>div{border-right:0!important;border-bottom:1px solid #dce5e7!important}.architecture-strip>div:last-child{border-bottom:0!important}
  .deployment-timeline { grid-template-columns:1fr; }.deployment-timeline article{min-height:280px}.service-band{align-items:flex-start;flex-direction:column;padding:25px}.service-band h3{font-size:23px}
  .closing-layout { grid-template-columns:1fr;text-align:left; }.closing-layout>a{grid-column:auto}.closing-layout img{width:100px}.closing-layout h2{font-size:32px}
  .footer-grid { grid-template-columns:1fr;gap:30px }.footer-grid>div:last-child{grid-column:auto}.footer-brand .footer-logo{width:285px}.footer-bottom{align-items:flex-start;flex-direction:column}
  .kk-contact-menu .menu-scroll { padding:24px 18px 32px; }.contact-grid{grid-template-columns:1fr}.menu-contact-title h4{font-size:27px}
}

@media (max-width: 390px) {
  .header-logo { width:180px; }
  .hero-copy h1 { font-size:39px; }
  .metric-grid { grid-template-columns:1fr; }.tech-grid{grid-template-columns:1fr}.snapshot-grid{grid-template-columns:1fr}
  .produce-tag { max-width:145px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }
  *, *::before, *::after { animation-duration:.01ms!important; animation-iteration-count:1!important; transition-duration:.01ms!important; }
}
