/* Shared port of the Competiscan HTML design system (css/site.css + css/pages.css)
   for the inner solution/company pages that are rebuilt as dedicated templates.
   Values are verbatim from the source so each page matches at desktop, tablet and
   mobile. Scoped to the .cs-x1 page wrapper; the theme header/footer are reused
   and are intentionally not restyled here. Classes are added per page as pages
   are built. (The About page keeps its own about.css and is untouched.) */

.cs-x1 { box-sizing: border-box; }
.cs-x1 *, .cs-x1 *::before, .cs-x1 *::after { box-sizing: border-box; }

/* Page background + base type (source .cs-x1). */
.cs-x1 {
  font-family: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  background-color: rgb(255,255,255);
  background-image:
    linear-gradient(rgba(0,75,129,0.05) 0.75px, transparent 0.75px),
    linear-gradient(90deg, rgba(0,75,129,0.05) 0.75px, transparent 0.75px),
    linear-gradient(90deg, rgb(255,255,255) 0%, rgb(226,242,248) 100%);
  background-size: 189px 192px, 189px 192px, 100% 100%;
  color: rgb(0,30,51);
  overflow-x: hidden;
}

/* Buttons (source site.css). */
.cs-x1 .cs-btn-primary, .cs-x1 .cs-btn-outline, .cs-x1 .cs-btn-teal, .cs-x1 .cs-btn-white { transition: background 0.14s ease; }
.cs-x1 .cs-btn-primary:hover { background: rgb(0,30,51) !important; }
.cs-x1 .cs-btn-outline:hover { background: rgba(0,75,129,0.1) !important; }
.cs-x1 .cs-btn-teal:hover { background: rgb(0,140,140) !important; }
.cs-x1 .cs-btn-white:hover { background: rgb(226,242,248) !important; }

/* Gated white-paper input focus (source site.css). */
.cs-x1 [data-cs-whitepaper] input:focus { border-color: rgb(0,171,171); box-shadow: 0 0 0 3px rgba(0,171,171,0.15); }
.cs-x1 [data-cs-whitepaper] input::placeholder { color: rgb(165,173,180); }

/* ==================================================================
   HERO (generic solution hero) — cs-x15/16/19/20 + eyebrow cs-x113
   ================================================================== */
.cs-x15 { max-width: 1300px; margin: 0 auto; padding: clamp(56px,9vw,110px) clamp(20px,5vw,40px) clamp(40px,6vw,72px); }
.cs-x16 { max-width: 880px; }
.cs-x113 { display:inline-block; font-size: 15px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: rgb(0,171,171); margin-bottom: 20px; }
.cs-x19 { margin: 0 0 26px; font-size: clamp(40px,6.5vw,66px); font-weight: 600; letter-spacing: -0.03em; line-height: 1.05; color: rgb(0,75,129); }
.cs-x20 { margin: 0; max-width: 680px; font-size: 20px; line-height: 1.55; color: rgb(30,55,67); }
.cs-x21 { display: flex; gap: 12px; margin-top: 36px; flex-wrap: wrap; }
.cs-x22 { display:inline-flex; align-items:center; gap:10px; padding: 15px 26px; border-radius: 10px; background: rgb(0,75,129); font-size: 16px; font-weight: 500; color: rgb(255,255,255); }
.cs-x23 { font-size:14px; }
.cs-x24 { display:inline-flex; align-items:center; padding: 15px 26px; border-radius: 10px; border: 1px solid rgb(0,75,129); font-size: 16px; font-weight: 500; color: rgb(0,30,51); }

/* ==================================================================
   KEY CAPABILITIES — cs-x25/26/27 + icon cs-x185 + cs-x31/32
   ================================================================== */
.cs-x25 { max-width: 1300px; margin: 0 auto; padding: clamp(20px,3vw,32px) clamp(20px,5vw,40px) clamp(40px,6vw,64px); }
.cs-x26 { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px,1fr)); gap: 24px; }
.cs-x27 { background: rgb(255,255,255); border: 1px solid rgb(214,226,234); border-radius: 20px; padding: clamp(28px,3vw,40px); box-shadow: 0 18px 50px rgba(0,75,129,0.07); }
.cs-x185 { width: 56px; height: 56px; border-radius: 14px; background: rgba(0,171,171,0.1); display: flex; align-items: center; justify-content: center; flex-shrink: 0; margin-bottom: 22px; }
.cs-x31 { margin: 0 0 10px; font-size: 22px; font-weight: 600; letter-spacing: -0.02em; color: rgb(0,75,129); }
.cs-x32 { margin: 0; font-size: 16px; line-height: 1.6; color: rgb(98,98,98); }

