/* Final visual system: white space, graphite type, and one yellow action color. */
:root {
  --ink: #1a1a18;
  --ink-2: #30302d;
  --paper: #fafaf8;
  --white: #ffffff;
  --coral: #ffc400;
  --coral-dark: #e5ae00;
  --cyan: #f4f2ec;
  --mint: #f7f6f2;
  --line: #deded8;
  --muted: #666660;
  --display: Helvetica, "Helvetica Neue", Arial, sans-serif;
  --body: Helvetica, "Helvetica Neue", Arial, sans-serif;
}

html, body, button, input, textarea { font-family: Helvetica, "Helvetica Neue", Arial, sans-serif; }
body { color: var(--ink); background: #fff; }
.topline, .footer { background: #1a1a18; color: #d9d8d2; }
.topline a, .topline a span, .footer a { color: #fff; }
.topline .status-dot { background: var(--coral); box-shadow: 0 0 0 4px rgba(255,196,0,.16); }
.site-header { background: rgba(255,255,255,.94); }
.site-header.is-scrolled { border-color: var(--line); box-shadow: 0 8px 22px rgba(26,26,24,.07); }
.brand__mark { background: var(--coral); color: var(--ink); }
.nav>a:not(.button)::after { background: var(--coral); }
.button { background: var(--coral); color: var(--ink); box-shadow: 0 10px 22px rgba(255,196,0,.23); }
.button:hover { background: var(--coral-dark); box-shadow: 0 13px 25px rgba(229,174,0,.28); }
.text-link i { color: #ad7900; }

.section-dark { background: #1a1a18; }
.hero { min-height: 740px; color: var(--ink); background: linear-gradient(135deg,#fff 0%,#fafaf8 69%,#f4f0e6 100%); }
.hero__grid { background-image: linear-gradient(rgba(26,26,24,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(26,26,24,.045) 1px,transparent 1px); }
.hero__grid::before { border-color: rgba(26,26,24,.11); box-shadow: 0 0 0 88px rgba(255,196,0,.035),0 0 0 176px rgba(26,26,24,.018); }
.hero h1, .section h2, .modal h2 { color: var(--ink); }
.hero h1 em, .section:not(.section-dark) h2 em, .configs h2 em { color: #9a6900; }
.hero h1 em { white-space: nowrap; }
.hero__lead { color: #52524e; }
.text-link--light { color: var(--ink); }
.hero__proof strong span { color: #a36f00; }
.hero__proof strong span { display: inline-block; margin-left: 4px; letter-spacing: 0; }
.hero__proof small, .hero__bottom p { color: #6c6c66; }
.hero__proof>div:not(:last-child)::after, .hero__bottom { border-color: #d9d8d2; }
.ticker span { color: #353531; }
.ticker span::before { background: var(--coral); }
.hero-visual>img { filter: grayscale(1) sepia(.18) saturate(.7) contrast(.93) drop-shadow(0 28px 31px rgba(26,26,24,.16)); }
.hero-visual--system { min-height: 500px; isolation: isolate; }
.hero-visual--system>img {
  width: min(88%, 560px);
  max-width: 560px;
  filter: none;
  mix-blend-mode: normal;
  -webkit-mask-image: none;
  mask-image: none;
  animation: float 7s ease-in-out infinite;
}
.orb { border-color: rgba(26,26,24,.16); }
.orb--two { border-color: rgba(255,196,0,.78); }
.orb--three { background: var(--coral); box-shadow: 0 0 0 7px rgba(255,196,0,.2),0 0 28px rgba(255,196,0,.48); }
.floating-ticket { box-shadow: 0 15px 30px rgba(26,26,24,.14); }
.mini-icon--coral { background: #fff2bd; color: #7a5700; }
.avatar { background: #eceae3; color: #30302d; }

.intro, .configs, .sectors, .faq { background: #fff; }
.services, .cases { background: #f7f6f2; }
.intro__text, .section-heading>p, .sectors__copy>p, .faq__grid>div>p, .configs__heading>p { color: var(--muted); }
.pain-card { border-color: var(--line); box-shadow: 0 8px 22px rgba(26,26,24,.035); }
.pain-card:hover { box-shadow: 0 18px 31px rgba(26,26,24,.09); }
.pain-card--accent { background: #fff8dc; }
.pain-card--accent p { color: var(--muted); }
.pain-card::after { border-color: #e3e0d5; }
.pain-card--accent::after { border-color: #ead28a; }
.pain-card__number, .config-card span { color: #a36f00; }
.pain-card p, .service-card>p:not(.service-card__tag) { color: var(--muted); }

.service-card { background: #fff; border-color: var(--line); }
.service-card:hover { box-shadow: 0 16px 30px rgba(26,26,24,.09); }
.service-card--featured, .service-card--featured:hover { background: #1a1a18; }
.service-card--featured>p:not(.service-card__tag), .service-card--featured .service-card__tag { color: #d9d8d2; }
.service-card__icon { background: #fff4ca; color: #725100; }
.service-card--featured .service-card__icon { color: var(--ink); background: var(--coral); }
.service-card__tag { color: #77776f; }
.service-card>a { border-color: #cfcec7; }
.service-card>a:hover { color: var(--ink); }

.configs__heading { margin-bottom: 50px; }
.configs__photo { display: grid; gap: 15px; align-self: start; margin: 0; min-height: 0; padding: 10px 10px 16px; overflow: visible; background: #f5f4f0; border: 1px solid var(--line); border-radius: 14px; }
.configs__photo::after { display: none; }
.configs__photo img { width: 100%; height: auto; min-height: 0; object-fit: contain; object-position: center; display: block; border-radius: 8px; box-shadow: 0 12px 24px rgba(26,26,24,.12); }
.configs__photo figcaption { position: static; color: #353531; padding: 0 8px; font-size: 13px; line-height: 1.35; }
.configs__photo .status-dot { background: var(--coral); box-shadow: 0 0 0 4px rgba(255,196,0,.22); }
.config-card { border-color: var(--line); background: #fff; }
.config-card:hover { border-color: #c7b15b; box-shadow: 0 14px 26px rgba(26,26,24,.08); }
.config-card p { color: var(--muted); }
.configs__cta { background: #f7f6f2; border-color: var(--line); }

.control, .contact { background: #1a1a18; }
.control h2, .contact h2 { color: #fff; }
.control h2 em, .contact h2 em, .process-step:hover, .process-step.is-active { color: var(--coral); }
.control__intro>p, .contact__copy>p:not(.eyebrow) { color: #d9d8d2; }
.process-step { color: #fff; border-color: rgba(255,255,255,.18); }
.process-step span, .process-step i { color: #bcbcb4; }
.dashboard { border-color: rgba(255,255,255,.19); background: #282825; box-shadow: 0 25px 60px rgba(0,0,0,.28); }
.dashboard::before { background: var(--coral); }
.dashboard img { filter: grayscale(1) sepia(.12) saturate(.65) contrast(.95); }
.dashboard__caption { color: var(--ink); }
.dashboard__caption .status-dot { background: var(--coral); }

.segment-tabs button { border-color: #cfcec7; color: #686861; }
.segment-tabs button.is-selected { color: #fff; background: #1a1a18; border-color: #1a1a18; }
.segment-panel { background: #f4f2ec; border: 1px solid var(--line); }
.segment-panel::after { border-color: rgba(26,26,24,.11); }
.segment-panel img { object-fit: cover; object-position: center; width: 66%; height: 80%; top: 10%; right: 0; border-radius: 8px 0 0 8px; box-shadow: -12px 14px 28px rgba(26,26,24,.08); }
.segment-panel li { color: #3c3c38; }
.segment-panel li::before { color: #aa7500; }

/* Interactive process interface: every stage updates the actual ticket state. */
.dashboard { --progress: 25%; min-height: 412px; padding: 11px; }
.dashboard::before { width: 210px; height: 210px; opacity: .16; }
.dashboard-ui { position: relative; z-index: 1; min-height: 388px; padding: 17px 18px 74px; overflow: hidden; color: var(--ink); background: #fff; border-radius: 10px; }
.dashboard-ui::after { content: ""; position: absolute; width: 160px; height: 160px; right: -96px; top: -88px; border: 1px solid rgba(255,196,0,.32); border-radius: 50%; }
.dashboard-ui__header { display: flex; align-items: center; justify-content: space-between; gap: 14px; position: relative; z-index: 1; padding-bottom: 13px; border-bottom: 1px solid #ebe9e2; color: #74746d; font-size: 9px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.dashboard-ui__brand { display: inline-flex; align-items: center; gap: 5px; color: #33332f; }
.dashboard-ui__brand i { width: 6px; height: 6px; display: block; border-radius: 50%; background: #d1d0ca; }
.dashboard-ui__brand i:last-of-type { margin-right: 5px; background: var(--coral); }
.dashboard-ticket { position: relative; z-index: 1; margin-top: 15px; padding: 18px; border: 1px solid #e7e5dd; border-radius: 10px; background: #fbfaf7; transition: border-color .35s, background .35s, transform .35s; }
.ticket__meta, .ticket__progress>div:first-child { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.ticket__number { color: #76766f; font-size: 10px; font-weight: 700; }
.ticket__badge { padding: 4px 9px; border-radius: 999px; background: #fff0b3; color: #5f4700; font-size: 9px; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; transition: background .35s, color .35s; }
.ticket__title { display: block; margin-top: 15px; font-size: 20px; line-height: 1.15; letter-spacing: -.04em; }
.ticket__note { min-height: 30px; margin: 7px 0 15px; color: #76766f; font-size: 11px; line-height: 1.4; }
.ticket__progress { color: #55554f; font-size: 10px; font-weight: 700; }
.ticket__percent { color: #9a6900; font-size: 12px; }
.progress-track { height: 8px; margin-top: 8px; overflow: hidden; border-radius: 999px; background: #e8e6df; }
.progress-track i { display: block; width: var(--progress); height: 100%; border-radius: inherit; background: var(--coral); box-shadow: 5px 0 10px rgba(255,196,0,.27); transition: width .65s cubic-bezier(.22,1,.36,1); }
.dashboard-timeline { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; position: relative; z-index: 1; margin: 18px 0 0; padding: 0; list-style: none; }
.dashboard-timeline::before { content: ""; position: absolute; z-index: -1; top: 13px; right: 10%; left: 10%; height: 1px; background: #dddcd5; }
.dashboard-timeline li { min-width: 0; color: #898982; text-align: center; transition: color .32s; }
.dashboard-timeline li span { display: grid; width: 27px; height: 27px; place-items: center; margin: 0 auto 7px; border: 1px solid #d3d2cb; border-radius: 50%; background: #fff; color: #85857e; font-size: 10px; font-weight: 800; transition: background .32s, border-color .32s, color .32s, box-shadow .32s; }
.dashboard-timeline li b, .dashboard-timeline li small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dashboard-timeline li b { color: currentColor; font-size: 9px; }
.dashboard-timeline li small { margin-top: 2px; font-size: 8px; font-weight: 600; }
.dashboard-timeline li.is-done { color: #4f4f49; }
.dashboard-timeline li.is-done span { border-color: #1a1a18; background: #1a1a18; color: #fff; }
.dashboard-timeline li.is-active { color: #9a6900; }
.dashboard-timeline li.is-active span { border-color: var(--coral); background: var(--coral); color: #1a1a18; box-shadow: 0 0 0 6px rgba(255,196,0,.18); animation: stagePulse 1.7s ease-in-out infinite; }
.dashboard-activity { position: absolute; z-index: 1; right: 18px; bottom: 15px; left: 18px; display: flex; align-items: center; gap: 9px; padding: 10px 11px; border: 1px solid #ebe9e2; border-radius: 8px; background: #f7f6f2; }
.activity__icon { display: grid; width: 25px; height: 25px; flex: 0 0 25px; place-items: center; border-radius: 7px; background: #fff0b3; color: #8c6300; font-size: 12px; }
.activity__title, .activity__time { display: block; }
.activity__title { font-size: 10px; line-height: 1.2; }
.activity__time { margin-top: 2px; color: #86867f; font-size: 8px; font-weight: 700; }
.dashboard__caption { left: 27px; bottom: -17px; z-index: 3; }
.dashboard.is-changing .dashboard-ticket, .dashboard.is-changing .dashboard-activity { animation: dashboardRefresh .44s cubic-bezier(.22,1,.36,1); }
.dashboard[data-stage="diagnosis"] .ticket__badge { background: #fff6d6; }
.dashboard[data-stage="work"] .ticket__badge { background: #ffe484; }
.dashboard[data-stage="result"] .ticket__badge { background: #e8f1dc; color: #456235; }
.dashboard[data-stage="result"] .dashboard-ticket { border-color: #d6e1c8; background: #fbfdf8; }

/* Two self-contained areas prevent copy and visual content from overlapping. */
.segment-panel { display: grid; grid-template-columns: minmax(220px, .86fr) minmax(0, 1.14fr); align-items: stretch; min-height: 465px; padding: 0; overflow: hidden; }
.segment-panel::after { display: none; }
.segment-panel__content { position: relative; z-index: 1; display: flex; flex-direction: column; justify-content: center; padding: 56px 46px; }
.segment-panel__visual { display: flex; min-width: 0; margin: 0; padding: 20px 20px 20px 0; }
.segment-panel__visual img { position: static; top: auto; right: auto; display: block; width: 100%; height: 100%; min-height: 0; object-fit: cover; object-position: center; border-radius: 12px; box-shadow: 0 10px 26px rgba(26,26,24,.10); transition: opacity .28s, transform .28s; }
.segment-panel h3 { max-width: 330px; font-size: 32px; }
.segment-panel li { max-width: 330px; font-size: 11px; line-height: 1.45; }

@keyframes stagePulse { 50% { box-shadow: 0 0 0 9px rgba(255,196,0,.08); } }
@keyframes dashboardRefresh { 0% { opacity: .45; transform: translateY(5px); } 100% { opacity: 1; transform: translateY(0); } }

.case-card { background: #e9e7df; }
.case-card img { filter: saturate(.8) contrast(1.02); }
.case-card>div:not(:first-child), .case-card--wide>div { background: linear-gradient(transparent,rgba(20,20,18,.83)); }
.case-card p { color: #fff0ae; }
.case-card a span, .quote-mark { color: var(--coral); }
.case-card--coral { color: var(--ink); background: var(--coral); }
.case-card--coral p { color: #5b4200; }
.quote-mark { color: #fff7d7; }
.industry-row span, .accordion, .accordion details { border-color: var(--line); }
.industry-row span, .accordion details p { color: var(--muted); }
.accordion summary span { color: #a36f00; }

.contact__flare { background: var(--coral); opacity: .5; }
.contact-phone small { color: #d9d8d2; }
.form-dot { background: var(--coral); box-shadow: 0 0 0 4px #fff1b7; }
.lead-form label { color: #4a4a45; }
.lead-form input:focus, .lead-form textarea:focus { border-color: #b37e00; }
.footer__legal a { color: #d9d8d2; }
.success-icon { background: #fff4ca; color: #715000; }

@media (max-width: 900px) {
  .hero-visual--system { min-height: 420px; }
  .hero-visual--system>img { width: min(88%, 500px); }
  .configs__photo, .configs__photo img { min-height: 0; }
  .sectors__grid { grid-template-columns: 1fr; }
  .segment-panel { grid-template-columns: minmax(220px, .88fr) minmax(0, 1.12fr); min-height: 410px; }
  .segment-panel__content { padding: 42px 30px; }
  .segment-panel__visual { padding: 16px 16px 16px 0; }
  .segment-panel h3 { font-size: 27px; }
}
@media (max-width: 680px) {
  .hero { min-height: auto; }
  .hero h1 em { white-space: normal; }
  .hero-visual--system { min-height: 300px; }
  .hero-visual--system>img { width: min(94%, 390px); }
  .configs__photo, .configs__photo img { min-height: 0; }
  .dashboard { min-height: 390px; }
  .dashboard-ui { min-height: 366px; padding: 14px 14px 71px; }
  .dashboard-ticket { margin-top: 12px; padding: 15px; }
  .ticket__title { font-size: 18px; }
  .dashboard-timeline { gap: 3px; }
  .dashboard-timeline li b { font-size: 8px; }
  .dashboard-timeline li small { font-size: 7px; }
  .dashboard-activity { right: 14px; bottom: 14px; left: 14px; }
  .dashboard__caption { left: 20px; }
  .segment-panel { grid-template-columns: 1fr; min-height: 0; }
  .segment-panel__content { min-height: 250px; padding: 34px 25px 25px; }
  .segment-panel__visual { height: 285px; padding: 0 16px 16px; }
  .segment-panel__visual img { height: 100%; }
  .segment-panel h3 { font-size: 26px; }
}
