:root {
  --phone-page-gap: clamp(14px, 4vw, 30px);
  --phone-card-padding: clamp(20px, 6vw, 46px);
}

.phone-home { width: min(100%, var(--phone-content-width)); margin: 0 auto; }
.phone-fit-shell { display: flex; width: 100%; flex-direction: column; gap: var(--phone-page-gap); padding-bottom: var(--phone-page-gap); overflow-x: clip; }
.phone-section { width: 100%; min-width: 0; overflow: hidden; }
.phone-card { width: calc(100% - clamp(24px, 8vw, 62px)); margin: 0 auto; padding: var(--phone-card-padding); border-radius: clamp(18px, 4vw, 30px); background: #fff; }
.phone-section-heading { text-align: center; }
.phone-section-heading h2 { margin: 0; font-size: clamp(27px, 5.6vw, 42px); font-weight: 500; line-height: 1.25; }
.phone-section-heading h2 span { color: var(--phone-blue); }
.phone-section-heading p { margin: 10px 0 0; color: var(--phone-muted); font-size: clamp(15px, 3.333vw, 25px); line-height: 1.55; }
.phone-compact-heading h2 { font-size: clamp(26px, 5.2vw, 39px); }
.phone-soft-button { display: block; width: max-content; max-width: 100%; margin: 26px auto 0; padding: 13px clamp(20px, 4.533vw, 34px); border: 0; border-radius: 12px; background: #e1f3ff; color: var(--phone-blue); font-size: clamp(15px, 3.333vw, 25px); line-height: 1.35; text-align: center; text-decoration: none; }
.phone-soft-button:disabled { cursor: not-allowed; opacity: .65; }

.phone-hero { display: flex; min-height: clamp(430px, 104vw, 780px); flex-direction: column; align-items: center; padding: clamp(94px, 20vw, 150px) clamp(18px, 5vw, 38px) clamp(24px, 6vw, 45px); background: linear-gradient(130deg, #dbeaff 0%, #d8edff 46%, #bce7fb 100%); }
.phone-hero-copy { position: relative; z-index: 2; color: var(--phone-blue); text-align: center; }
.phone-hero-copy h1 { margin: 0 0 12px; font-size: clamp(38px, 7.333vw, 55px); line-height: 1.1; }
.phone-hero-copy p { margin: 0; font-size: clamp(18px, 4.133vw, 31px); }
.phone-hero-illustration { width: min(86%, 577px); margin: clamp(14px, 3vw, 24px) auto 0; object-fit: contain; mix-blend-mode: multiply; }
.phone-hero-tags { position: relative; z-index: 2; width: min(100%, 666px); margin: clamp(-48px, -6vw, -24px) 0 0; padding: 11px 10px; border-radius: 12px; background: rgba(255, 255, 255, .96); color: var(--phone-sky); font-size: clamp(14px, 3.333vw, 25px); line-height: 1.5; text-align: center; }

.phone-benefits { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 16px; margin-top: 25px; padding: clamp(14px, 2.533vw, 19px); border-radius: 14px; background: var(--phone-pale); }
.phone-benefits div { display: flex; min-width: 0; align-items: center; gap: 9px; font-size: clamp(14px, 2.933vw, 22px); line-height: 1.45; }
.phone-benefits img { width: clamp(38px, 7.467vw, 56px); height: clamp(38px, 7.467vw, 56px); flex: 0 0 auto; object-fit: contain; }
.phone-trial-form { margin-top: 20px; }
.phone-trial-field, .phone-trial-location { position: relative; display: flex; min-height: 58px; align-items: center; margin-bottom: 19px; padding: 8px clamp(14px, 3.2vw, 24px); border: 2px solid #e3e5eb; border-radius: 12px; }
.phone-trial-location { display: grid; grid-template-columns: 34px minmax(0, 1fr) minmax(0, 1fr); gap: 9px; }
.phone-trial-location label { position: relative; display: block; min-width: 0; padding-left: 9px; border-left: 1px solid #e3e5eb; }
.phone-field-icon { width: 34px; height: 34px; flex: 0 0 auto; margin-right: 10px; object-fit: contain; }
.phone-trial-location > .phone-field-icon { margin-right: 0; }
.phone-trial-form input { width: 100%; min-width: 0; padding: 0; border: 0; outline: 0; background: transparent; color: var(--phone-ink); font-size: 16px; }
.phone-trial-form input::placeholder { color: #aeb3bc; }
.phone-trial-note-label { flex: 0 0 auto; margin-right: 12px; color: #737b88; font-size: 15px; }
.phone-trial-error { position: absolute; right: 6px; bottom: -19px; color: #c62828; font-size: 14px; line-height: 1.2; }
.phone-trial-location .phone-trial-error { right: 0; white-space: nowrap; }
.phone-trial-form input[aria-invalid="true"] { color: #9d1d1d; }
.phone-trial-form button { width: 100%; min-height: 58px; padding: 11px 18px; border: 0; border-radius: 11px; color: #fff; background: var(--phone-sky); font-size: 17px; }
.phone-trial-form button:disabled { cursor: wait; opacity: .7; }
.phone-trial-status, .phone-trial-consent { min-height: 22px; margin: 9px 0 0; color: #697181; font-size: 14px; line-height: 1.55; text-align: center; }
.phone-trial-status[data-state="error"] { color: #b42318; }
.phone-trial-status[data-state="success"] { color: #16813c; }
.phone-trial-consent a { color: #385f87; text-decoration: underline; text-underline-offset: 2px; }
.phone-visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; clip-path: inset(50%); }

.phone-stat-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-top: 28px; }
.phone-stat-grid div { display: grid; min-height: 104px; place-items: center; align-content: center; gap: 10px; border-radius: 14px; background: var(--phone-pale); }
.phone-stat-grid strong { color: var(--phone-blue); font-size: clamp(30px, 5.733vw, 43px); line-height: 1; }
.phone-stat-grid span { color: #697181; font-size: clamp(14px, 3.333vw, 25px); }
.phone-award-row { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin-top: 32px; }
.phone-award-row figure { min-width: 0; margin: 0; text-align: center; }
.phone-award-row img { width: clamp(58px, 13.333vw, 100px); height: clamp(58px, 13.333vw, 100px); object-fit: contain; }
.phone-award-row figcaption { margin-top: 10px; color: #697181; font-size: clamp(14px, 3.2vw, 24px); line-height: 1.45; }

.phone-system-tabs { display: flex; justify-content: center; gap: 8px; margin: 24px 0; }
.phone-system-tabs button { padding: 10px clamp(14px, 3.6vw, 27px); border: 0; border-radius: 13px; background: transparent; color: var(--phone-ink); font-size: clamp(15px, 3.467vw, 26px); }
.phone-system-tabs .is-active { color: var(--phone-blue); background: var(--phone-pale); }
.phone-system-card { min-height: clamp(470px, 78vw, 585px); padding: clamp(24px, 5.2vw, 39px) clamp(20px, 4.133vw, 31px); border-radius: 15px; background: linear-gradient(145deg, #c9f0ff, #f3fbff); }
.phone-system-card[hidden] { display: none; }
.phone-system-saas { background: linear-gradient(145deg, #e6e0ff, #cfc5ff); }
.phone-system-small { background: linear-gradient(145deg, #d7f4ff, #fff0e8); }
.phone-system-card h3 { margin: 0; color: var(--phone-blue); font-size: clamp(24px, 4.667vw, 35px); line-height: 1.35; }
.phone-system-lead { margin: 12px 0 0; color: #526579; font-size: clamp(15px, 3.333vw, 25px); }
.phone-system-copy { margin-top: clamp(42px, 11vw, 82px); color: #4d6175; font-size: clamp(15px, 2.667vw, 20px); line-height: 1.7; }
.phone-system-copy p { margin: 0 0 18px; }
.phone-system-card .phone-soft-button { margin-top: 12px; }

.phone-solution-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(8px, 2.533vw, 19px); margin-top: 30px; }
.phone-solution-grid div { display: grid; min-height: 96px; place-items: center; align-content: center; gap: 8px; padding: 9px 3px 12px; border-radius: 13px; background: var(--phone-pale); color: #697181; font-size: clamp(14px, 2.667vw, 20px); line-height: 1.35; text-align: center; }
.phone-solution-grid img { width: clamp(40px, 7.2vw, 54px); height: clamp(40px, 7.2vw, 54px); object-fit: contain; }

.phone-ai-track { display: flex; width: calc(100% + var(--phone-card-padding)); gap: 12px; margin-top: 30px; padding: 0 var(--phone-card-padding) 10px 0; overflow-x: auto; overflow-y: hidden; scroll-snap-type: x mandatory; overscroll-behavior-x: contain; touch-action: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
.phone-ai-track::-webkit-scrollbar { display: none; }
.phone-ai-track .phone-ai-card { display: flex; min-height: clamp(390px, 78vw, 585px); flex: 0 0 min(84vw, 520px); flex-direction: column; padding: clamp(26px, 5.733vw, 43px) clamp(20px, 4.133vw, 31px); border-radius: 15px; scroll-snap-align: start; scroll-snap-stop: always; background: linear-gradient(145deg, #27aaff, #cceeff); }
.phone-ai-track .phone-ai-loss { background: linear-gradient(145deg, #ffbd10, #fff0b9); }
.phone-ai-track .phone-ai-membership { background: linear-gradient(145deg, #18bbed, #bdefff); }
.phone-ai-track .phone-ai-inventory { background: linear-gradient(145deg, #ff323c, #ffc5c9); }
.phone-ai-track .phone-ai-weighing { background: linear-gradient(145deg, #12d8c7, #c2fff6); }
.phone-ai-track h3 { margin: 0; color: var(--phone-blue); font-size: clamp(24px, 4.8vw, 36px); }
.phone-ai-track p { margin: 18px 0 0; color: #26384c; font-size: clamp(15px, 3.333vw, 25px); line-height: 1.7; }
.phone-ai-industries { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin-top: auto; color: #303d4c; font-size: 14px; text-align: center; }
.phone-ai-industries-two { grid-template-columns: repeat(2, 1fr); }
.phone-ai-industries span { display: flex; min-width: 0; flex-direction: column; align-items: center; gap: 7px; line-height: 1.35; }
.phone-ai-industries img { width: 42px; height: 42px; padding: 5px; border-radius: 8px; background: rgba(255, 255, 255, .88); object-fit: contain; }
.phone-wide-button { font-size: clamp(14px, 3.067vw, 23px); }

.phone-featured-case { position: relative; min-height: 340px; margin-top: 30px; padding: clamp(22px, 4.533vw, 34px) clamp(20px, 4.133vw, 31px); border-radius: 13px; background: #f5f6f7; }
.phone-featured-case h3 { margin: 0 0 12px; font-size: clamp(22px, 4.133vw, 31px); }
.phone-featured-case strong { display: block; font-size: clamp(15px, 3.333vw, 25px); font-weight: 500; line-height: 1.55; }
.phone-featured-case p { max-width: 100%; margin: 12px 0 0; color: #626a78; font-size: clamp(14px, 2.533vw, 19px); line-height: 1.65; }
.phone-featured-case img { display: block; width: clamp(120px, 18vw, 135px); height: auto; margin-top: 20px; object-fit: contain; }
.phone-case-logos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(10px, 2.533vw, 19px); margin-top: 20px; }
.phone-case-logos img { width: 100%; height: clamp(74px, 12.267vw, 92px); padding: 5px; border-radius: 11px; background: #f5f6f7; object-fit: contain; }

.phone-hotline { display: grid; min-height: 60px; margin: 28px 0 0; padding: 10px; place-items: center; border-radius: 12px; background: var(--phone-pale); color: var(--phone-blue); font-size: clamp(18px, 3.867vw, 29px); font-weight: 700; text-align: center; }

.phone-news-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(14px, 2.533vw, 19px); margin-top: 34px; }
.phone-news-item { min-width: 0; color: inherit; text-decoration: none; }
.phone-news-grid img { width: 100%; aspect-ratio: 1.65 / 1; border-radius: 13px; object-fit: cover; }
.phone-news-grid h3 { margin: 16px 0 8px; font-size: clamp(15px, 3.2vw, 24px); font-weight: 500; line-height: 1.55; }
.phone-news-grid p { margin: 0; color: #626a78; font-size: clamp(14px, 2.667vw, 20px); line-height: 1.65; }
.phone-news-grid time { display: block; margin-top: 9px; color: #848b96; font-size: 14px; }

.phone-faq-list { margin-top: 30px; }
.phone-faq-item { border-top: 1px solid #e5e7eb; }
.phone-faq-item:first-child { border-top: 0; }
.phone-faq-item summary { width: 100%; padding: 15px 0; color: var(--phone-ink); font-size: clamp(15px, 3.067vw, 23px); font-weight: 400; line-height: 1.5; list-style: none; cursor: pointer; }
.phone-faq-item summary::-webkit-details-marker { display: none; }
.phone-faq-item[open] summary { color: #153960; }
.phone-faq-answer p { margin: 0 0 16px; color: #626a78; font-size: clamp(14px, 2.533vw, 19px); line-height: 1.7; }

@media (max-width: 420px) {
  .phone-benefits { grid-template-columns: 1fr; }
  .phone-news-grid { grid-template-columns: 1fr; }
}

@media (max-width: 359px) {
  .phone-solution-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}