/* ==================================================================
   WHITE PAPER (gated) — cs-x352/65/353/67/354/69/70/355/72/73/74/75
   ================================================================== */
.cs-x352 { max-width: 1300px; margin: 0 auto; padding: 0 clamp(20px,5vw,40px) clamp(40px,6vw,64px); }
.cs-x65 { background: rgb(0,75,129); border-radius: 24px; padding: clamp(32px,4vw,56px); position: relative; overflow: hidden; box-shadow: 0 18px 50px rgba(0,75,129,0.18); }
.cs-x353 { position: absolute; right: -70px; top: -90px; width: 320px; opacity: 0.06; pointer-events: none; }
.cs-x67 { position: relative; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 360px), 1fr)); gap: clamp(32px,5vw,72px); align-items: center; }
.cs-x354 { display: inline-block; font-size: 14px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: rgb(241,202,95); margin-bottom: 14px; }
.cs-x69 { margin: 0 0 12px; font-size: clamp(24px,3vw,34px); font-weight: 600; letter-spacing: -0.02em; line-height: 1.15; color: rgb(255,255,255); }
.cs-x70 { margin: 0; font-size: 17px; line-height: 1.6; color: rgb(204,234,255); max-width: 520px; }
.cs-x355 { background: rgb(255,255,255); border-radius: 20px; padding: clamp(28px,3.5vw,44px); box-shadow: 0 24px 60px rgba(0,15,30,0.25); }
.cs-x72 { display: flex; flex-direction: column; gap: 20px; }
.cs-x73 { display: block; margin-bottom: 8px; font-size: 15px; font-weight: 600; color: rgb(0,30,51); }
.cs-x74 { width: 100%; box-sizing: border-box; padding: 13px 16px; border-radius: 10px; border: 1px solid rgb(214,226,234); font-family: inherit; font-size: 16px; color: rgb(0,30,51); background: rgb(255,255,255); transition: border-color 0.14s ease, box-shadow 0.14s ease; }
.cs-x75 { margin-top: 4px; padding: 15px 26px; border-radius: 10px; border: none; background: rgb(0,75,129); font-family: inherit; font-size: 16px; font-weight: 600; color: rgb(255,255,255); cursor: pointer; }

/* ==================================================================
   COVERAGE — cs-x33/34/356/357/281/282
   ================================================================== */
.cs-x33 { max-width: 1300px; margin: 0 auto; padding: 0 clamp(20px,5vw,40px) clamp(56px,8vw,96px); }
.cs-x34 { background: rgb(255,255,255); border: 1px solid rgb(214,226,234); border-radius: 24px; padding: clamp(32px,4vw,56px); box-shadow: 0 18px 50px rgba(0,75,129,0.07); }
.cs-x356 { margin-bottom: 40px; }
.cs-x357 { margin: 0 0 18px; font-size: 15px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: rgb(0,171,171); }
.cs-x281 { display: flex; flex-wrap: wrap; gap: 10px; }
.cs-x282 { font-size: 15px; font-weight: 500; color: rgb(0,30,51); background: rgb(238,245,250); border: 1px solid rgb(214,226,234); border-radius: 999px; padding: 8px 16px; }

/* ==================================================================
   CTA BAND (centered) — cs-x64/180/144/181/77/183/79
   ================================================================== */
.cs-x64 { max-width: 1300px; margin: 0 auto clamp(60px,8vw,96px); padding: 0 clamp(20px,5vw,40px); }
.cs-x180 { background: rgb(0,30,51); border-radius: 24px; padding: clamp(48px,7vw,88px) clamp(28px,5vw,64px); position: relative; overflow: hidden; text-align: center; }
.cs-x144 { position:absolute; right:-70px; top:-90px; width:360px; height:360px; opacity:0.05; display:block; pointer-events:none; }
.cs-x181 { position: relative; max-width: 640px; margin: 0 auto; }
.cs-x77 { margin: 0 0 16px; font-size: clamp(28px,4.5vw,46px); font-weight: 600; letter-spacing: -0.03em; line-height: 1.1; color: rgb(0,171,171); }
.cs-x183 { margin: 0 0 32px; font-size: 18px; line-height: 1.6; color: rgb(204,234,255); }
.cs-x79 { display: inline-flex; align-items: center; gap: 10px; padding: 16px 32px; border-radius: 10px; background: rgb(0,75,129); font-size: 16px; font-weight: 600; color: rgb(255,255,255); }

/* ==================================================================
   FAQ BAND — cs-x80 + cs-2col cs-x81..x90 (shared)
   ================================================================== */
.cs-x80 { background: rgb(0,75,129); position: relative; overflow: hidden; }
.cs-2col { display: grid; }
.cs-x81 { position: relative; max-width: 1300px; margin: 0 auto; padding: clamp(56px,8vw,104px) clamp(20px,5vw,40px); display: grid; grid-template-columns: minmax(0,0.85fr) minmax(0,1.4fr); gap: clamp(32px,5vw,72px); }
.cs-x82 { margin: 0 0 20px; font-size: clamp(34px,4.5vw,54px); font-weight: 600; letter-spacing: -0.03em; line-height: 1.08; color: rgb(0,171,171); }
.cs-x83 { color: rgb(255,255,255); }
.cs-x84 { margin: 0; font-size: 18px; line-height: 1.55; color: rgb(204,234,255); max-width: 380px; }
.cs-x85 { border-bottom: 1px solid rgba(255,255,255,0.35); }
.cs-x86 { width: 100%; display: flex; align-items: center; gap: 18px; padding: 22px 4px; background: none; border: none; cursor: pointer; text-align: left; font-family: inherit; }
.cs-x87 { width: 6px; height: 6px; border-radius: 50%; background: rgb(232,119,82); flex-shrink: 0; }
.cs-x88 { flex: 1; font-size: clamp(18px,2vw,24px); color: rgb(0,171,171); line-height: 1.25; }
.cs-x89 { font-size: 30px; font-weight: 300; color: rgb(0,171,171); line-height: 1; flex-shrink: 0; }
.cs-x90 { margin: 0; padding: 0 34px 26px; font-size: 17px; line-height: 1.6; color: rgb(204,234,255); }

/* ==================================================================
   AI TOOLKIT additions
   ================================================================== */
/* Hero eyebrow with NEW badge */
.cs-x17 { display:inline-flex; align-items:center; gap:10px; font-size: 15px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: rgb(0,171,171); margin-bottom: 20px; }
.cs-x18 { font-size:11px; font-weight:700; letter-spacing:0.04em; color: rgb(230,120,20); }
/* Analysis modules number + icon */
.cs-x28 { display: flex; align-items: center; gap: 14px; margin-bottom: 20px; }
.cs-x29 { width: 40px; height: 40px; border-radius: 10px; background: rgb(0,75,129); display: flex; align-items: center; justify-content: center; flex-shrink: 0; font-size: 15px; font-weight: 700; color: rgb(255,255,255); }
.cs-x30 { width: 56px; height: 56px; border-radius: 14px; background: rgba(0,171,171,0.1); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
/* Key capabilities */
.cs-x35 { margin: 0 0 26px; font-size: 15px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: rgb(0,171,171); }
.cs-x36 { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px,1fr)); gap: 24px; }
.cs-x37 { display: flex; gap: 14px; align-items: flex-start; }
.cs-x38 { flex-shrink:0; margin-top:2px; }
.cs-x39 { margin:0 0 5px; font-size: 17px; font-weight: 600; color: rgb(0,30,51); }
.cs-x40 { margin:0; font-size: 15px; line-height: 1.55; color: rgb(98,98,98); }
/* Deliverables carousel */
.cs-x41 { margin-bottom: clamp(24px,3vw,36px); }
.cs-x42 { margin: 0 0 16px; font-size: clamp(30px,4.5vw,44px); font-weight: 600; letter-spacing: -0.03em; line-height: 1.1; color: rgb(0,75,129); }
.cs-x43 { margin: 0; font-size: 18px; line-height: 1.6; color: rgb(30,55,67); }
.cs-x44 { display: flex; align-items: center; gap: clamp(10px,1.6vw,22px); }
.cs-x45 { flex-shrink: 0; width: 44px; height: 44px; border-radius: 50%; border: 1px solid rgba(0,171,171,0.4); background: rgb(255,255,255); color: rgb(0,171,171); cursor: pointer; display: flex; align-items: center; justify-content: center; }
.cs-x46 { display: grid; flex: 1; min-width: 0; }
.cs-x47 { grid-area: 1 / 1; opacity: 1; transform: translateX(0); pointer-events: auto; transition: opacity 0.5s ease, transform 0.5s ease; }
.cs-x48 { height: 100%; background: rgb(255,255,255); border: 1px solid rgb(214,226,234); border-radius: 20px; overflow: hidden; box-shadow: 0 18px 50px rgba(0,75,129,0.07); display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 340px), 1fr)); }
.cs-x49 { min-height: 320px; display: flex; align-items: center; justify-content: center; padding: clamp(16px,2vw,28px); background: rgb(245,250,253); }
.cs-x50 { max-width: 100%; max-height: 440px; width: auto; height: auto; object-fit: contain; display: block; }
.cs-x51 { padding: clamp(24px,3.5vw,48px); display: flex; flex-direction: column; justify-content: center; }
.cs-x52 { margin: 0 0 6px; font-size: 22px; font-weight: 600; letter-spacing: -0.02em; color: rgb(0,75,129); }
.cs-x53 { margin: 0 0 12px; font-size: 16px; font-weight: 600; color: rgb(0,171,171); }
.cs-x54 { margin: 0 0 16px; font-size: 15px; line-height: 1.6; color: rgb(98,98,98); }
.cs-x55 { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 12px; }
.cs-x56 { display: flex; gap: 10px; align-items: flex-start; font-size: 15px; line-height: 1.55; color: rgb(98,98,98); }
.cs-x57 { flex-shrink:0; margin-top:3px; }
.cs-x58 { color: rgb(0,30,51); font-weight: 600; }
.cs-x59 { grid-area: 1 / 1; opacity: 0; transform: translateX(24px); pointer-events: none; transition: opacity 0.5s ease, transform 0.5s ease; }
.cs-x60 { display: flex; justify-content: center; gap: 10px; margin-top: clamp(20px,3vw,28px); }
.cs-x61 { width: 11px; height: 11px; border-radius: 50%; border: 1px solid rgb(0,171,171); background: rgb(0,171,171); cursor: pointer; padding: 0; }
.cs-x62 { width: 11px; height: 11px; border-radius: 50%; border: 1px solid rgba(0,75,129,0.35); background: transparent; cursor: pointer; padding: 0; }
.cs-x63 { margin: clamp(20px,3vw,28px) 0 0; text-align: center; font-size: 19px; font-weight: 600; letter-spacing: -0.02em; color: rgb(0,75,129); }
/* White paper (case study) variants */
.cs-x66 { position:absolute; right:-70px; top:-90px; width:320px; opacity:0.06; display:block; pointer-events:none; }
.cs-x68 { display:inline-block; font-size: 14px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: rgb(241,202,95); margin-bottom: 14px; }
.cs-x71 { background: rgb(255,255,255); border-radius: 20px; padding: clamp(28px,3.5vw,44px); box-shadow: 0 24px 60px rgba(0,15,30,0.35); }
/* Centered text CTA (white bg) */
.cs-x76 { max-width: 640px; margin: 0 auto; text-align: center; }
.cs-x78 { margin: 0 0 32px; font-size: 18px; line-height: 1.6; color: rgb(0,30,51); }

/* ==================================================================
   Embedded CF7 forms (e.g. the white-paper form) — branded rounded inputs
   matching the source's .cs-x74 / .cs-x75 form styling.
   ================================================================== */
.cs-cf7 .form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 0 18px; }
.cs-cf7 .wpcf7-form-control-wrap { display: block; }
.cs-cf7 p { margin: 0; }
.cs-cf7 label { display: block; }
/* Visible field labels (source .cs-x73). */
.cs-cf7 .wp-l { display: block; margin: 0 0 8px; font-size: 15px; font-weight: 600; color: rgb(0,30,51); }
.cs-cf7 input.wpcf7-form-control:not([type="submit"]),
.cs-cf7 select.wpcf7-form-control,
.cs-cf7 textarea.wpcf7-form-control {
  width: 100%; box-sizing: border-box; margin: 0 0 18px; padding: 13px 16px;
  border: 1px solid rgb(214,226,234); border-radius: 10px; background: rgb(255,255,255);
  font-family: inherit; font-size: 16px; color: rgb(0,30,51);
  transition: border-color 0.14s ease, box-shadow 0.14s ease;
}
.cs-cf7 .wpcf7-form-control:not([type="submit"]):focus { border-color: rgb(0,171,171); box-shadow: 0 0 0 3px rgba(0,171,171,0.15); outline: none; }
.cs-cf7 ::placeholder { color: rgb(165,173,180); opacity: 1; }
.cs-cf7 .wpcf7-submit { width: 100%; margin-top: 4px; padding: 15px 26px; border: none; border-radius: 10px; background: rgb(0,75,129); color: rgb(255,255,255); font-family: inherit; font-size: 16px; font-weight: 600; cursor: pointer; transition: background 0.14s ease; }
.cs-cf7 .wpcf7-submit:hover { background: rgb(0,30,51); }
.cs-cf7 .wpcf7-spinner { display: block; margin: 12px auto 0; }
.cs-cf7 .wpcf7-not-valid-tip { display: block; margin: -12px 0 14px; font-size: 13px; color: rgb(196,54,54); }
.cs-cf7 input.wpcf7-not-valid { border-color: rgb(196,54,54); }
.cs-cf7 .wpcf7-response-output { margin: 14px 0 0 !important; padding: 12px 16px; border-radius: 8px; border: 1px solid transparent; font-size: 15px; line-height: 1.5; }
.cs-cf7 .wpcf7-form.invalid .wpcf7-response-output, .cs-cf7 .wpcf7-form.unaccepted .wpcf7-response-output, .cs-cf7 .wpcf7-form.spam .wpcf7-response-output { color: rgb(196,54,54); background: transparent; border: 0; text-align: center; }
.cs-cf7 .wpcf7-form.sent .wpcf7-response-output { color: rgb(0,140,90); background: rgba(0,140,90,0.06); border-color: rgba(0,140,90,0.4); }
@media (max-width: 560px) {
  .cs-cf7 .form-row { grid-template-columns: minmax(0, 1fr); }
}

/* ==================================================================
   CAREERS page
   ================================================================== */
.cs-x110 { color: rgb(0,171,171); }
.cs-x133 { margin: 0 0 16px; font-size: clamp(34px,5vw,54px); font-weight: 600; letter-spacing: -0.03em; line-height: 1.1; color: rgb(0,75,129); }
/* Hero */
.cs-x151 { position: relative; max-width: 1300px; margin: 0 auto; padding: clamp(56px,9vw,110px) clamp(20px,5vw,40px) clamp(40px,6vw,72px); }
.cs-x152 { position: relative; max-width: 900px; }
.cs-x153 { margin: 0; max-width: 640px; font-size: 20px; line-height: 1.55; color: rgb(30,55,67); }
/* Why join + benefits */
.cs-x154 { max-width: 1300px; margin: 0 auto; padding: clamp(24px,4vw,48px) clamp(20px,5vw,40px) clamp(56px,8vw,96px); display: grid; grid-template-columns: minmax(0,0.9fr) minmax(0,1.1fr); gap: clamp(32px,5vw,72px); align-items: center; }
.cs-x155 { margin: 0 0 20px; font-size: clamp(32px,4.5vw,54px); font-weight: 600; letter-spacing: -0.03em; line-height: 1.1; color: rgb(0,75,129); }
.cs-x156 { margin: 0 0 18px; font-size: 18px; line-height: 1.6; color: rgb(30,55,67); }
.cs-x157 { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px,1fr)); gap: 14px; }
.cs-x158 { display: flex; align-items: center; gap: 14px; background: rgb(255,255,255); border: 1px solid rgb(214,226,234); border-radius: 12px; padding: 18px 20px; box-shadow: 0 10px 30px rgba(0,75,129,0.05); }
.cs-x159 { flex-shrink: 0; width: 34px; height: 34px; border-radius: 50%; background: rgba(0,171,171,0.12); display: flex; align-items: center; justify-content: center; }
.cs-x160 { font-size: 16px; font-weight: 500; color: rgb(0,30,51); line-height: 1.3; }
/* Open roles */
.cs-x161 { max-width: 1300px; margin: 0 auto; padding: clamp(56px,8vw,96px) clamp(20px,5vw,40px); }
.cs-x162 { max-width: 640px; margin-bottom: 44px; }
.cs-x163 { display: flex; flex-direction: column; gap: 18px; }
.cs-x164 { background: rgb(255,255,255); border: 1px solid rgb(214,226,234); border-radius: 18px; overflow: hidden; box-shadow: 0 14px 40px rgba(0,75,129,0.06); }
.cs-x165 { width: 100%; display: flex; align-items: center; gap: 20px; padding: clamp(22px,3vw,32px); background: none; border: none; cursor: pointer; text-align: left; font-family: inherit; }
.cs-x166 { flex: 1; }
.cs-x167 { margin: 0 0 8px; font-size: clamp(22px,2.5vw,28px); font-weight: 600; letter-spacing: -0.02em; color: rgb(0,75,129); }
.cs-x168 { display: inline-flex; align-items: center; gap: 8px; font-size: 15px; color: rgb(98,98,98); }
.cs-x169 { font-size: 34px; font-weight: 300; color: rgb(0,171,171); line-height: 1; flex-shrink: 0; }
.cs-x170 { padding: 0 clamp(22px,3vw,32px) clamp(26px,3vw,36px); border-top: 1px solid rgb(232,240,246); }
.cs-x171 { margin: 22px 0 24px; font-size: 17px; line-height: 1.6; color: rgb(30,55,67); max-width: 820px; }
.cs-x172 { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px,1fr)); gap: 32px; }
.cs-x173 { font-size: 15px; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; color: rgb(0,75,129); margin-bottom: 14px; }
.cs-x174 { display: flex; gap: 12px; font-size: 16px; line-height: 1.5; color: rgb(30,55,67); }
.cs-x175 { flex-shrink: 0; width: 6px; height: 6px; border-radius: 50%; background: rgb(232,119,82); margin-top: 9px; }
.cs-x176 { flex-shrink: 0; width: 6px; height: 6px; border-radius: 50%; background: rgb(0,171,171); margin-top: 9px; }
.cs-x177 { display: inline-flex; align-items: center; gap: 10px; margin-top: 30px; padding: 14px 26px; border-radius: 10px; background: rgb(0,75,129); font-size: 16px; font-weight: 500; color: rgb(255,255,255); }
.cs-x178 { margin: 28px 0 0; font-size: 15px; line-height: 1.6; color: rgb(98,98,98); }
.cs-x179 { color: rgb(0,75,129); }
/* Careers CTA title */
.cs-x182 { margin: 0 0 16px; font-size: clamp(30px,4.5vw,48px); font-weight: 600; letter-spacing: -0.03em; line-height: 1.1; color: rgb(0,171,171); }

/* ==================================================================
   CUSTOM RESEARCH — study types grid
   ================================================================== */
.cs-x184 { max-width: 1300px; margin: 0 auto; padding: clamp(20px,3vw,32px) clamp(20px,5vw,40px) clamp(56px,8vw,96px); }
.cs-x186 { background: rgb(0,75,129); border: 1px solid rgb(0,75,129); border-radius: 20px; padding: clamp(28px,3vw,40px); box-shadow: 0 18px 50px rgba(0,75,129,0.12); display: flex; flex-direction: column; justify-content: center; }
.cs-x187 { margin: 0 0 10px; font-size: 22px; font-weight: 600; letter-spacing: -0.02em; color: rgb(0,171,171); }
.cs-x188 { margin: 0 0 20px; font-size: 16px; line-height: 1.6; color: rgb(204,234,255); }
.cs-x189 { display:inline-flex; align-items:center; gap:10px; align-self:flex-start; padding: 13px 22px; border-radius: 10px; background: rgb(255,255,255); font-size: 16px; font-weight: 600; color: rgb(0,75,129); }

/* ==================================================================
   INDUSTRIES page
   ================================================================== */
/* Featured industry cards */
.cs-x277 { max-width: 1300px; margin: 0 auto; padding: clamp(20px,3vw,32px) clamp(20px,5vw,40px) 20px; }
.cs-x278 { display: grid; grid-template-columns: repeat(auto-fit, minmax(360px,1fr)); gap: 24px; }
.cs-x279 { display: flex; align-items: center; gap: 16px; margin-bottom: 22px; }
.cs-x280 { margin: 0; font-size: 26px; font-weight: 600; letter-spacing: -0.02em; color: rgb(0,75,129); }
/* Other industries grid */
.cs-x283 { max-width: 1300px; margin: 0 auto; padding: 24px clamp(20px,5vw,40px) clamp(56px,8vw,96px); }
.cs-x284 { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px,1fr)); gap: 18px; }
.cs-x285 { background: rgb(255,255,255); border: 1px solid rgb(214,226,234); border-radius: 16px; padding: 26px 24px; box-shadow: 0 12px 34px rgba(0,75,129,0.05); display: flex; align-items: center; gap: 16px; }
.cs-x286 { width: 48px; height: 48px; border-radius: 12px; background: rgba(0,171,171,0.1); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.cs-x287 { font-size: 18px; font-weight: 600; letter-spacing: -0.02em; color: rgb(0,75,129); }
.cs-x288 { background: rgb(0,75,129); border: 1px solid rgb(0,75,129); border-radius: 16px; padding: 26px 24px; box-shadow: 0 12px 34px rgba(0,75,129,0.12); display: flex; align-items: center; gap: 16px; }
.cs-x289 { width: 48px; height: 48px; border-radius: 12px; background: rgba(255,255,255,0.14); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.cs-x290 { font-size: 18px; font-weight: 600; letter-spacing: -0.02em; color: rgb(255,255,255); }

/* ==================================================================
   LOGIN page
   ================================================================== */
.cs-x336 { max-width: 1300px; margin: 0 auto; padding: clamp(48px,7vw,88px) clamp(20px,5vw,40px) clamp(60px,9vw,110px); display: flex; justify-content: center; }
.cs-x337 { width: 100%; max-width: 460px; }
.cs-x338 { text-align: center; margin-bottom: 32px; }
.cs-x339 { display:inline-block; font-size: 15px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: rgb(0,171,171); margin-bottom: 16px; }
.cs-x340 { margin: 0; font-size: clamp(34px,5vw,48px); font-weight: 600; letter-spacing: -0.03em; line-height: 1.05; color: rgb(0,75,129); }
.cs-x341 { background: rgb(255,255,255); border: 1px solid rgb(214,226,234); border-radius: 20px; padding: clamp(28px,4vw,40px); box-shadow: 0 18px 50px rgba(0,75,129,0.07); }
.cs-x342 { display: block; margin-bottom: 20px; }
.cs-x343 { display: block; font-size: 14px; font-weight: 500; color: rgb(0,30,51); margin-bottom: 8px; }
.cs-x344 { width: 100%; padding: 13px 16px; border-radius: 10px; border: 1px solid rgb(214,226,234); background: rgb(248,251,253); font-size: 16px; font-family: inherit; color: rgb(0,30,51); outline: none; }
.cs-x344:focus { border-color: rgb(0,171,171); box-shadow: 0 0 0 3px rgba(0,171,171,0.15); }
.cs-x345 { display: block; margin-bottom: 18px; }
.cs-x346 { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 26px; flex-wrap: wrap; }
.cs-x347 { display: inline-flex; align-items: center; gap: 9px; cursor: pointer; font-size: 15px; color: rgb(30,55,67); }
.cs-x348 { width: 16px; height: 16px; accent-color: rgb(0,75,129); cursor: pointer; }
.cs-x349 { font-size: 15px; color: rgb(0,75,129); }
.cs-x350 { width: 100%; padding: 15px 26px; border-radius: 10px; border: none; background: rgb(0,75,129); font-size: 16px; font-weight: 600; font-family: inherit; color: rgb(255,255,255); cursor: pointer; transition: background 0.14s ease; }
.cs-login-submit:hover { background: rgb(0,30,51); }
.cs-x351 { text-align: center; margin: 26px 0 0; font-size: 15px; line-height: 1.6; color: rgb(98,98,98); }

/* ==================================================================
   VALUE PROP TRACKERS page
   ================================================================== */
.cs-x358 { max-width: 1300px; margin: 0 auto; padding: clamp(48px,7vw,88px) clamp(20px,5vw,40px) clamp(28px,4vw,44px); }
/* Feature tile */
.cs-x359 { position: relative; overflow: hidden; border-radius: 20px; background: linear-gradient(115deg, rgb(0,75,129) 0%, rgb(0,45,90) 68%); box-shadow: 0 30px 70px rgba(0,20,35,0.25); }
.cs-x360 { position: relative; display: grid; grid-template-columns: 1fr 1.05fr; gap: 0; align-items: center; }
.cs-x361 { padding: clamp(32px,4vw,52px) clamp(28px,3vw,40px) clamp(40px,5vw,56px) clamp(32px,4vw,56px); }
.cs-x362 { display: inline-flex; align-items: center; gap: 8px; background: rgba(255,255,255,0.12); border: 1px solid rgba(255,255,255,0.18); border-radius: 999px; padding: 5px 12px; margin-bottom: 18px; }
.cs-x363 { width: 6px; height: 6px; border-radius: 50%; background: rgb(0,171,171); }
.cs-x364 { font-size: 12px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: rgb(255,255,255); }
.cs-x365 { font-size: clamp(22px,2.6vw,28px); line-height: 1.25; font-weight: 700; letter-spacing: -0.01em; color: rgb(255,255,255); margin: 0 0 14px; max-width: 480px; }
.cs-x366 { font-size: 16px; line-height: 1.6; color: rgba(255,255,255,0.78); margin: 0 0 26px; max-width: 460px; }
.cs-x367 { list-style: none; margin: 0 0 32px; padding: 0; display: flex; flex-direction: column; gap: 12px; }
.cs-x368 { display: flex; align-items: flex-start; gap: 10px; font-size: 15px; line-height: 1.45; color: rgb(255,255,255); }
.cs-x369 { flex:none; margin-top:2px; }
.cs-x370 { display: inline-flex; align-items: center; gap: 10px; padding: 14px 26px; border-radius: 10px; background: rgb(255,255,255); font-size: 16px; font-weight: 600; color: rgb(0,75,129); }
.cs-x371 { font-size: 13px; line-height: 1.6; color: rgba(255,255,255,0.55); margin: 24px 0 0; max-width: 460px; padding-top: 18px; border-top: 1px solid rgba(255,255,255,0.14); }
.cs-x372 { color: rgba(255,255,255,0.8); }
.cs-x373 { padding: clamp(32px,4vw,40px) clamp(28px,4vw,48px) 36px 0; display: flex; justify-content: center; }
.cs-x374 { width: 100%; max-width: 560px; background: rgb(255,255,255); border-radius: 12px; box-shadow: 0 24px 60px rgba(0,20,35,0.4); overflow: hidden; transform: rotate(0.4deg); }
.cs-x375 { display: flex; align-items: center; gap: 10px; padding: 11px 14px; background: rgb(248,250,252); border-bottom: 1px solid rgb(232,240,246); }
.cs-x376 { display: flex; gap: 6px; }
.cs-x377 { width: 8px; height: 8px; border-radius: 50%; background: rgb(200,206,212); }
.cs-x378 { font-size: 11.5px; font-weight: 600; color: rgb(98,98,98); margin-left: 4px; }
.cs-x379 { display: flex; flex-wrap: wrap; gap: 8px; padding: 12px 14px; border-bottom: 1px solid rgb(232,240,246); }
.cs-x380 { font-size: 11px; font-weight: 600; color: rgb(0,30,51); background: rgb(244,247,250); border: 1px solid rgb(214,226,234); border-radius: 6px; padding: 5px 10px; }
.cs-x381 { font-size: 11px; font-weight: 600; color: rgb(0,75,129); background: rgb(226,242,248); border: 1px solid rgb(204,234,255); border-radius: 6px; padding: 5px 10px; }
.cs-x382 { width: 100%; border-collapse: collapse; font-size: 11px; }
.cs-x383 { background: rgb(0,53,111); }
.cs-x384 { text-align: left; font-weight: 700; color: rgb(255,255,255); padding: 8px 12px; font-size: 10.5px; letter-spacing: 0.02em; }
.cs-x385 { text-align: left; font-weight: 700; color: rgb(255,255,255); padding: 8px 10px; font-size: 10.5px; }
.cs-x386 { text-align: left; font-weight: 700; color: rgb(255,255,255); padding: 8px 12px; font-size: 10.5px; }
.cs-x387 { border-top: 1px solid rgb(228,235,241); }
.cs-x388 { padding: 9px 12px; }
.cs-x389 { display: flex; align-items: center; gap: 8px; }
.cs-x390 { width: 20px; height: 14px; border-radius: 3px; flex: none; background: rgb(0,75,129); }
.cs-x391 { font-weight: 600; color: rgb(0,30,51); }
.cs-x392 { padding: 9px 10px; color: rgb(60,80,95); }
.cs-x393 { padding: 9px 12px; color: rgb(60,80,95); }
.cs-x394 { border-top: 1px solid rgb(228,235,241); background: rgb(247,250,252); }
.cs-x395 { width: 20px; height: 14px; border-radius: 3px; flex: none; background: rgb(0,171,171); }
.cs-x396 { width: 20px; height: 14px; border-radius: 3px; flex: none; background: rgb(241,202,95); }
.cs-x397 { width: 20px; height: 14px; border-radius: 3px; flex: none; background: rgb(232,119,82); }
.cs-x398 { width: 20px; height: 14px; border-radius: 3px; flex: none; background: rgb(28,102,153); }
.cs-x235 { position: absolute; top: 0; right: 0; width: 473px; height: 285px; overflow: hidden; pointer-events: none; }
.cs-x236 { position: absolute; left: 0; top: -211px; width: 496px; height: 496px; opacity: 0.05; display: block; }
/* Trackers by category */
.cs-x399 { margin: 0 0 32px; font-size: clamp(28px,3.5vw,40px); font-weight: 600; letter-spacing: -0.03em; line-height: 1.1; color: rgb(0,75,129); }
.cs-x400 { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px,1fr)); gap: 18px; }
.cs-x401 { background: rgb(255,255,255); border: 1px solid rgb(214,226,234); border-radius: 16px; padding: 26px 24px 28px; box-shadow: 0 14px 40px rgba(0,75,129,0.06); }
.cs-x402 { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.cs-x403 { width: 40px; height: 26px; border-radius: 5px; background: rgb(0,75,129); }
.cs-x404 { margin: 0 0 8px; font-size: 20px; font-weight: 600; letter-spacing: -0.02em; color: rgb(0,75,129); }
.cs-x405 { margin: 0; font-size: 15px; line-height: 1.5; color: rgb(98,98,98); }
.cs-x406 { width: 40px; height: 26px; border-radius: 5px; background: rgb(0,171,171); }
.cs-x407 { width: 40px; height: 26px; border-radius: 5px; background: rgb(232,119,82); }
.cs-x408 { width: 40px; height: 26px; border-radius: 5px; background: rgb(241,202,95); }

/* ==================================================================
   RESPONSIVE (source site.css)
   ================================================================== */
@media (max-width: 980px) {
  .cs-vpt-mockcol { padding: 8px clamp(16px,4vw,48px) 36px !important; }
}
@media (max-width: 560px) {
  .cs-vpt-mockcol table { font-size: 10px; }
  .cs-vpt-mockcol th, .cs-vpt-mockcol td { padding: 7px 5px !important; font-size: 10px !important; }
  .cs-vpt-mockcol th:first-child, .cs-vpt-mockcol td:first-child { padding-left: 10px !important; }
}
@media (max-width: 980px) {
  .cs-2col { grid-template-columns: minmax(0, 1fr) !important; }
}