/* ==========================================================================
   FIMRIQ PRODUCTION COMPILED STYLESHEET — VERSION 1.0.3
   Nordic Titanium & Emerald Aurora Design System 3.0
   ========================================================================== */

/*! tailwindcss v4.2.1 | MIT License | https://tailwindcss.com */
@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after{--tw-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial;--tw-border-style:solid;--tw-outline-style:solid;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial;--tw-backdrop-blur:initial;--tw-backdrop-brightness:initial;--tw-backdrop-contrast:initial;--tw-backdrop-grayscale:initial;--tw-backdrop-hue-rotate:initial;--tw-backdrop-invert:initial;--tw-backdrop-opacity:initial;--tw-backdrop-saturate:initial;--tw-backdrop-sepia:initial}::backdrop{--tw-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial;--tw-border-style:solid;--tw-outline-style:solid;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial;--tw-backdrop-blur:initial;--tw-backdrop-brightness:initial;--tw-backdrop-contrast:initial;--tw-backdrop-grayscale:initial;--tw-backdrop-hue-rotate:initial;--tw-backdrop-invert:initial;--tw-backdrop-opacity:initial;--tw-backdrop-saturate:initial;--tw-backdrop-sepia:initial}}}@layer theme{:root,:host{--font-sans:ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--font-mono:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--color-orange-300:lab(80.8059% 21.7313 50.4455);--color-orange-500:lab(64.272% 57.1788 90.3583);--color-amber-300:lab(86.4156% 6.13147 78.3961);--color-amber-400:lab(80.1641% 16.6016 99.2089);--color-amber-500:lab(72.7183% 31.8672 97.9407);--color-emerald-300:lab(83.9203% -48.7124 13.8849);--color-emerald-400:lab(75.0771% -60.7313 19.4146);--color-emerald-500:lab(66.9756% -58.27 19.5419);--color-cyan-300:lab(85.3886% -36.7635 -21.5717);--color-cyan-400:lab(76.6045% -40.9406 -29.6231);--color-cyan-500:lab(67.805% -35.3952 -30.2018);--color-sky-300:lab(80.3307% -20.2945 -31.385);--color-sky-500:lab(63.3038% -18.433 -51.0407);--color-blue-300:lab(77.5052% -6.4629 -36.42);--color-blue-400:lab(65.0361% -1.42062 -56.9803);--color-blue-500:lab(54.1736% 13.3368 -74.6839);--color-blue-600:lab(44.0605% 29.0279 -86.0352);--color-indigo-400:lab(59.866% 22.4833 -64.4485);--color-indigo-500:lab(48.295% 38.3129 -81.9673);--color-purple-300:lab(78.3298% 26.2195 -34.9499);--color-purple-400:lab(63.6946% 47.6127 -59.2066);--color-purple-500:lab(52.0183% 66.11 -78.2316);--color-pink-400:lab(64.5597% 64.3615 -12.7988);--color-pink-500:lab(56.9303% 76.8162 -8.07021);--color-rose-300:lab(76.6339% 38.3549 9.68834);--color-rose-500:lab(56.101% 79.4329 31.4532);--color-slate-100:lab(96.286% -.852466 -2.46847);--color-slate-200:lab(91.7353% -.998765 -4.76968);--color-slate-300:lab(84.7652% -1.94535 -7.93337);--color-slate-400:lab(65.5349% -2.25151 -14.5072);--color-slate-500:lab(48.0876% -2.03595 -16.5814);--color-slate-950:lab(1.76974% 1.32743 -9.28855);--spacing:.25rem;--text-xs:.75rem;--text-xs--line-height:calc(1 / .75);--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4, 0, .2, 1);--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono)}}@layer base{*,:after,:before{box-sizing:border-box;border:0 solid;margin:0;padding:0}::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab, red, red)){::placeholder{color:color-mix(in oklab, currentcolor 50%, transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){-webkit-appearance:button;appearance:button}::file-selector-button{-webkit-appearance:button;appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components;@layer utilities{.visible{visibility:visible}.sr-only{clip-path:inset(50%);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.fixed{position:fixed}.relative{position:relative}.static{position:static}.start{inset-inline-start:var(--spacing)}.container{width:100%}@media (min-width:40rem){.container{max-width:40rem}}@media (min-width:48rem){.container{max-width:48rem}}@media (min-width:64rem){.container{max-width:64rem}}@media (min-width:80rem){.container{max-width:80rem}}@media (min-width:96rem){.container{max-width:96rem}}.mx-auto{margin-inline:auto}.block{display:block}.flex{display:flex}.hidden{display:none}.inline-flex{display:inline-flex}.table{display:table}.min-h-screen{min-height:100vh}.w-full{width:100%}.max-w-\[1700px\]{max-width:1700px}.flex-1{flex:1}.flex-shrink{flex-shrink:1}.flex-grow,.grow{flex-grow:1}.transform{transform:var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,)}.resize{resize:both}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.rounded{border-radius:.25rem}.border{border-style:var(--tw-border-style);border-width:1px}.border-amber-500\/30{border-color:#f99c004d}@supports (color:color-mix(in lab, red, red)){.border-amber-500\/30{border-color:color-mix(in oklab, var(--color-amber-500) 30%, transparent)}}.border-amber-500\/40{border-color:#f99c0066}@supports (color:color-mix(in lab, red, red)){.border-amber-500\/40{border-color:color-mix(in oklab, var(--color-amber-500) 40%, transparent)}}.border-blue-500\/30{border-color:#3080ff4d}@supports (color:color-mix(in lab, red, red)){.border-blue-500\/30{border-color:color-mix(in oklab, var(--color-blue-500) 30%, transparent)}}.border-blue-500\/40{border-color:#3080ff66}@supports (color:color-mix(in lab, red, red)){.border-blue-500\/40{border-color:color-mix(in oklab, var(--color-blue-500) 40%, transparent)}}.border-blue-600\/30{border-color:#155dfc4d}@supports (color:color-mix(in lab, red, red)){.border-blue-600\/30{border-color:color-mix(in oklab, var(--color-blue-600) 30%, transparent)}}.border-cyan-500\/30{border-color:#00b7d74d}@supports (color:color-mix(in lab, red, red)){.border-cyan-500\/30{border-color:color-mix(in oklab, var(--color-cyan-500) 30%, transparent)}}.border-cyan-500\/40{border-color:#00b7d766}@supports (color:color-mix(in lab, red, red)){.border-cyan-500\/40{border-color:color-mix(in oklab, var(--color-cyan-500) 40%, transparent)}}.border-emerald-500\/30{border-color:#00bb7f4d}@supports (color:color-mix(in lab, red, red)){.border-emerald-500\/30{border-color:color-mix(in oklab, var(--color-emerald-500) 30%, transparent)}}.border-emerald-500\/40{border-color:#00bb7f66}@supports (color:color-mix(in lab, red, red)){.border-emerald-500\/40{border-color:color-mix(in oklab, var(--color-emerald-500) 40%, transparent)}}.border-indigo-500\/30{border-color:#625fff4d}@supports (color:color-mix(in lab, red, red)){.border-indigo-500\/30{border-color:color-mix(in oklab, var(--color-indigo-500) 30%, transparent)}}.border-orange-500\/40{border-color:#fe6e0066}@supports (color:color-mix(in lab, red, red)){.border-orange-500\/40{border-color:color-mix(in oklab, var(--color-orange-500) 40%, transparent)}}.border-pink-500\/30{border-color:#f6339a4d}@supports (color:color-mix(in lab, red, red)){.border-pink-500\/30{border-color:color-mix(in oklab, var(--color-pink-500) 30%, transparent)}}.border-purple-500\/30{border-color:#ac4bff4d}@supports (color:color-mix(in lab, red, red)){.border-purple-500\/30{border-color:color-mix(in oklab, var(--color-purple-500) 30%, transparent)}}.border-purple-500\/40{border-color:#ac4bff66}@supports (color:color-mix(in lab, red, red)){.border-purple-500\/40{border-color:color-mix(in oklab, var(--color-purple-500) 40%, transparent)}}.border-rose-500\/30{border-color:#ff23574d}@supports (color:color-mix(in lab, red, red)){.border-rose-500\/30{border-color:color-mix(in oklab, var(--color-rose-500) 30%, transparent)}}.border-sky-500\/30{border-color:#00a5ef4d}@supports (color:color-mix(in lab, red, red)){.border-sky-500\/30{border-color:color-mix(in oklab, var(--color-sky-500) 30%, transparent)}}.border-slate-500\/30{border-color:#62748e4d}@supports (color:color-mix(in lab, red, red)){.border-slate-500\/30{border-color:color-mix(in oklab, var(--color-slate-500) 30%, transparent)}}.border-slate-500\/40{border-color:#62748e66}@supports (color:color-mix(in lab, red, red)){.border-slate-500\/40{border-color:color-mix(in oklab, var(--color-slate-500) 40%, transparent)}}.bg-amber-500\/15{background-color:#f99c0026}@supports (color:color-mix(in lab, red, red)){.bg-amber-500\/15{background-color:color-mix(in oklab, var(--color-amber-500) 15%, transparent)}}.bg-amber-500\/20{background-color:#f99c0033}@supports (color:color-mix(in lab, red, red)){.bg-amber-500\/20{background-color:color-mix(in oklab, var(--color-amber-500) 20%, transparent)}}.bg-blue-500\/20{background-color:#3080ff33}@supports (color:color-mix(in lab, red, red)){.bg-blue-500\/20{background-color:color-mix(in oklab, var(--color-blue-500) 20%, transparent)}}.bg-blue-600\/15{background-color:#155dfc26}@supports (color:color-mix(in lab, red, red)){.bg-blue-600\/15{background-color:color-mix(in oklab, var(--color-blue-600) 15%, transparent)}}.bg-cyan-500\/20{background-color:#00b7d733}@supports (color:color-mix(in lab, red, red)){.bg-cyan-500\/20{background-color:color-mix(in oklab, var(--color-cyan-500) 20%, transparent)}}.bg-emerald-500\/15{background-color:#00bb7f26}@supports (color:color-mix(in lab, red, red)){.bg-emerald-500\/15{background-color:color-mix(in oklab, var(--color-emerald-500) 15%, transparent)}}.bg-emerald-500\/20{background-color:#00bb7f33}@supports (color:color-mix(in lab, red, red)){.bg-emerald-500\/20{background-color:color-mix(in oklab, var(--color-emerald-500) 20%, transparent)}}.bg-indigo-500\/20{background-color:#625fff33}@supports (color:color-mix(in lab, red, red)){.bg-indigo-500\/20{background-color:color-mix(in oklab, var(--color-indigo-500) 20%, transparent)}}.bg-orange-500\/20{background-color:#fe6e0033}@supports (color:color-mix(in lab, red, red)){.bg-orange-500\/20{background-color:color-mix(in oklab, var(--color-orange-500) 20%, transparent)}}.bg-pink-500\/20{background-color:#f6339a33}@supports (color:color-mix(in lab, red, red)){.bg-pink-500\/20{background-color:color-mix(in oklab, var(--color-pink-500) 20%, transparent)}}.bg-purple-500\/15{background-color:#ac4bff26}@supports (color:color-mix(in lab, red, red)){.bg-purple-500\/15{background-color:color-mix(in oklab, var(--color-purple-500) 15%, transparent)}}.bg-purple-500\/20{background-color:#ac4bff33}@supports (color:color-mix(in lab, red, red)){.bg-purple-500\/20{background-color:color-mix(in oklab, var(--color-purple-500) 20%, transparent)}}.bg-rose-500\/15{background-color:#ff235726}@supports (color:color-mix(in lab, red, red)){.bg-rose-500\/15{background-color:color-mix(in oklab, var(--color-rose-500) 15%, transparent)}}.bg-sky-500\/15{background-color:#00a5ef26}@supports (color:color-mix(in lab, red, red)){.bg-sky-500\/15{background-color:color-mix(in oklab, var(--color-sky-500) 15%, transparent)}}.bg-slate-500\/15{background-color:#62748e26}@supports (color:color-mix(in lab, red, red)){.bg-slate-500\/15{background-color:color-mix(in oklab, var(--color-slate-500) 15%, transparent)}}.bg-slate-500\/20{background-color:#62748e33}@supports (color:color-mix(in lab, red, red)){.bg-slate-500\/20{background-color:color-mix(in oklab, var(--color-slate-500) 20%, transparent)}}.bg-slate-950{background-color:var(--color-slate-950)}.px-4{padding-inline:calc(var(--spacing) * 4)}.py-8{padding-block:calc(var(--spacing) * 8)}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.text-amber-300{color:var(--color-amber-300)}.text-amber-400{color:var(--color-amber-400)}.text-blue-300{color:var(--color-blue-300)}.text-blue-400{color:var(--color-blue-400)}.text-cyan-300{color:var(--color-cyan-300)}.text-cyan-400{color:var(--color-cyan-400)}.text-emerald-300{color:var(--color-emerald-300)}.text-emerald-400{color:var(--color-emerald-400)}.text-indigo-400{color:var(--color-indigo-400)}.text-orange-300{color:var(--color-orange-300)}.text-pink-400{color:var(--color-pink-400)}.text-purple-300{color:var(--color-purple-300)}.text-purple-400{color:var(--color-purple-400)}.text-rose-300{color:var(--color-rose-300)}.text-sky-300{color:var(--color-sky-300)}.text-slate-100{color:var(--color-slate-100)}.text-slate-200{color:var(--color-slate-200)}.text-slate-300{color:var(--color-slate-300)}.text-slate-400{color:var(--color-slate-400)}.antialiased{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.outline{outline-style:var(--tw-outline-style);outline-width:1px}.filter{filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}.backdrop-filter{-webkit-backdrop-filter:var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);backdrop-filter:var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,)}.transition{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,-webkit-backdrop-filter,backdrop-filter,display,content-visibility,overlay,pointer-events;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}}:root{--canvas:#04080f;--canvas-subtle:#070d17;--canvas-surface:#0a1320;--canvas-surface-elevated:#0f1c2d;--card-bg:#0a1320a6;--card-bg-hover:#0e1a2cd1;--card-border:#ffffff12;--card-border-hover:#00e59959;--specular-line:linear-gradient(180deg, #ffffff1f 0%, #ffffff05 100%);--emerald-aurora:#00e599;--emerald-vivid:#10b981;--emerald-deep:#059669;--mint-bright:#38ef7d;--cyan-glow:#06b6d4;--teal-accent:#14b8a6;--glow-emerald:radial-gradient(circle, #00e59924 0%, #10b9810d 50%, transparent 75%);--glow-cyan:radial-gradient(circle, #06b6d41a 0%, transparent 70%);--button-aurora:linear-gradient(135deg, #00e599 0%, #10b981 50%, #059669 100%);--button-aurora-hover:linear-gradient(135deg, #38ef7d 0%, #00e599 100%);--text-main:#fff;--text-sub:#cbd5e1;--text-muted:#94a3b8;--text-dim:#64748b;--font-display:var(--font-space-grotesk), "Space Grotesk", -apple-system, BlinkMacSystemFont, sans-serif;--font-body:var(--font-geist-sans), "Geist", -apple-system, BlinkMacSystemFont, sans-serif;--font-mono:var(--font-geist-mono), monospace;--content-max:1360px;--gutter:clamp(20px, 4vw, 48px);--section-space:clamp(76px, 7.5vw, 116px)}*{box-sizing:border-box}html{scroll-behavior:smooth;background-color:var(--canvas);--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;scroll-padding-top:110px}body{background-color:var(--canvas);color:var(--text-main);font-family:var(--font-body);font-synthesis:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;margin:0;line-height:1.55;overflow-x:hidden}main{position:relative;overflow:clip}::selection{background:var(--emerald-aurora);color:#04080f}a{color:inherit;text-decoration:none;transition:all .22s cubic-bezier(.16,1,.3,1)}button{cursor:pointer;background:0 0;border:none;font-family:inherit;transition:all .22s cubic-bezier(.16,1,.3,1)}:is(a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible){outline:2px solid var(--emerald-aurora);outline-offset:3px}h1,h2,h3,h4{font-family:var(--font-display);color:var(--text-main);letter-spacing:-.035em;margin:0;font-weight:700}h1{font-size:clamp(46px,5.4vw,78px);line-height:1.02}h1 em{-webkit-text-fill-color:transparent;filter:drop-shadow(0 0 24px #00e59940);background:linear-gradient(135deg,#fff 0%,#00e599 45%,#38ef7d 100%);-webkit-background-clip:text;font-style:normal}h2{font-size:clamp(34px,4.2vw,56px);line-height:1.06}h2 em{-webkit-text-fill-color:transparent;background:linear-gradient(135deg,#fff 0%,#00e599 45%,#06b6d4 100%);-webkit-background-clip:text;font-style:normal}p{color:var(--text-sub);margin:0}.eyebrow,.section-tag{font-family:var(--font-display);letter-spacing:.12em;text-transform:uppercase;color:var(--emerald-aurora);background:#00e59914;border:1px solid #00e59938;border-radius:9999px;align-items:center;gap:8px;margin-bottom:20px;padding:6px 14px;font-size:11.5px;font-weight:700;display:inline-flex;box-shadow:0 2px 10px #00e59914}.eyebrow span{background:var(--emerald-aurora);width:7px;height:7px;box-shadow:0 0 12px var(--emerald-aurora);border-radius:50%}.section-tag.light{color:var(--emerald-aurora);background:#00e5991a;border-color:#00e5994d}.button{font-family:var(--font-display);white-space:nowrap;border-radius:9999px;justify-content:center;align-items:center;gap:8px;padding:13px 26px;font-size:15px;font-weight:600;text-decoration:none;transition:all .25s cubic-bezier(.16,1,.3,1);display:inline-flex}.button-lime{background:var(--button-aurora);color:#03070d;font-weight:700;box-shadow:0 4px 24px #00e59959,inset 0 1px #fff6}.button-lime:hover{background:var(--button-aurora-hover);transform:translateY(-2px);box-shadow:0 8px 32px #00e5998c,inset 0 1px #fff9}.button-glass{color:var(--text-main);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#ffffff0a;border:1px solid #ffffff1f}.button-glass:hover{color:#fff;background:#ffffff17;border-color:#00e59966;transform:translateY(-2px);box-shadow:0 4px 20px #00e59926}.button-dark{color:var(--text-main);background:#091320;border:1px solid #ffffff1a}.button-dark:hover{border-color:var(--emerald-aurora);color:#fff;background:#112238;box-shadow:0 4px 20px #00e59933}.button-outline{color:var(--text-main);border:1px solid #ffffff29}.button-outline:hover{border-color:var(--emerald-aurora);color:var(--emerald-aurora);background:#00e59914}.button-header-cta{color:var(--emerald-aurora);background:#00e5991a;border:1px solid #00e5994d;padding:9px 20px;font-size:14px;box-shadow:0 2px 12px #00e5991a}.button-header-cta:hover{background:var(--emerald-aurora);color:#03070d;border-color:var(--emerald-aurora);box-shadow:0 0 20px #00e59973}.btn-icon{vertical-align:middle;flex-shrink:0;transition:transform .22s cubic-bezier(.16,1,.3,1);display:inline-block}.btn-icon-right{transition:transform .22s cubic-bezier(.16,1,.3,1)}a:hover .btn-icon-right,button:hover .btn-icon-right,.button:hover .btn-icon-right{transform:translate(4px)}.btn-icon-up-right{transition:transform .22s cubic-bezier(.16,1,.3,1)}a:hover .btn-icon-up-right,button:hover .btn-icon-up-right,.button:hover .btn-icon-up-right,.service-card:hover .btn-icon-up-right,.showcase-action-btn:hover .btn-icon-up-right,.card-link-subtle:hover .btn-icon-up-right{transform:translate(3px,-3px)}.btn-icon-left{transition:transform .22s cubic-bezier(.16,1,.3,1)}button:hover .btn-icon-left,.button:hover .btn-icon-left{transform:translate(-4px)}.pipeline-dot{background:var(--emerald-aurora);width:5px;height:5px;box-shadow:0 0 8px var(--emerald-aurora);border-radius:50%;display:inline-block}.announcement-ribbon{padding:8px var(--gutter);background:#050a12f2;border-bottom:1px solid #ffffff0f;font-size:13px}.announcement-inner{max-width:var(--content-max);flex-wrap:wrap;justify-content:center;align-items:center;gap:12px;margin:0 auto;display:flex}.announcement-badge{font-family:var(--font-display);color:var(--emerald-aurora);letter-spacing:.06em;background:#00e59926;border:1px solid #00e5994d;border-radius:6px;padding:2px 8px;font-size:11px;font-weight:700}.announcement-text{color:var(--text-sub);margin:0}.announcement-link{font-family:var(--font-display);color:var(--emerald-aurora);align-items:center;gap:4px;font-weight:600;display:inline-flex}.announcement-link:hover{color:#fff;text-decoration:underline}.site-header{z-index:100;-webkit-backdrop-filter:blur(20px);padding:10px var(--gutter);background:#04080fd1;border-bottom:1px solid #ffffff12;transition:all .3s;position:sticky;top:0}.header-inner{max-width:var(--content-max);justify-content:space-between;align-items:center;gap:24px;margin:0 auto;display:flex}.brand{align-items:center;text-decoration:none;display:inline-flex}.brand-logo-img{object-fit:contain;filter:drop-shadow(0 2px 12px #00000047);width:auto;max-width:285px;height:66px;transition:transform .25s cubic-bezier(.16,1,.3,1),filter .25s;display:block}.brand:hover .brand-logo-img{filter:drop-shadow(0 4px 18px #00e59959);transform:scale(1.03)}.footer-logo{max-width:330px;height:78px}.site-nav{align-items:center;gap:28px;display:flex}.nav-item{font-family:var(--font-display);color:var(--text-sub);padding:6px 0;font-size:15px;font-weight:500;position:relative}.nav-item:hover{color:var(--text-main)}.nav-item:after{content:"";background:var(--emerald-aurora);width:0%;height:2px;box-shadow:0 0 8px var(--emerald-aurora);transition:width .25s;position:absolute;bottom:0;left:0}.nav-item:hover:after{width:100%}.hero{padding:clamp(52px, 6.5vw, 96px) var(--gutter) clamp(52px, 6.5vw, 80px);max-width:var(--content-max);grid-template-columns:1.05fr 1fr;align-items:center;gap:clamp(32px,5vw,64px);margin:0 auto;display:grid;position:relative}.hero-glow-mesh{filter:blur(90px);pointer-events:none;z-index:0;background:radial-gradient(circle,#00e59926 0%,#06b6d414 45%,#0000 70%);width:700px;height:700px;position:absolute;top:-180px;left:25%}.hero-kicker-wrap{-webkit-backdrop-filter:blur(12px);background:#ffffff0a;border:1px solid #ffffff14;border-radius:999px;flex-wrap:wrap;align-items:center;gap:8px;width:fit-content;margin-bottom:20px;padding:5px 12px;display:inline-flex}.hero-kicker-badge{font-family:var(--font-display);letter-spacing:.08em;color:var(--lime);font-size:11px;font-weight:700}.hero-kicker-divider{color:#fff3;font-size:12px;font-weight:300}.hero-kicker-sub{font-family:var(--font-display);letter-spacing:.06em;color:var(--text-dim);font-size:10.5px;font-weight:600}.hero-copy{z-index:1;position:relative}.hero-lead{color:var(--text-sub);max-width:580px;margin:24px 0 36px;font-size:clamp(17px,1.8vw,20px);line-height:1.6}.hero-actions{flex-wrap:wrap;align-items:center;gap:16px;display:flex}.hero-visual-container{z-index:1;position:relative}.hero-showcase-wrapper{flex-direction:column;gap:16px;display:flex}.showcase-tabs-container{scrollbar-width:none;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);background:#ffffff0a;border:1px solid #ffffff14;border-radius:9999px;gap:4px;padding:5px;display:flex;overflow-x:auto;box-shadow:inset 0 1px #ffffff14}.showcase-tabs-container::-webkit-scrollbar{display:none}.showcase-tab-btn{font-family:var(--font-display);color:var(--text-sub);white-space:nowrap;border-radius:9999px;padding:8px 16px;font-size:13px;font-weight:500;transition:all .2s}.showcase-tab-btn:hover{color:var(--text-main);background:#ffffff0f}.showcase-tab-btn.active{color:#04080f;background:#fff;font-weight:700;box-shadow:0 4px 18px #00000073}.showcase-card-display{background:var(--card-bg);border:1px solid var(--card-border);-webkit-backdrop-filter:blur(24px);border-radius:24px;padding:clamp(24px,3vw,36px);transition:all .3s;position:relative;overflow:hidden;box-shadow:0 24px 54px #00000080,inset 0 1px #ffffff1f}.showcase-card-glow{pointer-events:none;background:radial-gradient(circle,#00e59929 0%,#0000 70%);width:300px;height:300px;position:absolute;top:0;right:0}.showcase-card-inner{z-index:1;position:relative}.showcase-badge-row{justify-content:space-between;align-items:center;margin-bottom:14px;display:flex}.showcase-pill-kicker{font-family:var(--font-display);letter-spacing:.14em;text-transform:uppercase;color:var(--emerald-aurora);font-size:11px;font-weight:700}.showcase-status-badge{font-family:var(--font-display);color:var(--text-sub);background:#ffffff0d;border:1px solid #ffffff14;border-radius:9999px;align-items:center;gap:6px;padding:3px 10px;font-size:11px;font-weight:600;display:inline-flex}.pulse-dot{background:var(--emerald-aurora);width:6px;height:6px;box-shadow:0 0 10px var(--emerald-aurora);border-radius:50%;animation:2s infinite pulse}@keyframes pulse{50%{opacity:.5}}.showcase-title{margin-bottom:8px;font-size:clamp(22px,2.4vw,28px)}.showcase-sub{color:var(--text-muted);margin-bottom:24px;font-size:15px;line-height:1.55}.showcase-body-grid{border-top:1px solid #ffffff14;grid-template-columns:1fr auto;align-items:center;gap:24px;padding-top:24px;display:grid}.showcase-feature-list{flex-direction:column;gap:10px;margin:0 0 20px;padding:0;list-style:none;display:flex}.showcase-feature-list li{color:var(--text-sub);align-items:flex-start;gap:10px;font-size:14px;display:flex}.check-icon{color:var(--emerald-aurora);background:#00e5991f;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:18px;height:18px;font-size:13px;font-weight:700;display:flex}.showcase-tags-strip{flex-wrap:wrap;gap:8px;display:flex}.showcase-tag{font-family:var(--font-display);color:var(--text-muted);background:#ffffff0a;border:1px solid #ffffff12;border-radius:6px;padding:3px 10px;font-size:12px;font-weight:500}.showcase-metric-box{text-align:right;flex-direction:column;align-items:flex-end;gap:16px;display:flex}.metric-highlight{text-align:center;background:#00e5990f;border:1px solid #00e59938;border-radius:16px;min-width:140px;padding:16px 20px;box-shadow:0 4px 16px #00e59914}.metric-num{font-family:var(--font-display);color:var(--emerald-aurora);font-size:32px;font-weight:800;line-height:1;display:block}.metric-sub{font-family:var(--font-display);text-transform:uppercase;letter-spacing:.06em;color:var(--text-sub);margin-top:4px;font-size:11px;font-weight:600;display:block}.showcase-action-btn{font-family:var(--font-display);color:var(--emerald-aurora);white-space:nowrap;background:#ffffff0d;border:1px solid #ffffff1a;border-radius:9999px;align-items:center;gap:6px;padding:8px 16px;font-size:13px;font-weight:600;display:inline-flex}.showcase-action-btn:hover{background:var(--emerald-aurora);color:#03070d;box-shadow:0 0 16px #00e59959}.signal-strip{background:linear-gradient(#060b14f2 0%,#08101ce6 100%);border-top:1px solid #ffffff14;border-bottom:1px solid #ffffff14;padding:14px 0;position:relative;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,#0000,#000 5% 95%,#0000);mask-image:linear-gradient(90deg,#0000,#000 5% 95%,#0000)}.signal-strip:before{content:"";z-index:2;background:linear-gradient(90deg,#0000,#38bdf8f2,#0066ffe6,#0000);width:30%;height:1.5px;animation:4.5s ease-in-out infinite signalLaserTop;position:absolute;top:0;left:0}.signal-strip:after{content:"";z-index:2;background:linear-gradient(90deg,#0000,#0066ffe6,#38bdf8f2,#0000);width:30%;height:1.5px;animation:4.5s ease-in-out 2.25s infinite signalLaserBottom;position:absolute;bottom:0;right:0}@keyframes signalLaserTop{0%{transform:translate(-120%)}to{transform:translate(450%)}}@keyframes signalLaserBottom{0%{transform:translate(120%)}to{transform:translate(-450%)}}.signal-track{will-change:transform;align-items:center;gap:20px;width:max-content;animation:30s linear infinite signalStreamFlow;display:flex}.signal-strip:hover .signal-track{animation-play-state:paused}@keyframes signalStreamFlow{0%{transform:translate(0)}to{transform:translate(-50%)}}.signal-item{font-family:var(--font-display);letter-spacing:.1em;color:var(--text-muted);white-space:nowrap;will-change:transform;background:#0d1626bf;border:1px solid #ffffff14;border-radius:999px;align-items:center;gap:10px;padding:8px 14px 8px 16px;font-size:11px;font-weight:700;text-decoration:none;transition:all .28s cubic-bezier(.16,1,.3,1);animation:3.8s ease-in-out infinite signalPillFloat;display:inline-flex;box-shadow:0 2px 10px #00000040,inset 0 1px #ffffff0a}.signal-item:nth-child(2n){animation-delay:-1.9s}.signal-item:nth-child(3n){animation-delay:-.9s}@keyframes signalPillFloat{0%,to{transform:translateY(0)}50%{transform:translateY(-3px)}}.signal-item:hover{color:#fff;background:#0e1e38f2;border-color:#38bdf88c;animation-play-state:paused;transform:translateY(-4px)scale(1.02);box-shadow:0 8px 24px #0066ff4d,0 0 14px #38bdf840}.signal-num{color:var(--lime);letter-spacing:.05em;font-size:10px;font-weight:800}.signal-slash{color:#fff3;font-weight:400}.signal-label{letter-spacing:.08em}.signal-arrow-box{color:#38bdf8;background:linear-gradient(135deg,#0e74f438 0%,#00a3ff1f 100%);border:1px solid #38bdf861;border-radius:6px;flex-shrink:0;justify-content:center;align-items:center;width:22px;height:22px;margin-left:2px;transition:all .25s cubic-bezier(.16,1,.3,1);animation:3s ease-in-out infinite blueBoxPulse;display:inline-flex;box-shadow:0 0 8px #008cff40,inset 0 1px #ffffff1f}.signal-arrow-box svg{width:10px;height:10px;transition:transform .25s cubic-bezier(.16,1,.3,1),stroke .25s}@keyframes blueBoxPulse{0%,to{border-color:#38bdf861;box-shadow:0 0 6px #008cff40}50%{border-color:#7dd3fca6;box-shadow:0 0 12px #38bdf88c,inset 0 0 6px #00a3ff40}}.signal-item:hover .signal-arrow-box{color:#fff;background:linear-gradient(135deg,#0284c7 0%,#2563eb 100%);border-color:#7dd3fc;transform:scale(1.08);box-shadow:0 0 16px #38bdf8bf,0 2px 8px #0066ff80}.signal-item:hover .signal-arrow-box svg{stroke:#fff;transform:translate(1.5px,-1.5px)}.signal-arrow{color:var(--text-dim);font-size:11px;transition:transform .2s,color .2s}.client-logos{padding:48px var(--gutter) 40px;text-align:center;max-width:var(--content-max);margin:0 auto}.logo-strip-head{font-family:var(--font-display);letter-spacing:.14em;color:var(--text-dim);justify-content:center;align-items:center;gap:12px;margin-bottom:24px;font-size:11px;font-weight:700;display:flex}.logo-strip-head span{background:#ffffff0f;border-radius:4px;padding:2px 8px}.logo-marquee{position:relative;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,#0000,#000 15% 85%,#0000);mask-image:linear-gradient(90deg,#0000,#000 15% 85%,#0000)}.logo-track{align-items:center;gap:48px;width:max-content;animation:35s linear infinite marquee;display:flex}@keyframes marquee{0%{transform:translate(0)}to{transform:translate(-50%)}}.placeholder-logo{opacity:.55;filter:grayscale();align-items:center;gap:10px;transition:all .2s;display:flex}.placeholder-logo:hover{opacity:.9;filter:grayscale(0)}.placeholder-logo img{object-fit:contain;width:22px;height:22px}.placeholder-logo span{font-family:var(--font-display);color:var(--text-muted);font-size:14px;font-weight:600}.client-logos small{color:var(--text-dim);margin-top:18px;font-size:12px;display:block}.intro{padding:var(--section-space) var(--gutter);max-width:var(--content-max);grid-template-columns:240px 1fr;gap:clamp(24px,4vw,64px);margin:0 auto;display:grid}.intro h2{max-width:800px;margin-bottom:24px}.intro p{max-width:760px;color:var(--text-sub);font-size:clamp(17px,1.8vw,20px);line-height:1.6}.services{padding:0 var(--gutter) var(--section-space);max-width:var(--content-max);margin:0 auto}.section-head{flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:20px;margin-bottom:40px;display:flex}.section-counter-badge{font-family:var(--font-display);letter-spacing:.12em;color:var(--text-muted);background:#ffffff0d;border:1px solid #ffffff14;border-radius:9999px;padding:6px 14px;font-size:12px;font-weight:700}.service-grid{grid-template-columns:repeat(4,1fr);gap:20px;display:grid}.service-card{background:var(--card-bg);border:1px solid var(--card-border);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border-radius:20px;flex-direction:column;justify-content:space-between;padding:32px 24px;transition:all .25s cubic-bezier(.16,1,.3,1);display:flex;position:relative;box-shadow:inset 0 1px #ffffff14}.service-card:hover{background:var(--card-bg-hover);border-color:var(--card-border-hover);transform:translateY(-4px);box-shadow:0 18px 40px #0006,0 0 20px #00e5991f}.service-card.featured{background:linear-gradient(#00e5991a 0%,#0a1320e0 100%);border-color:#00e59959;box-shadow:0 16px 36px #00000059,inset 0 1px #00e5994d}.service-num{font-family:var(--font-display);color:var(--emerald-aurora);margin-bottom:20px;font-size:13px;font-weight:700}.service-card h3{margin-bottom:14px;font-size:22px;line-height:1.2}.service-card p{color:var(--text-sub);flex-grow:1;margin-bottom:28px;font-size:14px;line-height:1.55}.service-card-link{font-family:var(--font-display);color:var(--emerald-aurora);align-items:center;gap:6px;font-size:13px;font-weight:600;display:inline-flex}.service-card:hover .service-card-link{color:#fff}.section-interactive-use-cases{padding:var(--section-space) var(--gutter);max-width:var(--content-max);margin:0 auto}.section-head-center{text-align:center;max-width:760px;margin:0 auto 40px}.section-pill-tag{font-family:var(--font-display);letter-spacing:.14em;text-transform:uppercase;color:var(--emerald-aurora);background:#00e5991a;border:1px solid #00e59940;border-radius:9999px;margin-bottom:16px;padding:5px 14px;font-size:11px;font-weight:700;display:inline-block}.section-title-large{margin-bottom:16px;font-size:clamp(32px,3.8vw,48px)}.section-sub-lead{color:var(--text-sub);font-size:17px}.use-case-tabs-bar{justify-content:center;gap:8px;margin-bottom:36px;padding-bottom:8px;display:flex;overflow-x:auto}.use-case-tab-btn{font-family:var(--font-display);color:var(--text-sub);white-space:nowrap;background:#ffffff0a;border:1px solid #ffffff14;border-radius:9999px;padding:10px 22px;font-size:14px;font-weight:600}.use-case-tab-btn:hover{color:var(--text-main);background:#ffffff14}.use-case-tab-btn.active{color:#04080f;background:#fff;border-color:#fff;box-shadow:0 4px 18px #0006}.use-cases-cards-grid{grid-template-columns:repeat(3,1fr);gap:24px;display:grid}.use-case-glass-card{background:var(--card-bg);border:1px solid var(--card-border);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-radius:20px;flex-direction:column;padding:28px;transition:all .25s cubic-bezier(.16,1,.3,1);display:flex;box-shadow:inset 0 1px #ffffff14}.use-case-glass-card:hover{background:var(--card-bg-hover);border-color:var(--card-border-hover);transform:translateY(-4px);box-shadow:0 18px 36px #0006,0 0 20px #00e5991f}.card-top-row{justify-content:space-between;align-items:center;margin-bottom:18px;display:flex}.card-icon-bubble{background:#ffffff0d;border:1px solid #ffffff14;border-radius:12px;justify-content:center;align-items:center;width:44px;height:44px;font-size:22px;display:flex}.card-stat-pill{font-family:var(--font-display);color:var(--emerald-aurora);letter-spacing:.04em;background:#00e5991a;border:1px solid #00e59940;border-radius:9999px;padding:3px 10px;font-size:11px;font-weight:700}.card-item-title{margin-bottom:10px;font-size:20px;line-height:1.3}.card-item-desc{color:var(--text-sub);flex-grow:1;margin-bottom:24px;font-size:14px;line-height:1.6}.card-footer-action{border-top:1px solid #ffffff0f;padding-top:16px}.card-link-subtle{font-family:var(--font-display);color:var(--emerald-aurora);align-items:center;gap:4px;font-size:13px;font-weight:600;display:inline-flex}.card-link-subtle:hover{color:#fff}.security-section{padding:var(--section-space) var(--gutter);max-width:var(--content-max);border-top:1px solid #ffffff0f;margin:0 auto}.security-grid{grid-template-columns:repeat(4,1fr);gap:20px;display:grid}.security-card{-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);background:#08101a99;border:1px solid #ffffff12;border-radius:20px;padding:28px;transition:all .25s;box-shadow:inset 0 1px #ffffff0f}.security-card:hover{background:#0c1826c7;border-color:#00e59959;transform:translateY(-3px);box-shadow:0 12px 30px #00000059,0 0 16px #00e5991a}.sec-icon-circle{background:#00e59914;border:1px solid #00e59938;border-radius:12px;justify-content:center;align-items:center;width:48px;height:48px;margin-bottom:16px;font-size:26px;display:flex}.security-card h3{margin-bottom:10px;font-size:18px}.security-card p{color:var(--text-sub);font-size:13.5px;line-height:1.55}.home-case{margin:0 auto var(--section-space);max-width:var(--content-max);padding:clamp(36px, 5vw, 64px) var(--gutter);background:linear-gradient(135deg,#0c1a2aeb 0%,#060d16f5 100%);border:1px solid #00e5994d;border-radius:28px;grid-template-columns:1fr 1fr;align-items:center;gap:clamp(32px,4vw,64px);display:grid;position:relative;overflow:hidden;box-shadow:0 24px 60px #00000080,inset 0 1px #ffffff1f}.case-badge-pill{font-family:var(--font-display);letter-spacing:.1em;color:var(--emerald-aurora);background:#00e5991f;border:1px solid #00e5994d;border-radius:9999px;margin-top:16px;padding:4px 12px;font-size:11px;font-weight:700;display:inline-block}.case-stage-indicators,.case-flow,.outcome-strip{font-family:var(--font-display);flex-wrap:wrap;align-items:center;gap:10px;margin:20px 0 28px;font-size:12px;font-weight:700;display:flex}.case-stage-indicators span:not(.pipeline-dot),.case-flow b,.outcome-strip span:not(.pipeline-dot){color:#fff;letter-spacing:.04em;background:#ffffff0d;border:1px solid #ffffff17;border-radius:8px;padding:5px 12px}.home-case-actions{flex-wrap:wrap;gap:14px;display:flex}.proof-section{padding:0 var(--gutter) var(--section-space);max-width:var(--content-max);margin:0 auto}.proof-intro{margin-bottom:36px}.proof-intro p{max-width:600px;margin-top:12px;font-size:18px}.proof-grid{grid-template-columns:repeat(4,1fr);gap:20px;display:grid}.proof-card{background:var(--card-bg);border:1px solid var(--card-border);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border-radius:20px;padding:28px;box-shadow:inset 0 1px #ffffff14}.proof-card strong{font-family:var(--font-display);color:var(--emerald-aurora);margin-bottom:8px;font-size:32px;font-weight:800;line-height:1;display:block}.proof-card span{font-family:var(--font-display);color:#fff;margin-bottom:8px;font-size:16px;font-weight:700;display:block}.proof-card p{color:var(--text-sub);font-size:13.5px;line-height:1.5}.process{padding:0 var(--gutter) var(--section-space);max-width:var(--content-max);margin:0 auto}.process h2{margin-bottom:40px}.process-grid{grid-template-columns:repeat(4,1fr);gap:20px;display:grid}.process-step{-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);background:#08101a99;border:1px solid #ffffff12;border-radius:20px;padding:28px;box-shadow:inset 0 1px #ffffff0f}.step-num{font-family:var(--font-display);color:var(--emerald-aurora);margin-bottom:12px;font-size:12px;font-weight:800;display:block}.process-step h3{margin-bottom:8px;font-size:20px}.process-step p{color:var(--text-sub);font-size:14px;line-height:1.5}.page-hero{padding:clamp(60px, 8vw, 100px) var(--gutter) 48px;max-width:var(--content-max);margin:0 auto}.page-hero h1{margin-bottom:18px}.page-hero p{color:var(--text-sub);max-width:720px;font-size:clamp(18px,2vw,22px);line-height:1.5}.detail-grid{padding:0 var(--gutter) var(--section-space);max-width:var(--content-max);grid-template-columns:repeat(2,1fr);gap:24px;margin:0 auto;display:grid}.detail-grid article{background:var(--card-bg);border:1px solid var(--card-border);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-radius:24px;flex-direction:column;padding:clamp(28px,4vw,40px);display:flex;box-shadow:inset 0 1px #ffffff14}.detail-featured{background:linear-gradient(#00e5991a 0%,#0a1320d9 100%)!important;border-color:#00e59959!important;box-shadow:0 16px 36px #00000059,inset 0 1px #00e5994d!important}.detail-grid span{font-family:var(--font-display);color:var(--emerald-aurora);margin-bottom:14px;font-size:13px;font-weight:700}.detail-grid h2{margin-bottom:12px;font-size:26px}.detail-grid ul{flex-direction:column;gap:10px;margin:20px 0 28px;padding:0;list-style:none;display:flex}.detail-grid li{color:var(--text-sub);padding-left:16px;font-size:14px;position:relative}.detail-grid li:before{content:"•";color:var(--emerald-aurora);position:absolute;left:0}.rich-section{padding:0 var(--gutter) var(--section-space);max-width:var(--content-max);margin:0 auto}.rich-head{margin-bottom:36px}.rich-list{grid-template-columns:repeat(2,1fr);gap:24px;display:grid}.rich-list article{background:var(--card-bg);border:1px solid var(--card-border);border-radius:20px;padding:28px;box-shadow:inset 0 1px #ffffff14}.rich-list span{font-family:var(--font-display);color:var(--emerald-aurora);margin-bottom:8px;font-size:12px;font-weight:700;display:block}.rich-list h3{margin-bottom:10px;font-size:20px}.rich-list small{font-family:var(--font-display);color:var(--text-muted);margin-top:14px;font-size:12px;font-weight:600;display:block}.platform-page{padding:0 var(--gutter) var(--section-space);max-width:var(--content-max);grid-template-columns:1fr 1fr;align-items:center;gap:48px;margin:0 auto;display:grid}.stack-diagram{background:var(--card-bg);border:1px solid var(--card-border);border-radius:24px;flex-direction:column;gap:12px;padding:28px;display:flex;box-shadow:inset 0 1px #ffffff14}.stack-title{font-family:var(--font-display);color:var(--emerald-aurora);justify-content:space-between;margin-bottom:8px;font-size:12px;font-weight:700;display:flex}.layer{background:#ffffff0a;border:1px solid #ffffff14;border-radius:12px;justify-content:space-between;align-items:center;padding:16px 20px;display:flex}.layer span{font-family:var(--font-display);color:var(--text-muted);font-size:12px;font-weight:700}.layer b{font-family:var(--font-display);color:#fff;font-size:14px}.metric-list div{background:#ffffff08;border:1px solid #ffffff0f;border-radius:14px;padding:16px}.metric-list b{font-family:var(--font-display);color:var(--emerald-aurora);font-size:18px;display:block}.assurance{padding:0 var(--gutter) var(--section-space);max-width:var(--content-max);grid-template-columns:repeat(4,1fr);gap:20px;margin:0 auto;display:grid}.assurance span{color:var(--text-sub);font-size:13px}.about-page{padding:0 var(--gutter) 48px;max-width:var(--content-max);grid-template-columns:1fr 1fr;gap:48px;margin:0 auto;display:grid}.about-copy p{margin-bottom:20px;font-size:17px;line-height:1.65}.principles{padding:0 var(--gutter) var(--section-space);max-width:var(--content-max);grid-template-columns:repeat(3,1fr);gap:24px;margin:0 auto;display:grid}.principles article{background:var(--card-bg);border:1px solid var(--card-border);border-radius:20px;padding:32px 24px}.principles span{font-family:var(--font-display);color:var(--emerald-aurora);margin-bottom:12px;font-size:13px;font-weight:700;display:block}.principles h3{margin-bottom:10px;font-size:20px}.principles p{color:var(--text-sub);font-size:14px;line-height:1.55}.beliefs{padding:0 var(--gutter) var(--section-space);max-width:var(--content-max);text-align:center;margin:0 auto}.beliefs blockquote{font-family:var(--font-display);color:#fff;max-width:900px;margin:0 auto 36px;font-size:clamp(22px,3vw,36px);font-weight:600;line-height:1.35}.beliefs span{font-family:var(--font-display);color:var(--emerald-aurora);background:#00e59914;border:1px solid #00e59938;border-radius:9999px;padding:8px 18px;font-size:13px;font-weight:600}.project-start{padding:0 var(--gutter) var(--section-space);max-width:var(--content-max);grid-template-columns:1fr 1.3fr;gap:clamp(32px,5vw,64px);margin:0 auto;display:grid}.project-start-intro h2{margin-bottom:16px;font-size:clamp(36px,4vw,54px)}.project-start-intro p{margin-bottom:24px;font-size:17px;line-height:1.6}.project-start-intro div span{font-family:var(--font-display);color:var(--text-sub);margin-bottom:8px;font-size:14px;font-weight:600;display:block}.direct-contact-card{-webkit-backdrop-filter:blur(16px);background:#08101cbf;border:1px solid #ffffff17;border-radius:20px;margin-top:32px;padding:20px;box-shadow:0 16px 36px #00000059,inset 0 1px #ffffff14}.direct-card-head{border-bottom:1px solid #ffffff0f;justify-content:space-between;align-items:center;margin-bottom:16px;padding-bottom:12px;display:flex}.direct-kicker{font-family:var(--font-display);letter-spacing:.14em;text-transform:uppercase;color:var(--emerald-aurora);font-size:11px;font-weight:700}.direct-status-live{font-family:var(--font-display);letter-spacing:.1em;color:#c8f8ec;background:#00e5991f;border:1px solid #00e59940;border-radius:9999px;align-items:center;gap:6px;padding:3px 8px;font-size:10px;font-weight:700;display:inline-flex}.direct-rows{flex-direction:column;gap:10px;display:flex}.direct-row-btn{background:#ffffff08;border:1px solid #ffffff0f;border-radius:12px;justify-content:space-between;align-items:center;padding:10px 14px;text-decoration:none;transition:all .22s cubic-bezier(.16,1,.3,1);display:flex}.direct-row-btn .btn-label-group{flex-direction:column;gap:2px;display:flex}.direct-row-btn small{font-family:var(--font-display);letter-spacing:.1em;color:var(--text-dim);font-size:10px;font-weight:700}.direct-row-btn strong,.direct-row-btn span{font-family:var(--font-display);color:var(--text-main);font-size:14px}.direct-row-btn.hotline{background:#00e5990f;border-color:#00e59933}.direct-row-btn.hotline strong{color:var(--emerald-aurora)}.direct-row-btn.whatsapp{background:#25d36614;border-color:#25d36640}.direct-row-btn.whatsapp span{color:#25d366;font-weight:700}.direct-row-btn:hover{background:#ffffff17;border-color:#00e59966;transform:translate(3px)}.direct-row-btn:hover .btn-label-group small{color:#ffffffbf}.direct-row-btn:hover .btn-label-group span,.direct-row-btn:hover .btn-label-group strong{color:#fff!important}.direct-row-btn.whatsapp:hover{background:#25d36629!important;border-color:#25d36680!important}.direct-row-btn.whatsapp:hover .btn-label-group small{color:#a7f3d0!important}.direct-row-btn.whatsapp:hover .btn-label-group span{text-shadow:0 0 12px #25d36666;color:#fff!important}.direct-row-btn.whatsapp:hover svg{color:#25d366!important}.direct-row-info{font-family:var(--font-display);color:var(--text-muted);background:#ffffff05;border:1px solid #ffffff0a;border-radius:10px;justify-content:space-between;align-items:center;padding:8px 14px;font-size:13px;display:flex}.direct-row-info small{letter-spacing:.1em;color:var(--text-dim);font-size:10px;font-weight:700}.direct-card-footer{text-align:center;border-top:1px solid #ffffff0f;margin-top:14px;padding-top:12px}.jump-to-maps-link{font-family:var(--font-display);color:var(--emerald-aurora);align-items:center;gap:6px;font-size:12px;font-weight:600;text-decoration:none;transition:color .2s;display:inline-flex}.jump-to-maps-link:hover{color:#fff;text-decoration:underline}.global-offices-section{max-width:var(--content-max);padding:0 var(--gutter);margin:80px auto 100px;scroll-margin-top:110px}.offices-grid{grid-template-columns:repeat(auto-fit,minmax(380px,1fr));gap:32px;margin-top:48px;display:grid}@media (max-width:768px){.offices-grid{grid-template-columns:1fr}}.office-glass-card{background:var(--card-bg);border:1px solid var(--card-border);-webkit-backdrop-filter:blur(24px);border-radius:28px;flex-direction:column;transition:all .3s;display:flex;overflow:hidden;box-shadow:0 20px 48px #0006,inset 0 1px #ffffff1a}.office-glass-card:hover{border-color:#00e59959;transform:translateY(-4px);box-shadow:0 24px 60px #00000080,inset 0 1px #ffffff2e}.office-card-header{background:#ffffff05;border-bottom:1px solid #ffffff0f;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;padding:24px 28px 20px;display:flex}.office-location-tag{align-items:center;gap:14px;display:flex}.country-flag-badge{width:38px;height:38px;font-family:var(--font-display);letter-spacing:.06em;border-radius:12px;flex-shrink:0;justify-content:center;align-items:center;font-size:13px;font-weight:800;display:inline-flex;box-shadow:0 4px 14px #00000059}.country-flag-badge.lk{color:#04080e;background:linear-gradient(135deg,#00e599,#096);border:1px solid #00e59966}.country-flag-badge.ae{color:#fff;background:linear-gradient(135deg,#00d2ff,#0077b6);border:1px solid #00d2ff66}.office-hub-badge{font-family:var(--font-display);letter-spacing:.14em;color:var(--emerald-aurora);text-transform:uppercase;font-size:11px;font-weight:700;display:block}.office-role-badge{font-family:var(--font-display);color:var(--text-dim);text-transform:uppercase;font-size:12px;font-weight:600;display:block}.office-tz-pill{font-family:var(--font-display);color:var(--text-muted);background:#ffffff0a;border:1px solid #ffffff12;border-radius:9999px;padding:4px 10px;font-size:11px;font-weight:600}.office-body{flex-direction:column;flex-grow:1;padding:28px;display:flex}.office-title{font-family:var(--font-display);color:#fff;margin-bottom:8px;font-size:22px;font-weight:700}.office-address-text{color:var(--text-sub);min-height:44px;margin-bottom:24px;font-size:14px;line-height:1.55}.office-channels-list{grid-template-columns:1fr 1fr;gap:12px;margin-bottom:24px;display:grid}@media (max-width:480px){.office-channels-list{grid-template-columns:1fr}}.office-channel-item{background:#ffffff08;border:1px solid #ffffff0f;border-radius:12px;align-items:center;gap:10px;padding:10px 14px;text-decoration:none;transition:all .2s;display:flex}.office-channel-item:not(.plain):hover{background:#00e59914;border-color:#00e5994d}.office-channel-item .channel-icon{flex-shrink:0;font-size:18px}.office-channel-item div{flex-direction:column;display:flex}.office-channel-item small{font-family:var(--font-display);letter-spacing:.1em;color:var(--text-dim);text-transform:uppercase;font-size:9px;font-weight:700}.office-channel-item strong{font-family:var(--font-display);color:var(--emerald-aurora);font-size:13px;font-weight:700}.office-channel-item span{font-family:var(--font-display);color:var(--text-main);font-size:13px;font-weight:500}.map-card-container{background:#020509;border:1px solid #ffffff17;border-radius:18px;margin-top:auto;overflow:hidden}.map-iframe-wrapper{width:100%;height:220px;position:relative;overflow:hidden}.map-iframe{-webkit-filter:invert(90%)hue-rotate(180deg)brightness(85%)contrast(110%);pointer-events:auto;border:0;width:100%;height:100%}.map-pin-overlay{pointer-events:none;z-index:10;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.map-pin-bubble{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#040a12eb;border:1px solid #00e59980;border-radius:9999px;align-items:center;gap:10px;padding:8px 14px;display:flex;box-shadow:0 8px 24px #000000b3,0 0 20px #00e5994d}.pin-beacon{background:var(--emerald-aurora);width:10px;height:10px;box-shadow:0 0 12px var(--emerald-aurora);border-radius:50%;flex-shrink:0;animation:1.8s infinite pulse}.pin-beacon.cyan-beacon{background:#00d2ff;box-shadow:0 0 12px #00d2ff}.pin-text{flex-direction:column;display:flex}.pin-text strong{font-family:var(--font-display);color:#fff;font-size:12px;font-weight:700}.pin-text small{color:var(--text-dim);font-size:10px}.map-action-bar{background:#080e18f2;border-top:1px solid #ffffff0f;justify-content:space-between;align-items:center;padding:12px 18px;display:flex}.map-coord-tag{font-family:var(--font-mono,monospace);color:var(--text-dim);font-size:11px}.map-nav-btn{font-family:var(--font-display);color:var(--emerald-aurora);align-items:center;gap:6px;font-size:12px;font-weight:600;text-decoration:none;transition:color .2s;display:inline-flex}.map-nav-btn:hover{color:#fff;text-decoration:underline}.project-wizard{background:var(--card-bg);border:1px solid var(--card-border);-webkit-backdrop-filter:blur(24px);border-radius:28px;padding:clamp(24px,4vw,44px);box-shadow:0 24px 54px #00000073,inset 0 1px #ffffff1f}.wizard-top{margin-bottom:28px}.wizard-top>div:first-child{justify-content:space-between;align-items:center;margin-bottom:12px;display:flex}.wizard-top span{font-family:var(--font-display);letter-spacing:.12em;color:var(--emerald-aurora);font-size:11px;font-weight:700}.wizard-top b{font-family:var(--font-display);color:var(--text-sub);font-size:13px;font-weight:700}.wizard-progress{background:#ffffff14;border-radius:9999px;width:100%;height:4px;overflow:hidden}.wizard-progress i{background:linear-gradient(90deg,#00e599,#10b981,#06b6d4);border-radius:9999px;height:100%;transition:width .3s cubic-bezier(.16,1,.3,1);display:block;box-shadow:0 0 10px #00e59980}.wizard-stage fieldset{border:none;margin:0;padding:0}.wizard-stage legend{font-family:var(--font-display);color:#fff;margin-bottom:8px;font-size:clamp(22px,2.5vw,30px);font-weight:700;line-height:1.2}.wizard-stage fieldset>p{color:var(--text-sub);margin-bottom:24px;font-size:14px}.choice-grid{grid-template-columns:repeat(2,1fr);gap:12px;display:grid}.choice-grid.two{grid-template-columns:repeat(2,1fr)}.choice-grid label{cursor:pointer;font-family:var(--font-display);color:var(--text-sub);background:#ffffff0a;border:1px solid #ffffff14;border-radius:16px;justify-content:space-between;align-items:center;padding:18px 20px;font-size:15px;font-weight:600;transition:all .2s;display:flex;position:relative}.choice-grid label:hover{color:var(--text-main);background:#ffffff14;border-color:#fff3}.choice-grid label.selected{border-color:var(--emerald-aurora);color:#fff;background:#00e5991f;box-shadow:0 0 18px #00e59940}.choice-grid label input[type=radio]{opacity:0;pointer-events:none;position:absolute}.choice-grid label svg{color:var(--text-dim);transition:all .2s}.choice-grid label:hover svg{color:var(--emerald-aurora);transform:translate(2px)}.choice-grid label.selected svg{color:var(--emerald-aurora)}.field-label{font-family:var(--font-display);letter-spacing:.06em;color:var(--text-main);text-transform:uppercase;margin:24px 0 12px;font-size:13px;font-weight:700;display:block}.budget-row{flex-wrap:wrap;gap:10px;display:flex}.budget-row label{cursor:pointer;font-family:var(--font-display);color:var(--text-sub);background:#ffffff0a;border:1px solid #ffffff14;border-radius:9999px;padding:10px 18px;font-size:13px;font-weight:600;transition:all .2s;position:relative}.budget-row label:hover{color:var(--text-main);background:#ffffff14}.budget-row label.selected{background:var(--emerald-aurora);color:#03070d;border-color:var(--emerald-aurora);font-weight:700;box-shadow:0 0 16px #00e59959}.budget-row label input[type=radio]{opacity:0;pointer-events:none;position:absolute}.wizard-fields{grid-template-columns:repeat(2,1fr);gap:16px;display:grid}.wizard-fields label{font-family:var(--font-display);color:var(--text-sub);flex-direction:column;gap:6px;font-size:13px;font-weight:600;display:flex}.wizard-fields label small{color:var(--text-dim);font-size:11px;font-weight:400}.wizard-fields input,.wizard-fields textarea{color:#fff;font-family:var(--font-body);background:#ffffff0a;border:1px solid #ffffff1f;border-radius:12px;padding:12px 16px;font-size:14px;transition:all .2s}.wizard-fields input:focus,.wizard-fields textarea:focus{border-color:var(--emerald-aurora);background:#ffffff12;outline:none;box-shadow:0 0 0 3px #00e59933}.wizard-fields label.wide{grid-column:1/-1}.wizard-review{text-align:center;padding:12px 0}.review-mark{border:2px solid var(--emerald-aurora);width:48px;height:48px;color:var(--emerald-aurora);background:#00e59926;border-radius:50%;justify-content:center;align-items:center;margin-bottom:16px;font-size:22px;font-weight:700;display:inline-flex;box-shadow:0 0 20px #00e5994d}.wizard-review h2{margin-bottom:8px;font-size:clamp(24px,2.5vw,32px)}.wizard-review p{color:var(--text-sub);max-width:460px;margin-bottom:24px;margin-left:auto;margin-right:auto;font-size:14px}.wizard-review dl{text-align:left;background:#ffffff08;border:1px solid #ffffff0f;border-radius:16px;grid-template-columns:repeat(2,1fr);gap:12px;padding:20px;display:grid}.wizard-review dt{font-family:var(--font-display);letter-spacing:.08em;text-transform:uppercase;color:var(--emerald-aurora);margin-bottom:4px;font-size:11px;font-weight:700}.wizard-review dd{color:#fff;margin:0;font-size:14px;font-weight:600}.wizard-actions{border-top:1px solid #ffffff0f;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;margin-top:28px;padding-top:20px;display:flex}.wizard-back{font-family:var(--font-display);color:var(--text-sub);border-radius:8px;padding:8px 14px;font-size:14px;font-weight:600}.wizard-back:hover{color:#fff;background:#ffffff0f}.wizard-actions span{color:var(--text-dim);font-size:12px}.site-footer{padding:var(--section-space) var(--gutter) 40px;background:#020509;border-top:1px solid #ffffff0f}.footer-cta-container{max-width:var(--content-max);margin:0 auto 64px}.footer-cta-glass{-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);background:linear-gradient(135deg,#0c1826e0 0%,#060c14f2 100%);border:1px solid #00e59959;border-radius:28px;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:32px;padding:clamp(36px,5vw,64px);display:flex;box-shadow:0 24px 60px #0000008c,inset 0 1px #ffffff26}.footer-cta-content{flex:500px}.footer-kicker-pill{font-family:var(--font-display);letter-spacing:.14em;color:var(--emerald-aurora);margin-bottom:12px;font-size:11px;font-weight:700;display:inline-block}.footer-cta-heading{margin-bottom:10px;font-size:clamp(32px,3.8vw,48px);line-height:1.15}.footer-cta-sub{color:var(--text-sub);max-width:540px;margin:0;font-size:16px;line-height:1.55}.footer-cta-actions{flex-wrap:wrap;align-items:center;gap:16px;display:flex}.footer-btn-lg{justify-content:center;align-items:center;gap:8px;padding:16px 32px;font-size:16px;display:inline-flex}.footer-main{max-width:var(--content-max);border-bottom:1px solid #ffffff0f;grid-template-columns:1.4fr 1fr 1fr 1.2fr;gap:clamp(32px,4vw,64px);margin:0 auto;padding-bottom:48px;display:grid}.footer-brand-bio{color:var(--text-muted);max-width:320px;margin:16px 0 20px;font-size:14px;line-height:1.6}.footer-locations{font-family:var(--font-display);color:var(--text-sub);flex-wrap:wrap;gap:10px;font-size:12px;display:flex}.footer-locations span{background:#ffffff0a;border:1px solid #ffffff14;border-radius:6px;padding:4px 10px}.footer-col-title{font-family:var(--font-display);letter-spacing:.12em;text-transform:uppercase;color:var(--text-main);margin-bottom:18px;font-size:12px;font-weight:700;display:block}.footer-column{flex-direction:column;gap:12px;display:flex}.footer-column a{color:var(--text-muted);font-size:14px}.footer-column a:hover{color:var(--emerald-aurora)}.footer-contact-col{flex-direction:column;gap:12px;display:flex}.contact-link{font-family:var(--font-display);align-items:center;gap:8px;font-size:14px;display:inline-flex}.email-link{color:#fff;font-weight:600}.phone-link{color:var(--emerald-aurora);align-items:baseline;gap:8px;font-size:15px;display:flex}.phone-link small,.phone-sub-link small,.fax-item small{letter-spacing:.1em;color:var(--emerald-aurora);background:#00e59926;border-radius:4px;padding:2px 6px;font-size:10px;font-weight:700}.phone-sub-link{color:var(--text-sub);align-items:baseline;gap:8px;font-size:14px;text-decoration:none;display:flex}.phone-sub-link:hover{color:#fff}.fax-item{color:var(--text-muted);align-items:baseline;gap:8px;font-size:13px;display:flex}.address-item{color:var(--text-sub);align-items:flex-start;gap:8px;margin-top:4px;font-size:13px;line-height:1.45;display:flex}.address-pin{flex-shrink:0;margin-top:1px;font-size:14px}.whatsapp-pill{width:fit-content;font-weight:700;font-family:var(--font-display);background:#25d36624;border:1px solid #25d36659;border-radius:9999px;align-items:center;gap:8px;padding:8px 16px;text-decoration:none;transition:all .2s;display:inline-flex;color:#25d366!important}.whatsapp-pill:hover,.footer-column a.whatsapp-pill:hover{transform:translateY(-2px);box-shadow:0 6px 20px #25d36666;color:#03070d!important;background:#25d366!important;border-color:#25d366!important;font-weight:800!important}.whatsapp-pill:hover svg{color:#03070d!important}.footer-response-tag{color:var(--text-dim);margin-top:8px;font-size:12px}.footer-bottom-bar{max-width:var(--content-max);font-family:var(--font-display);color:var(--text-dim);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px;margin:32px auto 0;font-size:12px;display:flex}.footer-motto{letter-spacing:.12em}.back-to-top:hover{color:var(--emerald-aurora)}@media (max-width:1024px){.hero{grid-template-columns:1fr;gap:40px}.service-grid,.security-grid,.proof-grid,.process-grid,.assurance,.use-cases-cards-grid,.footer-main{grid-template-columns:repeat(2,1fr)}.home-case,.platform-page,.about-page,.project-start{grid-template-columns:1fr}}@media (max-width:768px){.site-nav{display:none}.intro,.service-grid,.security-grid,.proof-grid,.process-grid,.use-cases-cards-grid,.detail-grid,.rich-list,.principles,.assurance,.footer-main,.showcase-body-grid{grid-template-columns:1fr}.showcase-metric-box{text-align:left;align-items:flex-start}.choice-grid,.wizard-fields{grid-template-columns:1fr}.footer-cta-glass{flex-direction:column;align-items:flex-start}}.crm-app-container{flex-direction:column;gap:1.5rem;width:100%;display:flex}.crm-top-bar{background:var(--card-bg,#0f172abf);border:1px solid var(--border-color,#ffffff1a);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border-radius:1rem;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1.25rem;padding:1.25rem 1.5rem;display:flex;box-shadow:0 10px 30px #00000059}.crm-brand-block{align-items:center;gap:.85rem;display:flex}.crm-status-beacon{background:#10b981;border-radius:50%;width:12px;height:12px;animation:2s ease-in-out infinite pulseBeacon;box-shadow:0 0 12px #10b981}@keyframes pulseBeacon{0%,to{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(1.2)}}.crm-main-title{letter-spacing:.05em;-webkit-text-fill-color:transparent;background:linear-gradient(135deg,#fff 30%,#a5b4fc 100%);-webkit-background-clip:text;margin:0;font-size:1.15rem;font-weight:800}.crm-main-sub{color:var(--text-muted,#94a3b8);margin:.15rem 0 0;font-size:.78rem}.crm-metrics-strip{flex-wrap:wrap;align-items:center;gap:.75rem;display:flex}.crm-stat-chip{background:#1e293b99;border:1px solid #ffffff0f;border-radius:.5rem;flex-direction:column;min-width:95px;padding:.45rem .85rem;display:flex}.stat-label{letter-spacing:.06em;color:#64748b;font-size:.65rem;font-weight:700}.stat-value{color:#f8fafc;font-size:1.05rem;font-weight:800}.crm-view-switchers{background:#0f172acc;border:1px solid #ffffff1a;border-radius:.6rem;gap:.25rem;padding:.25rem;display:flex}.crm-tab-btn{color:#94a3b8;cursor:pointer;background:0 0;border:none;border-radius:.4rem;padding:.5rem .95rem;font-size:.82rem;font-weight:600;transition:all .2s}.crm-tab-btn:hover{color:#fff;background:#ffffff0d}.crm-tab-btn.active{color:#fff;background:#3b82f6;box-shadow:0 0 15px #3b82f666}.crm-workspace-grid{grid-template-columns:360px minmax(0,1fr) 380px;align-items:start;gap:1.5rem;display:grid}@media (max-width:1280px){.crm-workspace-grid{grid-template-columns:320px 1fr}.crm-composer-panel{grid-column:span 2}}@media (max-width:900px){.crm-workspace-grid{grid-template-columns:1fr}.crm-composer-panel{grid-column:span 1}}.crm-sidebar-panel{background:var(--card-bg,#0f172a99);border:1px solid var(--border-color,#ffffff14);border-radius:1rem;flex-direction:column;gap:1rem;max-height:850px;padding:1.25rem;display:flex;overflow-y:auto}.sidebar-search-box{width:100%}.crm-search-input{color:#fff;background:#1e293bb3;border:1px solid #ffffff1f;border-radius:.5rem;outline:none;width:100%;padding:.6rem .85rem;font-size:.85rem;transition:border-color .2s}.crm-search-input:focus{border-color:#38bdf8;box-shadow:0 0 10px #38bdf833}.sidebar-filter-row{grid-template-columns:1fr 1fr;gap:.5rem;display:grid}.crm-select-filter{color:#cbd5e1;background:#1e293bcc;border:1px solid #ffffff1a;border-radius:.5rem;outline:none;padding:.5rem .65rem;font-size:.78rem}.crm-leads-list{flex-direction:column;gap:.65rem;display:flex}.crm-lead-card{cursor:pointer;background:#1e293b66;border:1px solid #ffffff0f;border-radius:.75rem;flex-direction:column;gap:.5rem;padding:.85rem 1rem;transition:all .2s;display:flex}.crm-lead-card:hover{background:#1e293bcc;border-color:#38bdf84d;transform:translateY(-1px)}.crm-lead-card.selected{background:#3b82f61f;border-color:#3b82f6;box-shadow:0 0 18px #3b82f633}.lead-card-header{justify-content:space-between;align-items:flex-start;display:flex}.lead-name-block{align-items:center;gap:.65rem;display:flex}.lead-avatar{color:#fff;background:linear-gradient(135deg,#6366f1,#a855f7);border-radius:50%;justify-content:center;align-items:center;width:34px;height:34px;font-size:.8rem;font-weight:800;display:flex}.lead-name{color:#f1f5f9;font-size:.92rem;font-weight:700;display:block}.hot-badge{color:#f87171;background:#ef444433;border:1px solid #ef444466;border-radius:.25rem;margin-left:.25rem;padding:.1rem .35rem;font-size:.65rem}.lead-company{color:#94a3b8;font-size:.76rem;display:block}.lead-budget{color:#34d399;font-size:.8rem;font-weight:700}.lead-badges-row{flex-wrap:wrap;gap:.35rem;display:flex}.source-pill,.stage-pill{border-width:1px;border-radius:.3rem;padding:.15rem .5rem;font-size:.68rem;font-weight:600}.lead-card-footer{color:#64748b;border-top:1px solid #ffffff0a;justify-content:space-between;align-items:center;padding-top:.4rem;font-size:.72rem;display:flex}.lead-project-snip{white-space:nowrap;text-overflow:ellipsis;color:#cbd5e1;max-width:180px;overflow:hidden}.crm-timeline-panel{flex-direction:column;gap:1.25rem;display:flex}.client-hero-card{background:var(--card-bg,#0f172ab3);border:1px solid var(--border-color,#ffffff1a);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-radius:1rem;flex-direction:column;gap:1.25rem;padding:1.5rem;display:flex}.client-hero-top{flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:1rem;display:flex}.client-full-name{color:#f8fafc;margin:0;font-size:1.5rem;font-weight:800}.client-role-company{color:#94a3b8;margin:.2rem 0 .6rem;font-size:.92rem;display:block}.client-meta-pills{flex-wrap:wrap;gap:.5rem;display:flex}.meta-tag{color:#cbd5e1;background:#1e293bcc;border:1px solid #ffffff14;border-radius:.4rem;padding:.25rem .65rem;font-size:.75rem}.client-hero-contact-actions{flex-wrap:wrap;gap:.5rem;display:flex}.btn-action-pill{border-width:1px;border-radius:.45rem;padding:.45rem .85rem;font-size:.78rem;font-weight:600;text-decoration:none;transition:all .2s}.btn-action-pill:hover{filter:brightness(1.2);transform:translateY(-1px)}.client-scope-banner{background:#1e293b80;border:1px solid #ffffff0f;border-radius:.75rem;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:.75rem;padding:1rem;display:grid}.scope-item{flex-direction:column;gap:.25rem;display:flex}.scope-lbl{letter-spacing:.06em;color:#64748b;font-size:.65rem;font-weight:700}.scope-val{color:#f1f5f9;font-size:.88rem}.stage-selector-bar{flex-direction:column;gap:.5rem;display:flex}.stage-bar-title{letter-spacing:.06em;color:#94a3b8;font-size:.72rem;font-weight:700}.stage-btn-group{flex-wrap:wrap;gap:.35rem;display:flex}.stage-step-btn{color:#94a3b8;cursor:pointer;text-transform:capitalize;background:#1e293b99;border:1px solid #ffffff1a;border-radius:.4rem;padding:.4rem .8rem;font-size:.75rem;font-weight:600;transition:all .2s}.stage-step-btn:hover{color:#fff;border-color:#ffffff4d}.stage-step-btn.active{color:#fff;background:#3b82f6;border-color:#3b82f6;box-shadow:0 0 12px #3b82f666}.event-reminder-banner{background:linear-gradient(135deg,#ec489926,#a855f726);border:1px solid #ec48994d;border-radius:.75rem;justify-content:space-between;align-items:center;gap:1rem;padding:.85rem 1.25rem;display:flex}.event-reminder-icon{font-size:1.5rem}.event-reminder-text{color:#fce7f3;flex-direction:column;flex:1;font-size:.84rem;display:flex}.event-reminder-text span{color:#f472b6;font-size:.72rem}.btn-trigger-event{color:#fff;cursor:pointer;background:#ec4899;border:none;border-radius:.4rem;padding:.45rem .85rem;font-size:.75rem;font-weight:700;transition:all .2s}.btn-trigger-event:hover{background:#db2777}.timeline-feed-wrapper{background:var(--card-bg,#0f172ab3);border:1px solid var(--border-color,#ffffff14);border-radius:1rem;flex-direction:column;gap:1.25rem;padding:1.5rem;display:flex}.timeline-header-row{border-bottom:1px solid #ffffff0f;justify-content:space-between;align-items:center;padding-bottom:.75rem;display:flex}.timeline-feed-title{color:#f1f5f9;margin:0;font-size:1.05rem;font-weight:700}.timeline-zero-gap-pill{color:#34d399;background:#34d3991a;border:1px solid #34d39933;border-radius:.3rem;padding:.2rem .6rem;font-size:.72rem}.timeline-items-list{border-left:2px solid #ffffff14;flex-direction:column;gap:1rem;padding-left:1rem;display:flex;position:relative}.timeline-card{background:#1e293b80;border:1px solid #ffffff12;border-radius:.75rem;flex-direction:column;gap:.5rem;padding:1rem 1.25rem;display:flex;position:relative}.timeline-card:before{content:"";background:#3b82f6;border:2px solid #0f172a;border-radius:50%;width:10px;height:10px;position:absolute;top:1.2rem;left:-1.45rem}.timeline-card.channel-whatsapp:before{background:#10b981}.timeline-card.channel-email:before{background:#3b82f6}.timeline-card.channel-sms:before{background:#6366f1}.timeline-card.channel-call:before{background:#f59e0b}.timeline-card.channel-meeting:before{background:#a855f7}.timeline-card.channel-web:before{background:#06b6d4}.timeline-card.channel-event:before{background:#ec4899}.timeline-card-header{justify-content:space-between;align-items:center;display:flex}.timeline-badge-group{flex-wrap:wrap;align-items:center;gap:.5rem;display:flex}.channel-icon-tag{border-width:1px;border-radius:.3rem;padding:.15rem .5rem;font-size:.72rem;font-weight:700}.timeline-time{color:#94a3b8;font-size:.75rem}.timeline-sender{color:#64748b;font-size:.72rem}.timeline-status{border-radius:.25rem;padding:.1rem .4rem;font-size:.65rem;font-weight:700}.status-read,.status-opened,.status-completed{color:#34d399;background:#34d39926}.status-sent,.status-delivered,.status-scheduled{color:#60a5fa;background:#3b82f626}.timeline-subject{color:#f8fafc;margin:.15rem 0 0;font-size:.95rem;font-weight:700}.timeline-content-text{color:#cbd5e1;margin:0;font-size:.85rem;line-height:1.45}.timeline-metadata-box{color:#94a3b8;background:#0f172a99;border:1px solid #ffffff0d;border-radius:.5rem;flex-direction:column;gap:.35rem;padding:.6rem .85rem;font-size:.78rem;display:flex}.timeline-metadata-box a{color:#38bdf8;text-decoration:underline}.crm-composer-panel{background:var(--card-bg,#0f172abf);border:1px solid var(--border-color,#ffffff1a);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-radius:1rem;flex-direction:column;gap:1.25rem;padding:1.5rem;display:flex}.composer-header{border-bottom:1px solid #ffffff0f;padding-bottom:.75rem}.composer-title{color:#f8fafc;margin:0;font-size:1.1rem;font-weight:800}.composer-sub{color:#94a3b8;margin:.2rem 0 0;font-size:.78rem}.composer-alert-success{color:#34d399;background:#10b98133;border:1px solid #10b98166;border-radius:.5rem;padding:.6rem .85rem;font-size:.8rem}.crm-composer-form{flex-direction:column;gap:1rem;display:flex}.composer-channel-tabs{background:#1e293b99;border-radius:.5rem;flex-wrap:wrap;gap:.25rem;padding:.25rem;display:flex}.composer-ch-btn{color:#94a3b8;cursor:pointer;background:0 0;border:none;border-radius:.35rem;padding:.35rem .6rem;font-size:.74rem;font-weight:600;transition:all .2s}.composer-ch-btn:hover{color:#fff}.composer-ch-btn.active{color:#fff;background:#3b82f6}.composer-field-label{letter-spacing:.06em;color:#64748b;margin-bottom:.35rem;font-size:.68rem;font-weight:700;display:block}.crm-input-field,.crm-textarea-field{color:#fff;background:#1e293bb3;border:1px solid #ffffff1f;border-radius:.5rem;outline:none;width:100%;padding:.65rem .85rem;font-family:inherit;font-size:.85rem}.crm-input-field:focus,.crm-textarea-field:focus{border-color:#38bdf8;box-shadow:0 0 10px #38bdf833}.composer-recipient-preview{background:#0f172a80;border-radius:.4rem;justify-content:space-between;padding:.45rem .75rem;display:flex}.composer-submit-btn{padding:.75rem;font-size:.88rem;font-weight:700}.composer-attachments-box{background:#1e293b66;border:1px solid #ffffff0f;border-radius:.65rem;padding:.85rem 1rem}.attachment-quick-list{flex-direction:column;gap:.35rem;margin:.5rem 0 0;padding:0;list-style:none;display:flex}.attachment-quick-link{color:#38bdf8;font-size:.78rem;text-decoration:none;display:block}.attachment-quick-link:hover{text-decoration:underline}.crm-pipeline-kanban-view{width:100%;overflow-x:auto}.kanban-columns-container{grid-template-columns:repeat(5,minmax(280px,1fr));align-items:start;gap:1.25rem;display:grid}.kanban-column{background:var(--card-bg,#0f172a99);border:1px solid var(--border-color,#ffffff14);border-radius:.85rem;flex-direction:column;gap:.85rem;min-height:500px;padding:1rem;display:flex}.kanban-col-header{border-bottom:1px solid #ffffff0f;justify-content:space-between;align-items:center;padding-bottom:.5rem;display:flex}.kanban-col-title{color:#f1f5f9;margin:0;font-size:.88rem;font-weight:700}.kanban-col-count{color:#cbd5e1;background:#ffffff1a;border-radius:.25rem;padding:.1rem .45rem;font-size:.75rem;font-weight:700}.kanban-cards-stack{flex-direction:column;gap:.75rem;display:flex}.kanban-card{cursor:pointer;background:#1e293b99;border:1px solid #ffffff12;border-radius:.65rem;flex-direction:column;gap:.4rem;padding:.85rem;transition:all .2s;display:flex}.kanban-card:hover{background:#1e293bf2;border-color:#3b82f6;transform:translateY(-2px);box-shadow:0 8px 20px #00000059}.kanban-card-top{justify-content:space-between;display:flex}.kanban-card-name{color:#f8fafc;font-size:.88rem}.kanban-card-budget{color:#34d399;font-size:.78rem;font-weight:700}.kanban-card-company{color:#94a3b8;font-size:.75rem}.kanban-card-scope{color:#cbd5e1;margin:0;font-size:.74rem;line-height:1.35}.kanban-card-footer{border-top:1px solid #ffffff0a;justify-content:space-between;align-items:center;padding-top:.4rem;display:flex}.kanban-card-time{color:#64748b;font-size:.68rem}.crm-campaigns-view{flex-direction:column;gap:1.5rem;display:flex}.campaigns-header-card{background:var(--card-bg,#0f172ab3);border:1px solid var(--border-color,#ffffff1a);border-radius:1rem;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1rem;padding:1.5rem;display:flex}.campaigns-view-title{color:#f8fafc;margin:0;font-size:1.3rem;font-weight:800}.campaigns-view-sub{color:#94a3b8;margin:.25rem 0 0;font-size:.85rem}.campaigns-grid-cards{grid-template-columns:repeat(auto-fill,minmax(360px,1fr));gap:1.25rem;display:grid}.campaign-card{background:var(--card-bg,#0f172aa6);border:1px solid var(--border-color,#ffffff14);border-radius:1rem;flex-direction:column;gap:1rem;padding:1.25rem;display:flex}.campaign-card-header{justify-content:space-between;align-items:flex-start;display:flex}.camp-type-pill{border-radius:.25rem;margin-bottom:.35rem;padding:.15rem .5rem;font-size:.68rem;font-weight:700;display:inline-block}.type-event_wish{color:#f472b6;background:#ec489933;border:1px solid #ec48994d}.type-milestone{color:#60a5fa;background:#3b82f633;border:1px solid #3b82f64d}.type-reactivation{color:#fbbf24;background:#f59e0b33;border:1px solid #f59e0b4d}.camp-card-name{color:#f8fafc;margin:0;font-size:1rem;font-weight:700}.camp-status-badge{border-radius:.25rem;padding:.15rem .45rem;font-size:.65rem;font-weight:700}.status-active{color:#34d399;background:#10b98133}.status-scheduled{color:#a5b4fc;background:#6366f133}.camp-details-box{background:#1e293b66;border-radius:.5rem;flex-direction:column;gap:.35rem;padding:.75rem;font-size:.78rem;display:flex}.camp-detail-row{color:#94a3b8;justify-content:space-between;gap:.5rem;display:flex}.camp-detail-row strong{color:#e2e8f0;text-align:right}.camp-preview-box{background:#0f172a80;border:1px solid #ffffff0d;border-radius:.5rem;padding:.75rem}.camp-preview-lbl{letter-spacing:.05em;color:#64748b;margin-bottom:.3rem;font-size:.65rem;font-weight:700;display:block}.camp-preview-text{color:#cbd5e1;margin:0;font-size:.78rem;font-style:italic;line-height:1.4}.camp-card-actions{border-top:1px solid #ffffff0d;justify-content:space-between;align-items:center;padding-top:.75rem;display:flex}.camp-last-run{color:#64748b;font-size:.7rem}.section-tag{font-family:var(--font-display);letter-spacing:.14em;text-transform:uppercase;color:var(--emerald-aurora);align-items:center;gap:8px;margin-bottom:12px;font-size:11px;font-weight:700;display:inline-flex}.section-tag.light{color:var(--emerald-aurora)}.section-tag:before{content:"";background:var(--emerald-aurora);width:6px;height:6px;box-shadow:0 0 8px var(--emerald-aurora);border-radius:50%;display:inline-block}.use-cases{max-width:var(--content-max);margin:var(--section-space) auto;padding:clamp(40px, 5vw, 64px) var(--gutter);-webkit-backdrop-filter:blur(20px);background:linear-gradient(135deg,#0a1422bf 0%,#050c16e6 100%);border:1px solid #ffffff14;border-radius:28px;grid-template-columns:1fr 1.6fr;align-items:start;gap:clamp(32px,5vw,64px);display:grid;box-shadow:0 24px 60px #00000073,inset 0 1px #ffffff1a}.use-cases h2{margin:0;font-size:clamp(28px,3.2vw,42px);line-height:1.2}.use-grid{grid-template-columns:repeat(2,1fr);gap:16px;display:grid}@media (max-width:900px){.use-cases{grid-template-columns:1fr}}@media (max-width:600px){.use-grid{grid-template-columns:1fr}}.use-grid article{background:#ffffff08;border:1px solid #ffffff0f;border-radius:16px;padding:20px;transition:all .25s}.use-grid article b{font-family:var(--font-display);color:#fff;margin-bottom:6px;font-size:15px;display:block}.use-grid article p{color:var(--text-sub);margin:0;font-size:13px;line-height:1.5}.use-grid article:hover{background:#00e5990f;border-color:#00e5994d;transform:translateY(-2px)}.engagements{max-width:var(--content-max);margin:var(--section-space) auto;padding:0 var(--gutter)}.engagements>div{grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:24px;margin-top:24px;display:grid}.engagements article{background:var(--card-bg);border:1px solid var(--card-border);-webkit-backdrop-filter:blur(16px);border-radius:20px;flex-direction:column;padding:28px;transition:all .25s;display:flex}.engagements article span{font-family:var(--font-display);letter-spacing:.14em;color:var(--emerald-aurora);background:#00e5991f;border-radius:4px;width:fit-content;margin-bottom:14px;padding:3px 8px;font-size:10px;font-weight:700}.engagements article h3{color:#fff;margin:0 0 10px;font-size:20px}.engagements article p{color:var(--text-sub);flex-grow:1;margin:0 0 20px;font-size:14px;line-height:1.55}.engagements article b{color:var(--text-muted);border-top:1px solid #ffffff0f;padding-top:14px;font-size:12px;font-weight:500}.engagements article:hover{border-color:#00e59959;transform:translateY(-3px);box-shadow:0 16px 40px #0006}.work-page-container{max-width:var(--content-max);margin:var(--section-space) auto;padding:0 var(--gutter)}.work-intro-header{max-width:800px;margin-bottom:48px}.work-intro-header h2{margin:0 0 16px;font-size:clamp(30px,3.6vw,48px);line-height:1.2}.work-intro-header p{color:var(--text-sub);margin:0;font-size:16px;line-height:1.6}.work-cases-grid{grid-template-columns:repeat(auto-fit,minmax(420px,1fr));gap:32px;margin-bottom:64px;display:grid}@media (max-width:600px){.work-cases-grid{grid-template-columns:1fr}}.work-client-card{background:var(--card-bg);border:1px solid var(--card-border);-webkit-backdrop-filter:blur(20px);border-radius:28px;flex-direction:column;padding:clamp(28px,4vw,36px);transition:all .25s;display:flex;position:relative}.work-client-card.featured-case{background:linear-gradient(135deg,#0e1c30eb 0%,#060e18f7 100%);border:1px solid #00e59966;box-shadow:0 24px 60px #00000080,inset 0 1px #ffffff26}.work-client-card:hover{border-color:#00e59966;transform:translateY(-4px);box-shadow:0 24px 54px #00000073}.client-card-head{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;margin-bottom:16px;display:flex}.client-num-badge{font-family:var(--font-display);letter-spacing:.14em;color:var(--emerald-aurora);font-size:11px;font-weight:700}.client-category-tag{font-family:var(--font-display);letter-spacing:.1em;color:var(--text-dim);text-transform:uppercase;background:#ffffff0d;border-radius:4px;padding:3px 8px;font-size:10px;font-weight:700}.client-name-row{flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:4px;display:flex}.client-name{font-size:clamp(24px,2.5vw,32px);font-family:var(--font-display);color:#fff;margin:0}.client-region{color:var(--text-dim);font-size:12px;font-family:var(--font-display);font-weight:500}.client-product-sub{color:var(--emerald-aurora);margin-bottom:18px;font-size:14px;font-weight:600;display:block}.client-pipeline-flow{background:#ffffff08;border:1px solid #ffffff0f;border-radius:12px;flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:20px;padding:10px 14px;display:flex}.pipeline-node{font-family:var(--font-display);color:#fff;letter-spacing:.06em;font-size:11px;font-weight:700}.client-headline{color:#fff;margin:0 0 10px;font-size:18px;line-height:1.35}.client-desc{color:var(--text-sub);flex-grow:1;margin:0 0 20px;font-size:14px;line-height:1.6}.client-outcomes{border-top:1px solid #ffffff0f;flex-direction:column;gap:8px;margin-bottom:22px;padding-top:16px;display:flex}.outcome-row{color:var(--text-sub);align-items:flex-start;gap:8px;font-size:13px;line-height:1.45;display:flex}.outcome-check{color:var(--emerald-aurora);flex-shrink:0;margin-top:1px;font-size:12px;font-weight:700}.client-stack-row{flex-wrap:wrap;gap:6px;margin-bottom:24px;display:flex}.client-actions{flex-wrap:wrap;gap:12px;margin-top:auto;display:flex}.outcome-strip{max-width:var(--content-max);padding:18px var(--gutter);font-family:var(--font-display);letter-spacing:.1em;color:var(--text-sub);background:#ffffff05;border-top:1px solid #ffffff0f;border-bottom:1px solid #ffffff0f;border-radius:16px;flex-wrap:wrap;justify-content:center;align-items:center;gap:16px;margin:0 auto 64px;font-size:12px;font-weight:700;display:flex}.evidence-note{max-width:var(--content-max);margin:var(--section-space) auto;padding:clamp(40px, 5vw, 64px) var(--gutter);-webkit-backdrop-filter:blur(20px);text-align:left;background:linear-gradient(135deg,#08121ebf 0%,#040a12e6 100%);border:1px solid #ffffff14;border-radius:28px;box-shadow:0 24px 60px #00000073,inset 0 1px #ffffff1a}.evidence-note h2{margin:0 0 16px;font-size:clamp(28px,3.2vw,40px);line-height:1.25}.evidence-note p:last-child{color:var(--text-sub);max-width:680px;margin:0;font-size:16px;line-height:1.6}.platform-page{max-width:var(--content-max);margin:var(--section-space) auto;padding:0 var(--gutter);grid-template-columns:1fr 1.2fr;align-items:center;gap:clamp(32px,5vw,64px);display:grid}@media (max-width:860px){.platform-page{grid-template-columns:1fr}}.platform-page h2{margin:0 0 16px;font-size:clamp(28px,3.2vw,42px);line-height:1.2}.platform-page p{color:var(--text-sub);margin:0 0 24px;font-size:16px;line-height:1.6}.stack-diagram{-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);background:#08101cbf;border:1px solid #ffffff17;border-radius:24px;flex-direction:column;gap:12px;padding:24px;display:flex}.stack-title{font-family:var(--font-display);letter-spacing:.1em;color:var(--emerald-aurora);border-bottom:1px solid #ffffff0f;justify-content:space-between;padding-bottom:8px;font-size:11px;font-weight:700;display:flex}.stack-diagram .layer{font-family:var(--font-display);background:#ffffff08;border:1px solid #ffffff0f;border-radius:12px;justify-content:space-between;align-items:center;padding:14px 18px;transition:all .2s;display:flex}.stack-diagram .layer span{letter-spacing:.1em;color:var(--text-dim);text-transform:uppercase;font-size:11px;font-weight:700}.stack-diagram .layer b{color:#fff;font-size:14px;font-weight:600}.stack-diagram .layer:hover{background:#00e5990f;border-color:#00e59940}.metric-list{grid-template-columns:repeat(2,1fr);gap:14px;margin-top:24px;display:grid}@media (max-width:500px){.metric-list{grid-template-columns:1fr}}.metric-list div{background:#ffffff05;border:1px solid #ffffff0d;border-radius:12px;align-items:center;gap:12px;padding:14px;display:flex}.metric-list b{font-family:var(--font-display);color:var(--emerald-aurora);font-size:14px;font-weight:700}.metric-list span{color:var(--text-sub);font-size:13px}.rich-section{max-width:var(--content-max);margin:var(--section-space) auto;padding:0 var(--gutter)}.rich-head{max-width:680px;margin-bottom:36px}.rich-head h2{margin:0 0 12px;font-size:clamp(28px,3.2vw,42px);line-height:1.2}.rich-head p{color:var(--text-sub);margin:0;font-size:16px}.rich-list,.roadmap{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px;display:grid}.rich-list article,.roadmap article{background:var(--card-bg);border:1px solid var(--card-border);-webkit-backdrop-filter:blur(16px);border-radius:20px;padding:24px;transition:all .25s}.rich-list article span,.roadmap article span{font-family:var(--font-display);letter-spacing:.12em;color:var(--emerald-aurora);text-transform:uppercase;background:#00e5991f;border-radius:4px;margin-bottom:12px;padding:3px 8px;font-size:10px;font-weight:700;display:inline-block}.rich-list article h3,.roadmap article h3{color:#fff;margin:0 0 8px;font-size:18px}.rich-list article p,.roadmap article p{color:var(--text-sub);margin:0;font-size:14px;line-height:1.55}.rich-list article:hover,.roadmap article:hover{border-color:#00e59959;transform:translateY(-3px);box-shadow:0 16px 40px #0006}.assurance{max-width:var(--content-max);margin:var(--section-space) auto;padding:clamp(32px, 4vw, 48px) var(--gutter);-webkit-backdrop-filter:blur(16px);background:#08101ca6;border:1px solid #ffffff14;border-radius:24px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));align-items:center;gap:24px;display:grid}.assurance p.section-tag{grid-column:1/-1;margin-bottom:0}.assurance div{background:#ffffff08;border:1px solid #ffffff0d;border-radius:14px;padding:18px}.assurance b{font-family:var(--font-display);color:#fff;margin-bottom:6px;font-size:16px;display:block}.assurance span{color:var(--text-sub);font-size:13px;line-height:1.45}.about-page{max-width:var(--content-max);margin:var(--section-space) auto;padding:0 var(--gutter);grid-template-columns:1fr 1.3fr;align-items:start;gap:clamp(32px,5vw,64px);display:grid}@media (max-width:860px){.about-page{grid-template-columns:1fr}}.about-page h2{margin:0;font-size:clamp(32px,3.8vw,48px);line-height:1.15}.about-copy p{color:var(--text-sub);margin:0 0 20px;font-size:16px;line-height:1.65}.principles{max-width:var(--content-max);margin:var(--section-space) auto;padding:0 var(--gutter);grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:24px;display:grid}.principles article{background:var(--card-bg);border:1px solid var(--card-border);-webkit-backdrop-filter:blur(16px);border-radius:20px;padding:28px;transition:all .25s}.principles article span{font-family:var(--font-display);color:var(--emerald-aurora);margin-bottom:12px;font-size:16px;font-weight:800;display:block}.principles article h3{color:#fff;margin:0 0 8px;font-size:18px}.principles article p{color:var(--text-sub);margin:0;font-size:14px;line-height:1.55}.principles article:hover{border-color:#00e59959;transform:translateY(-3px);box-shadow:0 16px 40px #0006}.beliefs{max-width:var(--content-max);margin:var(--section-space) auto;padding:clamp(40px, 5vw, 64px) var(--gutter);-webkit-backdrop-filter:blur(20px);text-align:center;background:linear-gradient(135deg,#0a1624cc 0%,#050c16f2 100%);border:1px solid #00e59940;border-radius:28px;box-shadow:0 24px 60px #00000073,inset 0 1px #ffffff1a}.beliefs blockquote{font-family:var(--font-display);color:#fff;max-width:800px;margin:0 auto 32px;font-size:clamp(20px,2.4vw,28px);font-style:italic;line-height:1.4}.beliefs div{flex-wrap:wrap;justify-content:center;gap:12px;display:flex}.beliefs div span{font-family:var(--font-display);color:var(--text-sub);background:#ffffff0a;border:1px solid #ffffff14;border-radius:9999px;padding:8px 16px;font-size:13px;font-weight:500}.proposals-page{max-width:var(--content-max);margin:var(--section-space) auto;padding:0 var(--gutter)}.proposals-intro{max-width:760px;margin-bottom:40px}.proposals-intro h2{margin:0 0 14px;font-size:clamp(28px,3.4vw,44px);line-height:1.2}.proposals-intro p{color:var(--text-sub);margin:0;font-size:16px;line-height:1.6}.master-proposal-hero{-webkit-backdrop-filter:blur(16px);background:linear-gradient(135deg,#0e1c30eb 0%,#060e18fa 100%);border:1px solid #aeff0059;border-radius:28px;grid-template-columns:1.25fr .95fr;align-items:stretch;gap:clamp(24px,3vw,44px);margin-bottom:48px;padding:clamp(24px,3.5vw,44px);display:grid;position:relative;overflow:hidden;box-shadow:0 24px 60px #00000080,inset 0 1px #ffffff26}.master-proposal-hero:before{content:"";pointer-events:none;background:radial-gradient(circle,#aeff001f 0%,#0000 70%);width:300px;height:300px;position:absolute;top:-100px;right:-100px}.master-hero-content{flex-direction:column;display:flex}.master-hero-badge-row{flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:16px;display:flex}.master-badge-gold{font-family:var(--font-display);letter-spacing:.08em;color:var(--lime);background:#aeff001f;border:1px solid #aeff0059;border-radius:999px;padding:4px 12px;font-size:11px;font-weight:800}.master-file-type{font-family:var(--font-display);letter-spacing:.1em;color:var(--text-dim);background:#ffffff0f;border-radius:6px;padding:4px 10px;font-size:10px;font-weight:700}.master-hero-title{color:#fff;margin:0 0 14px;font-size:clamp(22px,2.5vw,32px);font-weight:700;line-height:1.25}.master-hero-desc{color:var(--text-sub);margin:0 0 24px;font-size:15px;line-height:1.6}.master-meta-tags-row{background:#ffffff08;border:1px solid #ffffff0f;border-radius:14px;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;margin-bottom:24px;padding:14px 18px;display:grid}.master-meta-item small{font-family:var(--font-display);letter-spacing:.1em;color:var(--lime);margin-bottom:4px;font-size:10px;font-weight:700;display:block}.master-meta-item strong{color:#fff;font-size:14px;font-weight:600}.master-meta-item span{color:var(--text-sub);font-size:13px}.master-stack-pills{flex-wrap:wrap;gap:8px;display:flex}.stack-pill.master-pill{color:var(--lime);background:#aeff0014;border-color:#aeff0047;padding:4px 10px;font-weight:600}.master-primary-actions{flex-wrap:wrap;align-items:center;gap:14px;margin-top:28px;display:flex}.master-download-action-btn{white-space:nowrap;box-sizing:border-box;border:1px solid var(--lime);background:var(--lime);color:#000;cursor:pointer;border-radius:12px;justify-content:center;align-items:center;gap:10px;height:48px;padding:0 24px;font-size:14px;font-weight:700;text-decoration:none;transition:all .2s cubic-bezier(.16,1,.3,1);display:inline-flex;box-shadow:0 4px 16px #aeff0033}.master-download-action-btn:hover{transform:translateY(-2px);box-shadow:0 8px 24px #aeff0061}.master-scope-action-btn{white-space:nowrap;box-sizing:border-box;color:#fff;cursor:pointer;background:#ffffff0a;border:1px solid #ffffff29;border-radius:12px;justify-content:center;align-items:center;gap:8px;height:48px;padding:0 22px;font-size:14px;font-weight:600;text-decoration:none;transition:all .2s;display:inline-flex}.master-scope-action-btn:hover{color:#fff;background:#ffffff17;border-color:#ffffff4d;transform:translateY(-2px)}.master-hero-side-card{background:#ffffff05;border:1px solid #ffffff0f;border-radius:20px;flex-direction:column;justify-content:flex-start;padding:24px;display:flex}.master-highlights-box{flex-direction:column;gap:14px;height:100%;display:flex}.highlights-header-row{justify-content:space-between;align-items:center;margin-bottom:2px;display:flex}.highlights-header{font-family:var(--font-display);letter-spacing:.12em;color:var(--lime);font-size:11px;font-weight:800}.highlights-tag{font-family:var(--font-display);letter-spacing:.1em;color:var(--lime);background:#aeff001f;border-radius:6px;padding:3px 8px;font-size:10px;font-weight:800}.master-highlights-list{flex-direction:column;gap:10px;display:flex}.master-highlight-row{color:#e2e8f0;background:#ffffff06;border:1px solid #ffffff0a;border-radius:10px;align-items:flex-start;gap:10px;padding:10px 14px;font-size:13.5px;line-height:1.45;display:flex}.highlight-check{color:var(--lime);flex-shrink:0;margin-top:1px;font-size:13px;font-weight:800}.master-scope-note{color:var(--text-sub);border-top:1px solid #ffffff0f;margin-top:auto;padding-top:16px;font-size:12px;line-height:1.55}.proposals-sub-header{margin-bottom:24px}.proposals-sub-header h3{color:#fff;margin:6px 0 0;font-size:clamp(20px,2.2vw,26px)}.proposals-grid{grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:28px;display:grid}.proposal-card{background:var(--card-bg);border:1px solid var(--card-border);-webkit-backdrop-filter:blur(16px);border-radius:24px;flex-direction:column;padding:32px;transition:all .25s;display:flex;position:relative}.proposal-card:hover{border-color:#aeff0066;transform:translateY(-4px);box-shadow:0 20px 48px #00000073}.proposal-card-head{justify-content:space-between;align-items:center;margin-bottom:14px;display:flex}.proposal-num{font-family:var(--font-display);letter-spacing:.12em;color:var(--lime);font-size:11px;font-weight:700}.proposal-cat{font-family:var(--font-display);letter-spacing:.1em;color:var(--text-dim);background:#ffffff0d;border-radius:4px;padding:3px 8px;font-size:10px;font-weight:700}.proposal-title{color:#fff;margin:0 0 12px;font-size:clamp(19px,2vw,22px);line-height:1.3}.proposal-desc{color:var(--text-sub);flex-grow:1;margin:0 0 20px;font-size:14px;line-height:1.55}.proposal-meta-row{background:#ffffff08;border:1px solid #ffffff0d;border-radius:12px;grid-template-columns:repeat(2,1fr);gap:12px;margin-bottom:20px;padding:12px 16px;display:grid}.proposal-meta-row small{font-family:var(--font-display);letter-spacing:.1em;color:var(--lime);margin-bottom:2px;font-size:10px;font-weight:700;display:block}.proposal-meta-row strong,.proposal-meta-row span{color:#fff;font-size:13px;font-weight:600}.proposal-meta-row span{color:var(--text-sub);font-size:12px;font-weight:400}.proposal-stack-tags{flex-wrap:wrap;gap:6px;margin-bottom:20px;display:flex}.stack-pill{font-family:var(--font-display);color:var(--lime);background:#aeff0014;border:1px solid #aeff0033;border-radius:6px;padding:3px 8px;font-size:11px}.proposal-highlights-list{border-top:1px solid #ffffff0f;flex-direction:column;gap:8px;margin-bottom:24px;padding-top:16px;display:flex}.highlight-row{color:var(--text-sub);align-items:flex-start;gap:8px;font-size:13px;line-height:1.45;display:flex}.highlight-dot{color:var(--lime);flex-shrink:0;margin-top:1px;font-size:12px;font-weight:700}.proposal-actions{flex-direction:column;gap:10px;margin-top:auto;display:flex}.proposal-download-btn{justify-content:center;padding:11px 18px;font-size:13.5px;font-weight:700}@media (max-width:960px){.master-proposal-hero{grid-template-columns:1fr;gap:28px;padding:24px}.master-primary-actions{flex-direction:column;align-items:stretch;width:100%}.master-download-action-btn,.master-scope-action-btn{width:100%}}.pricing-page{max-width:var(--content-max);margin:var(--section-space) auto;padding:0 var(--gutter)}.pricing-intro{max-width:760px;margin-bottom:40px}.pricing-intro h2{margin:0 0 14px;font-size:clamp(28px,3.4vw,44px);line-height:1.2}.pricing-intro p{color:var(--text-sub);margin:0;font-size:16px;line-height:1.6}.pricing-grid{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:24px;margin-bottom:56px;display:grid}.pricing-card{background:var(--card-bg);border:1px solid var(--card-border);-webkit-backdrop-filter:blur(16px);border-radius:24px;flex-direction:column;padding:32px;transition:all .25s;display:flex;position:relative}.pricing-card.popular{background:linear-gradient(135deg,#0e1c30e6 0%,#060e18f5 100%);border:1px solid #00e59973;transform:scale(1.02);box-shadow:0 24px 60px #00000080,inset 0 1px #ffffff26}@media (max-width:1100px){.pricing-card.popular{transform:none}}.pricing-card:hover{border-color:#00e59966;transform:translateY(-4px)}.popular-ribbon{background:var(--emerald-aurora);color:#03070d;font-family:var(--font-display);letter-spacing:.1em;border-radius:9999px;padding:4px 10px;font-size:10px;font-weight:800;position:absolute;top:-12px;right:24px;box-shadow:0 4px 16px #00e59966}.pricing-badge{font-family:var(--font-display);letter-spacing:.14em;color:var(--emerald-aurora);background:#00e5991f;border-radius:4px;margin-bottom:12px;padding:3px 8px;font-size:10px;font-weight:700;display:inline-block}.pricing-tier-name{color:#fff;margin:0 0 12px;font-size:20px}.pricing-amount{align-items:baseline;gap:8px;margin-bottom:14px;display:flex}.pricing-amount strong{color:#fff;font-size:clamp(24px,2.5vw,32px);font-weight:800;font-family:var(--font-display)}.pricing-amount small{color:var(--text-dim);font-size:13px}.pricing-desc{color:var(--text-sub);margin:0 0 20px;font-size:13px;line-height:1.5}.pricing-deliverables{border-top:1px solid #ffffff0f;flex-grow:1;margin-bottom:24px;padding-top:18px}.deliverables-heading{font-family:var(--font-display);letter-spacing:.12em;color:var(--text-dim);margin-bottom:12px;font-size:10px;font-weight:700;display:block}.pricing-deliverables ul{flex-direction:column;gap:10px;margin:0;padding:0;list-style:none;display:flex}.pricing-deliverables li{color:var(--text-sub);align-items:flex-start;gap:8px;font-size:13px;line-height:1.45;display:flex}.check-icon{color:var(--emerald-aurora);flex-shrink:0;margin-top:1px;font-size:12px;font-weight:700}.pricing-card-footer{margin-top:auto}.pricing-guarantees{grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:20px;display:grid}.guarantee-box{background:#ffffff05;border:1px solid #ffffff0f;border-radius:18px;padding:24px}.guarantee-icon{margin-bottom:12px;font-size:24px;display:block}.guarantee-box h4{color:#fff;margin:0 0 8px;font-size:15px}.guarantee-box p{color:var(--text-sub);margin:0;font-size:13px;line-height:1.5}.use-cases-page-wrapper{max-width:var(--content-max);margin:var(--section-space) auto;padding:0 var(--gutter)}.btn-modal-trigger{cursor:pointer;border:none;font-family:inherit}.footer-legal-links{flex-wrap:wrap;align-items:center;gap:16px;display:flex}.footer-legal-links a{color:var(--text-dim);font-size:12px;font-family:var(--font-display);transition:color .2s}.footer-legal-links a:hover{color:var(--emerald-aurora)}.project-modal-backdrop{z-index:9999;-webkit-backdrop-filter:blur(24px);background:#02060cd1;justify-content:center;align-items:center;padding:20px;animation:.25s cubic-bezier(.16,1,.3,1) forwards modalFadeIn;display:flex;position:fixed;inset:0}@keyframes modalFadeIn{0%{opacity:0}to{opacity:1}}.project-modal-window{background:linear-gradient(135deg,#0e1c30f5 0%,#060e18fa 100%);border:1px solid #00e59959;border-radius:28px;flex-direction:column;width:100%;max-width:820px;max-height:90vh;padding:clamp(24px,4vw,40px);animation:.3s cubic-bezier(.16,1,.3,1) forwards modalSlideUp;display:flex;position:relative;overflow-y:auto;box-shadow:0 32px 80px #000000b3,inset 0 1px #fff3}@keyframes modalSlideUp{0%{opacity:0;transform:translateY(24px)scale(.98)}to{opacity:1;transform:translateY(0)scale(1)}}.modal-header{justify-content:space-between;align-items:flex-start;gap:20px;margin-bottom:20px;display:flex}.modal-header-info{flex-grow:1}.modal-badge-row{align-items:center;gap:12px;margin-bottom:8px;display:flex}.modal-kicker{font-family:var(--font-display);letter-spacing:.12em;color:var(--emerald-aurora);background:#00e5991f;border-radius:4px;padding:3px 8px;font-size:11px;font-weight:800}.modal-step-counter{font-family:var(--font-display);color:var(--text-dim);letter-spacing:.08em;font-size:11px;font-weight:700}.modal-title{color:#fff;margin:0 0 6px;font-size:clamp(22px,2.6vw,30px);line-height:1.2}.modal-subtitle{color:var(--text-sub);margin:0;font-size:14px;line-height:1.5}.modal-close-btn{color:var(--text-sub);cursor:pointer;background:#ffffff0f;border:1px solid #ffffff1a;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:38px;height:38px;transition:all .2s;display:flex}.modal-close-btn:hover{color:#fff;background:#ffffff26;border-color:#ffffff40;transform:rotate(90deg)}.modal-progress-track{background:#ffffff0f;border-radius:9999px;width:100%;height:4px;margin-bottom:28px;overflow:hidden}.modal-progress-bar{background:linear-gradient(90deg, var(--emerald-aurora) 0%, #00b4d8 100%);border-radius:9999px;height:100%;transition:width .35s}.modal-body-form{flex-direction:column;flex-grow:1;display:flex}.modal-step-content{margin-bottom:28px;animation:.25s forwards stepFade}@keyframes stepFade{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}.modal-services-grid{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;display:grid}.modal-service-card{cursor:pointer;background:#ffffff08;border:1px solid #ffffff14;border-radius:18px;flex-direction:column;padding:18px;transition:all .2s;display:flex}.modal-service-card:hover{background:#ffffff0f;border-color:#00e59959;transform:translateY(-2px)}.modal-service-card.selected{border-color:var(--emerald-aurora);background:#00e59914;box-shadow:0 0 20px #00e59933}.card-top{justify-content:space-between;align-items:center;margin-bottom:12px;display:flex}.service-tag{font-family:var(--font-display);letter-spacing:.1em;color:var(--emerald-aurora);background:#00e5991a;border-radius:4px;padding:2px 6px;font-size:9px;font-weight:800}.custom-radio{border:1px solid #fff3;border-radius:50%;justify-content:center;align-items:center;width:18px;height:18px;display:flex}.modal-service-card.selected .custom-radio{border-color:var(--emerald-aurora)}.radio-inner{background:var(--emerald-aurora);border-radius:50%;width:8px;height:8px}.service-title{color:#fff;margin:0 0 6px;font-size:15px;font-weight:600}.service-desc{color:var(--text-sub);margin:0;font-size:12px;line-height:1.45}.form-group-block{margin-bottom:24px}.group-label{font-family:var(--font-display);letter-spacing:.1em;color:var(--text-dim);margin-bottom:12px;font-size:11px;font-weight:700;display:block}.modal-pills-grid{flex-wrap:wrap;gap:10px;display:flex}.modal-pill-option{color:var(--text-sub);cursor:pointer;background:#ffffff08;border:1px solid #ffffff14;border-radius:9999px;align-items:center;gap:8px;padding:10px 18px;font-family:inherit;font-size:13px;transition:all .2s;display:flex}.modal-pill-option:hover{color:#fff;background:#ffffff14;border-color:#fff3}.modal-pill-option.active{border-color:var(--emerald-aurora);color:#fff;background:#00e5991f;font-weight:600}.pill-dot{background:#ffffff4d;border-radius:50%;width:6px;height:6px}.modal-pill-option.active .pill-dot{background:var(--emerald-aurora)}.modal-fields-grid{grid-template-columns:repeat(2,1fr);gap:16px;display:grid}@media (max-width:640px){.modal-fields-grid{grid-template-columns:1fr}}.modal-field{flex-direction:column;gap:6px;display:flex}.modal-field.full-width{grid-column:1/-1}.modal-field label{font-size:12px;font-family:var(--font-display);color:var(--text-sub);font-weight:600}.modal-field label .req{color:var(--emerald-aurora)}.modal-field label .opt{color:var(--text-dim);font-weight:400}.modal-field input,.modal-field textarea{color:#fff;background:#00000059;border:1px solid #ffffff1a;border-radius:12px;padding:12px 16px;font-family:inherit;font-size:14px;transition:all .2s}.modal-field input:focus,.modal-field textarea:focus{border-color:var(--emerald-aurora);background:#00000080;outline:none;box-shadow:0 0 16px #00e59933}.review-summary-card{background:#00e5990d;border:1px solid #00e5994d;border-radius:20px;margin-bottom:24px;padding:24px}.summary-header{border-bottom:1px solid #00e59933;align-items:center;gap:14px;margin-bottom:20px;padding-bottom:16px;display:flex}.summary-check-icon{background:var(--emerald-aurora);color:#03070d;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:36px;height:36px;font-weight:800;display:flex}.summary-header h4{color:#fff;margin:0 0 4px;font-size:18px}.summary-header span{color:var(--emerald-aurora);font-size:13px}.summary-details-grid{grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px;display:grid}.summary-item small{font-family:var(--font-display);letter-spacing:.1em;color:var(--text-dim);margin-bottom:4px;font-size:10px;font-weight:700;display:block}.summary-item strong{color:#fff;font-size:13px}.dispatch-action-options{grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px;display:grid}.dispatch-btn{justify-content:center;padding:14px 20px;font-weight:700}.modal-footer-actions{border-top:1px solid #ffffff14;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px;padding-top:20px;display:flex}.modal-back-btn{color:var(--text-sub);font-size:13px;font-family:var(--font-display);cursor:pointer;background:0 0;border:none;align-items:center;gap:6px;transition:color .2s;display:flex}.modal-back-btn:hover{color:#fff}.modal-guarantee-note{color:var(--text-dim);align-items:center;gap:6px;font-size:12px;display:flex}.modal-next-btn{margin-left:auto}.legal-page-container{max-width:var(--content-max);margin:var(--section-space) auto;padding:0 var(--gutter)}.legal-intro-card{background:var(--card-bg);border:1px solid var(--card-border);-webkit-backdrop-filter:blur(16px);border-radius:24px;margin-bottom:40px;padding:clamp(28px,4vw,40px)}.legal-intro-card h2{margin:12px 0 14px;font-size:clamp(26px,3vw,38px);line-height:1.25}.legal-intro-card p{color:var(--text-sub);margin:0;font-size:16px;line-height:1.6}.legal-sections-grid{grid-template-columns:repeat(auto-fit,minmax(360px,1fr));gap:24px;display:grid}.legal-card{background:var(--card-bg);border:1px solid var(--card-border);-webkit-backdrop-filter:blur(16px);border-radius:20px;flex-direction:column;padding:28px;transition:all .2s;display:flex}.legal-card:hover{border-color:#00e59959;transform:translateY(-2px)}.legal-num{font-family:var(--font-display);letter-spacing:.12em;color:var(--emerald-aurora);background:#00e5991a;border-radius:4px;width:fit-content;margin-bottom:14px;padding:3px 8px;font-size:11px;font-weight:800}.legal-card h3{color:#fff;margin:0 0 10px;font-size:18px;line-height:1.35}.legal-card p{color:var(--text-sub);margin:0;font-size:14px;line-height:1.6}.sitemap-page-container{max-width:var(--content-max);margin:var(--section-space) auto;padding:0 var(--gutter)}.sitemap-intro-card{background:var(--card-bg);border:1px solid var(--card-border);-webkit-backdrop-filter:blur(16px);border-radius:24px;margin-bottom:40px;padding:clamp(28px,4vw,40px)}.sitemap-intro-card h2{margin:12px 0 14px;font-size:clamp(26px,3vw,38px);line-height:1.25}.sitemap-intro-card p{color:var(--text-sub);margin:0;font-size:16px;line-height:1.6}.sitemap-grid{grid-template-columns:repeat(auto-fit,minmax(360px,1fr));gap:28px;display:grid}.sitemap-column-card{background:var(--card-bg);border:1px solid var(--card-border);-webkit-backdrop-filter:blur(16px);border-radius:24px;flex-direction:column;padding:28px;display:flex}.sitemap-card-head{border-bottom:1px solid #ffffff14;justify-content:space-between;align-items:center;margin-bottom:20px;padding-bottom:14px;display:flex}.sitemap-badge{font-family:var(--font-display);letter-spacing:.12em;color:var(--emerald-aurora);background:#00e5991f;border-radius:4px;padding:3px 8px;font-size:10px;font-weight:800}.sitemap-category{color:#fff;font-size:14px;font-family:var(--font-display);letter-spacing:.05em;margin:0}.sitemap-links-list{flex-direction:column;gap:12px;display:flex}.sitemap-link-item{background:#ffffff05;border:1px solid #ffffff0f;border-radius:14px;padding:14px 18px;text-decoration:none;transition:all .2s;display:block}.sitemap-link-item:hover{background:#00e5990f;border-color:#00e5994d;transform:translate(4px)}.sitemap-link-head{flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:8px;margin-bottom:4px;display:flex}.sitemap-link-head strong{color:#fff;font-size:14px;font-weight:600}.sitemap-path{font-family:var(--font-mono,monospace);color:var(--emerald-aurora);background:#00e59914;border-radius:4px;padding:2px 6px;font-size:11px}.sitemap-link-item p{color:var(--text-sub);margin:0;font-size:12px;line-height:1.45}.floating-whatsapp-widget{z-index:9990;-webkit-backdrop-filter:blur(12px);cursor:pointer;background:linear-gradient(135deg,#25d366 0%,#128c7e 100%);border:1px solid #fff6;border-radius:9999px;align-items:center;gap:8px;padding:6px 14px 6px 8px;text-decoration:none;transition:all .22s cubic-bezier(.16,1,.3,1);display:flex;position:fixed;bottom:22px;right:22px;box-shadow:0 8px 24px #25d36661,0 3px 10px #00000080,inset 0 1px #fff6;color:#fff!important}.floating-whatsapp-widget:hover{background:linear-gradient(135deg,#2ee872 0%,#15a191 100%);border-color:#ffffffb3;transform:translateY(-3px)scale(1.02);box-shadow:0 12px 30px #25d36680,0 5px 14px #0009,inset 0 1px #fff9;color:#fff!important}.floating-whatsapp-icon-box{color:#fff;background:#ffffff38;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:28px;height:28px;display:flex;position:relative}.floating-whatsapp-icon-box .whatsapp-icon{width:16px;height:16px;fill:#fff!important;color:#fff!important}.online-indicator{background:#0f8;border:1.5px solid #128c7e;border-radius:50%;width:8px;height:8px;animation:2s ease-in-out infinite pulsePresence;position:absolute;bottom:-1px;right:-1px;box-shadow:0 0 5px #0f8}@keyframes pulsePresence{0%,to{opacity:1;transform:scale(1)}50%{opacity:.8;transform:scale(1.25)}}.floating-whatsapp-text{flex-direction:column;line-height:1.15;display:flex}.floating-whatsapp-text .whatsapp-title{font-family:var(--font-display);letter-spacing:.01em;text-shadow:0 1px 2px #00000059;font-size:12.5px;font-weight:700;color:#fff!important}.floating-whatsapp-text .whatsapp-status{font-family:var(--font-display);letter-spacing:.04em;text-shadow:0 1px 2px #00000040;font-size:9px;font-weight:600;color:#ffffffe6!important}.floating-whatsapp-widget .floating-arrow{flex-shrink:0;width:12px;height:12px;transition:transform .2s;color:#fff!important}.floating-whatsapp-widget:hover .floating-arrow{transform:translate(2px,-2px)}@media (max-width:900px){.floating-whatsapp-widget{gap:7px;padding:5px 12px 5px 7px;bottom:18px;right:18px}}@media (max-width:640px){.floating-whatsapp-widget{gap:6px;padding:5px 10px 5px 6px;bottom:14px;right:14px}.floating-whatsapp-icon-box{width:24px;height:24px}.floating-whatsapp-icon-box .whatsapp-icon{width:14px;height:14px}.floating-whatsapp-text .whatsapp-title{font-size:11.5px}.floating-whatsapp-text .whatsapp-status{display:none}}.mobile-menu-toggle-btn{width:38px;height:38px;color:var(--text-sub);cursor:pointer;background:#ffffff0f;border:1px solid #ffffff1f;border-radius:10px;justify-content:center;align-items:center;transition:all .2s;display:none}.mobile-menu-toggle-btn:hover{color:#fff;border-color:var(--emerald-aurora);background:#ffffff1f}.header-actions{align-items:center;gap:12px;display:flex}@media (max-width:992px){.site-nav{display:none}.mobile-menu-toggle-btn{display:flex}}.mobile-nav-drawer{background:#060c16fa;border-top:1px solid #ffffff14;border-radius:0 0 18px 18px;margin-top:10px;padding:18px 0 12px;animation:.2s cubic-bezier(.16,1,.3,1) forwards mobileNavFade}@keyframes mobileNavFade{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}.mobile-nav-links{flex-direction:column;gap:4px;display:flex}.mobile-nav-link{color:var(--text-sub);font-family:var(--font-display);border-radius:10px;justify-content:space-between;align-items:center;padding:11px 16px;font-size:14px;font-weight:500;text-decoration:none;transition:all .2s;display:flex}.mobile-nav-link:hover{color:var(--emerald-aurora);background:#00e59914;padding-left:20px}.mobile-nav-link svg{color:var(--text-dim);transition:transform .2s}.mobile-nav-link:hover svg{color:var(--emerald-aurora);transform:translate(2px,-2px)}@media (max-width:768px){.brand-logo-img{max-width:170px;height:clamp(38px,6vw,48px)}.footer-logo{max-width:210px;height:clamp(46px,7vw,60px)}.button-header-cta{padding:7px 12px;font-size:12px}.announcement-ribbon{padding:6px var(--gutter)}.announcement-text{text-align:center;font-size:11.5px}.hero-actions{flex-direction:column;width:100%}.hero-actions .button{justify-content:center;width:100%}.work-cases-grid{grid-template-columns:1fr}.client-pipeline-flow{flex-wrap:wrap;gap:6px}.flow-stage-pill{padding:3px 8px;font-size:11px}.legal-sections-grid,.sitemap-grid,.proposals-grid,.pricing-grid,.use-cases-grid,.direct-contacts-grid,.office-hubs-grid{grid-template-columns:1fr}.crm-top-bar{flex-direction:column;align-items:stretch}.crm-kanban-board{-webkit-overflow-scrolling:touch;padding-bottom:12px;overflow-x:auto}}.tco-calculator-section{width:100%;margin:56px 0 64px}.tco-calculator-card{-webkit-backdrop-filter:blur(20px);background:linear-gradient(135deg,#0e1c30f2 0%,#060e18fa 100%);border:1px solid #00e59959;border-radius:28px;padding:clamp(24px,4vw,44px);box-shadow:0 24px 70px #0009,inset 0 1px #ffffff26}.tco-card-head{border-bottom:1px solid #ffffff14;flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:28px;margin-bottom:36px;padding-bottom:28px;display:flex}.tco-title{color:#fff;margin:10px 0 8px;font-size:clamp(24px,2.8vw,36px);line-height:1.25}.tco-subtitle{color:var(--text-sub);max-width:680px;margin:0;font-size:15px;line-height:1.6}.tco-badge-savings{background:#00e5991f;border:1px solid #00e59966;border-radius:18px;flex-direction:column;flex-shrink:0;align-items:flex-start;padding:16px 24px;display:flex;box-shadow:0 8px 24px #00e59926}.tco-badge-savings small{font-family:var(--font-display);letter-spacing:.12em;color:var(--emerald-aurora);margin-bottom:4px;font-size:10px;font-weight:800}.tco-badge-savings strong{color:#fff;font-size:clamp(26px,3vw,36px);font-family:var(--font-display);text-shadow:0 0 16px #00e59966;font-weight:800;line-height:1.1}.tco-badge-savings span{color:var(--text-sub);margin-top:4px;font-size:12px}.tco-interactive-grid{grid-template-columns:1fr 1.35fr;gap:36px;display:grid}@media (max-width:1024px){.tco-interactive-grid{grid-template-columns:1fr}}.tco-controls-panel{background:#ffffff05;border:1px solid #ffffff0f;border-radius:20px;flex-direction:column;gap:24px;padding:24px;display:flex}.controls-heading{font-family:var(--font-display);letter-spacing:.08em;color:var(--text-dim);text-transform:uppercase;margin:0 0 8px;font-size:13px;font-weight:800}.control-group{flex-direction:column;gap:10px;display:flex}.control-label-row{justify-content:space-between;align-items:center;display:flex}.control-label-row label,.control-label{font-family:var(--font-display);color:#fff;font-size:13px;font-weight:700}.control-val-badge{font-family:var(--font-display);color:var(--emerald-aurora);background:#00e5991f;border-radius:6px;padding:3px 10px;font-size:12px;font-weight:800}.tco-range-slider{-webkit-appearance:none;appearance:none;background:#ffffff1a;border-radius:9999px;outline:none;width:100%;height:6px;transition:all .2s}.tco-range-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;background:var(--emerald-aurora);cursor:pointer;border:2px solid #03070d;border-radius:50%;width:20px;height:20px;transition:transform .15s;box-shadow:0 0 14px #00e599cc}.tco-range-slider::-webkit-slider-thumb:hover{transform:scale(1.2)}.slider-ticks{color:var(--text-dim);font-size:11px;font-family:var(--font-display);justify-content:space-between;display:flex}.complexity-options-grid{flex-direction:column;gap:10px;display:flex}.complexity-btn{text-align:left;cursor:pointer;background:#ffffff06;border:1px solid #ffffff14;border-radius:14px;flex-direction:column;gap:3px;padding:12px 16px;transition:all .2s;display:flex}.complexity-btn strong{color:#fff;font-size:14px}.complexity-btn small{color:var(--text-sub);font-size:12px}.complexity-btn:hover{background:#ffffff0f;border-color:#00e5994d}.complexity-btn.active{border-color:var(--emerald-aurora);background:#00e59917;box-shadow:0 0 16px #00e59926}.timeframe-switch-row{gap:8px;display:flex}.timeframe-pill{color:var(--text-sub);font-size:13px;font-weight:600;font-family:var(--font-display);cursor:pointer;background:#ffffff08;border:1px solid #ffffff14;border-radius:10px;flex:1;padding:10px;transition:all .2s}.timeframe-pill:hover{color:#fff;background:#ffffff14}.timeframe-pill.active{border-color:var(--emerald-aurora);color:#fff;background:#00e5991f;font-weight:700}.tco-results-panel{flex-direction:column;display:flex}.comparison-columns-grid{grid-template-columns:repeat(3,1fr);gap:16px;margin-top:14px;display:grid}@media (max-width:860px){.comparison-columns-grid{grid-template-columns:1fr}}.comparison-col{background:#ffffff05;border:1px solid #ffffff0f;border-radius:18px;flex-direction:column;padding:20px;display:flex;position:relative}.comparison-col.fimriq-winner{border:1px solid var(--emerald-aurora);background:linear-gradient(135deg,#00e59914 0%,#061814f2 100%);transform:scale(1.02);box-shadow:0 16px 40px #00e5992e}@media (max-width:860px){.comparison-col.fimriq-winner{transform:none}}.col-tag{font-family:var(--font-display);letter-spacing:.1em;color:var(--text-dim);margin-bottom:6px;font-size:9.5px;font-weight:800;display:block}.col-winner-badge{font-family:var(--font-display);letter-spacing:.1em;color:#03070d;background:var(--emerald-aurora);border-radius:9999px;width:fit-content;margin-bottom:8px;padding:3px 8px;font-size:9.5px;font-weight:800;display:inline-block;box-shadow:0 2px 8px #00e59966}.col-title{color:#fff;margin:0 0 12px;font-size:15px}.col-price-block{border-bottom:1px solid #ffffff14;margin-bottom:16px;padding-bottom:14px}.col-price-block strong{font-family:var(--font-display);color:#fff;font-size:28px;line-height:1.1;display:block}.col-price-block strong.emerald-highlight{color:var(--emerald-aurora);text-shadow:0 0 12px #00e59966}.col-price-block small{color:var(--text-sub);margin-top:4px;font-size:11px;display:block}.col-points{color:var(--text-sub);flex-direction:column;flex-grow:1;gap:10px;margin:0 0 20px;padding:0;font-size:12.5px;list-style:none;display:flex}.col-points li{align-items:flex-start;gap:6px;line-height:1.4;display:flex}.col-points li svg{color:var(--emerald-aurora);flex-shrink:0;width:14px;height:14px;margin-top:2px}.winner-action-box{margin-top:auto}.case-detail-hero{background:radial-gradient(circle at 50% 10%,#00e5991f 0%,#03070dfa 70%);border-bottom:1px solid #ffffff14;padding:140px 24px 60px}.case-detail-hero-inner{max-width:1200px;margin:0 auto}.case-breadcrumb-nav{font-family:var(--font-display);align-items:center;gap:10px;margin-bottom:24px;font-size:13px;display:flex}.case-back-link{color:var(--emerald-aurora);align-items:center;gap:6px;font-weight:700;text-decoration:none;transition:all .2s;display:inline-flex}.case-back-link:hover{color:#fff;transform:translate(-3px)}.breadcrumb-sep{color:var(--text-dim)}.breadcrumb-curr{color:var(--text-sub);font-weight:700}.case-hero-meta-row{flex-wrap:wrap;align-items:center;gap:12px;margin-bottom:20px;display:flex}.case-num-badge{font-family:var(--font-display);color:#03070d;background:var(--emerald-aurora);letter-spacing:.08em;border-radius:9999px;padding:4px 10px;font-size:11px;font-weight:800}.case-cat-pill{font-family:var(--font-display);color:#fff;letter-spacing:.06em;text-transform:uppercase;background:#ffffff0f;border:1px solid #ffffff1f;border-radius:9999px;padding:4px 12px;font-size:11px;font-weight:700}.case-region-pill{font-family:var(--font-display);color:var(--text-sub);font-size:12px;font-weight:700}.case-detail-title{color:#fff;max-width:900px;margin:0 0 16px;font-size:clamp(32px,4.5vw,56px);line-height:1.15}.case-detail-sub{color:var(--text-sub);max-width:820px;margin:0 0 36px;font-size:clamp(16px,1.8vw,20px);line-height:1.6}.case-quick-facts-bar{-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);background:#ffffff06;border:1px solid #ffffff14;border-radius:18px;grid-template-columns:repeat(4,1fr);gap:18px;padding:20px 24px;display:grid}@media (max-width:992px){.case-quick-facts-bar{grid-template-columns:repeat(2,1fr)}}@media (max-width:580px){.case-quick-facts-bar{grid-template-columns:1fr}}.quick-fact-item{flex-direction:column;gap:4px;display:flex}.quick-fact-item small{font-family:var(--font-display);letter-spacing:.1em;color:var(--text-dim);font-size:10px;font-weight:800}.quick-fact-item strong{color:#fff;font-size:14px}.quick-fact-doc-link{color:var(--emerald-aurora);font-family:var(--font-display);align-items:center;gap:6px;font-size:13px;font-weight:700;text-decoration:none;transition:all .2s;display:inline-flex}.quick-fact-doc-link:hover{color:#fff;text-decoration:underline}.case-detail-body-container{flex-direction:column;gap:64px;max-width:1200px;margin:0 auto;padding:60px 24px 100px;display:flex}.case-quote-card{background:linear-gradient(135deg,#00e5990f 0%,#0a1826e6 100%);border:1px solid #00e5994d;border-radius:24px;padding:40px clamp(24px,4vw,48px);position:relative;box-shadow:0 16px 50px #0006}.quote-mark{color:#00e59926;pointer-events:none;font-family:Georgia,serif;font-size:80px;line-height:1;position:absolute;top:16px;left:24px}.quote-text{color:#fff;z-index:1;margin:0 0 20px;font-size:clamp(17px,2vw,22px);font-style:italic;line-height:1.6;position:relative}.quote-author-block{flex-direction:column;gap:2px;display:flex}.quote-author-block strong{color:var(--emerald-aurora);font-size:15px;font-family:var(--font-display)}.quote-author-block span{color:var(--text-sub);font-size:13px}.case-section-block{flex-direction:column;gap:28px;display:flex}.case-block-head h2{color:#fff;margin:10px 0 6px;font-size:clamp(24px,3vw,36px)}.case-block-head p{color:var(--text-sub);max-width:700px;margin:0;font-size:15px}.case-metrics-grid{grid-template-columns:repeat(2,1fr);gap:20px;display:grid}@media (max-width:768px){.case-metrics-grid{grid-template-columns:1fr}}.metric-delta-card{background:#ffffff05;border:1px solid #ffffff14;border-radius:20px;flex-direction:column;gap:16px;padding:24px;transition:all .2s;display:flex}.metric-delta-card:hover{background:#ffffff0a;border-color:#00e59959}.metric-label{font-family:var(--font-display);color:var(--text-dim);text-transform:uppercase;letter-spacing:.08em;font-size:13px;font-weight:800}.delta-row{background:#0000004d;border-radius:14px;justify-content:space-between;align-items:center;gap:12px;padding:14px 18px;display:flex}.before-box,.after-box{flex-direction:column;gap:3px;display:flex}.before-box small,.after-box small{font-family:var(--font-display);letter-spacing:.1em;color:var(--text-dim);font-size:9.5px;font-weight:800}.before-box span{color:#ff6b6b;font-size:13px;text-decoration:line-through}.after-box strong{color:var(--emerald-aurora);font-size:16px;font-family:var(--font-display)}.arrow-sep{color:var(--text-dim);font-size:16px}.impact-pill{color:#fff;font-size:13px;font-weight:700;font-family:var(--font-display);background:#00e5991a;border:1px solid #00e59940;border-radius:10px;align-items:center;gap:8px;padding:8px 12px;display:inline-flex}.impact-check{color:var(--emerald-aurora);font-weight:900}.case-narrative-grid{grid-template-columns:1fr 1fr;gap:24px;display:grid}@media (max-width:768px){.case-narrative-grid{grid-template-columns:1fr}}.narrative-card{border-radius:22px;flex-direction:column;gap:12px;padding:32px;display:flex}.narrative-card.challenge{background:linear-gradient(135deg,#ff4b4b0a 0%,#120c0ee6 100%);border:1px solid #ff4b4b33}.narrative-card.solution{background:linear-gradient(135deg,#00e5990d 0%,#06141af2 100%);border:1px solid #00e5994d}.narrative-badge{font-family:var(--font-display);letter-spacing:.1em;border-radius:9999px;width:fit-content;padding:4px 10px;font-size:10px;font-weight:800}.narrative-badge.red{color:#ff6b6b;background:#ff4b4b26;border:1px solid #ff4b4b4d}.narrative-badge.emerald{color:var(--emerald-aurora);background:#00e59926;border:1px solid #00e5994d}.narrative-card h3{color:#fff;margin:0;font-size:20px}.narrative-card p{color:var(--text-sub);margin:0;font-size:14.5px;line-height:1.65}.architecture-tiers-flow{grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:20px;display:grid}.arch-tier-node{background:#ffffff05;border:1px solid #ffffff14;border-radius:20px;flex-direction:column;gap:12px;padding:24px;transition:all .2s;display:flex;position:relative}.arch-tier-node:hover{border-color:var(--emerald-aurora);box-shadow:0 12px 36px #00e5991f}.arch-tier-header{flex-direction:column;gap:6px;display:flex}.tier-step-num{font-family:var(--font-display);color:var(--emerald-aurora);font-size:11px;font-weight:800}.tier-badge-label{font-family:var(--font-display);letter-spacing:.1em;color:var(--text-dim);background:#ffffff0d;border-radius:4px;width:fit-content;padding:2px 8px;font-size:9.5px;font-weight:800}.tier-name{color:#fff;margin:4px 0 0;font-size:16px}.tier-desc{color:var(--text-sub);flex-grow:1;margin:0;font-size:13px;line-height:1.55}.tier-tech-pills{flex-wrap:wrap;gap:6px;margin-top:8px;display:flex}.tier-tech-pills .tech-pill{font-size:11px;font-family:var(--font-display);color:#fff;background:#00e59914;border:1px solid #00e59933;border-radius:6px;padding:3px 8px}.milestones-timeline-grid{grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px;display:grid}.milestone-card{background:#ffffff05;border:1px solid #ffffff0f;border-radius:18px;flex-direction:column;gap:8px;padding:20px;display:flex}.ms-head{justify-content:space-between;align-items:center;display:flex}.ms-phase{font-family:var(--font-display);color:var(--emerald-aurora);letter-spacing:.08em;font-size:10px;font-weight:800}.ms-duration{font-family:var(--font-display);color:var(--text-dim);font-size:11px;font-weight:700}.ms-title{color:#fff;margin:0;font-size:15px}.ms-outcome{color:var(--text-sub);margin:0;font-size:13px;line-height:1.5}.case-bottom-cta-box{background:linear-gradient(135deg,#0e1c30f2 0%,#060e18fa 100%);border:1px solid #00e59959;border-radius:24px;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:28px;padding:clamp(24px,4vw,40px);display:flex;box-shadow:0 20px 60px #0009}.cta-doc-info{align-items:center;gap:20px;display:flex}.doc-icon-wrapper{width:56px;height:56px;color:var(--emerald-aurora);background:#00e5991f;border:1px solid #00e5994d;border-radius:16px;flex-shrink:0;justify-content:center;align-items:center;font-size:24px;display:flex}.doc-label{font-family:var(--font-display);letter-spacing:.1em;color:var(--emerald-aurora);margin-bottom:4px;font-size:10px;font-weight:800;display:block}.cta-doc-info h4{color:#fff;margin:0 0 4px;font-size:18px}.cta-doc-info p{color:var(--text-sub);margin:0;font-size:13.5px}.cta-btn-group{flex-wrap:wrap;gap:12px;display:flex}.status-page-container{flex-direction:column;gap:56px;max-width:1200px;margin:0 auto;padding:40px 24px 100px;display:flex}.status-hero-card{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:linear-gradient(135deg,#0e1c30f2 0%,#060e18fa 100%);border:1px solid #00e59959;border-radius:28px;padding:clamp(24px,4vw,44px);box-shadow:0 24px 70px #0009}.status-indicator-badge{font-family:var(--font-display);letter-spacing:.1em;border-radius:9999px;align-items:center;gap:10px;margin-bottom:16px;padding:6px 14px;font-size:11px;font-weight:800;display:inline-flex}.status-indicator-badge.operational{color:var(--emerald-aurora);background:#00e5991f;border:1px solid #00e59966}.live-pulsing-dot{background:var(--emerald-aurora);border-radius:50%;width:8px;height:8px;animation:2s cubic-bezier(.4,0,.6,1) infinite liveBeaconPulse;box-shadow:0 0 10px #00e599e6}@keyframes liveBeaconPulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(1.4)}}.status-heading{color:#fff;margin:0 0 12px;font-size:clamp(26px,3.5vw,42px);line-height:1.2}.status-intro-text{color:var(--text-sub);max-width:800px;margin:0 0 36px;font-size:15px;line-height:1.6}.status-kpis-grid{background:#ffffff05;border:1px solid #ffffff0f;border-radius:20px;grid-template-columns:repeat(4,1fr);gap:18px;padding:20px 24px;display:grid}@media (max-width:900px){.status-kpis-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width:540px){.status-kpis-grid{grid-template-columns:1fr}}.status-kpi-item{flex-direction:column;gap:4px;display:flex}.status-kpi-item small{font-family:var(--font-display);letter-spacing:.1em;color:var(--text-dim);font-size:10px;font-weight:800}.status-kpi-item strong{font-family:var(--font-display);color:#fff;font-size:clamp(22px,2.5vw,32px);line-height:1.15}.status-kpi-item strong.emerald-highlight{color:var(--emerald-aurora);text-shadow:0 0 14px #00e59966}.status-kpi-item span{color:var(--text-sub);font-size:12px}.status-block-wrapper{flex-direction:column;gap:24px;display:flex}.status-block-head h3{color:#fff;margin:8px 0 4px;font-size:clamp(22px,2.6vw,32px)}.status-block-head p{color:var(--text-sub);max-width:700px;margin:0;font-size:14.5px}.system-nodes-list{flex-direction:column;gap:16px;display:flex}.system-node-card{background:#ffffff05;border:1px solid #ffffff14;border-radius:20px;flex-direction:column;gap:14px;padding:24px clamp(18px,3vw,28px);transition:all .2s;display:flex}.system-node-card:hover{background:#ffffff09;border-color:#00e5994d}.node-head{flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:16px;display:flex}.node-category{font-family:var(--font-display);letter-spacing:.1em;color:var(--text-dim);margin-bottom:4px;font-size:9.5px;font-weight:800;display:block}.node-name{color:#fff;margin:0;font-size:17px}.node-status-pill{color:var(--emerald-aurora);font-family:var(--font-display);background:#00e5991a;border:1px solid #00e59940;border-radius:9999px;align-items:center;gap:6px;padding:4px 10px;font-size:11px;font-weight:700;display:inline-flex}.mini-green-dot{background:var(--emerald-aurora);border-radius:50%;width:6px;height:6px}.node-desc{color:var(--text-sub);margin:0;font-size:13.5px;line-height:1.5}.node-uptime-row{background:#00000040;border-radius:12px;flex-direction:column;gap:8px;padding:12px 16px;display:flex}.uptime-bar-label{font-family:var(--font-display);color:var(--text-dim);justify-content:space-between;align-items:center;font-size:11px;display:flex}.uptime-bar-label .uptime-pct{color:var(--emerald-aurora);font-weight:800}.uptime-ticks-container{grid-template-columns:repeat(45,1fr);align-items:center;gap:3px;height:24px;display:grid}.uptime-tick-bar{border-radius:2px;height:100%;transition:opacity .15s}.uptime-tick-bar.operational{background:var(--emerald-aurora);opacity:.85}.uptime-tick-bar:hover{opacity:1;transform:scaleY(1.15)}.regional-latency-grid{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;display:grid}.latency-region-card{background:#ffffff05;border:1px solid #ffffff14;border-radius:16px;justify-content:space-between;align-items:center;gap:12px;padding:18px 20px;display:flex}.region-meta{align-items:center;gap:10px;display:flex}.region-flag{font-size:20px}.region-name{color:#fff;font-size:13.5px;font-family:var(--font-display)}.latency-val-block{flex-direction:column;align-items:flex-end;gap:2px;display:flex}.latency-num{font-family:var(--font-display);color:var(--emerald-aurora);font-size:16px;font-weight:800}.latency-status-tag{font-size:10px;font-family:var(--font-display);color:var(--text-dim);text-transform:uppercase}.maintenance-logs-list{flex-direction:column;gap:14px;display:flex}.maintenance-log-card{background:#ffffff05;border:1px solid #ffffff0f;border-radius:16px;flex-direction:column;gap:6px;padding:18px 22px;display:flex}.log-head{justify-content:space-between;align-items:center;display:flex}.log-date{font-family:var(--font-display);color:var(--text-dim);font-size:11px;font-weight:700}.log-impact-badge{font-family:var(--font-display);color:#03070d;background:var(--emerald-aurora);border-radius:4px;padding:2px 8px;font-size:10px;font-weight:800}.log-title{color:#fff;margin:2px 0 0;font-size:15px}.log-details{color:var(--text-sub);margin:0;font-size:13px;line-height:1.5}.status-footer-cta{background:linear-gradient(135deg,#0e1c30f2 0%,#060e18fa 100%);border:1px solid #00e59959;border-radius:24px;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:28px;padding:clamp(24px,4vw,40px);display:flex;box-shadow:0 20px 60px #0009}.status-cta-text h4{color:#fff;margin:0 0 6px;font-size:20px}.status-cta-text p{color:var(--text-sub);max-width:620px;margin:0;font-size:14px}.status-cta-actions{flex-wrap:wrap;gap:12px;display:flex}.blueprint-builder-section{width:100%;margin:60px 0 80px}.blueprint-builder-card{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:linear-gradient(135deg,#0e1c30f2 0%,#060e18fa 100%);border:1px solid #00e59959;border-radius:28px;padding:clamp(24px,4vw,44px);box-shadow:0 24px 70px #0009,inset 0 1px #ffffff26}.blueprint-header-row{border-bottom:1px solid #ffffff14;flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:28px;margin-bottom:36px;padding-bottom:28px;display:flex}.blueprint-subtext{color:var(--text-sub);max-width:680px;margin:0;font-size:15px;line-height:1.6}.blueprint-summary-badge{background:#00e5991f;border:1px solid #00e59966;border-radius:18px;flex-direction:column;flex-shrink:0;align-items:flex-start;padding:16px 24px;display:flex;box-shadow:0 8px 24px #00e59926}.blueprint-summary-badge small{font-family:var(--font-display);letter-spacing:.12em;color:var(--emerald-aurora);margin-bottom:4px;font-size:10px;font-weight:800}.blueprint-summary-badge strong{color:#fff;font-size:clamp(24px,2.8vw,32px);font-family:var(--font-display);text-shadow:0 0 16px #00e59966;font-weight:800;line-height:1.1}.blueprint-summary-badge span{color:var(--text-sub);margin-top:4px;font-size:12px}.blueprint-configurator-layout{grid-template-columns:1.25fr 1fr;gap:36px;display:grid}@media (max-width:1024px){.blueprint-configurator-layout{grid-template-columns:1fr}}.blueprint-option-btn{text-align:left;cursor:pointer;background:#ffffff06;border:1px solid #ffffff14;border-radius:16px;flex-direction:column;gap:4px;padding:16px 18px;transition:all .2s;display:flex}.blueprint-option-btn:hover{background:#ffffff0f;border-color:#00e5994d}.opt-name{color:#fff;font-size:14.5px;font-family:var(--font-display)}.checked-indicator{color:#03070d;background:var(--emerald-aurora);border-radius:50%;justify-content:center;align-items:center;width:16px;height:16px;font-size:10px;font-weight:900;display:flex}.blueprint-canvas-column{flex-direction:column;display:flex}.live-topology-card{background:#ffffff05;border:1px solid #ffffff14;border-radius:24px;flex-direction:column;gap:24px;padding:28px;display:flex;position:sticky;top:100px}.topology-card-head{justify-content:space-between;align-items:center;display:flex}.live-active-tag{font-family:var(--font-display);color:var(--emerald-aurora);letter-spacing:.08em;font-size:10.5px;font-weight:800}.topology-node{background:#00000059;border:1px solid #00e59940;border-radius:16px;align-items:center;gap:16px;padding:16px 18px;transition:all .2s;display:flex}.topology-node:hover{border-color:var(--emerald-aurora);box-shadow:0 4px 18px #00e59926}.topology-node.integrations-node{border-color:#ffffff26}.node-icon-box{flex-shrink:0;font-size:24px}.node-details{flex-direction:column;gap:2px;display:flex}.node-details strong{color:#fff;font-size:14.5px;font-family:var(--font-display)}.topology-connector-arrow{text-align:center;font-family:var(--font-display);color:var(--text-dim);padding:2px 0;font-size:11px;font-weight:700}.investment-header-row{flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:16px;display:flex}.investment-header-row strong.emerald-highlight{font-family:var(--font-display);color:var(--emerald-aurora);text-shadow:0 0 12px #00e59966;font-size:22px}.investment-header-row strong.white-highlight{font-family:var(--font-display);color:#fff;font-size:20px}.blueprint-features-list div svg{color:var(--emerald-aurora);width:14px;height:14px}.currency-switcher-wrapper{display:inline-block;position:relative}.currency-switcher-btn{cursor:pointer;color:#fff;font-family:var(--font-display);background:#ffffff0a;border:1px solid #ffffff1f;border-radius:9999px;align-items:center;gap:6px;padding:6px 12px;font-size:11.5px;font-weight:700;transition:all .2s;display:inline-flex}.currency-switcher-btn:hover{color:var(--emerald-aurora);background:#00e5991a;border-color:#00e59959}.curr-flag{font-size:13px;line-height:1}.curr-code{letter-spacing:.05em}.curr-arrow{color:var(--text-dim);font-size:8px}.currency-dropdown-menu{z-index:1000;-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);background:#060e18f5;border:1px solid #00e5994d;border-radius:16px;flex-direction:column;gap:4px;width:280px;padding:10px;animation:.15s ease-out dropdownFadeIn;display:flex;position:absolute;top:calc(100% + 8px);right:0;box-shadow:0 16px 45px #000c,0 0 20px #00e5991f}@keyframes dropdownFadeIn{0%{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}.dropdown-title{font-family:var(--font-display);letter-spacing:.1em;color:var(--text-dim);padding:6px 10px 4px;font-size:9.5px;font-weight:800}.currency-menu-item{cursor:pointer;text-align:left;background:0 0;border:none;border-radius:10px;align-items:center;gap:12px;width:100%;padding:8px 10px;transition:all .15s;display:flex}.currency-menu-item:hover{background:#00e59914}.currency-menu-item.active{background:#00e59924;border:1px solid #00e5994d}.menu-flag{font-size:20px}.menu-labels{flex-direction:column;flex-grow:1;display:flex}.menu-labels strong{color:#fff;font-size:13px;font-family:var(--font-display)}.menu-labels small{color:var(--text-sub);font-size:11px}.menu-check{color:var(--emerald-aurora);font-size:13px;font-weight:800}.pricing-tiers-wrapper{flex-direction:column;gap:32px;display:flex}.pricing-currency-header{background:#ffffff05;border:1px solid #ffffff14;border-radius:16px;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px;padding:12px 20px;display:flex}.currency-pills-bar{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.currency-bar-label{font-family:var(--font-display);letter-spacing:.1em;color:var(--text-dim);margin-right:4px;font-size:10.5px;font-weight:800}.currency-pill-btn{color:var(--text-sub);font-family:var(--font-display);cursor:pointer;background:#ffffff08;border:1px solid #ffffff1a;border-radius:9999px;align-items:center;gap:6px;padding:6px 14px;font-size:12px;font-weight:700;transition:all .2s;display:inline-flex}.currency-pill-btn:hover{color:#fff;background:#ffffff14}.currency-pill-btn.active{border-color:var(--emerald-aurora);color:var(--emerald-aurora);background:#00e59924;box-shadow:0 0 12px #00e59940}.regional-office-indicator{align-items:center;gap:6px;font-size:12.5px;display:flex}.office-flag{font-size:16px}.office-region{font-family:var(--font-display);color:#fff;font-weight:700}.office-note{color:var(--text-sub)}.insights-page-container{flex-direction:column;gap:40px;max-width:1200px;margin:0 auto;padding:20px 24px 100px;display:flex}.insights-filter-bar{border-bottom:1px solid #ffffff14;flex-wrap:wrap;gap:8px;padding-bottom:20px;display:flex}.insight-filter-btn{color:var(--text-sub);font-family:var(--font-display);cursor:pointer;background:#ffffff05;border:1px solid #ffffff14;border-radius:9999px;padding:8px 16px;font-size:11.5px;font-weight:700;transition:all .2s}.insight-filter-btn:hover{color:#fff;background:#ffffff0f}.insight-filter-btn.active{border-color:var(--emerald-aurora);color:var(--emerald-aurora);background:#00e5991f;box-shadow:0 0 12px #00e59933}.insights-articles-grid{grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:24px;display:grid}@media (max-width:768px){.insights-articles-grid{grid-template-columns:1fr}}.insight-card{cursor:pointer;background:linear-gradient(135deg,#0e1c30f2 0%,#060e18fa 100%);border:1px solid #ffffff14;border-radius:24px;flex-direction:column;justify-content:space-between;gap:16px;padding:clamp(22px,3vw,32px);transition:all .25s cubic-bezier(.16,1,.3,1);display:flex;box-shadow:0 10px 30px #0006}.insight-card:hover{border-color:#00e59966;transform:translateY(-4px);box-shadow:0 20px 50px #0009,0 0 30px #00e59926}.insight-card.featured-card{background:linear-gradient(135deg,#10243cf2 0%,#06101cfa 100%);border-color:#00e59959;grid-column:1/-1}.insight-card-head{justify-content:space-between;align-items:center;gap:12px;display:flex}.insight-category-tag{font-family:var(--font-display);letter-spacing:.1em;color:var(--emerald-aurora);background:#00e59914;border:1px solid #00e59940;border-radius:6px;padding:4px 10px;font-size:10px;font-weight:800}.insight-read-time{font-family:var(--font-display);color:var(--text-dim);font-size:11px;font-weight:700}.insight-title-btn{text-align:left;cursor:pointer;background:0 0;border:none;width:100%;padding:0}.insight-card-title{color:#fff;margin:0;font-size:clamp(18px,2.2vw,24px);line-height:1.3;transition:color .2s}.insight-title-btn:hover .insight-card-title{color:var(--emerald-aurora)}.insight-card.featured-card .insight-card-title{font-size:clamp(22px,2.6vw,30px)}.insight-card-summary{color:var(--text-sub);flex-grow:1;margin:0;font-size:14px;line-height:1.6}.insight-tags-row{flex-wrap:wrap;gap:6px;margin:4px 0 8px;display:flex}.insight-mini-tag{font-family:var(--font-display);color:var(--text-dim);background:#ffffff08;border:1px solid #ffffff0f;border-radius:4px;padding:2px 8px;font-size:10.5px}.insight-card-footer{border-top:1px solid #ffffff0f;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px;padding-top:16px;display:flex}.insight-author-meta{align-items:center;gap:10px;display:flex}.author-avatar{font-size:20px}.insight-author-meta div{flex-direction:column;display:flex}.insight-author-meta strong{color:#fff;font-size:12.5px;font-family:var(--font-display)}.insight-author-meta small{color:var(--text-dim);font-size:11px}.insight-read-btn{color:var(--emerald-aurora);font-family:var(--font-display);cursor:pointer;background:0 0;border:none;align-items:center;gap:6px;padding:0;font-size:12px;font-weight:800;transition:gap .2s;display:inline-flex}.insight-read-btn:hover{gap:10px;text-decoration:underline}.article-modal-overlay{-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);z-index:10000;background:#03070de0;justify-content:center;align-items:flex-start;padding:clamp(20px,4vw,60px) 16px;display:flex;position:fixed;inset:0;overflow-y:auto}.article-modal-container{background:linear-gradient(135deg,#0e1c30fa 0%,#060e18fc 100%);border:1px solid #00e59959;border-radius:28px;flex-direction:column;gap:28px;width:100%;max-width:860px;padding:clamp(24px,4vw,48px);animation:.25s cubic-bezier(.16,1,.3,1) modalSlideUp;display:flex;position:relative;box-shadow:0 30px 90px #000000e6,0 0 40px #00e59926}.article-modal-head{justify-content:space-between;align-items:center;display:flex}.article-modal-title{color:#fff;margin:0;font-size:clamp(24px,3.2vw,36px);line-height:1.25}.article-modal-author-bar{border-bottom:1px solid #ffffff14;align-items:center;gap:14px;padding-bottom:20px;display:flex}.author-avatar-lg{font-size:28px}.article-modal-author-bar div{flex-direction:column;gap:2px;display:flex}.article-modal-author-bar strong{color:#fff;font-size:14px;font-family:var(--font-display)}.article-modal-author-bar span{color:var(--text-dim);font-size:12px}.article-modal-body{flex-direction:column;gap:28px;display:flex}.article-lead-paragraph{color:#fff;border-left:3px solid var(--emerald-aurora);margin:0;padding-left:18px;font-size:16px;font-style:italic;line-height:1.7}.article-content-section{flex-direction:column;gap:14px;display:flex}.article-content-section h3{color:#fff;margin:12px 0 0;font-size:clamp(18px,2.2vw,22px)}.article-content-section p{color:var(--text-sub);margin:0;font-size:14.5px;line-height:1.7}.article-takeaways-box{background:#00e5990f;border:1px solid #00e59940;border-radius:16px;flex-direction:column;gap:10px;margin:8px 0;padding:18px 22px;display:flex}.takeaways-title{font-family:var(--font-display);letter-spacing:.1em;color:var(--emerald-aurora);font-size:10.5px;font-weight:800}.article-takeaways-box ul{flex-direction:column;gap:8px;margin:0;padding:0;list-style:none;display:flex}.article-takeaways-box li{color:#fff;align-items:flex-start;gap:10px;font-size:13.5px;line-height:1.5;display:flex}.article-takeaways-box li svg{color:var(--emerald-aurora);flex-shrink:0;width:14px;height:14px;margin-top:2px}.article-code-wrapper{background:#02060b;border:1px solid #ffffff1a;border-radius:14px;margin:8px 0;overflow:hidden}.code-header{font-family:var(--font-mono);color:var(--text-dim);letter-spacing:.05em;background:#ffffff08;border-bottom:1px solid #ffffff14;padding:8px 16px;font-size:10.5px;font-weight:700}.article-code-block{margin:0;padding:16px;overflow-x:auto}.article-code-block code{font-family:var(--font-mono);color:var(--emerald-aurora);font-size:12.5px;line-height:1.55}.article-modal-footer-cta{background:#ffffff05;border:1px solid #00e5994d;border-radius:20px;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:20px;margin-top:12px;padding:24px clamp(18px,3vw,28px);display:flex}.article-modal-footer-cta h4{color:#fff;margin:0 0 4px;font-size:17px}.article-modal-footer-cta p{color:var(--text-sub);margin:0;font-size:13.5px}.article-footer-btns{flex-wrap:wrap;gap:10px;display:flex}.products-overview-section{max-width:1280px;margin:0 auto;padding:0 24px 80px}.products-grid-catalog{grid-template-columns:repeat(auto-fill,minmax(360px,1fr));gap:28px;display:grid}@media (max-width:768px){.products-grid-catalog{grid-template-columns:1fr}}.product-catalog-card{background:linear-gradient(135deg,#0e1c30f2 0%,#060e18fa 100%);border:1px solid #ffffff14;border-radius:28px;flex-direction:column;gap:20px;padding:clamp(24px,3.5vw,36px);transition:all .25s cubic-bezier(.16,1,.3,1);display:flex;box-shadow:0 10px 30px #0006}.product-catalog-card:hover{border-color:#00e59966;transform:translateY(-4px);box-shadow:0 20px 50px #0009,0 0 30px #00e59926}.card-top-header{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;display:flex}.prod-badge{font-family:var(--font-display);letter-spacing:.1em;color:var(--emerald-aurora);background:#00e59914;border:1px solid #00e59940;border-radius:6px;padding:4px 10px;font-size:10px;font-weight:800}.single-tenant-pill{font-family:var(--font-mono);color:var(--text-dim);background:#ffffff08;border:1px solid #ffffff0f;border-radius:4px;padding:3px 8px;font-size:10px;font-weight:700}.prod-name{color:#fff;margin:0;font-size:clamp(24px,2.8vw,32px);line-height:1.2}.prod-tagline{color:var(--emerald-aurora);margin:0;font-size:14.5px;font-weight:600;line-height:1.4}.prod-summary{color:var(--text-sub);flex-grow:1;margin:0;font-size:13.5px;line-height:1.6}.prod-metrics-strip{background:#0000004d;border:1px solid #ffffff0f;border-radius:14px;grid-template-columns:1fr 1fr;gap:12px;padding:14px 16px;display:grid}.prod-metric-box{flex-direction:column;gap:2px;display:flex}.metric-val{font-family:var(--font-display);color:var(--emerald-aurora);font-size:20px;font-weight:800}.metric-lbl{color:var(--text-dim);letter-spacing:.05em;font-size:10px;font-weight:700}.prod-benefits-list{flex-direction:column;gap:8px;display:flex}.prod-benefit-item{color:var(--text-sub);align-items:flex-start;gap:10px;font-size:13px;line-height:1.45;display:flex}.prod-benefit-item svg{color:var(--emerald-aurora);flex-shrink:0;width:14px;height:14px;margin-top:2px}.prod-card-actions{flex-direction:column;gap:10px;margin-top:6px;display:flex}.product-enterprise-banner{max-width:1280px;margin:0 auto 80px;padding:0 24px}.banner-content-box{background:linear-gradient(135deg,#10243cf2 0%,#06101cfa 100%);border:1px solid #00e59959;border-radius:28px;flex-direction:column;gap:18px;padding:clamp(28px,4vw,56px);display:flex;box-shadow:0 20px 60px #0009}.banner-btn-group{flex-wrap:wrap;gap:14px;margin-top:10px;display:flex}.product-hero-meta-strip{border-top:1px solid #ffffff14;flex-wrap:wrap;gap:24px;margin-top:16px;padding-top:20px;display:flex}.hero-meta-item{flex-direction:column;gap:4px;display:flex}.hero-meta-item small{font-family:var(--font-display);color:var(--text-dim);letter-spacing:.1em;font-size:10px;font-weight:800}.hero-meta-item strong{color:#fff;font-size:13.5px}.product-kpis-section{max-width:1280px;margin:0 auto;padding:0 24px 50px}.kpis-inner-grid{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:20px;display:grid}.kpi-block-card{background:#0e1c30cc;border:1px solid #ffffff14;border-radius:20px;flex-direction:column;gap:4px;padding:24px;display:flex}.kpi-value-text{font-family:var(--font-display);color:var(--emerald-aurora);font-size:clamp(28px,3.5vw,38px);font-weight:800;line-height:1.1}.kpi-label-text{font-family:var(--font-display);color:#fff;letter-spacing:.05em;margin-top:6px;font-size:11.5px;font-weight:800}.kpi-sub-text{color:var(--text-dim);font-size:12px}.product-interactive-sandbox-section{max-width:1280px;margin:0 auto;padding:0 24px 80px}.sandbox-wrapper-container{width:100%}.product-architecture-specs-section{max-width:1280px;margin:0 auto;padding:0 24px 80px}.specs-head{flex-direction:column;gap:12px;max-width:760px;margin-bottom:36px;display:flex}.specs-layers-grid{grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:20px;display:grid}.spec-layer-card{background:#0e1c30d9;border:1px solid #ffffff14;border-radius:20px;flex-direction:column;gap:10px;padding:24px;display:flex}.layer-tag{font-family:var(--font-mono);color:var(--emerald-aurora);letter-spacing:.05em;font-size:10px;font-weight:700}.spec-layer-card h3{color:#fff;margin:0;font-size:18px}.spec-layer-card p{color:var(--text-sub);margin:0;font-size:13px;line-height:1.5}.product-features-section{max-width:1280px;margin:0 auto;padding:0 24px 80px}.features-inner-grid{grid-template-columns:1fr 1fr;gap:40px;display:grid}@media (max-width:860px){.features-inner-grid{grid-template-columns:1fr}}.features-intro-col{flex-direction:column;gap:16px;display:flex}.compliance-pills-row{flex-direction:column;gap:8px;margin-top:16px;display:flex}.comp-label{font-family:var(--font-display);letter-spacing:.1em;color:var(--text-dim);font-size:10.5px;font-weight:800}.comp-pill{color:#fff;align-items:center;gap:8px;font-size:13px;display:inline-flex}.comp-pill svg{color:var(--emerald-aurora);width:14px;height:14px}.features-cards-col{flex-direction:column;gap:16px;display:flex}.product-feature-card{background:#0e1c30d9;border:1px solid #ffffff14;border-radius:18px;flex-direction:column;gap:6px;padding:22px;display:flex}.product-feature-card h4{color:#fff;margin:0;font-size:16px}.product-feature-card p{color:var(--text-sub);margin:0;font-size:13.5px;line-height:1.5}.product-detail-cta-banner{max-width:1280px;margin:0 auto 100px;padding:0 24px}.cta-banner-card{background:linear-gradient(135deg,#10243cf2 0%,#06101cfa 100%);border:1px solid #00e59959;border-radius:28px;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:32px;padding:clamp(28px,4vw,48px);display:flex;box-shadow:0 20px 60px #0009}.cta-action-buttons{flex-wrap:wrap;gap:12px;display:flex}.product-demo-sandbox{background:linear-gradient(135deg,#0a1626fa 0%,#040a12fc 100%);border:1px solid #00e5994d;border-radius:28px;flex-direction:column;gap:28px;padding:clamp(20px,3vw,36px);display:flex;box-shadow:0 25px 80px #000c,0 0 40px #00e5991a}.demo-header-bar{border-bottom:1px solid #ffffff14;flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:20px;padding-bottom:20px;display:flex}.demo-title-group{flex-direction:column;gap:8px;max-width:700px;display:flex}.demo-badge{font-family:var(--font-display);letter-spacing:.1em;color:var(--emerald-aurora);font-size:10px;font-weight:800}.demo-title-group h3{color:#fff;margin:0;font-size:clamp(20px,2.5vw,26px)}.demo-title-group p{color:var(--text-sub);margin:0;font-size:13.5px;line-height:1.5}.sample-selector-pills{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.sample-label{font-family:var(--font-display);letter-spacing:.08em;color:var(--text-dim);font-size:10px;font-weight:800}.sample-pill-btn{color:var(--text-sub);font-family:var(--font-display);cursor:pointer;background:#ffffff08;border:1px solid #ffffff1a;border-radius:9999px;padding:6px 14px;font-size:11.5px;font-weight:700;transition:all .2s}.sample-pill-btn:hover{color:#fff;background:#ffffff14}.sample-pill-btn.active{border-color:var(--emerald-aurora);color:var(--emerald-aurora);background:#00e59924;box-shadow:0 0 12px #00e59940}.demo-workspace-grid{grid-template-columns:1fr 1fr;gap:24px;display:grid}@media (max-width:900px){.demo-workspace-grid{grid-template-columns:1fr}}.doc-scanner-canvas{background:#040a12;border:1px solid #ffffff14;border-radius:20px;flex-direction:column;gap:16px;padding:20px;display:flex;position:relative}.scanner-top-bar{justify-content:space-between;align-items:center;font-size:12px;display:flex}.scanner-file-name{font-family:var(--font-mono);color:#fff}.scanner-status-tag{font-family:var(--font-display);color:var(--emerald-aurora);letter-spacing:.05em;font-size:10px;font-weight:800}.doc-preview-wrapper{color:#111827;background:#fff;border-radius:12px;padding:20px;position:relative;overflow:hidden;box-shadow:0 10px 25px #00000080}.scanning-laser-beam{background:var(--emerald-aurora);height:4px;box-shadow:0 0 16px var(--emerald-aurora);z-index:10;animation:1.5s ease-in-out infinite alternate scanLaser;position:absolute;top:0;left:0;right:0}@keyframes scanLaser{0%{transform:translateY(0)}to{transform:translateY(300px)}}.mock-invoice-paper{flex-direction:column;gap:12px;font-size:11.5px;display:flex}.mock-inv-head{border-bottom:2px solid #e5e7eb;justify-content:space-between;padding-bottom:8px;display:flex}.mock-inv-head h4{color:#111827;margin:0 0 2px;font-size:13.5px}.mock-inv-meta{flex-direction:column;align-items:flex-end;display:flex}.mock-inv-po-row{color:#4b5563;justify-content:space-between;font-size:11px;display:flex}.mock-inv-table{border:1px solid #e5e7eb;border-radius:6px;flex-direction:column;display:flex;overflow:hidden}.mock-table-head{background:#f3f4f6;grid-template-columns:2fr 1fr 1fr;padding:6px 10px;font-size:10.5px;font-weight:700;display:grid}.mock-table-row{border-top:1px solid #f3f4f6;grid-template-columns:2fr 1fr 1fr;padding:6px 10px;display:grid}.mock-inv-total-box{flex-direction:column;align-items:flex-end;gap:3px;padding-top:6px;display:flex}.mock-total-line{gap:20px;display:flex}.mock-total-line.grand{border-top:1px solid #111827;padding-top:4px;font-size:13px}.zero-retention-strip{background:#00e59914;border:1px solid #00e59940;border-radius:12px;align-items:center;gap:10px;padding:10px 14px;display:flex}.guard-icon{font-size:18px}.zero-retention-strip strong{color:var(--emerald-aurora);font-size:12px}.zero-retention-strip p{color:var(--text-sub);margin:0;font-size:11px}.doc-extracted-panel{flex-direction:column;gap:16px;display:flex}.panel-tab-head{justify-content:space-between;align-items:center;display:flex}.panel-tab-title{font-family:var(--font-display);letter-spacing:.08em;color:#fff;font-size:11px;font-weight:800}.zod-badge{font-family:var(--font-mono);color:var(--emerald-aurora);background:#00e5991f;border:1px solid #00e5994d;border-radius:6px;padding:3px 8px;font-size:10px;font-weight:700}.match-card-grid{grid-template-columns:1fr 1fr;gap:12px;display:grid}.match-status-card{background:#ffffff08;border:1px solid #ffffff14;border-radius:14px;flex-direction:column;gap:2px;padding:14px;display:flex}.match-status-card.matched strong{color:var(--emerald-aurora);font-size:18px;font-family:var(--font-display)}.match-status-card.speed strong{color:#fff;font-size:18px;font-family:var(--font-display)}.match-card-label{letter-spacing:.05em;color:var(--text-dim);font-size:9.5px;font-weight:800}.match-status-card small{color:var(--text-dim);font-size:11px}.extracted-fields-list{background:#0006;border:1px solid #ffffff0f;border-radius:16px;flex-direction:column;gap:10px;padding:16px;font-size:12.5px;display:flex}.extracted-field-row{justify-content:space-between;align-items:center;gap:12px;display:flex}.field-key{color:var(--text-dim);font-family:var(--font-mono);font-size:11px}.field-val{color:#fff;font-family:var(--font-display);text-align:right;font-weight:600}.field-val.highlight{color:var(--emerald-aurora)}.extracted-field-row.total-highlight{border-top:1px solid #ffffff1a;padding-top:8px}.field-val-total{font-family:var(--font-display);color:var(--emerald-aurora);font-size:16px;font-weight:800}.erp-sync-container{flex-direction:column;gap:10px;display:flex}.sync-title{font-family:var(--font-display);letter-spacing:.08em;color:var(--text-dim);font-size:10.5px;font-weight:800}.sync-buttons-row{flex-wrap:wrap;gap:8px;display:flex}.sync-btn{color:#fff;font-family:var(--font-display);cursor:pointer;background:#ffffff08;border:1px solid #ffffff1f;border-radius:8px;align-items:center;gap:6px;padding:8px 14px;font-size:11.5px;font-weight:700;transition:all .2s;display:inline-flex}.sync-btn:hover{border-color:var(--emerald-aurora);color:var(--emerald-aurora);background:#00e59926}.sync-notification-badge{border:1px solid var(--emerald-aurora);color:var(--emerald-aurora);background:#00e5991a;border-radius:8px;align-items:center;gap:8px;padding:10px 14px;font-size:12px;animation:.2s modalSlideUp;display:flex}.demo-mode-switcher{flex-wrap:wrap;gap:8px;display:flex}.mode-switch-btn{color:var(--text-sub);font-family:var(--font-display);cursor:pointer;background:#ffffff08;border:1px solid #ffffff1a;border-radius:10px;padding:8px 16px;font-size:12px;font-weight:700;transition:all .2s}.mode-switch-btn:hover{color:#fff;background:#ffffff14}.mode-switch-btn.active{border-color:var(--emerald-aurora);color:var(--emerald-aurora);background:#00e59924}.fieldpulse-dispatch-grid{grid-template-columns:1fr 1fr;gap:24px;display:grid}@media (max-width:860px){.fieldpulse-dispatch-grid{grid-template-columns:1fr}}.fp-column-card{background:#0e1c30cc;border:1px solid #ffffff14;border-radius:20px;flex-direction:column;gap:16px;padding:20px;display:flex}.fp-card-header{justify-content:space-between;align-items:center;display:flex}.fp-card-header h4{color:#fff;margin:0;font-size:15px}.gps-live-tag,.queue-count-tag{font-family:var(--font-mono);color:var(--emerald-aurora);font-size:10px;font-weight:700}.fp-techs-list,.fp-orders-list{flex-direction:column;gap:12px;display:flex}.fp-tech-item{background:#ffffff05;border:1px solid #ffffff0f;border-radius:14px;align-items:center;gap:12px;padding:12px 14px;display:flex}.tech-avatar-circle{width:36px;height:36px;color:var(--emerald-aurora);font-family:var(--font-display);background:#00e59926;border-radius:50%;justify-content:center;align-items:center;font-size:12px;font-weight:800;display:flex}.tech-details{flex-direction:column;flex-grow:1;gap:2px;display:flex}.tech-name-row{justify-content:space-between;align-items:center;display:flex}.tech-status-tag{font-family:var(--font-display);text-transform:uppercase;border-radius:4px;padding:2px 6px;font-size:9.5px;font-weight:800}.tech-status-tag.available{color:var(--emerald-aurora);background:#00e5991f}.tech-status-tag.en_route{color:#ffb300;background:#ffb30026}.tech-region{color:var(--text-dim);font-size:11.5px}.tech-skills-row{gap:6px;margin-top:4px;display:flex}.skill-pill{color:var(--text-sub);background:#ffffff0a;border-radius:4px;padding:1px 6px;font-size:9.5px}.battery-pill{color:var(--text-dim);font-size:9.5px}.fp-order-card{background:#ffffff05;border:1px solid #ffffff14;border-radius:14px;flex-direction:column;gap:8px;padding:14px;display:flex}.order-head-row{justify-content:space-between;align-items:center;display:flex}.order-id{font-family:var(--font-mono);color:var(--text-dim);font-size:11px}.priority-badge{font-family:var(--font-display);border-radius:4px;padding:2px 6px;font-size:9.5px;font-weight:800}.priority-badge.emergency{color:#ef4444;background:#ef444426}.priority-badge.high{color:#ffb300;background:#ffb30026}.priority-badge.medium{color:var(--emerald-aurora);background:#00e5991a}.order-title{color:#fff;margin:0;font-size:13.5px}.order-customer{color:var(--text-sub);margin:0;font-size:12px}.tech-select-dropdown{color:#fff;cursor:pointer;background:#00000080;border:1px solid #ffffff1f;border-radius:6px;width:100%;padding:6px 10px;font-size:11.5px}.assigned-status-badge{color:var(--emerald-aurora);align-items:center;gap:6px;font-size:11.5px;display:flex}.pwa-simulator-wrapper{grid-template-columns:340px 1fr;align-items:flex-start;gap:32px;display:grid}@media (max-width:768px){.pwa-simulator-wrapper{grid-template-columns:1fr}}.pwa-device-frame{background:#02060b;border:3px solid #ffffff26;border-radius:36px;padding:12px;box-shadow:0 20px 50px #000c}.pwa-app-screen{background:#08121e;border-radius:26px;flex-direction:column;gap:14px;padding:16px;display:flex}.pwa-status-bar{justify-content:space-between;align-items:center;font-size:11px;display:flex}.offline-toggle-btn{color:#fff;cursor:pointer;background:#ffffff0d;border:1px solid #ffffff1a;border-radius:9999px;padding:3px 8px;font-size:9.5px}.pwa-job-header h3{color:#fff;margin:4px 0 2px;font-size:14.5px}.pwa-job-tag{font-family:var(--font-mono);color:var(--emerald-aurora);font-size:9.5px}.pwa-checklist-section{flex-direction:column;gap:6px;display:flex}.checklist-title{font-family:var(--font-display);letter-spacing:.05em;color:var(--text-dim);font-size:9.5px;font-weight:800}.checklist-item{color:#fff;background:#0000004d;border-radius:8px;align-items:center;gap:6px;padding:6px 8px;font-size:11px;display:flex}.check-icon{color:var(--emerald-aurora);font-weight:800}.pwa-sign-box{flex-direction:column;gap:8px;display:flex}.sign-label{font-family:var(--font-display);color:var(--text-dim);font-size:9.5px;font-weight:800}.sign-canvas{background:#0000004d;border:1px dashed #fff3;border-radius:10px;justify-content:center;align-items:center;height:70px;display:flex}.sign-canvas.signed{border-style:solid;border-color:var(--emerald-aurora)}.mock-signature{color:var(--emerald-aurora);flex-direction:column;align-items:center;display:flex}.mock-signature em{font-family:cursive;font-size:16px}.mock-signature small{color:var(--text-dim);font-size:8.5px}.sign-prompt{color:var(--text-dim);font-size:10px}.whatsapp-dispatch-card{background:#00e59914;border:1px solid #00e5994d;border-radius:10px;align-items:center;gap:8px;padding:8px 10px;font-size:11px;display:flex}.whatsapp-dispatch-card strong{color:var(--emerald-aurora);display:block}.whatsapp-dispatch-card p{color:var(--text-sub);margin:0}.pwa-explainer-side{flex-direction:column;display:flex}.explainer-card{background:#0e1c30cc;border:1px solid #ffffff14;border-radius:20px;flex-direction:column;gap:14px;padding:24px;display:flex}.explainer-badge{font-family:var(--font-display);color:var(--emerald-aurora);font-size:10px;font-weight:800}.explainer-card h4{color:#fff;margin:0;font-size:18px}.explainer-card p{color:var(--text-sub);margin:0;font-size:13.5px;line-height:1.5}.explainer-card ul{flex-direction:column;gap:10px;margin:0;padding:0;list-style:none;display:flex}.explainer-card li{color:var(--text-sub);align-items:flex-start;gap:8px;font-size:13px;display:flex}.explainer-card li svg{color:var(--emerald-aurora);flex-shrink:0;width:14px;height:14px;margin-top:2px}.payflow-dashboard-grid{grid-template-columns:1.2fr 1fr;gap:24px;display:grid}@media (max-width:860px){.payflow-dashboard-grid{grid-template-columns:1fr}}.payflow-vault-card{background:#0e1c30d9;border:1px solid #ffffff14;border-radius:20px;flex-direction:column;gap:20px;padding:24px;display:flex}.vault-header{justify-content:space-between;align-items:flex-start;display:flex}.vault-badge{font-family:var(--font-mono);color:var(--emerald-aurora);font-size:10px;display:block}.vault-header h4{color:#fff;margin:4px 0 0;font-size:18px}.vault-security-pill{font-family:var(--font-mono);color:var(--emerald-aurora);background:#00e59914;border-radius:4px;padding:3px 8px;font-size:9.5px;font-weight:700}.milestones-track-list{flex-direction:column;gap:12px;display:flex}.milestone-row-card{background:#0000004d;border:1px solid #ffffff0f;border-radius:14px;gap:14px;padding:14px;display:flex}.milestone-status-indicator{background:#ffffff0d;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:28px;height:28px;font-size:12px;display:flex}.milestone-row-card.released .milestone-status-indicator{color:var(--emerald-aurora);background:#00e59926}.milestone-content{flex-direction:column;flex-grow:1;gap:6px;display:flex}.milestone-title-bar{justify-content:space-between;align-items:center;display:flex}.milestone-amount{font-family:var(--font-display);color:var(--emerald-aurora);font-size:13.5px;font-weight:800}.milestone-deliverable{color:var(--text-sub);margin:0;font-size:12px}.released-tag{color:var(--emerald-aurora);align-items:center;gap:4px;font-size:11px;display:flex}.escrow-lock-actions{border-top:1px solid #ffffff0f;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px;padding-top:6px;display:flex}.escrow-holding-text{color:var(--text-dim);font-size:11px}.button-sm{padding:6px 12px!important;font-size:11.5px!important}.pending-deposit-tag{color:var(--text-dim);font-size:11px}.vault-release-banner{border:1px solid var(--emerald-aurora);color:var(--emerald-aurora);background:#00e5991a;border-radius:12px;align-items:center;gap:8px;padding:12px 16px;font-size:12.5px;display:flex}.payflow-side-column{flex-direction:column;gap:20px;display:flex}.clearing-rail-card,.dunning-simulator-card{background:#0e1c30d9;border:1px solid #ffffff14;border-radius:20px;flex-direction:column;gap:12px;padding:20px;display:flex}.rail-badge,.dunning-tag{font-family:var(--font-display);color:var(--emerald-aurora);font-size:10px;font-weight:800}.clearing-rail-card h4{color:#fff;margin:0;font-size:16px}.rail-kpis{background:#0000004d;border-radius:12px;grid-template-columns:1fr 1fr;gap:12px;padding:12px;display:grid}.rail-kpis div{flex-direction:column;display:flex}.rail-kpis small{color:var(--text-dim);font-size:10px}.rail-kpis strong{color:#fff;font-size:12px}.dunning-head{justify-content:space-between;align-items:center;display:flex}.dunning-trigger-btn{border:1px solid var(--emerald-aurora);color:var(--emerald-aurora);font-family:var(--font-display);cursor:pointer;background:#00e5991a;border-radius:6px;padding:4px 10px;font-size:10.5px;font-weight:800}.mock-whatsapp-message{color:#fff;background:#054d40;border-radius:14px;flex-direction:column;gap:8px;padding:12px;font-size:12px;display:flex}.wa-bubble-head{color:#ffffffb3;justify-content:space-between;font-size:10.5px;display:flex}.wa-pay-cta{flex-wrap:wrap;gap:6px;display:flex}.wa-btn-mock{background:#ffffff26;border-radius:6px;padding:4px 8px;font-size:10.5px}.dunning-alert-success{border:1px solid var(--emerald-aurora);color:var(--emerald-aurora);background:#00e5991a;border-radius:8px;align-items:center;gap:6px;padding:8px 12px;font-size:11.5px;display:flex}.vendorportal-grid{grid-template-columns:1.1fr 1fr;gap:24px;display:grid}@media (max-width:860px){.vendorportal-grid{grid-template-columns:1fr}}.wholesale-config-card,.po-approval-card{background:#0e1c30d9;border:1px solid #ffffff14;border-radius:20px;flex-direction:column;gap:16px;padding:24px;display:flex}.config-head{justify-content:space-between;align-items:center;display:flex}.sku-tag{font-family:var(--font-mono);color:var(--emerald-aurora);font-size:10px}.stock-tag{color:var(--text-dim);font-size:11px}.product-display-name{color:#fff;margin:0;font-size:18px}.category-subtitle{color:var(--text-dim);font-size:12px}.qty-slider-box{background:#0000004d;border-radius:14px;flex-direction:column;gap:12px;padding:16px;display:flex}.qty-label-row{color:#fff;justify-content:space-between;font-size:13px;display:flex}.qty-value-highlight{color:var(--emerald-aurora);font-size:16px}.tier-indicator-badge{background:#00e59914;border:1px solid #00e59940;border-radius:8px;flex-direction:column;gap:2px;padding:8px 12px;display:flex}.tier-indicator-badge span{color:var(--text-dim);font-size:9.5px;font-weight:800}.tier-indicator-badge strong{color:var(--emerald-aurora);font-size:12px}.pricing-math-breakdown{flex-direction:column;gap:8px;font-size:13px;display:flex}.math-row{color:var(--text-sub);justify-content:space-between;display:flex}.discount-val{color:var(--emerald-aurora);font-weight:800}.grand-total-row{color:#fff;border-top:1px solid #ffffff1a;padding-top:10px}.total-po-amt{color:var(--emerald-aurora);font-size:18px;font-family:var(--font-display)}.po-head-bar{justify-content:space-between;align-items:center;display:flex}.po-number{font-family:var(--font-mono);color:var(--text-dim);font-size:11px}.po-status-badge{font-family:var(--font-display);color:var(--emerald-aurora);background:#00e5991a;border-radius:4px;padding:3px 8px;font-size:9.5px;font-weight:800}.approval-stepper{flex-direction:column;gap:12px;display:flex}.step-node{opacity:.4;align-items:center;gap:12px;transition:opacity .2s;display:flex}.step-node.completed,.step-node.active{opacity:1}.step-circle{width:28px;height:28px;font-family:var(--font-display);color:#fff;background:#ffffff0d;border:1px solid #ffffff26;border-radius:50%;justify-content:center;align-items:center;font-size:12px;display:flex}.step-node.completed .step-circle{border-color:var(--emerald-aurora);color:var(--emerald-aurora);background:#00e59926}.step-node div{flex-direction:column;display:flex}.step-node strong{color:#fff;font-size:13px}.step-node small{color:var(--text-dim);font-size:11px}.po-success-notification{border:1px solid var(--emerald-aurora);color:var(--emerald-aurora);background:#00e5991a;border-radius:10px;align-items:center;gap:8px;padding:12px;font-size:12.5px;display:flex}.clinixcare-grid{grid-template-columns:1fr 1.1fr;gap:24px;display:grid}@media (max-width:860px){.clinixcare-grid{grid-template-columns:1fr}}.wa-booking-phone-card{background:#02060b;border:2px solid #ffffff1f;border-radius:24px;flex-direction:column;gap:14px;padding:16px;display:flex}.wa-phone-header{border-bottom:1px solid #ffffff14;justify-content:space-between;align-items:center;padding-bottom:10px;display:flex}.wa-clinic-meta{align-items:center;gap:8px;display:flex}.clinic-avatar{font-size:22px}.wa-clinic-meta strong{color:#fff;font-size:12.5px;display:block}.wa-clinic-meta small{color:var(--text-dim);font-size:10px}.wa-verified-check{background:var(--emerald-aurora);color:#000;border-radius:50%;justify-content:center;align-items:center;width:18px;height:18px;font-size:10px;font-weight:800;display:flex}.wa-chat-container{flex-direction:column;gap:12px;display:flex}.wa-bubble{border-radius:12px;padding:12px;font-size:12px;line-height:1.45}.wa-bubble.incoming{color:#fff;background:#1f2c34;align-self:flex-start;max-width:90%}.wa-bubble.outgoing{color:#fff;background:#005c4b;justify-content:space-between;align-self:flex-end;align-items:flex-end;gap:8px;max-width:80%;display:flex}.wa-time-stamp{color:#fff9;font-size:9.5px}.slot-selection-title{color:var(--emerald-aurora);margin:8px 0 6px;font-size:10px;font-weight:800;display:block}.wa-slot-pills{flex-direction:column;gap:6px;display:flex}.wa-slot-btn{color:#fff;cursor:pointer;text-align:left;background:#ffffff14;border:1px solid #ffffff26;border-radius:6px;padding:6px 10px;font-size:11.5px}.wa-slot-btn.active{border-color:var(--emerald-aurora);color:var(--emerald-aurora);background:#00e59933}.confirmed-bubble{border:1px solid var(--emerald-aurora);background:#00e59926!important}.confirmed-head{color:var(--emerald-aurora);align-items:center;gap:6px;margin-bottom:4px;font-size:13px;display:flex}.clinical-chart-card{background:#0e1c30d9;border:1px solid #ffffff14;border-radius:20px;flex-direction:column;gap:16px;padding:24px;display:flex}.chart-badge{font-family:var(--font-display);color:var(--emerald-aurora);font-size:10px;font-weight:800}.clinical-chart-card h4{color:#fff;margin:4px 0 0;font-size:17px}.patient-vitals-strip{background:#0000004d;border-radius:12px;grid-template-columns:repeat(3,1fr);gap:10px;padding:12px;display:grid}.vital-item{flex-direction:column;display:flex}.vital-item small{color:var(--text-dim);font-size:10px}.vital-item strong{color:var(--emerald-aurora);font-size:13px}.clinical-notes-box{background:#00000040;border:1px solid #ffffff0f;border-radius:12px;padding:14px}.notes-label{font-family:var(--font-display);color:var(--text-dim);margin-bottom:6px;font-size:10px;font-weight:800;display:block}.clinical-notes-box p{color:var(--text-sub);margin:0;font-size:12.5px;line-height:1.5}.prescription-action-row{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;display:flex}.rx-summary-card{flex-direction:column;display:flex}.rx-tag{font-family:var(--font-mono);color:var(--emerald-aurora);font-size:9.5px}.rx-summary-card strong{color:#fff;font-size:13px}.rx-summary-card small{color:var(--text-dim);font-size:11px}.rx-preview-alert{border:1px solid var(--emerald-aurora);background:#00e5991a;border-radius:12px;flex-direction:column;gap:6px;padding:14px;display:flex}.rx-preview-head{color:var(--emerald-aurora);justify-content:space-between;align-items:center;font-size:12px;display:flex}.close-rx-btn{color:#fff;cursor:pointer;background:0 0;border:none}.semantic-speed-badge{font-family:var(--font-mono);color:var(--emerald-aurora);background:#00e59914;border:1px solid #00e59940;border-radius:8px;align-items:center;gap:6px;padding:6px 12px;font-size:11px;display:flex}.talentops-kanban-board{grid-template-columns:repeat(4,1fr);gap:16px;display:grid}@media (max-width:960px){.talentops-kanban-board{grid-template-columns:1fr 1fr}}@media (max-width:600px){.talentops-kanban-board{grid-template-columns:1fr}}.kanban-stage-column{background:#0e1c30b3;border:1px solid #ffffff14;border-radius:18px;flex-direction:column;gap:12px;min-height:280px;padding:14px;display:flex}.stage-column-header{border-bottom:1px solid #ffffff0f;justify-content:space-between;align-items:center;padding-bottom:8px;display:flex}.stage-title{font-family:var(--font-display);color:#fff;font-size:11px;font-weight:800}.stage-count{color:var(--text-dim);background:#ffffff0d;border-radius:9999px;padding:2px 6px;font-size:10.5px}.stage-candidates-list{flex-direction:column;gap:10px;display:flex}.candidate-card{background:#0006;border:1px solid #ffffff14;border-radius:14px;flex-direction:column;gap:8px;padding:12px;transition:all .2s;display:flex}.candidate-card:hover{border-color:#00e5994d}.candidate-card-top{align-items:center;gap:8px;display:flex;position:relative}.cand-avatar{font-size:20px}.candidate-card-top div{flex-direction:column;flex-grow:1;display:flex}.candidate-card-top strong{color:#fff;font-size:12.5px}.candidate-card-top small{color:var(--text-dim);font-size:10.5px}.vector-score-badge{font-family:var(--font-mono);color:var(--emerald-aurora);background:#00e5991a;border-radius:4px;padding:2px 6px;font-size:9.5px;font-weight:700}.cand-experience-row{color:var(--text-dim);font-size:11px}.cand-skills-row{flex-wrap:wrap;gap:4px;display:flex}.cand-skill-pill{color:var(--text-sub);background:#ffffff08;border-radius:3px;padding:1px 5px;font-size:9px}.advance-stage-btn{color:var(--emerald-aurora);font-family:var(--font-display);cursor:pointer;background:#00e5991a;border:1px solid #00e5994d;border-radius:6px;justify-content:center;align-items:center;gap:4px;padding:5px 8px;font-size:10.5px;font-weight:800;display:inline-flex}.advance-stage-btn:hover{background:var(--emerald-aurora);color:#000}.offer-issued-badge{color:var(--emerald-aurora);align-items:center;gap:4px;font-size:11px;font-weight:700;display:flex}.talent-alert-banner{border:1px solid var(--emerald-aurora);color:var(--emerald-aurora);background:#00e5991a;border-radius:12px;align-items:center;gap:8px;padding:12px 16px;font-size:12.5px;display:flex}.blueprint-preset-pills-row{flex-wrap:wrap;align-items:center;gap:8px;margin-top:14px;display:flex}.preset-label{font-family:var(--font-display);letter-spacing:.08em;color:var(--text-dim);font-size:10.5px;font-weight:800}.preset-btn{color:var(--text-sub);font-family:var(--font-display);cursor:pointer;background:#ffffff08;border:1px solid #ffffff1a;border-radius:9999px;padding:6px 12px;font-size:11px;font-weight:700;transition:all .2s}.preset-btn:hover{border-color:var(--emerald-aurora);color:var(--emerald-aurora);background:#00e59924}.submitted-lead-alert{background:#00e59914;border:1px solid #00e59966;border-radius:16px;margin-top:16px;padding:20px}.lead-dispatch-info{color:var(--emerald-aurora);align-items:flex-start;gap:12px;margin-bottom:16px;display:flex}.lead-dispatch-info strong{margin-bottom:4px;font-size:14px;display:block}.lead-dispatch-info p{color:var(--text-sub);margin:0;font-size:13px}.submitted-cta-row{flex-wrap:wrap;gap:12px;display:flex}.proposal-modal-overlay{-webkit-backdrop-filter:blur(12px);z-index:9999;background:#000000d9;justify-content:center;align-items:center;padding:20px;display:flex;position:fixed;inset:0;overflow-y:auto}.proposal-modal-container{background:#08111e;border:1px solid #00e59959;border-radius:24px;width:100%;max-width:920px;max-height:90vh;padding:clamp(20px,3vw,36px);position:relative;overflow-y:auto;box-shadow:0 24px 80px #000c}.proposal-modal-top-bar{border-bottom:1px solid #ffffff14;justify-content:space-between;align-items:center;margin-bottom:24px;padding-bottom:20px;display:flex}.top-bar-branding{align-items:center;gap:12px;display:flex}.spec-badge{font-family:var(--font-display);letter-spacing:.12em;color:var(--emerald-aurora);background:#00e5991f;border:1px solid #00e5994d;border-radius:9999px;padding:4px 10px;font-size:10px;font-weight:800}.modal-close-btn{color:var(--text-sub);cursor:pointer;background:#ffffff0d;border:1px solid #ffffff1a;border-radius:50%;justify-content:center;align-items:center;width:36px;height:36px;font-size:16px;transition:all .2s;display:flex}.modal-close-btn:hover{color:#fff;background:#ffffff26}.form-intro-box h3{color:#fff;margin:0 0 8px;font-size:22px}.form-intro-box p{color:var(--text-sub);margin:0 0 24px;font-size:14px}.form-fields-grid{grid-template-columns:1fr 1fr;gap:16px;margin-bottom:24px;display:grid}.form-field-group{flex-direction:column;gap:8px;display:flex}.form-field-group.full-col{grid-column:1/-1}.form-field-group label{color:var(--text-dim);text-transform:uppercase;letter-spacing:.06em;font-size:12px;font-weight:700}.form-field-group input{color:#fff;background:#ffffff0a;border:1px solid #ffffff1f;border-radius:12px;padding:12px 16px;font-size:14px;transition:border-color .2s}.form-field-group input:focus{border-color:var(--emerald-aurora);outline:none;box-shadow:0 0 0 2px #00e59933}.selected-stack-preview-box{background:#0000004d;border:1px solid #ffffff0f;border-radius:14px;margin-bottom:24px;padding:16px 20px}.preview-label{font-family:var(--font-display);letter-spacing:.1em;color:var(--emerald-aurora);margin-bottom:8px;font-size:10px;font-weight:800;display:block}.selected-stack-preview-box ul{color:var(--text-sub);flex-direction:column;gap:6px;margin:0 0 12px;padding:0;font-size:13px;list-style:none;display:flex}.selected-stack-preview-box ul strong{color:#fff}.preview-timeline-val{font-family:var(--font-display);color:var(--emerald-aurora);border-top:1px solid #ffffff14;justify-content:space-between;padding-top:10px;font-size:12px;font-weight:800;display:flex}.form-actions-row{justify-content:flex-end;gap:12px;display:flex}.document-actions-floating-bar{flex-wrap:wrap;gap:10px;margin-bottom:20px;display:flex}.printable-proposal-paper{color:#0b1523;background:#fff;border-radius:12px;padding:clamp(24px,4vw,48px);box-shadow:0 10px 40px #0006}.doc-paper-header{border-bottom:2px solid #00e599;justify-content:space-between;align-items:flex-start;margin-bottom:24px;padding-bottom:20px;display:flex}.doc-logo-title{font-family:var(--font-display);color:#04101e;letter-spacing:-.02em;margin:0 0 4px;font-size:22px;font-weight:900}.doc-type-tag{font-family:var(--font-display);letter-spacing:.1em;color:#0b6b47;font-size:11px;font-weight:800}.doc-meta-right{color:#4a5568;flex-direction:column;align-items:flex-end;font-size:12px;display:flex}.seal-text{color:#0b6b47;margin-top:4px;font-weight:800}.doc-client-strip{background:#f4f7fa;border-radius:8px;grid-template-columns:1fr 1fr 1fr;gap:16px;margin-bottom:28px;padding:14px 18px;display:grid}.doc-client-strip small{color:#718096;margin-bottom:2px;font-size:10px;font-weight:800;display:block}.doc-client-strip strong{color:#0f172a;font-size:14px}.doc-section{margin-bottom:28px}.doc-section h3{color:#0f172a;border-bottom:1px solid #e2e8f0;margin-bottom:12px;padding-bottom:6px;font-size:16px;font-weight:800}.doc-section p{color:#334155;margin:0;font-size:13.5px;line-height:1.6}.doc-spec-table{border-collapse:collapse;width:100%;margin-top:8px;font-size:12.5px}.doc-spec-table th,.doc-spec-table td{text-align:left;border:1px solid #e2e8f0;padding:10px 12px}.doc-spec-table th{color:#475569;letter-spacing:.06em;background:#f8fafc;font-size:11px;font-weight:800}.doc-milestones-grid{grid-template-columns:1fr 1fr 1fr;gap:12px;margin-top:10px;display:grid}.milestone-box{background:#f8fafc;border:1px solid #e2e8f0;border-radius:8px;flex-direction:column;padding:14px;display:flex}.m-num{letter-spacing:.08em;color:#0b6b47;margin-bottom:4px;font-size:9.5px;font-weight:800}.milestone-box strong{color:#0f172a;margin-bottom:6px;font-size:13px}.milestone-box p{color:#64748b;flex-grow:1;margin-bottom:8px;font-size:11.5px}.m-price{font-family:var(--font-display);color:#0f172a;font-size:15px;font-weight:800}.doc-bullets{color:#334155;margin:0;padding-left:18px;font-size:13px;line-height:1.6}.doc-sign-off-footer{color:#64748b;border-top:1px solid #e2e8f0;justify-content:space-between;margin-top:36px;padding-top:16px;font-size:12px;display:flex}.doc-sign-off-footer small{color:#94a3b8;font-size:9.5px;font-weight:800;display:block}.doc-sign-off-footer strong{color:#0f172a;display:block}@media print{body *{visibility:hidden}.printable-proposal-paper,.printable-proposal-paper *{visibility:visible}.printable-proposal-paper{width:100%;box-shadow:none;margin:0;padding:20px;position:absolute;top:0;left:0}.no-print{display:none!important}}.booking-scheduler-container{-webkit-backdrop-filter:blur(16px);background:linear-gradient(135deg,#0a1626f2 0%,#040b14fa 100%);border:1px solid #00e5994d;border-radius:24px;margin:48px 0;padding:clamp(24px,4vw,44px);box-shadow:0 24px 60px #0009}.pricing-embedded-scheduler{margin:64px 0 32px}.scheduler-header{text-align:left;margin-bottom:32px}.sched-badge{font-family:var(--font-display);letter-spacing:.12em;color:var(--emerald-aurora);background:#00e5991a;border:1px solid #00e5994d;border-radius:9999px;margin-bottom:12px;padding:4px 12px;font-size:10.5px;font-weight:800;display:inline-block}.sched-title{color:#fff;margin:0 0 10px;font-size:clamp(22px,2.5vw,32px);line-height:1.25}.sched-subtitle{color:var(--text-sub);max-width:680px;margin:0;font-size:14.5px;line-height:1.6}.scheduler-grid{grid-template-columns:1.2fr 1fr;gap:32px;display:grid}@media (max-width:900px){.scheduler-grid{grid-template-columns:1fr}}.scheduler-calendar-pane{background:#00000059;border:1px solid #ffffff14;border-radius:18px;padding:24px}.tz-selector-row{flex-wrap:wrap;align-items:center;gap:12px;margin-bottom:20px;display:flex}.tz-selector-row label{font-family:var(--font-display);letter-spacing:.08em;color:var(--text-dim);font-size:10.5px;font-weight:800}.tz-select-dropdown{color:#fff;cursor:pointer;background:#ffffff0f;border:1px solid #ffffff26;border-radius:10px;padding:8px 12px;font-size:13px}.tz-select-dropdown option{color:#fff;background:#0b1523}.days-tab-row{gap:8px;margin-bottom:24px;padding-bottom:6px;display:flex;overflow-x:auto}.day-tab-btn{cursor:pointer;background:#ffffff08;border:1px solid #ffffff1a;border-radius:12px;flex-direction:column;align-items:center;min-width:88px;padding:10px 14px;transition:all .2s;display:flex}.day-tab-btn:hover{background:#ffffff14;border-color:#fff3}.day-tab-btn.active{border-color:var(--emerald-aurora);background:#00e59926}.day-label{color:#fff;font-size:12px;font-weight:700}.day-date{color:var(--text-dim);font-size:10px}.day-tab-btn.active .day-date{color:var(--emerald-aurora)}.slots-title{font-family:var(--font-display);letter-spacing:.08em;color:var(--text-dim);margin-bottom:12px;font-size:10.5px;font-weight:800;display:block}.slots-grid{grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:10px;display:grid}.time-slot-btn{cursor:pointer;background:#ffffff0a;border:1px solid #ffffff1a;border-radius:10px;flex-direction:column;align-items:center;gap:2px;padding:10px 8px;transition:all .2s;display:flex}.time-slot-btn:hover{border-color:var(--emerald-aurora);background:#00e5991a}.time-slot-btn.selected{background:var(--emerald-aurora);border-color:var(--emerald-aurora)}.slot-time{color:#fff;font-size:13px;font-weight:700}.time-slot-btn.selected .slot-time{color:#000}.slot-avail{color:var(--emerald-aurora);font-size:9.5px}.time-slot-btn.selected .slot-avail{color:#042e1d;font-weight:700}.scheduler-form-pane{flex-direction:column;justify-content:space-between;display:flex}.form-pane-heading{margin-bottom:20px}.form-pane-heading strong{color:#fff;font-size:16px;display:block}.form-pane-heading small{color:var(--emerald-aurora);font-size:12.5px}.sched-fields{flex-direction:column;gap:14px;margin-bottom:20px;display:flex}.btn-confirm-booking{margin-bottom:14px}.meeting-reassurance{color:var(--text-dim);flex-direction:column;gap:4px;font-size:11.5px;display:flex}.booking-confirmed-card{text-align:center;background:#00e59914;border:1px solid #00e59966;border-radius:20px;max-width:640px;margin:0 auto;padding:36px}.confirmed-icon-circle{background:var(--emerald-aurora);color:#000;border-radius:50%;justify-content:center;align-items:center;width:56px;height:56px;margin:0 auto 16px;font-size:24px;display:flex}.booking-confirmed-card h3{color:#fff;margin:0 0 8px;font-size:24px}.confirmed-subtext{color:var(--text-sub);margin:0 0 24px;font-size:14px}.confirmed-details-box{text-align:left;background:#0006;border:1px solid #ffffff14;border-radius:14px;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:28px;padding:20px;display:grid}.conf-item small{letter-spacing:.08em;color:var(--text-dim);margin-bottom:4px;font-size:10px;font-weight:800;display:block}.conf-item strong{color:#fff;font-size:13.5px}.confirmed-actions-row{flex-wrap:wrap;justify-content:center;gap:14px;display:flex}.product-category-filters-row{flex-wrap:wrap;justify-content:center;gap:10px;margin-bottom:32px;display:flex}.filter-pill-btn{color:var(--text-sub);cursor:pointer;background:#ffffff0d;border:1px solid #ffffff1f;border-radius:20px;padding:8px 16px;font-size:13px;font-weight:600;transition:all .2s}.filter-pill-btn:hover{color:#fff;background:#ffffff1a}.filter-pill-btn.active{background:var(--emerald-aurora);border-color:var(--emerald-aurora);color:#000;font-weight:700}.cargoflow-controls-row{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px;margin-bottom:24px;display:flex}.truck-selector-group{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.truck-selector-group span{color:var(--text-dim);letter-spacing:.06em;font-size:11px;font-weight:800}.truck-btn{color:var(--text-sub);cursor:pointer;background:#ffffff0d;border:1px solid #ffffff1f;border-radius:8px;padding:8px 14px;font-size:12.5px;transition:all .2s}.truck-btn.active{border-color:var(--emerald-aurora);color:var(--emerald-aurora);background:#00e5991f;font-weight:700}.button-warning-amber{color:#ffb300;cursor:pointer;background:#ffb30026;border:1px solid #ffb30080;border-radius:8px;padding:8px 16px;font-size:12.5px;font-weight:700}.cargoflow-grid{grid-template-columns:1.2fr 1fr;gap:24px;display:grid}@media (max-width:900px){.cargoflow-grid{grid-template-columns:1fr}}.telemetry-pane,.route-epod-pane{background:#00000059;border:1px solid #ffffff14;border-radius:14px;flex-direction:column;gap:16px;padding:20px;display:flex}.telemetry-header{border-bottom:1px solid #ffffff14;justify-content:space-between;align-items:center;padding-bottom:14px;display:flex}.telemetry-header small{color:var(--text-dim);font-size:10px;font-weight:800;display:block}.telemetry-header strong{color:#fff;font-size:13px}.live-temp-badge{text-align:right;border-radius:10px;padding:8px 14px}.live-temp-badge.normal{border:1px solid var(--emerald-aurora);background:#00e5991f}.live-temp-badge.critical{background:#f443;border:1px solid #f44;animation:1.5s infinite pulseCritical}@keyframes pulseCritical{0%,to{opacity:1}50%{opacity:.7}}.temp-val{font-size:20px;font-weight:900;display:block}.live-temp-badge.normal .temp-val{color:var(--emerald-aurora)}.live-temp-badge.critical .temp-val{color:#f55}.sensor-ticks-container{flex-direction:column;gap:8px;display:flex}.ticks-label{color:var(--text-dim);letter-spacing:.06em;font-size:10px;font-weight:800}.sensor-ticks-stream{flex-direction:column;gap:6px;display:flex}.sensor-log-row{color:var(--text-sub);background:#ffffff08;border-radius:6px;grid-template-columns:60px 80px 80px 100px 1fr;align-items:center;padding:8px 12px;font-size:12px;display:grid}.sensor-log-row.critical-row{color:#f88;background:#ff444426;border:1px solid #f446;font-weight:700}.alarm-notification-box{background:#ff44441f;border:1px solid #f44;border-radius:10px;align-items:flex-start;gap:12px;padding:14px;display:flex}.alarm-notification-box strong{color:#f55;font-size:12.5px;display:block}.alarm-notification-box p{color:var(--text-sub);margin:4px 0 0;font-size:12px}.geofence-card{background:#0006;border:1px solid #ffffff0f;border-radius:10px;flex-direction:column;gap:12px;padding:14px;display:flex}.geo-header{justify-content:space-between;font-size:11px;display:flex}.geo-title{color:var(--emerald-aurora);font-weight:800}.geo-stat{color:var(--text-dim)}.geo-route-info{background:#ffffff0a;border-radius:8px;justify-content:space-between;align-items:center;padding:10px 14px;display:flex}.geo-route-info small{color:var(--text-dim);font-size:9.5px;font-weight:800;display:block}.geo-route-info strong{color:#fff;font-size:12.5px}.geo-arrow{color:var(--emerald-aurora);font-size:16px}.geofence-alert-box{color:var(--emerald-aurora);align-items:center;gap:8px;font-size:11.5px;display:flex}.epod-dispatch-box{flex-direction:column;gap:8px;display:flex}.epod-dispatch-box h4{color:#fff;margin:0;font-size:14px}.epod-dispatch-box p{color:var(--text-sub);margin:0;font-size:12px}.epod-success-alert{border:1px solid var(--emerald-aurora);background:#00e5991a;border-radius:8px;align-items:center;gap:10px;padding:12px;display:flex}.epod-success-alert strong{color:var(--emerald-aurora);font-size:12.5px;display:block}.epod-success-alert small{color:var(--text-sub);font-size:11px}.propops-tabs-bar{gap:10px;margin-bottom:20px;display:flex}.prop-tab-btn{color:var(--text-sub);cursor:pointer;background:#ffffff0d;border:1px solid #ffffff1f;border-radius:8px;padding:8px 16px;font-size:13px;transition:all .2s}.prop-tab-btn.active{border-color:var(--emerald-aurora);color:var(--emerald-aurora);background:#00e5991f;font-weight:700}.cpi-simulator-strip{background:#00000059;border:1px solid #ffffff14;border-radius:12px;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:20px;margin-bottom:20px;padding:16px 20px;display:flex}.cpi-slider-group{flex-direction:column;flex:1;gap:8px;min-width:260px;display:flex}.cpi-slider-group label{color:var(--text-dim);font-size:11px;font-weight:800}.cpi-slider-group strong{color:var(--emerald-aurora);font-size:14px}.cpi-slider{width:100%;accent-color:var(--emerald-aurora);cursor:pointer}.portfolio-kpi-grid{grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:20px;display:grid}@media (max-width:700px){.portfolio-kpi-grid{grid-template-columns:1fr}}.port-kpi-card{background:#0000004d;border:1px solid #ffffff0f;border-radius:10px;padding:14px}.port-kpi-card small{color:var(--text-dim);margin-bottom:4px;font-size:10px;font-weight:800;display:block}.port-kpi-card strong{color:#fff;font-size:18px}.rent-roll-table-wrapper{background:#00000059;border:1px solid #ffffff14;border-radius:12px;overflow-x:auto}.rent-roll-table{border-collapse:collapse;text-align:left;width:100%;font-size:12.5px}.rent-roll-table th{color:var(--text-dim);border-bottom:1px solid #ffffff14;padding:12px 16px;font-size:10.5px;font-weight:800}.rent-roll-table td{color:var(--text-sub);border-bottom:1px solid #ffffff0a;padding:14px 16px}.rent-roll-table strong{color:#fff;display:block}.rent-roll-table small{color:var(--text-dim);font-size:11px}.indexed-cell{color:var(--emerald-aurora);font-weight:700}.monthly-cell{color:#fff;font-weight:600}.expiry-badge{border-radius:6px;padding:4px 8px;font-size:11px}.expiry-badge.current{color:var(--emerald-aurora);background:#00e5991a}.expiry-badge.due_soon{color:#ffb300;background:#ffb30026}.table-action-btn{color:#fff;cursor:pointer;background:#ffffff0f;border:1px solid #ffffff1f;border-radius:6px;padding:6px 12px;font-size:11.5px;transition:all .2s}.table-action-btn:hover{border-color:var(--emerald-aurora);color:var(--emerald-aurora);background:#00e59933}.work-order-cards-grid{grid-template-columns:1fr 1fr;gap:20px;display:grid}@media (max-width:768px){.work-order-cards-grid{grid-template-columns:1fr}}.work-order-card{background:#00000059;border:1px solid #ffffff14;border-radius:12px;flex-direction:column;gap:12px;padding:20px;display:flex}.wo-header{justify-content:space-between;align-items:center;display:flex}.wo-badge{border-radius:6px;padding:4px 8px;font-size:10px;font-weight:800}.wo-badge.critical{color:#f55;background:#ff444426}.wo-badge.normal{color:var(--emerald-aurora);background:#00e5991a}.wo-ref{color:var(--text-dim);font-size:11px}.work-order-card h4{color:#fff;margin:0;font-size:15px}.work-order-card p{color:var(--text-sub);margin:0;font-size:12.5px}.wo-meta-row{color:var(--text-dim);border-top:1px solid #ffffff0f;justify-content:space-between;padding-top:10px;font-size:11px;display:flex}.dish-selector-row{flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:24px;display:flex}.dish-selector-row span{color:var(--text-dim);font-size:11px;font-weight:800}.dish-tab-btn{color:var(--text-sub);cursor:pointer;background:#ffffff0d;border:1px solid #ffffff1f;border-radius:8px;padding:8px 16px;font-size:13px}.dish-tab-btn.active{border-color:var(--emerald-aurora);color:var(--emerald-aurora);background:#00e5991f;font-weight:700}.kitchenops-grid{grid-template-columns:1.2fr 1fr;gap:24px;display:grid}@media (max-width:900px){.kitchenops-grid{grid-template-columns:1fr}}.recipe-bom-pane,.margin-replenish-pane{background:#00000059;border:1px solid #ffffff14;border-radius:14px;flex-direction:column;gap:16px;padding:20px;display:flex}.bom-header{justify-content:space-between;align-items:center;display:flex}.bom-header h4{color:#fff;margin:0;font-size:14px}.menu-price-tag{color:var(--emerald-aurora);font-size:12px;font-weight:700}.ingredient-slider-box{background:#ffffff08;border-radius:8px;flex-direction:column;gap:8px;padding:12px;display:flex}.ingredient-slider-box label{color:var(--text-dim);font-size:10.5px;font-weight:800}.ingredient-slider-box strong{color:#ffb300}.ingredients-list{flex-direction:column;gap:8px;display:flex}.ingredient-item-row{background:#ffffff05;border-bottom:1px solid #ffffff0a;border-radius:6px;justify-content:space-between;align-items:center;padding:10px 12px;display:flex}.ingredient-item-row strong{color:#fff;font-size:12.5px;display:block}.ingredient-item-row small{color:var(--text-dim);font-size:10.5px}.ing-cost{color:var(--text-sub);align-items:center;gap:8px;font-size:13px;font-weight:700;display:flex}.inflation-pill{color:#ffb300;background:#ffb30026;border-radius:4px;padding:2px 6px;font-size:10px}.margin-gauge-card{background:#0006;border-radius:12px;flex-direction:column;gap:16px;padding:20px;display:flex}.margin-gauge-card.optimal{border:1px solid var(--emerald-aurora)}.margin-gauge-card.warning{border:1px solid #ffb300}.gauge-header{justify-content:space-between;align-items:center;display:flex}.gauge-label{color:var(--text-dim);font-size:11px;font-weight:800}.food-cost-num{font-size:28px;font-weight:900}.margin-gauge-card.optimal .food-cost-num{color:var(--emerald-aurora)}.margin-gauge-card.warning .food-cost-num{color:#ffb300}.margin-breakdown-row{background:#ffffff08;border-radius:8px;justify-content:space-between;padding:12px;display:flex}.margin-breakdown-row small{color:var(--text-dim);font-size:10px;font-weight:800;display:block}.margin-breakdown-row strong{color:#fff;font-size:15px}.margin-alert-box{border-radius:8px;padding:10px 14px;font-size:12px}.margin-alert-box.success{color:var(--emerald-aurora);background:#00e59914;align-items:center;gap:8px;display:flex}.margin-alert-box.critical{color:#ffb300;background:#ffb3001f;line-height:1.4}.commissary-indent-box{flex-direction:column;gap:10px;display:flex}.commissary-indent-box h4{color:#fff;margin:0;font-size:14px}.commissary-indent-box p{color:var(--text-sub);margin:0;font-size:12px}.educore-pipeline-section{background:#00000059;border:1px solid #ffffff14;border-radius:14px;margin-bottom:24px;padding:20px}.pipeline-heading{flex-wrap:wrap;justify-content:space-between;align-items:center;margin-bottom:16px;display:flex}.pipeline-heading h4{color:#fff;margin:0;font-size:15px}.pipeline-note{color:var(--text-dim);font-size:11.5px}.pipeline-columns-grid{grid-template-columns:repeat(4,1fr);gap:14px;display:grid}@media (max-width:900px){.pipeline-columns-grid{grid-template-columns:1fr 1fr}}@media (max-width:550px){.pipeline-columns-grid{grid-template-columns:1fr}}.pipeline-col{background:#ffffff05;border:1px solid #ffffff0f;border-radius:10px;flex-direction:column;gap:10px;padding:12px;display:flex}.col-header{border-bottom:1px solid #ffffff0f;justify-content:space-between;align-items:center;padding-bottom:8px;display:flex}.col-title{color:var(--emerald-aurora);letter-spacing:.06em;font-size:10.5px;font-weight:800}.col-count{color:#fff;background:#ffffff1a;border-radius:10px;padding:2px 6px;font-size:10px;font-weight:700}.col-cards{flex-direction:column;gap:8px;display:flex}.applicant-card{cursor:pointer;background:#00000080;border:1px solid #ffffff14;border-radius:8px;flex-direction:column;gap:6px;padding:10px;transition:all .2s;display:flex}.applicant-card:hover,.applicant-card.active{border-color:var(--emerald-aurora);background:#00e5990a}.app-top{color:#fff;justify-content:space-between;font-size:12px;display:flex}.app-country{font-size:11px}.app-course{color:var(--text-sub);margin:0;font-size:10.5px;line-height:1.35}.app-bottom{border-top:1px solid #ffffff0f;justify-content:space-between;align-items:center;padding-top:6px;display:flex}.app-fee{color:var(--emerald-aurora);font-size:11px;font-weight:700}.advance-stage-btn{border:1px solid var(--emerald-aurora);color:var(--emerald-aurora);cursor:pointer;background:#00e59926;border-radius:4px;padding:3px 8px;font-size:10px;font-weight:700}.enrolled-check{color:var(--emerald-aurora);font-size:10px;font-weight:700}.educore-lower-grid{grid-template-columns:1.2fr 1fr;gap:24px;display:grid}@media (max-width:850px){.educore-lower-grid{grid-template-columns:1fr}}.tuition-vault-pane,.certificate-vault-pane{background:#00000059;border:1px solid #ffffff14;border-radius:14px;flex-direction:column;gap:14px;padding:20px;display:flex}.vault-head{justify-content:space-between;align-items:center;display:flex}.vault-head h4{color:#fff;margin:0;font-size:14px}.student-tag{color:var(--emerald-aurora);font-size:11px;font-weight:700}.installment-select-row{color:var(--text-dim);flex-wrap:wrap;align-items:center;gap:8px;font-size:11px;display:flex}.split-btn{color:var(--text-sub);cursor:pointer;background:#ffffff0a;border:1px solid #ffffff1a;border-radius:6px;padding:6px 12px;font-size:11.5px}.split-btn.active{border-color:var(--emerald-aurora);color:var(--emerald-aurora);background:#00e5991f;font-weight:700}.installment-table-box{background:#ffffff05;border-radius:8px;overflow:hidden}.installment-table{border-collapse:collapse;text-align:left;width:100%;font-size:12px}.installment-table th{color:var(--text-dim);background:#0000004d;padding:8px 12px;font-size:10px;font-weight:800}.installment-table td{color:var(--text-sub);border-bottom:1px solid #ffffff0a;padding:10px 12px}.status-pill.paid{color:var(--emerald-aurora);font-weight:700}.status-pill.scheduled{color:var(--text-dim)}.cert-head h4{color:#fff;margin:0 0 2px;font-size:14px}.cert-head small{color:var(--text-dim);font-size:10px}.cert-preview-card{background:#0d161d;border:2px solid #00e5994d;border-radius:10px;padding:16px}.cert-border-inner{text-align:center;border:1px dashed #00e59966;border-radius:6px;flex-direction:column;gap:8px;padding:16px;display:flex}.cert-seal{letter-spacing:.08em;color:var(--emerald-aurora);font-size:10px;font-weight:800}.cert-border-inner h5{color:#fff;margin:0;font-size:15px}.cert-awarded{color:var(--text-sub);margin:0;font-size:12px}.cert-border-inner small{color:var(--text-dim);font-size:11px}.cert-qr-row{border-top:1px solid #ffffff0f;justify-content:space-between;align-items:center;padding-top:8px;font-size:10.5px;display:flex}.cert-hash{color:var(--text-dim)}.qr-badge{color:var(--emerald-aurora);background:#00e59926;border-radius:4px;padding:2px 6px;font-weight:700}.blueprint-builder-section{max-width:var(--content-max);margin:var(--section-space) auto;padding:0 var(--gutter);box-sizing:border-box;position:relative}.blueprint-builder-card{background:var(--card-bg);border:1px solid var(--card-border);-webkit-backdrop-filter:blur(24px);border-radius:24px;padding:clamp(28px,3.5vw,44px);position:relative;overflow:hidden;box-shadow:0 24px 64px #00000080,inset 0 1px #ffffff1a}.blueprint-builder-card:before{content:"";pointer-events:none;z-index:0;background:radial-gradient(circle,#00e5991f 0%,#06b6d40a 50%,#0000 70%);width:500px;height:500px;position:absolute;top:0;right:0}.blueprint-header-row{z-index:1;border-bottom:1px solid #ffffff14;justify-content:space-between;align-items:flex-start;gap:32px;margin-bottom:32px;padding-bottom:24px;display:flex;position:relative}@media (max-width:960px){.blueprint-header-row{flex-direction:column}}.blueprint-heading{color:#fff;margin:8px 0 12px;font-size:clamp(24px,2.6vw,34px);line-height:1.18}.blueprint-subtext{color:var(--text-sub);max-width:720px;margin-bottom:20px;font-size:14.5px;line-height:1.6}.blueprint-preset-pills-row{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.preset-label{font-family:var(--font-display);letter-spacing:.08em;color:var(--text-dim);text-transform:uppercase;margin-right:4px;font-size:10.5px;font-weight:800}.preset-btn{color:var(--text-sub);cursor:pointer;white-space:nowrap;background:#ffffff0a;border:1px solid #ffffff1a;border-radius:9999px;padding:6px 12px;font-size:12px;font-weight:600;transition:all .2s}.preset-btn:hover{color:#fff;background:#00e5991f;border-color:#00e59966;transform:translateY(-1px)}.blueprint-summary-badge{text-align:center;background:#00e59914;border:1px solid #00e5994d;border-radius:16px;flex-shrink:0;min-width:180px;padding:16px 22px;box-shadow:0 4px 20px #00e5991a}.blueprint-summary-badge small{font-family:var(--font-display);letter-spacing:.08em;color:var(--emerald-aurora);margin-bottom:4px;font-size:10px;font-weight:800;display:block}.blueprint-summary-badge strong{color:#fff;margin-bottom:4px;font-size:26px;font-weight:800;line-height:1.1;display:block}.blueprint-summary-badge span{color:var(--text-dim);font-size:11px;display:block}.blueprint-configurator-layout{z-index:1;grid-template-columns:1.15fr .85fr;align-items:start;gap:32px;display:grid;position:relative}@media (max-width:1024px){.blueprint-configurator-layout{grid-template-columns:1fr}}.blueprint-selectors-column{flex-direction:column;gap:28px;display:flex}.layer-group{flex-direction:column;gap:12px;display:flex}.layer-step-tag{font-family:var(--font-display);letter-spacing:.1em;color:var(--emerald-aurora);text-transform:uppercase;font-size:11px;font-weight:800}.options-selector-grid{grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px;display:grid}.blueprint-option-btn{text-align:left;cursor:pointer;background:#ffffff08;border:1px solid #ffffff14;border-radius:14px;flex-direction:column;gap:6px;padding:16px;transition:all .22s cubic-bezier(.16,1,.3,1);display:flex;position:relative}.blueprint-option-btn:hover{background:#ffffff0f;border-color:#fff3;transform:translateY(-2px)}.blueprint-option-btn.active{border-color:var(--emerald-aurora);background:#00e59914;box-shadow:0 0 20px #00e5992e,inset 0 1px #fff3}.opt-cat{font-family:var(--font-display);letter-spacing:.06em;color:var(--text-dim);font-size:10px;font-weight:700}.blueprint-option-btn.active .opt-cat{color:var(--emerald-aurora)}.opt-name{color:#fff;font-size:14px;font-weight:700;line-height:1.3}.opt-desc{color:var(--text-sub);margin:0;font-size:11.5px;line-height:1.45}.opt-check-row{justify-content:space-between;align-items:center;display:flex}.checked-indicator{background:var(--emerald-aurora);color:#04080f;border-radius:50%;justify-content:center;align-items:center;width:18px;height:18px;font-size:11px;font-weight:800;display:flex}.blueprint-canvas-column{position:sticky;top:100px}.live-topology-card{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:#050c16d9;border:1px solid #00e59947;border-radius:20px;flex-direction:column;gap:20px;padding:24px;display:flex;box-shadow:0 16px 48px #0009}.topology-card-head{border-bottom:1px solid #ffffff14;justify-content:space-between;align-items:center;padding-bottom:14px;display:flex}.live-active-tag{font-family:var(--font-display);letter-spacing:.06em;color:var(--emerald-aurora);font-size:10.5px;font-weight:700}.topology-node-chain{flex-direction:column;gap:10px;display:flex}.topology-node{background:#ffffff08;border:1px solid #ffffff14;border-radius:12px;align-items:center;gap:12px;padding:12px 14px;display:flex}.node-icon-box{background:#00e5991a;border:1px solid #00e59940;border-radius:10px;flex-shrink:0;justify-content:center;align-items:center;width:38px;height:38px;font-size:18px;display:flex}.node-details{flex-direction:column;gap:2px;min-width:0;display:flex}.node-details small{font-family:var(--font-display);letter-spacing:.08em;color:var(--text-dim);font-size:9.5px;font-weight:800}.node-details strong{color:#fff;white-space:nowrap;text-overflow:ellipsis;font-size:13px;overflow:hidden}.tech-badge{color:var(--emerald-aurora);font-size:10.5px}.topology-connector-arrow{text-align:center;color:var(--text-dim);letter-spacing:.06em;padding:2px 0;font-size:10px;font-weight:700}.blueprint-investment-box{background:#0006;border:1px solid #ffffff14;border-radius:14px;flex-direction:column;gap:14px;padding:18px;display:flex}.investment-header-row{border-bottom:1px solid #ffffff14;justify-content:space-between;align-items:flex-end;padding-bottom:12px;display:flex}.investment-header-row small{font-family:var(--font-display);letter-spacing:.08em;color:var(--text-dim);margin-bottom:2px;font-size:9.5px;font-weight:800;display:block}.emerald-highlight{color:var(--emerald-aurora);font-size:18px;font-weight:800}.white-highlight{color:#fff;font-size:16px;font-weight:700}.blueprint-features-list{color:var(--text-sub);flex-direction:column;gap:6px;font-size:11.5px;display:flex}.blueprint-features-list div{align-items:center;gap:6px;display:flex}.blueprint-features-list div svg{color:var(--emerald-aurora);flex-shrink:0;width:13px;height:13px}.blueprint-actions-grid{flex-direction:column;gap:10px;margin-top:4px;display:flex}.studio-card-container{max-width:var(--content-max);margin:var(--section-space) auto;padding:0 var(--gutter);box-sizing:border-box}.studio-top-bar{background:var(--card-bg);border:1px solid var(--card-border);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-bottom:1px solid #ffffff14;border-radius:20px 20px 0 0;justify-content:space-between;align-items:center;gap:20px;padding:20px 28px;display:flex}@media (max-width:900px){.studio-top-bar{flex-direction:column;align-items:flex-start}}.studio-client-identity{align-items:center;gap:14px;display:flex}.studio-live-dot{background:var(--emerald-aurora);width:10px;height:10px;box-shadow:0 0 12px var(--emerald-aurora);border-radius:50%;animation:2s infinite pulse}.studio-client-title{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.studio-client-title strong{font-family:var(--font-display);color:#fff;font-size:14px}.studio-env-pill{color:var(--emerald-aurora);background:#00e5991f;border:1px solid #00e5994d;border-radius:6px;padding:2px 8px;font-size:11px;font-weight:700}.studio-meta-sub{color:var(--text-dim);font-size:11px;font-family:var(--font-mono);margin-top:2px;display:block}.studio-top-actions{flex-wrap:wrap;gap:8px;display:flex}.studio-tab-pill{font-family:var(--font-display);color:var(--text-sub);cursor:pointer;background:#ffffff0a;border:1px solid #ffffff14;border-radius:9999px;padding:6px 14px;font-size:12.5px;font-weight:600;transition:all .2s}.studio-tab-pill:hover{color:#fff;background:#ffffff14}.studio-tab-pill.active{border-color:var(--emerald-aurora);color:#fff;background:#00e59926}.studio-milestones-view,.studio-git-view,.studio-vpc-view{background:var(--card-bg);border:1px solid var(--card-border);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-top:none;border-radius:0 0 20px 20px;padding:clamp(24px,3.5vw,36px);box-shadow:0 24px 64px #00000080}.milestone-stepper-row{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;margin-bottom:28px;display:grid}.milestone-step-card{text-align:left;cursor:pointer;background:#ffffff08;border:1px solid #ffffff14;border-radius:14px;flex-direction:column;gap:8px;padding:16px;transition:all .2s;display:flex}.milestone-step-card:hover{background:#ffffff0f;border-color:#fff3}.milestone-step-card.active{border-color:var(--emerald-aurora);background:#00e5990f;box-shadow:0 0 20px #00e59926}.step-card-head{justify-content:space-between;align-items:center;display:flex}.sprint-num{font-family:var(--font-display);color:var(--text-dim);font-size:10px;font-weight:800}.status-tag{border-radius:4px;padding:2px 6px;font-size:9.5px;font-weight:800}.status-tag.completed{color:var(--emerald-aurora);background:#00e59926}.status-tag.active{color:var(--cyan-glow);background:#06b6d426}.status-tag.upcoming{color:var(--text-dim);background:#ffffff0d}.step-name{color:#fff;font-size:13px;line-height:1.3}.progress-bar-container{background:#ffffff14;border-radius:9999px;width:100%;height:4px;overflow:hidden}.progress-bar-fill{background:var(--emerald-aurora);border-radius:9999px;height:100%;transition:width .3s}.step-footer-row{color:var(--text-dim);justify-content:space-between;font-size:11px;display:flex}.active-sprint-panel{background:#00000059;border:1px solid #ffffff14;border-radius:16px;flex-direction:column;gap:20px;padding:24px;display:flex}.sprint-panel-header{border-bottom:1px solid #ffffff0f;justify-content:space-between;align-items:flex-start;gap:20px;padding-bottom:16px;display:flex}.sprint-panel-header h3{color:#fff;margin:6px 0 4px;font-size:18px}.sprint-panel-header p{color:var(--text-sub);font-size:13px}.sprint-kpi-badge{text-align:right;flex-shrink:0}.kpi-num{color:var(--emerald-aurora);font-size:28px;font-weight:800;line-height:1;display:block}.sprint-kpi-badge small{color:var(--text-dim);font-size:10px;font-weight:700}.sprint-tasks-list{flex-direction:column;gap:10px;display:flex}.task-row-card{cursor:pointer;background:#ffffff05;border:1px solid #ffffff0f;border-radius:10px;align-items:flex-start;gap:14px;padding:14px 16px;transition:all .2s;display:flex}.task-row-card:hover{background:#ffffff0d;border-color:#ffffff26}.task-row-card.completed{background:#00e59905;border-color:#00e59940}.task-checkbox-box{padding-top:2px}.task-checkbox{color:#03070d;border:1px solid #fff3;border-radius:6px;justify-content:center;align-items:center;width:20px;height:20px;font-size:12px;font-weight:800;transition:all .2s;display:flex}.task-checkbox.checked{background:var(--emerald-aurora);border-color:var(--emerald-aurora)}.task-content{flex-direction:column;gap:4px;display:flex}.task-title{color:#fff;font-size:14px}.task-row-card.completed .task-title{color:var(--text-dim);text-decoration:line-through}.task-meta{color:var(--text-dim);flex-wrap:wrap;gap:14px;font-size:11.5px;display:flex}.task-assignee{color:var(--emerald-aurora)}.staging-preview-deploy-box{background:#00e5990a;border:1px solid #00e59933;border-radius:12px;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:20px;padding:16px 20px;display:flex}.staging-preview-deploy-box strong{color:#fff;font-size:13.5px;display:block}.staging-preview-deploy-box p{color:var(--text-sub);margin-top:2px;font-size:12px}.preview-deployed-alert{color:var(--emerald-aurora);align-items:center;gap:10px;display:flex}.preview-link{font-family:var(--font-mono);color:var(--emerald-aurora);font-size:12px;text-decoration:underline}.studio-git-view{flex-direction:column;gap:20px;display:flex}.git-view-header{border-bottom:1px solid #ffffff14;justify-content:space-between;align-items:center;padding-bottom:14px;display:flex}.git-view-header h4{color:#fff;margin:0;font-size:16px}.git-branch-tag{font-family:var(--font-mono);color:var(--emerald-aurora);background:#00e5991a;border-radius:6px;padding:3px 8px;font-size:11.5px}.git-commit-timeline{flex-direction:column;gap:12px;display:flex}.git-commit-item{background:#ffffff05;border:1px solid #ffffff0f;border-radius:10px;align-items:flex-start;gap:14px;padding:12px 16px;display:flex}.commit-hash{font-family:var(--font-mono);color:var(--emerald-aurora);background:#00e5991f;border-radius:6px;flex-shrink:0;padding:3px 8px;font-size:12px;font-weight:700}.commit-details{flex-direction:column;gap:2px;display:flex}.commit-details strong{color:#fff;font-size:13px}.commit-details small{color:var(--text-dim);font-size:11.5px}.studio-vpc-view{flex-direction:column;gap:24px;display:flex}.vpc-kpi-cards-grid{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;display:grid}.vpc-kpi-card{background:#ffffff08;border:1px solid #ffffff14;border-radius:14px;flex-direction:column;gap:6px;padding:18px;display:flex}.vpc-kpi-card small{font-family:var(--font-display);letter-spacing:.08em;color:var(--text-dim);font-size:10px;font-weight:800}.emerald-text{color:var(--emerald-aurora);font-size:22px;font-weight:800}.vpc-kpi-card span{color:var(--text-sub);font-size:11.5px}.vpc-architecture-box{background:#00e5990a;border:1px solid #00e59933;border-radius:14px;padding:20px}.arch-head{align-items:flex-start;gap:14px;display:flex}.arch-head svg{color:var(--emerald-aurora);flex-shrink:0;width:24px;height:24px;margin-top:2px}.arch-head strong{color:#fff;font-size:14.5px;display:block}.arch-head p{color:var(--text-sub);margin-top:4px;font-size:12.5px;line-height:1.5}.saas-tax-calc-card{background:var(--card-bg);border:1px solid var(--card-border);-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);border-radius:24px;margin-top:36px;padding:clamp(28px,3.5vw,44px);box-shadow:0 24px 64px #00000080}.calc-header-row{border-bottom:1px solid #ffffff14;justify-content:space-between;align-items:flex-start;gap:28px;margin-bottom:28px;padding-bottom:24px;display:flex}@media (max-width:900px){.calc-header-row{flex-direction:column}}.calc-title{color:#fff;margin:6px 0 8px;font-size:clamp(22px,2.4vw,32px)}.calc-subtitle{color:var(--text-sub);max-width:680px;font-size:14.5px}.calc-crossover-badge{text-align:center;background:#00e59914;border:1px solid #00e5994d;border-radius:14px;flex-shrink:0;min-width:170px;padding:14px 20px}.calc-crossover-badge small{color:var(--emerald-aurora);font-size:9.5px;font-weight:800;display:block}.calc-crossover-badge strong{color:#fff;font-size:22px;display:block}.calc-crossover-badge span{color:var(--text-dim);font-size:10.5px}.saas-calc-grid{grid-template-columns:1.15fr .85fr;align-items:start;gap:32px;display:grid}@media (max-width:1024px){.saas-calc-grid{grid-template-columns:1fr}}.calc-inputs-pane{flex-direction:column;gap:24px;display:flex}.seat-slider-box{background:#ffffff05;border:1px solid #ffffff14;border-radius:14px;padding:18px 20px}.seat-num-text{color:var(--emerald-aurora);font-size:18px;font-weight:800}.saas-tools-grid{grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;margin-top:10px;display:grid}.saas-tool-card{text-align:left;cursor:pointer;background:#ffffff08;border:1px solid #ffffff14;border-radius:12px;flex-direction:column;gap:8px;padding:14px;transition:all .2s;display:flex}.saas-tool-card:hover{background:#ffffff0f;border-color:#ffffff2e}.saas-tool-card.selected{border-color:var(--emerald-aurora);background:#00e5990f;box-shadow:0 0 16px #00e5991f}.tool-card-top{justify-content:space-between;align-items:center;display:flex}.tool-check{width:18px;height:18px;color:var(--text-dim);background:#ffffff14;border-radius:50%;justify-content:center;align-items:center;font-size:11px;display:flex}.tool-check.checked{background:var(--emerald-aurora);color:#03070d;font-weight:800}.tool-name{color:#fff;font-size:13px;line-height:1.3}.tool-cost-row{color:var(--text-dim);justify-content:space-between;align-items:center;font-size:11px;display:flex}.tool-price{color:var(--emerald-aurora);font-weight:700}.results-inner-card{background:#050c16d9;border:1px solid #00e59947;border-radius:18px;flex-direction:column;gap:18px;padding:22px;display:flex}.results-head{border-bottom:1px solid #ffffff14;justify-content:space-between;align-items:center;padding-bottom:12px;display:flex}.res-tag{font-family:var(--font-display);color:var(--text-dim);font-size:10.5px;font-weight:800}.res-highlight{color:var(--emerald-aurora);font-size:13px;font-weight:800}.ledger-comparison-table{flex-direction:column;gap:8px;display:flex}.ledger-row{background:#ffffff05;border-radius:8px;grid-template-columns:1.2fr 1fr 1.2fr;align-items:center;padding:8px 10px;font-size:12.5px;display:grid}.ledger-row.header{font-family:var(--font-display);color:var(--text-dim);background:0 0;font-size:10px;font-weight:800}.saas-num{color:#f87171;font-weight:600}.saas-num.strike{opacity:.8;text-decoration:line-through}.fimriq-col{color:var(--text-main);text-align:right;font-weight:600}.fimriq-col.highlight{color:var(--emerald-aurora);font-weight:800}.savings-callout-box{background:#00e59914;border:1px solid #00e59940;border-radius:12px;align-items:flex-start;gap:10px;padding:14px;font-size:12px;display:flex}.savings-callout-box strong{color:var(--emerald-aurora);display:block}.savings-callout-box p{color:var(--text-sub);margin-top:2px}.calc-cta-group{flex-direction:column;gap:10px;display:flex}.audit-wizard-card{max-width:var(--content-max);margin:var(--section-space) auto;padding:0 var(--gutter);box-sizing:border-box}.wizard-progress-bar-row{background:var(--card-bg);border:1px solid var(--card-border);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-bottom:1px solid #ffffff14;border-radius:20px 20px 0 0;justify-content:space-between;align-items:center;gap:20px;padding:22px 28px;display:flex}.wizard-step-info h3{color:#fff;margin-top:4px;font-size:20px}.wizard-step-badges{gap:8px;display:flex}.wizard-step-dot{width:32px;height:32px;color:var(--text-dim);font-family:var(--font-display);background:#ffffff0a;border:1px solid #ffffff1a;border-radius:50%;justify-content:center;align-items:center;font-size:11px;font-weight:800;display:flex}.wizard-step-dot.active{border-color:var(--emerald-aurora);color:#fff;background:#00e59926}.wizard-step-dot.completed{background:var(--emerald-aurora);border-color:var(--emerald-aurora);color:#03070d}.wizard-step-body{background:var(--card-bg);border:1px solid var(--card-border);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-top:none;border-radius:0 0 20px 20px;flex-direction:column;gap:24px;padding:clamp(24px,3.5vw,36px);display:flex;box-shadow:0 24px 64px #00000080}.step-intro h4{color:#fff;margin-bottom:6px;font-size:18px}.step-intro p{color:var(--text-sub);font-size:13.5px}.audit-options-grid{grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px;display:grid}.audit-choice-card{text-align:left;cursor:pointer;background:#ffffff08;border:1px solid #ffffff14;border-radius:14px;flex-direction:column;gap:10px;padding:18px;transition:all .2s;display:flex}.audit-choice-card:hover{background:#ffffff0f;border-color:#fff3}.audit-choice-card.selected{border-color:var(--emerald-aurora);background:#00e5990f;box-shadow:0 0 20px #00e59926}.choice-top{justify-content:space-between;align-items:center;display:flex}.choice-cat{font-family:var(--font-display);color:var(--text-dim);font-size:10px;font-weight:800}.choice-check{width:18px;height:18px;color:var(--text-dim);background:#ffffff14;border-radius:50%;justify-content:center;align-items:center;font-size:11px;display:flex}.choice-check.checked{background:var(--emerald-aurora);color:#03070d;font-weight:800}.scale-config-grid{grid-template-columns:1fr 1fr;gap:24px;display:grid}@media (max-width:800px){.scale-config-grid{grid-template-columns:1fr}}.config-block{flex-direction:column;gap:10px;display:flex}.config-block label{font-family:var(--font-display);color:var(--text-dim);font-size:10.5px;font-weight:800}.pill-selector-row{flex-direction:column;gap:8px;display:flex}.pill-btn{text-align:left;color:var(--text-sub);cursor:pointer;background:#ffffff08;border:1px solid #ffffff14;border-radius:10px;padding:10px 14px;font-size:13px;transition:all .2s}.pill-btn:hover{background:#ffffff0f}.pill-btn.active{border-color:var(--emerald-aurora);color:#fff;background:#00e5991a;font-weight:700}.wizard-nav-row{border-top:1px solid #ffffff0f;justify-content:space-between;align-items:center;padding-top:18px;display:flex}.audit-results-card{flex-direction:column;gap:24px;display:flex}.score-hero-row{background:#0006;border:1px solid #ffffff14;border-radius:16px;align-items:center;gap:24px;padding:24px;display:flex}@media (max-width:768px){.score-hero-row{text-align:center;flex-direction:column}}.score-badge{border-radius:50%;flex-direction:column;flex-shrink:0;justify-content:center;align-items:center;width:100px;height:100px;display:flex}.score-badge.critical{color:#ef4444;background:#ef444426;border:2px solid #ef4444}.score-badge.warning{color:#f59e0b;background:#f59e0b26;border:2px solid #f59e0b}.score-badge.optimal{border:2px solid var(--emerald-aurora);color:var(--emerald-aurora);background:#00e59926}.score-num{font-size:32px;font-weight:900;line-height:1}.score-out-of{font-size:11px;font-weight:700}.risk-pill{font-family:var(--font-display);border-radius:9999px;margin-bottom:8px;padding:3px 10px;font-size:10.5px;font-weight:800;display:inline-block}.risk-pill.critical{color:#f87171;background:#ef444433;border:1px solid #ef4444}.risk-pill.warning{color:#fbbf24;background:#f59e0b33;border:1px solid #f59e0b}.risk-pill.optimal{color:var(--emerald-aurora);border:1px solid var(--emerald-aurora);background:#00e59933}.roadmap-recommendations-grid{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;display:grid}.rec-card{background:#ffffff08;border:1px solid #ffffff14;border-radius:12px;flex-direction:column;gap:6px;padding:16px;display:flex}.rec-step{font-family:var(--font-display);color:var(--emerald-aurora);font-size:9.5px;font-weight:800}.rec-card strong{color:#fff;font-size:13.5px}.rec-card p{color:var(--text-sub);font-size:12px;line-height:1.45}.audit-action-banner{background:#00e5990f;border:1px solid #00e59940;border-radius:16px;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:20px;padding:20px 24px;display:flex}.action-buttons-group{flex-wrap:wrap;gap:10px;display:flex}@property --tw-rotate-x{syntax:"*";inherits:false}@property --tw-rotate-y{syntax:"*";inherits:false}@property --tw-rotate-z{syntax:"*";inherits:false}@property --tw-skew-x{syntax:"*";inherits:false}@property --tw-skew-y{syntax:"*";inherits:false}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-outline-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-drop-shadow{syntax:"*";inherits:false}@property --tw-drop-shadow-color{syntax:"*";inherits:false}@property --tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false}@property --tw-backdrop-blur{syntax:"*";inherits:false}@property --tw-backdrop-brightness{syntax:"*";inherits:false}@property --tw-backdrop-contrast{syntax:"*";inherits:false}@property --tw-backdrop-grayscale{syntax:"*";inherits:false}@property --tw-backdrop-hue-rotate{syntax:"*";inherits:false}@property --tw-backdrop-invert{syntax:"*";inherits:false}@property --tw-backdrop-opacity{syntax:"*";inherits:false}@property --tw-backdrop-saturate{syntax:"*";inherits:false}@property --tw-backdrop-sepia{syntax:"*";inherits:false}




/* ==========================================================================
   FIMRIQ DESIGN SYSTEM 3.0 — NORDIC TITANIUM & EMERALD AURORA
   Ultra-Premium Linear / Supabase / VectorAgents Luxury Tech Palette
   ========================================================================== */

:root {
  /* Canvas & Obsidian Surfaces */
  --canvas: #04080f;
  --canvas-subtle: #070d17;
  --canvas-surface: #0a1320;
  --canvas-surface-elevated: #0f1c2d;
  
  /* Glassmorphism & Titanium Surfaces */
  --card-bg: rgba(10, 19, 32, 0.65);
  --card-bg-hover: rgba(14, 26, 44, 0.82);
  --card-border: rgba(255, 255, 255, 0.07);
  --card-border-hover: rgba(0, 229, 153, 0.35);
  --specular-line: linear-gradient(180deg, rgba(255, 255, 255, 0.12) 0%, rgba(255, 255, 255, 0.02) 100%);
  
  /* Electric Emerald Aurora Accents */
  --emerald-aurora: #00e599;
  --emerald-vivid: #10b981;
  --emerald-deep: #059669;
  --mint-bright: #38ef7d;
  --cyan-glow: #06b6d4;
  --teal-accent: #14b8a6;
  
  /* Ambient Glow Gradients */
  --glow-emerald: radial-gradient(circle, rgba(0, 229, 153, 0.14) 0%, rgba(16, 185, 129, 0.05) 50%, transparent 75%);
  --glow-cyan: radial-gradient(circle, rgba(6, 182, 212, 0.1) 0%, transparent 70%);
  --button-aurora: linear-gradient(135deg, #00e599 0%, #10b981 50%, #059669 100%);
  --button-aurora-hover: linear-gradient(135deg, #38ef7d 0%, #00e599 100%);
  
  /* High-Contrast Typography Hierarchy */
  --text-main: #ffffff;
  --text-sub: #cbd5e1;
  --text-muted: #94a3b8;
  --text-dim: #64748b;

  /* Typography Families */
  --font-display: var(--font-space-grotesk), "Space Grotesk", -apple-system, BlinkMacSystemFont, sans-serif;
  --font-body: var(--font-geist-sans), "Geist", -apple-system, BlinkMacSystemFont, sans-serif;
  --font-mono: var(--font-geist-mono), monospace;

  /* Spacing & Layout */
  --content-max: 1360px;
  --gutter: clamp(20px, 4vw, 48px);
  --section-space: clamp(76px, 7.5vw, 116px);
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
  scroll-padding-top: 110px;
  background-color: var(--canvas);
  color-scheme: dark;
}

body {
  margin: 0;
  background-color: var(--canvas);
  color: var(--text-main);
  font-family: var(--font-body);
  font-synthesis: none;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  line-height: 1.55;
  overflow-x: hidden;
}

main {
  position: relative;
  overflow: clip;
}

::selection {
  background: var(--emerald-aurora);
  color: #04080f;
}

a {
  color: inherit;
  text-decoration: none;
  transition: all 0.22s cubic-bezier(0.16, 1, 0.3, 1);
}

button {
  font-family: inherit;
  border: none;
  cursor: pointer;
  background: transparent;
  transition: all 0.22s cubic-bezier(0.16, 1, 0.3, 1);
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible {
  outline: 2px solid var(--emerald-aurora);
  outline-offset: 3px;
}

/* Headings */
h1, h2, h3, h4 {
  font-family: var(--font-display);
  margin: 0;
  color: var(--text-main);
  letter-spacing: -0.035em;
  font-weight: 700;
}

h1 {
  font-size: clamp(46px, 5.4vw, 78px);
  line-height: 1.02;
}

h1 em {
  font-style: normal;
  background: linear-gradient(135deg, #ffffff 0%, #00e599 45%, #38ef7d 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  filter: drop-shadow(0 0 24px rgba(0, 229, 153, 0.25));
}

h2 {
  font-size: clamp(34px, 4.2vw, 56px);
  line-height: 1.06;
}

h2 em {
  font-style: normal;
  background: linear-gradient(135deg, #ffffff 0%, #00e599 45%, #06b6d4 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

p {
  margin: 0;
  color: var(--text-sub);
}

/* Eyebrows & Section Tags */
.eyebrow,
.section-tag {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: var(--font-display);
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--emerald-aurora);
  background: rgba(0, 229, 153, 0.08);
  border: 1px solid rgba(0, 229, 153, 0.22);
  padding: 6px 14px;
  border-radius: 9999px;
  margin-bottom: 20px;
  box-shadow: 0 2px 10px rgba(0, 229, 153, 0.08);
}

.eyebrow span {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--emerald-aurora);
  box-shadow: 0 0 12px var(--emerald-aurora);
}

.section-tag.light {
  color: var(--emerald-aurora);
  background: rgba(0, 229, 153, 0.1);
  border-color: rgba(0, 229, 153, 0.3);
}

/* ==========================================================================
   BUTTONS & ACTION PILLS
   ========================================================================== */

.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-family: var(--font-display);
  font-size: 15px;
  font-weight: 600;
  padding: 13px 26px;
  border-radius: 9999px;
  white-space: nowrap;
  transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1);
  text-decoration: none;
}

.button-lime {
  background: var(--button-aurora);
  color: #03070d;
  font-weight: 700;
  box-shadow: 0 4px 24px rgba(0, 229, 153, 0.35), inset 0 1px 0 rgba(255, 255, 255, 0.4);
}

.button-lime:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 32px rgba(0, 229, 153, 0.55), inset 0 1px 0 rgba(255, 255, 255, 0.6);
  background: var(--button-aurora-hover);
}

.button-glass {
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.12);
  color: var(--text-main);
  backdrop-filter: blur(12px);
}

.button-glass:hover {
  background: rgba(255, 255, 255, 0.09);
  border-color: rgba(0, 229, 153, 0.4);
  transform: translateY(-2px);
  color: #ffffff;
  box-shadow: 0 4px 20px rgba(0, 229, 153, 0.15);
}

.button-dark {
  background: #091320;
  border: 1px solid rgba(255, 255, 255, 0.1);
  color: var(--text-main);
}

.button-dark:hover {
  background: #112238;
  border-color: var(--emerald-aurora);
  color: #ffffff;
  box-shadow: 0 4px 20px rgba(0, 229, 153, 0.2);
}

.button-outline {
  border: 1px solid rgba(255, 255, 255, 0.16);
  color: var(--text-main);
}

.button-outline:hover {
  border-color: var(--emerald-aurora);
  background: rgba(0, 229, 153, 0.08);
  color: var(--emerald-aurora);
}

.button-header-cta {
  background: rgba(0, 229, 153, 0.1);
  border: 1px solid rgba(0, 229, 153, 0.3);
  color: var(--emerald-aurora);
  padding: 9px 20px;
  font-size: 14px;
  box-shadow: 0 2px 12px rgba(0, 229, 153, 0.1);
}

.button-header-cta:hover {
  background: var(--emerald-aurora);
  color: #03070d;
  border-color: var(--emerald-aurora);
  box-shadow: 0 0 20px rgba(0, 229, 153, 0.45);
}

/* Precision Micro-Icons & Dynamic Hover Physics */
.btn-icon {
  display: inline-block;
  flex-shrink: 0;
  vertical-align: middle;
  transition: transform 0.22s cubic-bezier(0.16, 1, 0.3, 1);
}

.btn-icon-right {
  transition: transform 0.22s cubic-bezier(0.16, 1, 0.3, 1);
}

a:hover .btn-icon-right,
button:hover .btn-icon-right,
.button:hover .btn-icon-right {
  transform: translateX(4px);
}

.btn-icon-up-right {
  transition: transform 0.22s cubic-bezier(0.16, 1, 0.3, 1);
}

a:hover .btn-icon-up-right,
button:hover .btn-icon-up-right,
.button:hover .btn-icon-up-right,
.service-card:hover .btn-icon-up-right,
.showcase-action-btn:hover .btn-icon-up-right,
.card-link-subtle:hover .btn-icon-up-right {
  transform: translate(3px, -3px);
}

.btn-icon-left {
  transition: transform 0.22s cubic-bezier(0.16, 1, 0.3, 1);
}

button:hover .btn-icon-left,
.button:hover .btn-icon-left {
  transform: translateX(-4px);
}

.pipeline-dot {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--emerald-aurora);
  box-shadow: 0 0 8px var(--emerald-aurora);
  display: inline-block;
}

/* ==========================================================================
   TOP ANNOUNCEMENT BAR & STICKY HEADER
   ========================================================================== */

.announcement-ribbon {
  background: rgba(5, 10, 18, 0.95);
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
  padding: 8px var(--gutter);
  font-size: 13px;
}

.announcement-inner {
  max-width: var(--content-max);
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  flex-wrap: wrap;
}

.announcement-badge {
  font-family: var(--font-display);
  font-size: 11px;
  font-weight: 700;
  background: rgba(0, 229, 153, 0.15);
  color: var(--emerald-aurora);
  border: 1px solid rgba(0, 229, 153, 0.3);
  padding: 2px 8px;
  border-radius: 6px;
  letter-spacing: 0.06em;
}

.announcement-text {
  color: var(--text-sub);
  margin: 0;
}

.announcement-link {
  font-family: var(--font-display);
  color: var(--emerald-aurora);
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

.announcement-link:hover {
  color: #ffffff;
  text-decoration: underline;
}

.site-header {
  position: sticky;
  top: 0;
  z-index: 100;
  background: rgba(4, 8, 15, 0.82);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border-bottom: 1px solid rgba(255, 255, 255, 0.07);
  padding: 10px var(--gutter);
  transition: all 0.3s ease;
}

.header-inner {
  max-width: var(--content-max);
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}

/* Official FIMRIQ Logo */
.brand {
  display: inline-flex;
  align-items: center;
  text-decoration: none;
}

.brand-logo-img {
  height: 66px;
  width: auto;
  max-width: 285px;
  object-fit: contain;
  display: block;
  filter: drop-shadow(0 2px 12px rgba(0, 0, 0, 0.28));
  transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1), filter 0.25s ease;
}

.brand:hover .brand-logo-img {
  transform: scale(1.03);
  filter: drop-shadow(0 4px 18px rgba(0, 229, 153, 0.35));
}

.footer-logo {
  height: 78px;
  max-width: 330px;
}

.site-nav {
  display: flex;
  align-items: center;
  gap: 28px;
}

.nav-item {
  font-family: var(--font-display);
  font-size: 15px;
  font-weight: 500;
  color: var(--text-sub);
  position: relative;
  padding: 6px 0;
}

.nav-item:hover {
  color: var(--text-main);
}

.nav-item::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0%;
  height: 2px;
  background: var(--emerald-aurora);
  box-shadow: 0 0 8px var(--emerald-aurora);
  transition: width 0.25s ease;
}

.nav-item:hover::after {
  width: 100%;
}

/* ==========================================================================
   HERO SECTION & SHOWCASE
   ========================================================================== */

.hero {
  position: relative;
  padding: clamp(52px, 6.5vw, 96px) var(--gutter) clamp(52px, 6.5vw, 80px);
  max-width: var(--content-max);
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1.05fr 1fr;
  gap: clamp(32px, 5vw, 64px);
  align-items: center;
}

.hero-glow-mesh {
  position: absolute;
  top: -180px;
  left: 25%;
  width: 700px;
  height: 700px;
  background: radial-gradient(circle, rgba(0, 229, 153, 0.15) 0%, rgba(6, 182, 212, 0.08) 45%, transparent 70%);
  filter: blur(90px);
  pointer-events: none;
  z-index: 0;
}

.hero-kicker-wrap {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.08);
  padding: 5px 12px;
  border-radius: 999px;
  margin-bottom: 20px;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  width: fit-content;
  flex-wrap: wrap;
}

.hero-kicker-badge {
  font-family: var(--font-display);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  color: var(--lime);
}

.hero-kicker-divider {
  color: rgba(255, 255, 255, 0.2);
  font-size: 12px;
  font-weight: 300;
}

.hero-kicker-sub {
  font-family: var(--font-display);
  font-size: 10.5px;
  font-weight: 600;
  letter-spacing: 0.06em;
  color: var(--text-dim);
}

.hero-copy {
  position: relative;
  z-index: 1;
}

.hero-lead {
  font-size: clamp(17px, 1.8vw, 20px);
  line-height: 1.6;
  color: var(--text-sub);
  margin: 24px 0 36px;
  max-width: 580px;
}

.hero-actions {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
  align-items: center;
}

/* ==========================================================================
   HERO SHOWCASE COMPONENT (TITANIUM & EMERALD AURORA)
   ========================================================================== */

.hero-visual-container {
  position: relative;
  z-index: 1;
}

.hero-showcase-wrapper {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.showcase-tabs-container {
  display: flex;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 9999px;
  padding: 5px;
  gap: 4px;
  overflow-x: auto;
  scrollbar-width: none;
  backdrop-filter: blur(16px);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.showcase-tabs-container::-webkit-scrollbar {
  display: none;
}

.showcase-tab-btn {
  font-family: var(--font-display);
  font-size: 13px;
  font-weight: 500;
  color: var(--text-sub);
  padding: 8px 16px;
  border-radius: 9999px;
  white-space: nowrap;
  transition: all 0.2s ease;
}

.showcase-tab-btn:hover {
  color: var(--text-main);
  background: rgba(255, 255, 255, 0.06);
}

.showcase-tab-btn.active {
  background: #ffffff;
  color: #04080f;
  font-weight: 700;
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.45);
}

.showcase-card-display {
  position: relative;
  background: var(--card-bg);
  border: 1px solid var(--card-border);
  border-radius: 24px;
  padding: clamp(24px, 3vw, 36px);
  backdrop-filter: blur(24px);
  -webkit-backdrop-filter: blur(24px);
  box-shadow: 0 24px 54px rgba(0, 0, 0, 0.5), inset 0 1px 0 rgba(255, 255, 255, 0.12);
  overflow: hidden;
  transition: all 0.3s ease;
}

.showcase-card-glow {
  position: absolute;
  top: 0;
  right: 0;
  width: 300px;
  height: 300px;
  background: radial-gradient(circle, rgba(0, 229, 153, 0.16) 0%, transparent 70%);
  pointer-events: none;
}

.showcase-card-inner {
  position: relative;
  z-index: 1;
}

.showcase-badge-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 14px;
}

.showcase-pill-kicker {
  font-family: var(--font-display);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--emerald-aurora);
}

.showcase-status-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-family: var(--font-display);
  font-size: 11px;
  font-weight: 600;
  color: var(--text-sub);
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.08);
  padding: 3px 10px;
  border-radius: 9999px;
}

.pulse-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--emerald-aurora);
  box-shadow: 0 0 10px var(--emerald-aurora);
  animation: pulse 2s infinite;
}

@keyframes pulse {
  0% { transform: scale(0.95); opacity: 0.7; }
  50% { transform: scale(1.25); opacity: 1; }
  100% { transform: scale(0.95); opacity: 0.7; }
}

.showcase-title {
  font-size: clamp(22px, 2.4vw, 28px);
  margin-bottom: 8px;
}

.showcase-sub {
  font-size: 15px;
  color: var(--text-muted);
  line-height: 1.55;
  margin-bottom: 24px;
}

.showcase-body-grid {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 24px;
  align-items: center;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  padding-top: 24px;
}

.showcase-feature-list {
  list-style: none;
  padding: 0;
  margin: 0 0 20px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.showcase-feature-list li {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: 14px;
  color: var(--text-sub);
}

.check-icon {
  color: var(--emerald-aurora);
  font-weight: bold;
  font-size: 13px;
  background: rgba(0, 229, 153, 0.12);
  width: 18px;
  height: 18px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.showcase-tags-strip {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.showcase-tag {
  font-family: var(--font-display);
  font-size: 12px;
  font-weight: 500;
  color: var(--text-muted);
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.07);
  padding: 3px 10px;
  border-radius: 6px;
}

.showcase-metric-box {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 16px;
  text-align: right;
}

.metric-highlight {
  background: rgba(0, 229, 153, 0.06);
  border: 1px solid rgba(0, 229, 153, 0.22);
  border-radius: 16px;
  padding: 16px 20px;
  min-width: 140px;
  text-align: center;
  box-shadow: 0 4px 16px rgba(0, 229, 153, 0.08);
}

.metric-num {
  display: block;
  font-family: var(--font-display);
  font-size: 32px;
  font-weight: 800;
  color: var(--emerald-aurora);
  line-height: 1;
}

.metric-sub {
  display: block;
  font-family: var(--font-display);
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--text-sub);
  margin-top: 4px;
}

.showcase-action-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-family: var(--font-display);
  font-size: 13px;
  font-weight: 600;
  color: var(--emerald-aurora);
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.1);
  padding: 8px 16px;
  border-radius: 9999px;
  white-space: nowrap;
}

.showcase-action-btn:hover {
  background: var(--emerald-aurora);
  color: #03070d;
  box-shadow: 0 0 16px rgba(0, 229, 153, 0.35);
}

/* ==========================================================================
   SIGNAL STRIP (8-PILLAR INTERACTIVE MARQUEE) & TECH LOGO MARQUEE
   ========================================================================== */

.signal-strip {
  background: linear-gradient(180deg, rgba(6, 11, 20, 0.95) 0%, rgba(8, 16, 28, 0.9) 100%);
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  padding: 14px 0;
  overflow: hidden;
  position: relative;
  mask-image: linear-gradient(to right, transparent, black 5%, black 95%, transparent);
  -webkit-mask-image: linear-gradient(to right, transparent, black 5%, black 95%, transparent);
}

/* Luminous Laser Beam Sweep across borders */
.signal-strip::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 30%;
  height: 1.5px;
  background: linear-gradient(90deg, transparent, rgba(56, 189, 248, 0.95), rgba(0, 102, 255, 0.9), transparent);
  animation: signalLaserTop 4.5s ease-in-out infinite;
  z-index: 2;
}

.signal-strip::after {
  content: "";
  position: absolute;
  bottom: 0;
  right: 0;
  width: 30%;
  height: 1.5px;
  background: linear-gradient(90deg, transparent, rgba(0, 102, 255, 0.9), rgba(56, 189, 248, 0.95), transparent);
  animation: signalLaserBottom 4.5s ease-in-out infinite 2.25s;
  z-index: 2;
}

@keyframes signalLaserTop {
  0% {
    transform: translateX(-120%);
  }
  100% {
    transform: translateX(450%);
  }
}

@keyframes signalLaserBottom {
  0% {
    transform: translateX(120%);
  }
  100% {
    transform: translateX(-450%);
  }
}

.signal-track {
  display: flex;
  gap: 20px;
  width: max-content;
  animation: signalStreamFlow 30s linear infinite;
  align-items: center;
  will-change: transform;
}

.signal-strip:hover .signal-track {
  animation-play-state: paused;
}

@keyframes signalStreamFlow {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-50%);
  }
}

/* Dynamic Kinetic Floating Wave for each Pillar */
.signal-item {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 8px 14px 8px 16px;
  background: rgba(13, 22, 38, 0.75);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 999px;
  font-family: var(--font-display);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.1em;
  color: var(--text-muted);
  text-decoration: none;
  white-space: nowrap;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.25), inset 0 1px 0 rgba(255, 255, 255, 0.04);
  transition: all 0.28s cubic-bezier(0.16, 1, 0.3, 1);
  animation: signalPillFloat 3.8s ease-in-out infinite;
  will-change: transform;
}

.signal-item:nth-child(even) {
  animation-delay: -1.9s;
}

.signal-item:nth-child(3n) {
  animation-delay: -0.9s;
}

@keyframes signalPillFloat {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-3px);
  }
}

.signal-item:hover {
  background: rgba(14, 30, 56, 0.95);
  border-color: rgba(56, 189, 248, 0.55);
  color: #ffffff;
  transform: translateY(-4px) scale(1.02);
  box-shadow: 0 8px 24px rgba(0, 102, 255, 0.3), 0 0 14px rgba(56, 189, 248, 0.25);
  animation-play-state: paused;
}

.signal-num {
  color: var(--lime);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.05em;
}

.signal-slash {
  color: rgba(255, 255, 255, 0.2);
  font-weight: 400;
}

.signal-label {
  letter-spacing: 0.08em;
}

/* High-Tech Blue Box Arrow */
.signal-arrow-box {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  border-radius: 6px;
  background: linear-gradient(135deg, rgba(14, 116, 244, 0.22) 0%, rgba(0, 163, 255, 0.12) 100%);
  border: 1px solid rgba(56, 189, 248, 0.38);
  box-shadow: 0 0 8px rgba(0, 140, 255, 0.25), inset 0 1px 0 rgba(255, 255, 255, 0.12);
  color: #38bdf8;
  margin-left: 2px;
  flex-shrink: 0;
  transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1);
  animation: blueBoxPulse 3s ease-in-out infinite;
}

.signal-arrow-box svg {
  width: 10px;
  height: 10px;
  transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1), stroke 0.25s ease;
}

@keyframes blueBoxPulse {
  0%, 100% {
    box-shadow: 0 0 6px rgba(0, 140, 255, 0.25);
    border-color: rgba(56, 189, 248, 0.38);
  }
  50% {
    box-shadow: 0 0 12px rgba(56, 189, 248, 0.55), inset 0 0 6px rgba(0, 163, 255, 0.25);
    border-color: rgba(125, 211, 252, 0.65);
  }
}

.signal-item:hover .signal-arrow-box {
  background: linear-gradient(135deg, #0284c7 0%, #2563eb 100%);
  border-color: #7dd3fc;
  color: #ffffff;
  box-shadow: 0 0 16px rgba(56, 189, 248, 0.75), 0 2px 8px rgba(0, 102, 255, 0.5);
  transform: scale(1.08);
}

.signal-item:hover .signal-arrow-box svg {
  transform: translate(1.5px, -1.5px);
  stroke: #ffffff;
}

/* Backward compatibility fallback */
.signal-arrow {
  color: var(--text-dim);
  font-size: 11px;
  transition: transform 0.2s ease, color 0.2s ease;
}

.client-logos {
  padding: 48px var(--gutter) 40px;
  text-align: center;
  max-width: var(--content-max);
  margin: 0 auto;
}

.logo-strip-head {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  margin-bottom: 24px;
  font-family: var(--font-display);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.14em;
  color: var(--text-dim);
}

.logo-strip-head span {
  background: rgba(255, 255, 255, 0.06);
  padding: 2px 8px;
  border-radius: 4px;
}

.logo-marquee {
  overflow: hidden;
  position: relative;
  mask-image: linear-gradient(to right, transparent, black 15%, black 85%, transparent);
  -webkit-mask-image: linear-gradient(to right, transparent, black 15%, black 85%, transparent);
}

.logo-track {
  display: flex;
  gap: 48px;
  width: max-content;
  animation: marquee 35s linear infinite;
  align-items: center;
}

@keyframes marquee {
  0% { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

.placeholder-logo {
  display: flex;
  align-items: center;
  gap: 10px;
  opacity: 0.55;
  filter: grayscale(1);
  transition: all 0.2s ease;
}

.placeholder-logo:hover {
  opacity: 0.9;
  filter: grayscale(0);
}

.placeholder-logo img {
  width: 22px;
  height: 22px;
  object-fit: contain;
}

.placeholder-logo span {
  font-family: var(--font-display);
  font-size: 14px;
  font-weight: 600;
  color: var(--text-muted);
}

.client-logos small {
  display: block;
  margin-top: 18px;
  font-size: 12px;
  color: var(--text-dim);
}

/* ==========================================================================
   INTRO / WHY FIMRIQ & CAPABILITIES SECTION
   ========================================================================== */

.intro {
  padding: var(--section-space) var(--gutter);
  max-width: var(--content-max);
  margin: 0 auto;
  display: grid;
  grid-template-columns: 240px 1fr;
  gap: clamp(24px, 4vw, 64px);
}

.intro h2 {
  max-width: 800px;
  margin-bottom: 24px;
}

.intro p {
  font-size: clamp(17px, 1.8vw, 20px);
  line-height: 1.6;
  max-width: 760px;
  color: var(--text-sub);
}

.services {
  padding: 0 var(--gutter) var(--section-space);
  max-width: var(--content-max);
  margin: 0 auto;
}

.section-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  margin-bottom: 40px;
  flex-wrap: wrap;
  gap: 20px;
}

.section-counter-badge {
  font-family: var(--font-display);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.12em;
  color: var(--text-muted);
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.08);
  padding: 6px 14px;
  border-radius: 9999px;
}

.service-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}

.service-card {
  background: var(--card-bg);
  border: 1px solid var(--card-border);
  border-radius: 20px;
  padding: 32px 24px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1);
  position: relative;
  backdrop-filter: blur(16px);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.service-card:hover {
  transform: translateY(-4px);
  background: var(--card-bg-hover);
  border-color: var(--card-border-hover);
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.4), 0 0 20px rgba(0, 229, 153, 0.12);
}

.service-card.featured {
  background: linear-gradient(180deg, rgba(0, 229, 153, 0.1) 0%, rgba(10, 19, 32, 0.88) 100%);
  border-color: rgba(0, 229, 153, 0.35);
  box-shadow: 0 16px 36px rgba(0, 0, 0, 0.35), inset 0 1px 0 rgba(0, 229, 153, 0.3);
}

.service-num {
  font-family: var(--font-display);
  font-size: 13px;
  font-weight: 700;
  color: var(--emerald-aurora);
  margin-bottom: 20px;
}

.service-card h3 {
  font-size: 22px;
  margin-bottom: 14px;
  line-height: 1.2;
}

.service-card p {
  font-size: 14px;
  color: var(--text-sub);
  line-height: 1.55;
  margin-bottom: 28px;
  flex-grow: 1;
}

.service-card-link {
  font-family: var(--font-display);
  font-size: 13px;
  font-weight: 600;
  color: var(--emerald-aurora);
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.service-card:hover .service-card-link {
  color: #ffffff;
}

/* ==========================================================================
   INTERACTIVE USE CASES MATRIX (TITANIUM & EMERALD GLOW)
   ========================================================================== */

.section-interactive-use-cases {
  padding: var(--section-space) var(--gutter);
  max-width: var(--content-max);
  margin: 0 auto;
}

.section-head-center {
  text-align: center;
  max-width: 760px;
  margin: 0 auto 40px;
}

.section-pill-tag {
  font-family: var(--font-display);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--emerald-aurora);
  background: rgba(0, 229, 153, 0.1);
  border: 1px solid rgba(0, 229, 153, 0.25);
  padding: 5px 14px;
  border-radius: 9999px;
  display: inline-block;
  margin-bottom: 16px;
}

.section-title-large {
  font-size: clamp(32px, 3.8vw, 48px);
  margin-bottom: 16px;
}

.section-sub-lead {
  font-size: 17px;
  color: var(--text-sub);
}

.use-case-tabs-bar {
  display: flex;
  justify-content: center;
  gap: 8px;
  margin-bottom: 36px;
  overflow-x: auto;
  padding-bottom: 8px;
}

.use-case-tab-btn {
  font-family: var(--font-display);
  font-size: 14px;
  font-weight: 600;
  color: var(--text-sub);
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.08);
  padding: 10px 22px;
  border-radius: 9999px;
  white-space: nowrap;
}

.use-case-tab-btn:hover {
  background: rgba(255, 255, 255, 0.08);
  color: var(--text-main);
}

.use-case-tab-btn.active {
  background: #ffffff;
  color: #04080f;
  border-color: #ffffff;
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.4);
}

.use-cases-cards-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}

.use-case-glass-card {
  background: var(--card-bg);
  border: 1px solid var(--card-border);
  border-radius: 20px;
  padding: 28px;
  display: flex;
  flex-direction: column;
  transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1);
  backdrop-filter: blur(20px);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.use-case-glass-card:hover {
  transform: translateY(-4px);
  background: var(--card-bg-hover);
  border-color: var(--card-border-hover);
  box-shadow: 0 18px 36px rgba(0, 0, 0, 0.4), 0 0 20px rgba(0, 229, 153, 0.12);
}

.card-top-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 18px;
}

.card-icon-bubble {
  font-size: 22px;
  background: rgba(255, 255, 255, 0.05);
  width: 44px;
  height: 44px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(255, 255, 255, 0.08);
}

.card-stat-pill {
  font-family: var(--font-display);
  font-size: 11px;
  font-weight: 700;
  color: var(--emerald-aurora);
  background: rgba(0, 229, 153, 0.1);
  border: 1px solid rgba(0, 229, 153, 0.25);
  padding: 3px 10px;
  border-radius: 9999px;
  letter-spacing: 0.04em;
}

.card-item-title {
  font-size: 20px;
  margin-bottom: 10px;
  line-height: 1.3;
}

.card-item-desc {
  font-size: 14px;
  color: var(--text-sub);
  line-height: 1.6;
  margin-bottom: 24px;
  flex-grow: 1;
}

.card-footer-action {
  border-top: 1px solid rgba(255, 255, 255, 0.06);
  padding-top: 16px;
}

.card-link-subtle {
  font-family: var(--font-display);
  font-size: 13px;
  font-weight: 600;
  color: var(--emerald-aurora);
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

.card-link-subtle:hover {
  color: #ffffff;
}

/* ==========================================================================
   ENTERPRISE SECURITY & RELIABILITY GRID
   ========================================================================== */

.security-section {
  padding: var(--section-space) var(--gutter);
  max-width: var(--content-max);
  margin: 0 auto;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
}

.security-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}

.security-card {
  background: rgba(8, 16, 26, 0.6);
  border: 1px solid rgba(255, 255, 255, 0.07);
  border-radius: 20px;
  padding: 28px;
  backdrop-filter: blur(16px);
  transition: all 0.25s ease;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

.security-card:hover {
  background: rgba(12, 24, 38, 0.78);
  border-color: rgba(0, 229, 153, 0.35);
  transform: translateY(-3px);
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.35), 0 0 16px rgba(0, 229, 153, 0.1);
}

.sec-icon-circle {
  font-size: 26px;
  margin-bottom: 16px;
  background: rgba(0, 229, 153, 0.08);
  width: 48px;
  height: 48px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(0, 229, 153, 0.22);
}

.security-card h3 {
  font-size: 18px;
  margin-bottom: 10px;
}

.security-card p {
  font-size: 13.5px;
  color: var(--text-sub);
  line-height: 1.55;
}

/* ==========================================================================
   FEATURED CASE STUDY (GIGHUB)
   ========================================================================== */

.home-case {
  margin: 0 auto var(--section-space);
  max-width: var(--content-max);
  padding: clamp(36px, 5vw, 64px) var(--gutter);
  background: linear-gradient(135deg, rgba(12, 26, 42, 0.92) 0%, rgba(6, 13, 22, 0.96) 100%);
  border: 1px solid rgba(0, 229, 153, 0.3);
  border-radius: 28px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(32px, 4vw, 64px);
  align-items: center;
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.5), inset 0 1px 0 rgba(255, 255, 255, 0.12);
  position: relative;
  overflow: hidden;
}

.case-badge-pill {
  display: inline-block;
  font-family: var(--font-display);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.1em;
  color: var(--emerald-aurora);
  background: rgba(0, 229, 153, 0.12);
  border: 1px solid rgba(0, 229, 153, 0.3);
  padding: 4px 12px;
  border-radius: 9999px;
  margin-top: 16px;
}

.case-stage-indicators,
.case-flow,
.outcome-strip {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 20px 0 28px;
  flex-wrap: wrap;
  font-family: var(--font-display);
  font-size: 12px;
  font-weight: 700;
}

.case-stage-indicators span:not(.pipeline-dot),
.case-flow b,
.outcome-strip span:not(.pipeline-dot) {
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.09);
  padding: 5px 12px;
  border-radius: 8px;
  color: #ffffff;
  letter-spacing: 0.04em;
}

.home-case-actions {
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
}

/* ==========================================================================
   TANGIBLE VALUE PROOF & PROCESS
   ========================================================================== */

.proof-section {
  padding: 0 var(--gutter) var(--section-space);
  max-width: var(--content-max);
  margin: 0 auto;
}

.proof-intro {
  margin-bottom: 36px;
}

.proof-intro p {
  font-size: 18px;
  max-width: 600px;
  margin-top: 12px;
}

.proof-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}

.proof-card {
  background: var(--card-bg);
  border: 1px solid var(--card-border);
  border-radius: 20px;
  padding: 28px;
  backdrop-filter: blur(16px);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.proof-card strong {
  display: block;
  font-family: var(--font-display);
  font-size: 32px;
  font-weight: 800;
  color: var(--emerald-aurora);
  line-height: 1;
  margin-bottom: 8px;
}

.proof-card span {
  display: block;
  font-family: var(--font-display);
  font-size: 16px;
  font-weight: 700;
  color: #ffffff;
  margin-bottom: 8px;
}

.proof-card p {
  font-size: 13.5px;
  color: var(--text-sub);
  line-height: 1.5;
}

.process {
  padding: 0 var(--gutter) var(--section-space);
  max-width: var(--content-max);
  margin: 0 auto;
}

.process h2 {
  margin-bottom: 40px;
}

.process-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}

.process-step {
  background: rgba(8, 16, 26, 0.6);
  border: 1px solid rgba(255, 255, 255, 0.07);
  border-radius: 20px;
  padding: 28px;
  backdrop-filter: blur(16px);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

.step-num {
  display: block;
  font-family: var(--font-display);
  font-size: 12px;
  font-weight: 800;
  color: var(--emerald-aurora);
  margin-bottom: 12px;
}

.process-step h3 {
  font-size: 20px;
  margin-bottom: 8px;
}

.process-step p {
  font-size: 14px;
  color: var(--text-sub);
  line-height: 1.5;
}

/* ==========================================================================
   SUBPAGE LAYOUTS (SERVICES, PLATFORM, WORK, ABOUT, CONTACT)
   ========================================================================== */

.page-hero {
  padding: clamp(60px, 8vw, 100px) var(--gutter) 48px;
  max-width: var(--content-max);
  margin: 0 auto;
}

.page-hero h1 {
  margin-bottom: 18px;
}

.page-hero p {
  font-size: clamp(18px, 2vw, 22px);
  color: var(--text-sub);
  max-width: 720px;
  line-height: 1.5;
}

.detail-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
  padding: 0 var(--gutter) var(--section-space);
  max-width: var(--content-max);
  margin: 0 auto;
}

.detail-grid article {
  background: var(--card-bg);
  border: 1px solid var(--card-border);
  border-radius: 24px;
  padding: clamp(28px, 4vw, 40px);
  display: flex;
  flex-direction: column;
  backdrop-filter: blur(20px);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.detail-featured {
  border-color: rgba(0, 229, 153, 0.35) !important;
  background: linear-gradient(180deg, rgba(0, 229, 153, 0.1) 0%, rgba(10, 19, 32, 0.85) 100%) !important;
  box-shadow: 0 16px 36px rgba(0, 0, 0, 0.35), inset 0 1px 0 rgba(0, 229, 153, 0.3) !important;
}

.detail-grid span {
  font-family: var(--font-display);
  font-size: 13px;
  font-weight: 700;
  color: var(--emerald-aurora);
  margin-bottom: 14px;
}

.detail-grid h2 {
  font-size: 26px;
  margin-bottom: 12px;
}

.detail-grid ul {
  list-style: none;
  padding: 0;
  margin: 20px 0 28px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.detail-grid li {
  font-size: 14px;
  color: var(--text-sub);
  padding-left: 16px;
  position: relative;
}

.detail-grid li::before {
  content: "•";
  color: var(--emerald-aurora);
  position: absolute;
  left: 0;
}

.rich-section {
  padding: 0 var(--gutter) var(--section-space);
  max-width: var(--content-max);
  margin: 0 auto;
}

.rich-head {
  margin-bottom: 36px;
}

.rich-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
}

.rich-list article {
  background: var(--card-bg);
  border: 1px solid var(--card-border);
  border-radius: 20px;
  padding: 28px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.rich-list span {
  font-family: var(--font-display);
  font-size: 12px;
  font-weight: 700;
  color: var(--emerald-aurora);
  margin-bottom: 8px;
  display: block;
}

.rich-list h3 {
  font-size: 20px;
  margin-bottom: 10px;
}

.rich-list small {
  display: block;
  margin-top: 14px;
  font-family: var(--font-display);
  font-size: 12px;
  font-weight: 600;
  color: var(--text-muted);
}

/* Platform Page */
.platform-page {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 48px;
  padding: 0 var(--gutter) var(--section-space);
  max-width: var(--content-max);
  margin: 0 auto;
  align-items: center;
}

.stack-diagram {
  background: var(--card-bg);
  border: 1px solid var(--card-border);
  border-radius: 24px;
  padding: 28px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.stack-title {
  display: flex;
  justify-content: space-between;
  font-family: var(--font-display);
  font-size: 12px;
  font-weight: 700;
  color: var(--emerald-aurora);
  margin-bottom: 8px;
}

.layer {
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 12px;
  padding: 16px 20px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.layer span {
  font-family: var(--font-display);
  font-size: 12px;
  font-weight: 700;
  color: var(--text-muted);
}

.layer b {
  font-family: var(--font-display);
  font-size: 14px;
  color: #ffffff;
}

.metric-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 16px;
  margin-top: 24px;
}

.metric-list div {
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 14px;
  padding: 16px;
}

.metric-list b {
  font-family: var(--font-display);
  font-size: 18px;
  color: var(--emerald-aurora);
  display: block;
}

.metric-list span {
  font-size: 13px;
  color: var(--text-sub);
}

.assurance {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
  padding: 0 var(--gutter) var(--section-space);
  max-width: var(--content-max);
  margin: 0 auto;
}

.assurance div {
  background: var(--card-bg);
  border: 1px solid var(--card-border);
  border-radius: 18px;
  padding: 24px;
}

.assurance b {
  display: block;
  font-family: var(--font-display);
  font-size: 16px;
  color: #ffffff;
  margin-bottom: 6px;
}

.assurance span {
  font-size: 13px;
  color: var(--text-sub);
}

/* About Page */
.about-page {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 48px;
  padding: 0 var(--gutter) 48px;
  max-width: var(--content-max);
  margin: 0 auto;
}

.about-copy p {
  font-size: 17px;
  line-height: 1.65;
  margin-bottom: 20px;
}

.principles {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  padding: 0 var(--gutter) var(--section-space);
  max-width: var(--content-max);
  margin: 0 auto;
}

.principles article {
  background: var(--card-bg);
  border: 1px solid var(--card-border);
  border-radius: 20px;
  padding: 32px 24px;
}

.principles span {
  font-family: var(--font-display);
  font-size: 13px;
  font-weight: 700;
  color: var(--emerald-aurora);
  margin-bottom: 12px;
  display: block;
}

.principles h3 {
  font-size: 20px;
  margin-bottom: 10px;
}

.principles p {
  font-size: 14px;
  color: var(--text-sub);
  line-height: 1.55;
}

.beliefs {
  padding: 0 var(--gutter) var(--section-space);
  max-width: var(--content-max);
  margin: 0 auto;
  text-align: center;
}

.beliefs blockquote {
  font-family: var(--font-display);
  font-size: clamp(22px, 3vw, 36px);
  font-weight: 600;
  color: #ffffff;
  line-height: 1.35;
  margin: 0 auto 36px;
  max-width: 900px;
}

.beliefs div {
  display: flex;
  justify-content: center;
  gap: clamp(12px, 2vw, 24px);
  flex-wrap: wrap;
}

.beliefs span {
  font-family: var(--font-display);
  font-size: 13px;
  font-weight: 600;
  color: var(--emerald-aurora);
  background: rgba(0, 229, 153, 0.08);
  border: 1px solid rgba(0, 229, 153, 0.22);
  padding: 8px 18px;
  border-radius: 9999px;
}

/* ==========================================================================
   CONTACT PAGE & PROJECT WIZARD (LUXURY FINISH)
   ========================================================================== */

.project-start {
  display: grid;
  grid-template-columns: 1fr 1.3fr;
  gap: clamp(32px, 5vw, 64px);
  padding: 0 var(--gutter) var(--section-space);
  max-width: var(--content-max);
  margin: 0 auto;
}

.project-start-intro h2 {
  font-size: clamp(36px, 4vw, 54px);
  margin-bottom: 16px;
}

.project-start-intro p {
  font-size: 17px;
  line-height: 1.6;
  margin-bottom: 24px;
}

.project-start-intro div span {
  display: block;
  font-family: var(--font-display);
  font-size: 14px;
  font-weight: 600;
  color: var(--text-sub);
  margin-bottom: 8px;
}

/* ==========================================================================
   DIRECT CONTACT CHANNELS CARD & GLOBAL HUBS WITH INTERACTIVE MAPS
   ========================================================================== */

.direct-contact-card {
  margin-top: 32px;
  background: rgba(8, 16, 28, 0.75);
  border: 1px solid rgba(255, 255, 255, 0.09);
  border-radius: 20px;
  padding: 20px;
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  box-shadow: 0 16px 36px rgba(0, 0, 0, 0.35), inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.direct-card-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
  padding-bottom: 12px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.direct-kicker {
  font-family: var(--font-display);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--emerald-aurora);
}

.direct-status-live {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-family: var(--font-display);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.1em;
  color: #c8f8ec;
  background: rgba(0, 229, 153, 0.12);
  border: 1px solid rgba(0, 229, 153, 0.25);
  padding: 3px 8px;
  border-radius: 9999px;
}

.direct-rows {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.direct-row-btn {
  display: flex;
  align-items: center;
  justify-content: space-between;
  text-decoration: none;
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.06);
  padding: 10px 14px;
  border-radius: 12px;
  transition: all 0.22s cubic-bezier(0.16, 1, 0.3, 1);
}

.direct-row-btn .btn-label-group {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.direct-row-btn small {
  font-family: var(--font-display);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.1em;
  color: var(--text-dim);
}

.direct-row-btn strong,
.direct-row-btn span {
  font-family: var(--font-display);
  font-size: 14px;
  color: var(--text-main);
}

.direct-row-btn.hotline {
  background: rgba(0, 229, 153, 0.06);
  border-color: rgba(0, 229, 153, 0.2);
}

.direct-row-btn.hotline strong {
  color: var(--emerald-aurora);
}

.direct-row-btn.whatsapp {
  background: rgba(37, 211, 102, 0.08);
  border-color: rgba(37, 211, 102, 0.25);
}

.direct-row-btn.whatsapp span {
  color: #25d366;
  font-weight: 700;
}

.direct-row-btn:hover {
  background: rgba(255, 255, 255, 0.09);
  border-color: rgba(0, 229, 153, 0.4);
  transform: translateX(3px);
}

.direct-row-btn:hover .btn-label-group small {
  color: rgba(255, 255, 255, 0.75);
}

.direct-row-btn:hover .btn-label-group span,
.direct-row-btn:hover .btn-label-group strong {
  color: #ffffff !important;
}

.direct-row-btn.whatsapp:hover {
  background: rgba(37, 211, 102, 0.16) !important;
  border-color: rgba(37, 211, 102, 0.5) !important;
}

.direct-row-btn.whatsapp:hover .btn-label-group small {
  color: #a7f3d0 !important;
}

.direct-row-btn.whatsapp:hover .btn-label-group span {
  color: #ffffff !important;
  text-shadow: 0 0 12px rgba(37, 211, 102, 0.4);
}

.direct-row-btn.whatsapp:hover svg {
  color: #25d366 !important;
}

.direct-row-info {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: rgba(255, 255, 255, 0.02);
  border: 1px solid rgba(255, 255, 255, 0.04);
  padding: 8px 14px;
  border-radius: 10px;
  font-family: var(--font-display);
  font-size: 13px;
  color: var(--text-muted);
}

.direct-row-info small {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.1em;
  color: var(--text-dim);
}

.direct-card-footer {
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
  text-align: center;
}

.jump-to-maps-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-family: var(--font-display);
  font-size: 12px;
  font-weight: 600;
  color: var(--emerald-aurora);
  text-decoration: none;
  transition: color 0.2s ease;
}

.jump-to-maps-link:hover {
  color: #ffffff;
  text-decoration: underline;
}

/* ==========================================================================
   GLOBAL OFFICES SECTION & INTERACTIVE MAPS GRID
   ========================================================================== */

.global-offices-section {
  max-width: var(--content-max);
  margin: 80px auto 100px;
  padding: 0 var(--gutter);
  scroll-margin-top: 110px;
}

.offices-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(380px, 1fr));
  gap: 32px;
  margin-top: 48px;
}

@media (max-width: 768px) {
  .offices-grid {
    grid-template-columns: 1fr;
  }
}

.office-glass-card {
  background: var(--card-bg);
  border: 1px solid var(--card-border);
  border-radius: 28px;
  overflow: hidden;
  backdrop-filter: blur(24px);
  -webkit-backdrop-filter: blur(24px);
  box-shadow: 0 20px 48px rgba(0, 0, 0, 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.1);
  display: flex;
  flex-direction: column;
  transition: all 0.3s ease;
}

.office-glass-card:hover {
  border-color: rgba(0, 229, 153, 0.35);
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.5), inset 0 1px 0 rgba(255, 255, 255, 0.18);
  transform: translateY(-4px);
}

.office-card-header {
  padding: 24px 28px 20px;
  background: rgba(255, 255, 255, 0.02);
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
}

.office-location-tag {
  display: flex;
  align-items: center;
  gap: 14px;
}

.country-flag-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border-radius: 12px;
  font-family: var(--font-display);
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.06em;
  flex-shrink: 0;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.35);
}

.country-flag-badge.lk {
  background: linear-gradient(135deg, #00e599, #009966);
  color: #04080e;
  border: 1px solid rgba(0, 229, 153, 0.4);
}

.country-flag-badge.ae {
  background: linear-gradient(135deg, #00d2ff, #0077b6);
  color: #ffffff;
  border: 1px solid rgba(0, 210, 255, 0.4);
}

.office-hub-badge {
  display: block;
  font-family: var(--font-display);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.14em;
  color: var(--emerald-aurora);
  text-transform: uppercase;
}

.office-role-badge {
  display: block;
  font-family: var(--font-display);
  font-size: 12px;
  font-weight: 600;
  color: var(--text-dim);
  text-transform: uppercase;
}

.office-tz-pill {
  font-family: var(--font-display);
  font-size: 11px;
  font-weight: 600;
  color: var(--text-muted);
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.07);
  padding: 4px 10px;
  border-radius: 9999px;
}

.office-body {
  padding: 28px;
  display: flex;
  flex-direction: column;
  flex-grow: 1;
}

.office-title {
  font-family: var(--font-display);
  font-size: 22px;
  font-weight: 700;
  color: #ffffff;
  margin-bottom: 8px;
}

.office-address-text {
  font-size: 14px;
  color: var(--text-sub);
  line-height: 1.55;
  margin-bottom: 24px;
  min-height: 44px;
}

.office-channels-list {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  margin-bottom: 24px;
}

@media (max-width: 480px) {
  .office-channels-list {
    grid-template-columns: 1fr;
  }
}

.office-channel-item {
  display: flex;
  align-items: center;
  gap: 10px;
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.06);
  padding: 10px 14px;
  border-radius: 12px;
  text-decoration: none;
  transition: all 0.2s ease;
}

.office-channel-item:not(.plain):hover {
  background: rgba(0, 229, 153, 0.08);
  border-color: rgba(0, 229, 153, 0.3);
}

.office-channel-item .channel-icon {
  font-size: 18px;
  flex-shrink: 0;
}

.office-channel-item div {
  display: flex;
  flex-direction: column;
}

.office-channel-item small {
  font-family: var(--font-display);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.1em;
  color: var(--text-dim);
  text-transform: uppercase;
}

.office-channel-item strong {
  font-family: var(--font-display);
  font-size: 13px;
  font-weight: 700;
  color: var(--emerald-aurora);
}

.office-channel-item span {
  font-family: var(--font-display);
  font-size: 13px;
  font-weight: 500;
  color: var(--text-main);
}

/* Map Card Container & Overlay Pin */
.map-card-container {
  border-radius: 18px;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.09);
  background: #020509;
  margin-top: auto;
}

.map-iframe-wrapper {
  position: relative;
  width: 100%;
  height: 220px;
  overflow: hidden;
}

.map-iframe {
  width: 100%;
  height: 100%;
  border: 0;
  filter: invert(90%) hue-rotate(180deg) brightness(85%) contrast(110%);
  -webkit-filter: invert(90%) hue-rotate(180deg) brightness(85%) contrast(110%);
  pointer-events: auto;
}

.map-pin-overlay {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  pointer-events: none;
  z-index: 10;
}

.map-pin-bubble {
  background: rgba(4, 10, 18, 0.92);
  border: 1px solid rgba(0, 229, 153, 0.5);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.7), 0 0 20px rgba(0, 229, 153, 0.3);
  padding: 8px 14px;
  border-radius: 9999px;
  display: flex;
  align-items: center;
  gap: 10px;
  backdrop-filter: blur(12px);
}

.pin-beacon {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--emerald-aurora);
  box-shadow: 0 0 12px var(--emerald-aurora);
  animation: pulse 1.8s infinite;
  flex-shrink: 0;
}

.pin-beacon.cyan-beacon {
  background: #00d2ff;
  box-shadow: 0 0 12px #00d2ff;
}

.pin-text {
  display: flex;
  flex-direction: column;
}

.pin-text strong {
  font-family: var(--font-display);
  font-size: 12px;
  font-weight: 700;
  color: #ffffff;
}

.pin-text small {
  font-size: 10px;
  color: var(--text-dim);
}

.map-action-bar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 12px 18px;
  background: rgba(8, 14, 24, 0.95);
  border-top: 1px solid rgba(255, 255, 255, 0.06);
}

.map-coord-tag {
  font-family: var(--font-mono, monospace);
  font-size: 11px;
  color: var(--text-dim);
}

.map-nav-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-family: var(--font-display);
  font-size: 12px;
  font-weight: 600;
  color: var(--emerald-aurora);
  text-decoration: none;
  transition: color 0.2s ease;
}

.map-nav-btn:hover {
  color: #ffffff;
  text-decoration: underline;
}

.project-wizard {
  background: var(--card-bg);
  border: 1px solid var(--card-border);
  border-radius: 28px;
  padding: clamp(24px, 4vw, 44px);
  backdrop-filter: blur(24px);
  -webkit-backdrop-filter: blur(24px);
  box-shadow: 0 24px 54px rgba(0, 0, 0, 0.45), inset 0 1px 0 rgba(255, 255, 255, 0.12);
}

.wizard-top {
  margin-bottom: 28px;
}

.wizard-top > div:first-child {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 12px;
}

.wizard-top span {
  font-family: var(--font-display);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.12em;
  color: var(--emerald-aurora);
}

.wizard-top b {
  font-family: var(--font-display);
  font-size: 13px;
  font-weight: 700;
  color: var(--text-sub);
}

.wizard-progress {
  width: 100%;
  height: 4px;
  background: rgba(255, 255, 255, 0.08);
  border-radius: 9999px;
  overflow: hidden;
}

.wizard-progress i {
  display: block;
  height: 100%;
  background: linear-gradient(90deg, #00e599, #10b981, #06b6d4);
  border-radius: 9999px;
  transition: width 0.3s cubic-bezier(0.16, 1, 0.3, 1);
  box-shadow: 0 0 10px rgba(0, 229, 153, 0.5);
}

.wizard-stage fieldset {
  border: none;
  padding: 0;
  margin: 0;
}

.wizard-stage legend {
  font-family: var(--font-display);
  font-size: clamp(22px, 2.5vw, 30px);
  font-weight: 700;
  color: #ffffff;
  line-height: 1.2;
  margin-bottom: 8px;
}

.wizard-stage fieldset > p {
  font-size: 14px;
  color: var(--text-sub);
  margin-bottom: 24px;
}

.choice-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
}

.choice-grid.two {
  grid-template-columns: repeat(2, 1fr);
}

.choice-grid label {
  position: relative;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 16px;
  padding: 18px 20px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-family: var(--font-display);
  font-size: 15px;
  font-weight: 600;
  color: var(--text-sub);
  transition: all 0.2s ease;
}

.choice-grid label:hover {
  background: rgba(255, 255, 255, 0.08);
  color: var(--text-main);
  border-color: rgba(255, 255, 255, 0.2);
}

.choice-grid label.selected {
  background: rgba(0, 229, 153, 0.12);
  border-color: var(--emerald-aurora);
  color: #ffffff;
  box-shadow: 0 0 18px rgba(0, 229, 153, 0.25);
}

.choice-grid label input[type="radio"] {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.choice-grid label svg {
  color: var(--text-dim);
  transition: all 0.2s ease;
}

.choice-grid label:hover svg {
  color: var(--emerald-aurora);
  transform: translateX(2px);
}

.choice-grid label.selected svg {
  color: var(--emerald-aurora);
}

.field-label {
  display: block;
  font-family: var(--font-display);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.06em;
  color: var(--text-main);
  margin: 24px 0 12px;
  text-transform: uppercase;
}

.budget-row {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

.budget-row label {
  position: relative;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 9999px;
  padding: 10px 18px;
  cursor: pointer;
  font-family: var(--font-display);
  font-size: 13px;
  font-weight: 600;
  color: var(--text-sub);
  transition: all 0.2s ease;
}

.budget-row label:hover {
  background: rgba(255, 255, 255, 0.08);
  color: var(--text-main);
}

.budget-row label.selected {
  background: var(--emerald-aurora);
  color: #03070d;
  border-color: var(--emerald-aurora);
  font-weight: 700;
  box-shadow: 0 0 16px rgba(0, 229, 153, 0.35);
}

.budget-row label input[type="radio"] {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.wizard-fields {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 16px;
}

.wizard-fields label {
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-family: var(--font-display);
  font-size: 13px;
  font-weight: 600;
  color: var(--text-sub);
}

.wizard-fields label small {
  font-size: 11px;
  color: var(--text-dim);
  font-weight: normal;
}

.wizard-fields input,
.wizard-fields textarea {
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 12px;
  padding: 12px 16px;
  color: #ffffff;
  font-family: var(--font-body);
  font-size: 14px;
  transition: all 0.2s ease;
}

.wizard-fields input:focus,
.wizard-fields textarea:focus {
  border-color: var(--emerald-aurora);
  background: rgba(255, 255, 255, 0.07);
  outline: none;
  box-shadow: 0 0 0 3px rgba(0, 229, 153, 0.2);
}

.wizard-fields label.wide {
  grid-column: 1 / -1;
}

.wizard-review {
  text-align: center;
  padding: 12px 0;
}

.review-mark {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: rgba(0, 229, 153, 0.15);
  border: 2px solid var(--emerald-aurora);
  color: var(--emerald-aurora);
  font-size: 22px;
  font-weight: bold;
  margin-bottom: 16px;
  box-shadow: 0 0 20px rgba(0, 229, 153, 0.3);
}

.wizard-review h2 {
  font-size: clamp(24px, 2.5vw, 32px);
  margin-bottom: 8px;
}

.wizard-review p {
  font-size: 14px;
  color: var(--text-sub);
  margin-bottom: 24px;
  max-width: 460px;
  margin-left: auto;
  margin-right: auto;
}

.wizard-review dl {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 16px;
  padding: 20px;
  text-align: left;
}

.wizard-review dt {
  font-family: var(--font-display);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--emerald-aurora);
  margin-bottom: 4px;
}

.wizard-review dd {
  margin: 0;
  font-size: 14px;
  font-weight: 600;
  color: #ffffff;
}

.wizard-actions {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 28px;
  padding-top: 20px;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
  gap: 12px;
  flex-wrap: wrap;
}

.wizard-back {
  font-family: var(--font-display);
  font-size: 14px;
  font-weight: 600;
  color: var(--text-sub);
  padding: 8px 14px;
  border-radius: 8px;
}

.wizard-back:hover {
  color: #ffffff;
  background: rgba(255, 255, 255, 0.06);
}

.wizard-actions span {
  font-size: 12px;
  color: var(--text-dim);
}

/* ==========================================================================
   FOOTER (FROSTED GLASS CALLOUT & MULTI-COLUMN)
   ========================================================================== */

.site-footer {
  background: #020509;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
  padding: var(--section-space) var(--gutter) 40px;
}

.footer-cta-container {
  max-width: var(--content-max);
  margin: 0 auto 64px;
}

.footer-cta-glass {
  background: linear-gradient(135deg, rgba(12, 24, 38, 0.88) 0%, rgba(6, 12, 20, 0.95) 100%);
  border: 1px solid rgba(0, 229, 153, 0.35);
  border-radius: 28px;
  padding: clamp(36px, 5vw, 64px);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
  flex-wrap: wrap;
  backdrop-filter: blur(24px);
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.55), inset 0 1px 0 rgba(255, 255, 255, 0.15);
}

.footer-cta-content {
  flex: 1 1 500px;
}

.footer-kicker-pill {
  font-family: var(--font-display);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.14em;
  color: var(--emerald-aurora);
  display: inline-block;
  margin-bottom: 12px;
}

.footer-cta-heading {
  font-size: clamp(32px, 3.8vw, 48px);
  margin-bottom: 10px;
  line-height: 1.15;
}

.footer-cta-sub {
  font-size: 16px;
  color: var(--text-sub);
  max-width: 540px;
  line-height: 1.55;
  margin: 0;
}

.footer-cta-actions {
  display: flex;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
}

.footer-btn-lg {
  padding: 16px 32px;
  font-size: 16px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}

.footer-main {
  max-width: var(--content-max);
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1.4fr 1fr 1fr 1.2fr;
  gap: clamp(32px, 4vw, 64px);
  padding-bottom: 48px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.footer-brand-bio {
  font-size: 14px;
  color: var(--text-muted);
  line-height: 1.6;
  margin: 16px 0 20px;
  max-width: 320px;
}

.footer-locations {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  font-family: var(--font-display);
  font-size: 12px;
  color: var(--text-sub);
}

.footer-locations span {
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.08);
  padding: 4px 10px;
  border-radius: 6px;
}

.footer-col-title {
  display: block;
  font-family: var(--font-display);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--text-main);
  margin-bottom: 18px;
}

.footer-column {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.footer-column a {
  font-size: 14px;
  color: var(--text-muted);
}

.footer-column a:hover {
  color: var(--emerald-aurora);
}

.footer-contact-col {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.contact-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: var(--font-display);
  font-size: 14px;
}

.email-link {
  color: #ffffff;
  font-weight: 600;
}

.phone-link {
  color: var(--emerald-aurora);
  font-size: 15px;
  display: flex;
  align-items: baseline;
  gap: 8px;
}

.phone-link small,
.phone-sub-link small,
.fax-item small {
  font-size: 10px;
  letter-spacing: 0.1em;
  font-weight: 700;
  background: rgba(0, 229, 153, 0.15);
  color: var(--emerald-aurora);
  padding: 2px 6px;
  border-radius: 4px;
}

.phone-sub-link {
  color: var(--text-sub);
  font-size: 14px;
  display: flex;
  align-items: baseline;
  gap: 8px;
  text-decoration: none;
}

.phone-sub-link:hover {
  color: #ffffff;
}

.fax-item {
  color: var(--text-muted);
  font-size: 13px;
  display: flex;
  align-items: baseline;
  gap: 8px;
}

.address-item {
  color: var(--text-sub);
  font-size: 13px;
  line-height: 1.45;
  display: flex;
  align-items: flex-start;
  gap: 8px;
  margin-top: 4px;
}

.address-pin {
  font-size: 14px;
  flex-shrink: 0;
  margin-top: 1px;
}

.whatsapp-pill {
  background: rgba(37, 211, 102, 0.14);
  border: 1px solid rgba(37, 211, 102, 0.35);
  color: #25d366 !important;
  padding: 8px 16px;
  border-radius: 9999px;
  width: fit-content;
  font-weight: 700;
  font-family: var(--font-display);
  display: inline-flex;
  align-items: center;
  gap: 8px;
  transition: all 0.2s ease;
  text-decoration: none;
}

.whatsapp-pill:hover,
.footer-column a.whatsapp-pill:hover {
  background: #25d366 !important;
  border-color: #25d366 !important;
  color: #03070d !important;
  font-weight: 800 !important;
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(37, 211, 102, 0.4);
}

.whatsapp-pill:hover svg {
  color: #03070d !important;
}

.footer-response-tag {
  font-size: 12px;
  color: var(--text-dim);
  margin-top: 8px;
}

.footer-bottom-bar {
  max-width: var(--content-max);
  margin: 32px auto 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 16px;
  font-family: var(--font-display);
  font-size: 12px;
  color: var(--text-dim);
}

.footer-motto {
  letter-spacing: 0.12em;
}

.back-to-top:hover {
  color: var(--emerald-aurora);
}

/* ==========================================================================
   RESPONSIVE BREAKPOINTS
   ========================================================================== */

@media (max-width: 1024px) {
  .hero {
    grid-template-columns: 1fr;
    gap: 40px;
  }

  .service-grid,
  .security-grid,
  .proof-grid,
  .process-grid,
  .assurance {
    grid-template-columns: repeat(2, 1fr);
  }

  .use-cases-cards-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .footer-main {
    grid-template-columns: repeat(2, 1fr);
  }

  .home-case {
    grid-template-columns: 1fr;
  }

  .platform-page,
  .about-page,
  .project-start {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 768px) {
  .site-nav {
    display: none;
  }

  .intro {
    grid-template-columns: 1fr;
  }

  .service-grid,
  .security-grid,
  .proof-grid,
  .process-grid,
  .use-cases-cards-grid,
  .detail-grid,
  .rich-list,
  .principles,
  .assurance,
  .footer-main {
    grid-template-columns: 1fr;
  }

  .showcase-body-grid {
    grid-template-columns: 1fr;
  }

  .showcase-metric-box {
    align-items: flex-start;
    text-align: left;
  }

  .choice-grid,
  .wizard-fields {
    grid-template-columns: 1fr;
  }

  .footer-cta-glass {
    flex-direction: column;
    align-items: flex-start;
  }
}

/* ==========================================================================
   FIMRIQ OMNI-CRM & LEAD PIPELINE STYLES
   ========================================================================== */

.crm-app-container {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  width: 100%;
}

.crm-top-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 1.25rem;
  padding: 1.25rem 1.5rem;
  background: var(--card-bg, rgba(15, 23, 42, 0.75));
  border: 1px solid var(--border-color, rgba(255, 255, 255, 0.1));
  border-radius: 1rem;
  backdrop-filter: blur(16px);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.35);
}

.crm-brand-block {
  display: flex;
  align-items: center;
  gap: 0.85rem;
}

.crm-status-beacon {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: #10b981;
  box-shadow: 0 0 12px #10b981;
  animation: pulseBeacon 2s infinite ease-in-out;
}

@keyframes pulseBeacon {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.5; transform: scale(1.2); }
}

.crm-main-title {
  font-size: 1.15rem;
  font-weight: 800;
  letter-spacing: 0.05em;
  background: linear-gradient(135deg, #fff 30%, #a5b4fc 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  margin: 0;
}

.crm-main-sub {
  font-size: 0.78rem;
  color: var(--text-muted, #94a3b8);
  margin: 0.15rem 0 0 0;
}

.crm-metrics-strip {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.75rem;
}

.crm-stat-chip {
  display: flex;
  flex-direction: column;
  background: rgba(30, 41, 59, 0.6);
  border: 1px solid rgba(255, 255, 255, 0.06);
  padding: 0.45rem 0.85rem;
  border-radius: 0.5rem;
  min-width: 95px;
}

.stat-label {
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  color: #64748b;
}

.stat-value {
  font-size: 1.05rem;
  font-weight: 800;
  color: #f8fafc;
}

.crm-view-switchers {
  display: flex;
  background: rgba(15, 23, 42, 0.8);
  border: 1px solid rgba(255, 255, 255, 0.1);
  padding: 0.25rem;
  border-radius: 0.6rem;
  gap: 0.25rem;
}

.crm-tab-btn {
  background: transparent;
  border: none;
  color: #94a3b8;
  font-size: 0.82rem;
  font-weight: 600;
  padding: 0.5rem 0.95rem;
  border-radius: 0.4rem;
  cursor: pointer;
  transition: all 0.2s ease;
}

.crm-tab-btn:hover {
  color: #fff;
  background: rgba(255, 255, 255, 0.05);
}

.crm-tab-btn.active {
  background: #3b82f6;
  color: #fff;
  box-shadow: 0 0 15px rgba(59, 130, 246, 0.4);
}

/* 3-COLUMN WORKSPACE GRID */
.crm-workspace-grid {
  display: grid;
  grid-template-columns: 360px minmax(0, 1fr) 380px;
  gap: 1.5rem;
  align-items: start;
}

@media (max-width: 1280px) {
  .crm-workspace-grid {
    grid-template-columns: 320px 1fr;
  }
  .crm-composer-panel {
    grid-column: span 2;
  }
}

@media (max-width: 900px) {
  .crm-workspace-grid {
    grid-template-columns: 1fr;
  }
  .crm-composer-panel {
    grid-column: span 1;
  }
}

/* COLUMN 1: SIDEBAR PANEL */
.crm-sidebar-panel {
  background: var(--card-bg, rgba(15, 23, 42, 0.6));
  border: 1px solid var(--border-color, rgba(255, 255, 255, 0.08));
  border-radius: 1rem;
  padding: 1.25rem;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  max-height: 850px;
  overflow-y: auto;
}

.sidebar-search-box {
  width: 100%;
}

.crm-search-input {
  width: 100%;
  background: rgba(30, 41, 59, 0.7);
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 0.5rem;
  padding: 0.6rem 0.85rem;
  font-size: 0.85rem;
  color: #fff;
  outline: none;
  transition: border-color 0.2s ease;
}

.crm-search-input:focus {
  border-color: #38bdf8;
  box-shadow: 0 0 10px rgba(56, 189, 248, 0.2);
}

.sidebar-filter-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.5rem;
}

.crm-select-filter {
  background: rgba(30, 41, 59, 0.8);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 0.5rem;
  padding: 0.5rem 0.65rem;
  font-size: 0.78rem;
  color: #cbd5e1;
  outline: none;
}

.crm-leads-list {
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
}

.crm-lead-card {
  background: rgba(30, 41, 59, 0.4);
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 0.75rem;
  padding: 0.85rem 1rem;
  cursor: pointer;
  transition: all 0.2s ease;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.crm-lead-card:hover {
  background: rgba(30, 41, 59, 0.8);
  border-color: rgba(56, 189, 248, 0.3);
  transform: translateY(-1px);
}

.crm-lead-card.selected {
  background: rgba(59, 130, 246, 0.12);
  border-color: #3b82f6;
  box-shadow: 0 0 18px rgba(59, 130, 246, 0.2);
}

.lead-card-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}

.lead-name-block {
  display: flex;
  align-items: center;
  gap: 0.65rem;
}

.lead-avatar {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: linear-gradient(135deg, #6366f1, #a855f7);
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 800;
  font-size: 0.8rem;
  color: #fff;
}

.lead-name {
  display: block;
  font-size: 0.92rem;
  font-weight: 700;
  color: #f1f5f9;
}

.hot-badge {
  font-size: 0.65rem;
  background: rgba(239, 68, 68, 0.2);
  color: #f87171;
  border: 1px solid rgba(239, 68, 68, 0.4);
  padding: 0.1rem 0.35rem;
  border-radius: 0.25rem;
  margin-left: 0.25rem;
}

.lead-company {
  display: block;
  font-size: 0.76rem;
  color: #94a3b8;
}

.lead-budget {
  font-size: 0.8rem;
  font-weight: 700;
  color: #34d399;
}

.lead-badges-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
}

.source-pill, .stage-pill {
  font-size: 0.68rem;
  font-weight: 600;
  padding: 0.15rem 0.5rem;
  border-radius: 0.3rem;
  border-width: 1px;
}

.lead-card-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 0.72rem;
  color: #64748b;
  border-top: 1px solid rgba(255, 255, 255, 0.04);
  padding-top: 0.4rem;
}

.lead-project-snip {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 180px;
  color: #cbd5e1;
}

/* COLUMN 2: CUSTOMER 360 & TIMELINE */
.crm-timeline-panel {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.client-hero-card {
  background: var(--card-bg, rgba(15, 23, 42, 0.7));
  border: 1px solid var(--border-color, rgba(255, 255, 255, 0.1));
  border-radius: 1rem;
  padding: 1.5rem;
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  backdrop-filter: blur(12px);
}

.client-hero-top {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-start;
  gap: 1rem;
}

.client-full-name {
  font-size: 1.5rem;
  font-weight: 800;
  color: #f8fafc;
  margin: 0;
}

.client-role-company {
  font-size: 0.92rem;
  color: #94a3b8;
  margin: 0.2rem 0 0.6rem 0;
  display: block;
}

.client-meta-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}

.meta-tag {
  font-size: 0.75rem;
  background: rgba(30, 41, 59, 0.8);
  border: 1px solid rgba(255, 255, 255, 0.08);
  padding: 0.25rem 0.65rem;
  border-radius: 0.4rem;
  color: #cbd5e1;
}

.client-hero-contact-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}

.btn-action-pill {
  font-size: 0.78rem;
  font-weight: 600;
  padding: 0.45rem 0.85rem;
  border-radius: 0.45rem;
  border-width: 1px;
  text-decoration: none;
  transition: all 0.2s ease;
}

.btn-action-pill:hover {
  transform: translateY(-1px);
  filter: brightness(1.2);
}

.client-scope-banner {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 0.75rem;
  background: rgba(30, 41, 59, 0.5);
  border: 1px solid rgba(255, 255, 255, 0.06);
  padding: 1rem;
  border-radius: 0.75rem;
}

.scope-item {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}

.scope-lbl {
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  color: #64748b;
}

.scope-val {
  font-size: 0.88rem;
  color: #f1f5f9;
}

.stage-selector-bar {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.stage-bar-title {
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  color: #94a3b8;
}

.stage-btn-group {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
}

.stage-step-btn {
  background: rgba(30, 41, 59, 0.6);
  border: 1px solid rgba(255, 255, 255, 0.1);
  color: #94a3b8;
  font-size: 0.75rem;
  font-weight: 600;
  padding: 0.4rem 0.8rem;
  border-radius: 0.4rem;
  cursor: pointer;
  text-transform: capitalize;
  transition: all 0.2s ease;
}

.stage-step-btn:hover {
  color: #fff;
  border-color: rgba(255, 255, 255, 0.3);
}

.stage-step-btn.active {
  background: #3b82f6;
  border-color: #3b82f6;
  color: #fff;
  box-shadow: 0 0 12px rgba(59, 130, 246, 0.4);
}

.event-reminder-banner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  background: linear-gradient(135deg, rgba(236, 72, 153, 0.15), rgba(168, 85, 247, 0.15));
  border: 1px solid rgba(236, 72, 153, 0.3);
  padding: 0.85rem 1.25rem;
  border-radius: 0.75rem;
}

.event-reminder-icon {
  font-size: 1.5rem;
}

.event-reminder-text {
  display: flex;
  flex-direction: column;
  font-size: 0.84rem;
  color: #fce7f3;
  flex: 1;
}

.event-reminder-text span {
  font-size: 0.72rem;
  color: #f472b6;
}

.btn-trigger-event {
  background: #ec4899;
  border: none;
  color: #fff;
  font-size: 0.75rem;
  font-weight: 700;
  padding: 0.45rem 0.85rem;
  border-radius: 0.4rem;
  cursor: pointer;
  transition: all 0.2s ease;
}

.btn-trigger-event:hover {
  background: #db2777;
}

/* TIMELINE FEED */
.timeline-feed-wrapper {
  background: var(--card-bg, rgba(15, 23, 42, 0.7));
  border: 1px solid var(--border-color, rgba(255, 255, 255, 0.08));
  border-radius: 1rem;
  padding: 1.5rem;
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.timeline-header-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
  padding-bottom: 0.75rem;
}

.timeline-feed-title {
  font-size: 1.05rem;
  font-weight: 700;
  color: #f1f5f9;
  margin: 0;
}

.timeline-zero-gap-pill {
  font-size: 0.72rem;
  color: #34d399;
  background: rgba(52, 211, 153, 0.1);
  padding: 0.2rem 0.6rem;
  border-radius: 0.3rem;
  border: 1px solid rgba(52, 211, 153, 0.2);
}

.timeline-items-list {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  position: relative;
  padding-left: 1rem;
  border-left: 2px solid rgba(255, 255, 255, 0.08);
}

.timeline-card {
  background: rgba(30, 41, 59, 0.5);
  border: 1px solid rgba(255, 255, 255, 0.07);
  border-radius: 0.75rem;
  padding: 1rem 1.25rem;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  position: relative;
}

.timeline-card::before {
  content: "";
  position: absolute;
  left: -1.45rem;
  top: 1.2rem;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #3b82f6;
  border: 2px solid #0f172a;
}

.timeline-card.channel-whatsapp::before { background: #10b981; }
.timeline-card.channel-email::before { background: #3b82f6; }
.timeline-card.channel-sms::before { background: #6366f1; }
.timeline-card.channel-call::before { background: #f59e0b; }
.timeline-card.channel-meeting::before { background: #a855f7; }
.timeline-card.channel-web::before { background: #06b6d4; }
.timeline-card.channel-event::before { background: #ec4899; }

.timeline-card-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.timeline-badge-group {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
}

.channel-icon-tag {
  font-size: 0.72rem;
  font-weight: 700;
  padding: 0.15rem 0.5rem;
  border-radius: 0.3rem;
  border-width: 1px;
}

.timeline-time {
  font-size: 0.75rem;
  color: #94a3b8;
}

.timeline-sender {
  font-size: 0.72rem;
  color: #64748b;
}

.timeline-status {
  font-size: 0.65rem;
  font-weight: 700;
  padding: 0.1rem 0.4rem;
  border-radius: 0.25rem;
}

.status-read, .status-opened, .status-completed {
  background: rgba(52, 211, 153, 0.15);
  color: #34d399;
}

.status-sent, .status-delivered, .status-scheduled {
  background: rgba(59, 130, 246, 0.15);
  color: #60a5fa;
}

.timeline-subject {
  font-size: 0.95rem;
  font-weight: 700;
  color: #f8fafc;
  margin: 0.15rem 0 0 0;
}

.timeline-content-text {
  font-size: 0.85rem;
  color: #cbd5e1;
  line-height: 1.45;
  margin: 0;
}

.timeline-metadata-box {
  background: rgba(15, 23, 42, 0.6);
  border: 1px solid rgba(255, 255, 255, 0.05);
  border-radius: 0.5rem;
  padding: 0.6rem 0.85rem;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  font-size: 0.78rem;
  color: #94a3b8;
}

.timeline-metadata-box a {
  color: #38bdf8;
  text-decoration: underline;
}

/* COLUMN 3: COMPOSER PANEL */
.crm-composer-panel {
  background: var(--card-bg, rgba(15, 23, 42, 0.75));
  border: 1px solid var(--border-color, rgba(255, 255, 255, 0.1));
  border-radius: 1rem;
  padding: 1.5rem;
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  backdrop-filter: blur(12px);
}

.composer-header {
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
  padding-bottom: 0.75rem;
}

.composer-title {
  font-size: 1.1rem;
  font-weight: 800;
  color: #f8fafc;
  margin: 0;
}

.composer-sub {
  font-size: 0.78rem;
  color: #94a3b8;
  margin: 0.2rem 0 0 0;
}

.composer-alert-success {
  background: rgba(16, 185, 129, 0.2);
  border: 1px solid rgba(16, 185, 129, 0.4);
  color: #34d399;
  font-size: 0.8rem;
  padding: 0.6rem 0.85rem;
  border-radius: 0.5rem;
}

.crm-composer-form {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.composer-channel-tabs {
  display: flex;
  flex-wrap: wrap;
  background: rgba(30, 41, 59, 0.6);
  padding: 0.25rem;
  border-radius: 0.5rem;
  gap: 0.25rem;
}

.composer-ch-btn {
  background: transparent;
  border: none;
  color: #94a3b8;
  font-size: 0.74rem;
  font-weight: 600;
  padding: 0.35rem 0.6rem;
  border-radius: 0.35rem;
  cursor: pointer;
  transition: all 0.2s ease;
}

.composer-ch-btn:hover {
  color: #fff;
}

.composer-ch-btn.active {
  background: #3b82f6;
  color: #fff;
}

.composer-field-label {
  display: block;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  color: #64748b;
  margin-bottom: 0.35rem;
}

.crm-input-field, .crm-textarea-field {
  width: 100%;
  background: rgba(30, 41, 59, 0.7);
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 0.5rem;
  padding: 0.65rem 0.85rem;
  font-size: 0.85rem;
  color: #fff;
  outline: none;
  font-family: inherit;
}

.crm-input-field:focus, .crm-textarea-field:focus {
  border-color: #38bdf8;
  box-shadow: 0 0 10px rgba(56, 189, 248, 0.2);
}

.composer-recipient-preview {
  display: flex;
  justify-content: space-between;
  background: rgba(15, 23, 42, 0.5);
  padding: 0.45rem 0.75rem;
  border-radius: 0.4rem;
}

.composer-submit-btn {
  font-size: 0.88rem;
  font-weight: 700;
  padding: 0.75rem;
}

.composer-attachments-box {
  background: rgba(30, 41, 59, 0.4);
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 0.65rem;
  padding: 0.85rem 1rem;
}

.attachment-quick-list {
  list-style: none;
  padding: 0;
  margin: 0.5rem 0 0 0;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

.attachment-quick-link {
  font-size: 0.78rem;
  color: #38bdf8;
  text-decoration: none;
  display: block;
}

.attachment-quick-link:hover {
  text-decoration: underline;
}

/* PIPELINE KANBAN VIEW */
.crm-pipeline-kanban-view {
  width: 100%;
  overflow-x: auto;
}

.kanban-columns-container {
  display: grid;
  grid-template-columns: repeat(5, minmax(280px, 1fr));
  gap: 1.25rem;
  align-items: start;
}

.kanban-column {
  background: var(--card-bg, rgba(15, 23, 42, 0.6));
  border: 1px solid var(--border-color, rgba(255, 255, 255, 0.08));
  border-radius: 0.85rem;
  padding: 1rem;
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
  min-height: 500px;
}

.kanban-col-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
  padding-bottom: 0.5rem;
}

.kanban-col-title {
  font-size: 0.88rem;
  font-weight: 700;
  color: #f1f5f9;
  margin: 0;
}

.kanban-col-count {
  font-size: 0.75rem;
  font-weight: 700;
  background: rgba(255, 255, 255, 0.1);
  padding: 0.1rem 0.45rem;
  border-radius: 0.25rem;
  color: #cbd5e1;
}

.kanban-cards-stack {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.kanban-card {
  background: rgba(30, 41, 59, 0.6);
  border: 1px solid rgba(255, 255, 255, 0.07);
  border-radius: 0.65rem;
  padding: 0.85rem;
  cursor: pointer;
  transition: all 0.2s ease;
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
}

.kanban-card:hover {
  background: rgba(30, 41, 59, 0.95);
  border-color: #3b82f6;
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.35);
}

.kanban-card-top {
  display: flex;
  justify-content: space-between;
}

.kanban-card-name {
  font-size: 0.88rem;
  color: #f8fafc;
}

.kanban-card-budget {
  font-size: 0.78rem;
  font-weight: 700;
  color: #34d399;
}

.kanban-card-company {
  font-size: 0.75rem;
  color: #94a3b8;
}

.kanban-card-scope {
  font-size: 0.74rem;
  color: #cbd5e1;
  line-height: 1.35;
  margin: 0;
}

.kanban-card-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-top: 1px solid rgba(255, 255, 255, 0.04);
  padding-top: 0.4rem;
}

.kanban-card-time {
  font-size: 0.68rem;
  color: #64748b;
}

/* CAMPAIGNS VIEW */
.crm-campaigns-view {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.campaigns-header-card {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  background: var(--card-bg, rgba(15, 23, 42, 0.7));
  border: 1px solid var(--border-color, rgba(255, 255, 255, 0.1));
  border-radius: 1rem;
  padding: 1.5rem;
}

.campaigns-view-title {
  font-size: 1.3rem;
  font-weight: 800;
  color: #f8fafc;
  margin: 0;
}

.campaigns-view-sub {
  font-size: 0.85rem;
  color: #94a3b8;
  margin: 0.25rem 0 0 0;
}

.campaigns-grid-cards {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(360px, 1fr));
  gap: 1.25rem;
}

.campaign-card {
  background: var(--card-bg, rgba(15, 23, 42, 0.65));
  border: 1px solid var(--border-color, rgba(255, 255, 255, 0.08));
  border-radius: 1rem;
  padding: 1.25rem;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.campaign-card-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}

.camp-type-pill {
  font-size: 0.68rem;
  font-weight: 700;
  padding: 0.15rem 0.5rem;
  border-radius: 0.25rem;
  display: inline-block;
  margin-bottom: 0.35rem;
}

.type-event_wish { background: rgba(236, 72, 153, 0.2); color: #f472b6; border: 1px solid rgba(236, 72, 153, 0.3); }
.type-milestone { background: rgba(59, 130, 246, 0.2); color: #60a5fa; border: 1px solid rgba(59, 130, 246, 0.3); }
.type-reactivation { background: rgba(245, 158, 11, 0.2); color: #fbbf24; border: 1px solid rgba(245, 158, 11, 0.3); }

.camp-card-name {
  font-size: 1rem;
  font-weight: 700;
  color: #f8fafc;
  margin: 0;
}

.camp-status-badge {
  font-size: 0.65rem;
  font-weight: 700;
  padding: 0.15rem 0.45rem;
  border-radius: 0.25rem;
}

.status-active { background: rgba(16, 185, 129, 0.2); color: #34d399; }
.status-scheduled { background: rgba(99, 102, 241, 0.2); color: #a5b4fc; }

.camp-details-box {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  font-size: 0.78rem;
  background: rgba(30, 41, 59, 0.4);
  padding: 0.75rem;
  border-radius: 0.5rem;
}

.camp-detail-row {
  display: flex;
  justify-content: space-between;
  gap: 0.5rem;
  color: #94a3b8;
}

.camp-detail-row strong {
  color: #e2e8f0;
  text-align: right;
}

.camp-preview-box {
  background: rgba(15, 23, 42, 0.5);
  border: 1px solid rgba(255, 255, 255, 0.05);
  border-radius: 0.5rem;
  padding: 0.75rem;
}

.camp-preview-lbl {
  display: block;
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  color: #64748b;
  margin-bottom: 0.3rem;
}

.camp-preview-text {
  font-size: 0.78rem;
  color: #cbd5e1;
  font-style: italic;
  margin: 0;
  line-height: 1.4;
}

.camp-card-actions {
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-top: 1px solid rgba(255, 255, 255, 0.05);
  padding-top: 0.75rem;
}

.camp-last-run {
  font-size: 0.7rem;
  color: #64748b;
}

/* ==========================================================================
   SUBPAGE LUXURY DESIGN SYSTEM — PERFECT ALIGNMENT & RESPONSIVE GRID
   ========================================================================== */

.section-tag {
  font-family: var(--font-display);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--emerald-aurora);
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 12px;
}

.section-tag.light {
  color: var(--emerald-aurora);
}

.section-tag::before {
  content: "";
  display: inline-block;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--emerald-aurora);
  box-shadow: 0 0 8px var(--emerald-aurora);
}

/* 1. WHEN CUSTOM FITS (.use-cases) */
.use-cases {
  max-width: var(--content-max);
  margin: var(--section-space) auto;
  padding: clamp(40px, 5vw, 64px) var(--gutter);
  background: linear-gradient(135deg, rgba(10, 20, 34, 0.75) 0%, rgba(5, 12, 22, 0.9) 100%);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 28px;
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.45), inset 0 1px 0 rgba(255, 255, 255, 0.1);
  display: grid;
  grid-template-columns: 1fr 1.6fr;
  gap: clamp(32px, 5vw, 64px);
  align-items: start;
}

.use-cases h2 {
  font-size: clamp(28px, 3.2vw, 42px);
  margin: 0;
  line-height: 1.2;
}

.use-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 16px;
}

@media (max-width: 900px) {
  .use-cases {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 600px) {
  .use-grid {
    grid-template-columns: 1fr;
  }
}

.use-grid article {
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.06);
  padding: 20px;
  border-radius: 16px;
  transition: all 0.25s ease;
}

.use-grid article b {
  font-family: var(--font-display);
  font-size: 15px;
  color: #ffffff;
  display: block;
  margin-bottom: 6px;
}

.use-grid article p {
  font-size: 13px;
  color: var(--text-sub);
  line-height: 1.5;
  margin: 0;
}

.use-grid article:hover {
  background: rgba(0, 229, 153, 0.06);
  border-color: rgba(0, 229, 153, 0.3);
  transform: translateY(-2px);
}

/* 2. HOW TO ENGAGE (.engagements) */
.engagements {
  max-width: var(--content-max);
  margin: var(--section-space) auto;
  padding: 0 var(--gutter);
}

.engagements > div {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap: 24px;
  margin-top: 24px;
}

.engagements article {
  background: var(--card-bg);
  border: 1px solid var(--card-border);
  border-radius: 20px;
  padding: 28px;
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  display: flex;
  flex-direction: column;
  transition: all 0.25s ease;
}

.engagements article span {
  font-family: var(--font-display);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.14em;
  color: var(--emerald-aurora);
  background: rgba(0, 229, 153, 0.12);
  padding: 3px 8px;
  border-radius: 4px;
  width: fit-content;
  margin-bottom: 14px;
}

.engagements article h3 {
  font-size: 20px;
  color: #ffffff;
  margin: 0 0 10px;
}

.engagements article p {
  font-size: 14px;
  color: var(--text-sub);
  line-height: 1.55;
  margin: 0 0 20px;
  flex-grow: 1;
}

.engagements article b {
  font-size: 12px;
  color: var(--text-muted);
  padding-top: 14px;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
  font-weight: 500;
}

.engagements article:hover {
  border-color: rgba(0, 229, 153, 0.35);
  transform: translateY(-3px);
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.4);
}

/* 3. WORK PAGE: SELECTED CLIENT PORTFOLIO (.work-page-container, .work-cases-grid, .work-client-card) */
.work-page-container {
  max-width: var(--content-max);
  margin: var(--section-space) auto;
  padding: 0 var(--gutter);
}

.work-intro-header {
  margin-bottom: 48px;
  max-width: 800px;
}

.work-intro-header h2 {
  font-size: clamp(30px, 3.6vw, 48px);
  margin: 0 0 16px;
  line-height: 1.2;
}

.work-intro-header p {
  font-size: 16px;
  color: var(--text-sub);
  line-height: 1.6;
  margin: 0;
}

.work-cases-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(420px, 1fr));
  gap: 32px;
  margin-bottom: 64px;
}

@media (max-width: 600px) {
  .work-cases-grid {
    grid-template-columns: 1fr;
  }
}

.work-client-card {
  background: var(--card-bg);
  border: 1px solid var(--card-border);
  border-radius: 28px;
  padding: clamp(28px, 4vw, 36px);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  display: flex;
  flex-direction: column;
  transition: all 0.25s ease;
  position: relative;
}

.work-client-card.featured-case {
  background: linear-gradient(135deg, rgba(14, 28, 48, 0.92) 0%, rgba(6, 14, 24, 0.97) 100%);
  border: 1px solid rgba(0, 229, 153, 0.4);
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.5), inset 0 1px 0 rgba(255, 255, 255, 0.15);
}

.work-client-card:hover {
  border-color: rgba(0, 229, 153, 0.4);
  transform: translateY(-4px);
  box-shadow: 0 24px 54px rgba(0, 0, 0, 0.45);
}

.client-card-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
  flex-wrap: wrap;
  gap: 8px;
}

.client-num-badge {
  font-family: var(--font-display);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.14em;
  color: var(--emerald-aurora);
}

.client-category-tag {
  font-family: var(--font-display);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.1em;
  color: var(--text-dim);
  background: rgba(255, 255, 255, 0.05);
  padding: 3px 8px;
  border-radius: 4px;
  text-transform: uppercase;
}

.client-name-row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 4px;
  flex-wrap: wrap;
}

.client-name {
  font-size: clamp(24px, 2.5vw, 32px);
  font-family: var(--font-display);
  color: #ffffff;
  margin: 0;
}

.client-region {
  font-size: 12px;
  color: var(--text-dim);
  font-family: var(--font-display);
  font-weight: 500;
}

.client-product-sub {
  font-size: 14px;
  color: var(--emerald-aurora);
  font-weight: 600;
  margin-bottom: 18px;
  display: block;
}

.client-pipeline-flow {
  display: flex;
  align-items: center;
  gap: 10px;
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.06);
  padding: 10px 14px;
  border-radius: 12px;
  margin-bottom: 20px;
  flex-wrap: wrap;
}

.pipeline-node {
  font-family: var(--font-display);
  font-size: 11px;
  font-weight: 700;
  color: #ffffff;
  letter-spacing: 0.06em;
}

.client-headline {
  font-size: 18px;
  color: #ffffff;
  margin: 0 0 10px;
  line-height: 1.35;
}

.client-desc {
  font-size: 14px;
  color: var(--text-sub);
  line-height: 1.6;
  margin: 0 0 20px;
  flex-grow: 1;
}

.client-outcomes {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-bottom: 22px;
  padding-top: 16px;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
}

.outcome-row {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  font-size: 13px;
  color: var(--text-sub);
  line-height: 1.45;
}

.outcome-check {
  color: var(--emerald-aurora);
  font-weight: 700;
  font-size: 12px;
  flex-shrink: 0;
  margin-top: 1px;
}

.client-stack-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 24px;
}

.client-actions {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  margin-top: auto;
}

/* 4. OUTCOME STRIP (.outcome-strip) */
.outcome-strip {
  max-width: var(--content-max);
  margin: 0 auto 64px;
  padding: 18px var(--gutter);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  flex-wrap: wrap;
  background: rgba(255, 255, 255, 0.02);
  border-top: 1px solid rgba(255, 255, 255, 0.06);
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
  font-family: var(--font-display);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.1em;
  color: var(--text-sub);
  border-radius: 16px;
}

/* 5. OUR CASE-STUDY STANDARD (.evidence-note) */
.evidence-note {
  max-width: var(--content-max);
  margin: var(--section-space) auto;
  padding: clamp(40px, 5vw, 64px) var(--gutter);
  background: linear-gradient(135deg, rgba(8, 18, 30, 0.75) 0%, rgba(4, 10, 18, 0.9) 100%);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 28px;
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  text-align: left;
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.45), inset 0 1px 0 rgba(255, 255, 255, 0.1);
}

.evidence-note h2 {
  font-size: clamp(28px, 3.2vw, 40px);
  margin: 0 0 16px;
  line-height: 1.25;
}

.evidence-note p:last-child {
  font-size: 16px;
  color: var(--text-sub);
  max-width: 680px;
  line-height: 1.6;
  margin: 0;
}

/* 6. PLATFORM PAGE (.platform-page, .stack-diagram, .metric-list) */
.platform-page {
  max-width: var(--content-max);
  margin: var(--section-space) auto;
  padding: 0 var(--gutter);
  display: grid;
  grid-template-columns: 1fr 1.2fr;
  gap: clamp(32px, 5vw, 64px);
  align-items: center;
}

@media (max-width: 860px) {
  .platform-page {
    grid-template-columns: 1fr;
  }
}

.platform-page h2 {
  font-size: clamp(28px, 3.2vw, 42px);
  margin: 0 0 16px;
  line-height: 1.2;
}

.platform-page p {
  font-size: 16px;
  color: var(--text-sub);
  line-height: 1.6;
  margin: 0 0 24px;
}

.stack-diagram {
  background: rgba(8, 16, 28, 0.75);
  border: 1px solid rgba(255, 255, 255, 0.09);
  border-radius: 24px;
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  backdrop-filter: blur(16px);
}

.stack-title {
  display: flex;
  justify-content: space-between;
  font-family: var(--font-display);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.1em;
  color: var(--emerald-aurora);
  padding-bottom: 8px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.stack-diagram .layer {
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 12px;
  padding: 14px 18px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-family: var(--font-display);
  transition: all 0.2s ease;
}

.stack-diagram .layer span {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.1em;
  color: var(--text-dim);
  text-transform: uppercase;
}

.stack-diagram .layer b {
  font-size: 14px;
  font-weight: 600;
  color: #ffffff;
}

.stack-diagram .layer:hover {
  background: rgba(0, 229, 153, 0.06);
  border-color: rgba(0, 229, 153, 0.25);
}

.metric-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 14px;
  margin-top: 24px;
}

@media (max-width: 500px) {
  .metric-list {
    grid-template-columns: 1fr;
  }
}

.metric-list div {
  background: rgba(255, 255, 255, 0.02);
  border: 1px solid rgba(255, 255, 255, 0.05);
  padding: 14px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  gap: 12px;
}

.metric-list b {
  font-family: var(--font-display);
  font-size: 14px;
  color: var(--emerald-aurora);
  font-weight: 700;
}

.metric-list span {
  font-size: 13px;
  color: var(--text-sub);
}

/* 7. RICH SECTION & ROADMAP (.rich-section, .roadmap, .rich-list) */
.rich-section {
  max-width: var(--content-max);
  margin: var(--section-space) auto;
  padding: 0 var(--gutter);
}

.rich-head {
  margin-bottom: 36px;
  max-width: 680px;
}

.rich-head h2 {
  font-size: clamp(28px, 3.2vw, 42px);
  margin: 0 0 12px;
  line-height: 1.2;
}

.rich-head p {
  font-size: 16px;
  color: var(--text-sub);
  margin: 0;
}

.rich-list,
.roadmap {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 20px;
}

.rich-list article,
.roadmap article {
  background: var(--card-bg);
  border: 1px solid var(--card-border);
  border-radius: 20px;
  padding: 24px;
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  transition: all 0.25s ease;
}

.rich-list article span,
.roadmap article span {
  font-family: var(--font-display);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.12em;
  color: var(--emerald-aurora);
  background: rgba(0, 229, 153, 0.12);
  padding: 3px 8px;
  border-radius: 4px;
  display: inline-block;
  margin-bottom: 12px;
  text-transform: uppercase;
}

.rich-list article h3,
.roadmap article h3 {
  font-size: 18px;
  color: #ffffff;
  margin: 0 0 8px;
}

.rich-list article p,
.roadmap article p {
  font-size: 14px;
  color: var(--text-sub);
  line-height: 1.55;
  margin: 0;
}

.rich-list article:hover,
.roadmap article:hover {
  border-color: rgba(0, 229, 153, 0.35);
  transform: translateY(-3px);
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.4);
}

/* 8. ASSURANCE BAR (.assurance) */
.assurance {
  max-width: var(--content-max);
  margin: var(--section-space) auto;
  padding: clamp(32px, 4vw, 48px) var(--gutter);
  background: rgba(8, 16, 28, 0.65);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 24px;
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 24px;
  align-items: center;
}

.assurance p.section-tag {
  grid-column: 1 / -1;
  margin-bottom: 0;
}

.assurance div {
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.05);
  padding: 18px;
  border-radius: 14px;
}

.assurance b {
  display: block;
  font-family: var(--font-display);
  font-size: 16px;
  color: #ffffff;
  margin-bottom: 6px;
}

.assurance span {
  font-size: 13px;
  color: var(--text-sub);
  line-height: 1.45;
}

/* 9. ABOUT PAGE (.about-page, .principles, .beliefs) */
.about-page {
  max-width: var(--content-max);
  margin: var(--section-space) auto;
  padding: 0 var(--gutter);
  display: grid;
  grid-template-columns: 1fr 1.3fr;
  gap: clamp(32px, 5vw, 64px);
  align-items: start;
}

@media (max-width: 860px) {
  .about-page {
    grid-template-columns: 1fr;
  }
}

.about-page h2 {
  font-size: clamp(32px, 3.8vw, 48px);
  margin: 0;
  line-height: 1.15;
}

.about-copy p {
  font-size: 16px;
  color: var(--text-sub);
  line-height: 1.65;
  margin: 0 0 20px;
}

.principles {
  max-width: var(--content-max);
  margin: var(--section-space) auto;
  padding: 0 var(--gutter);
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 24px;
}

.principles article {
  background: var(--card-bg);
  border: 1px solid var(--card-border);
  border-radius: 20px;
  padding: 28px;
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  transition: all 0.25s ease;
}

.principles article span {
  font-family: var(--font-display);
  font-size: 16px;
  font-weight: 800;
  color: var(--emerald-aurora);
  display: block;
  margin-bottom: 12px;
}

.principles article h3 {
  font-size: 18px;
  color: #ffffff;
  margin: 0 0 8px;
}

.principles article p {
  font-size: 14px;
  color: var(--text-sub);
  line-height: 1.55;
  margin: 0;
}

.principles article:hover {
  border-color: rgba(0, 229, 153, 0.35);
  transform: translateY(-3px);
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.4);
}

.beliefs {
  max-width: var(--content-max);
  margin: var(--section-space) auto;
  padding: clamp(40px, 5vw, 64px) var(--gutter);
  background: linear-gradient(135deg, rgba(10, 22, 36, 0.8) 0%, rgba(5, 12, 22, 0.95) 100%);
  border: 1px solid rgba(0, 229, 153, 0.25);
  border-radius: 28px;
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  text-align: center;
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.45), inset 0 1px 0 rgba(255, 255, 255, 0.1);
}

.beliefs blockquote {
  font-family: var(--font-display);
  font-size: clamp(20px, 2.4vw, 28px);
  color: #ffffff;
  margin: 0 auto 32px;
  max-width: 800px;
  line-height: 1.4;
  font-style: italic;
}

.beliefs div {
  display: flex;
  justify-content: center;
  gap: 12px;
  flex-wrap: wrap;
}

.beliefs div span {
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.08);
  padding: 8px 16px;
  border-radius: 9999px;
  font-family: var(--font-display);
  font-size: 13px;
  font-weight: 500;
  color: var(--text-sub);
}

/* ==========================================================================
   10. PROPOSALS LIBRARY PAGE (.proposals-page)
   ========================================================================== */
.proposals-page {
  max-width: var(--content-max);
  margin: var(--section-space) auto;
  padding: 0 var(--gutter);
}

.proposals-intro {
  margin-bottom: 40px;
  max-width: 760px;
}

.proposals-intro h2 {
  font-size: clamp(28px, 3.4vw, 44px);
  margin: 0 0 14px;
  line-height: 1.2;
}

.proposals-intro p {
  font-size: 16px;
  color: var(--text-sub);
  line-height: 1.6;
  margin: 0;
}

/* ==========================================================================
   FLAGSHIP MASTER PROPOSAL HERO CARD
   ========================================================================== */
.master-proposal-hero {
  background: linear-gradient(135deg, rgba(14, 28, 48, 0.92) 0%, rgba(6, 14, 24, 0.98) 100%);
  border: 1px solid rgba(174, 255, 0, 0.35);
  border-radius: 28px;
  padding: clamp(24px, 3.5vw, 44px);
  margin-bottom: 48px;
  display: grid;
  grid-template-columns: 1.25fr 0.95fr;
  gap: clamp(24px, 3vw, 44px);
  align-items: stretch;
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.5), inset 0 1px 0 rgba(255, 255, 255, 0.15);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  position: relative;
  overflow: hidden;
}

.master-proposal-hero::before {
  content: "";
  position: absolute;
  top: -100px;
  right: -100px;
  width: 300px;
  height: 300px;
  background: radial-gradient(circle, rgba(174, 255, 0, 0.12) 0%, transparent 70%);
  pointer-events: none;
}

.master-hero-content {
  display: flex;
  flex-direction: column;
}

.master-hero-badge-row {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 16px;
}

.master-badge-gold {
  font-family: var(--font-display);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.08em;
  background: rgba(174, 255, 0, 0.12);
  border: 1px solid rgba(174, 255, 0, 0.35);
  color: var(--lime);
  padding: 4px 12px;
  border-radius: 999px;
}

.master-file-type {
  font-family: var(--font-display);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.1em;
  background: rgba(255, 255, 255, 0.06);
  color: var(--text-dim);
  padding: 4px 10px;
  border-radius: 6px;
}

.master-hero-title {
  font-size: clamp(22px, 2.5vw, 32px);
  color: #ffffff;
  margin: 0 0 14px;
  line-height: 1.25;
  font-weight: 700;
}

.master-hero-desc {
  font-size: 15px;
  color: var(--text-sub);
  line-height: 1.6;
  margin: 0 0 24px;
}

.master-meta-tags-row {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 12px;
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.06);
  padding: 14px 18px;
  border-radius: 14px;
  margin-bottom: 24px;
}

.master-meta-item small {
  display: block;
  font-family: var(--font-display);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.1em;
  color: var(--lime);
  margin-bottom: 4px;
}

.master-meta-item strong {
  font-size: 14px;
  color: #ffffff;
  font-weight: 600;
}

.master-meta-item span {
  font-size: 13px;
  color: var(--text-sub);
}

.master-stack-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.stack-pill.master-pill {
  background: rgba(174, 255, 0, 0.08);
  border-color: rgba(174, 255, 0, 0.28);
  color: var(--lime);
  font-weight: 600;
  padding: 4px 10px;
}

.master-primary-actions {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
  margin-top: 28px;
}

.master-download-action-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  height: 48px;
  padding: 0 24px;
  font-size: 14px;
  font-weight: 700;
  border-radius: 12px;
  white-space: nowrap;
  box-sizing: border-box;
  border: 1px solid var(--lime);
  background: var(--lime);
  color: #000000;
  text-decoration: none;
  cursor: pointer;
  transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1);
  box-shadow: 0 4px 16px rgba(174, 255, 0, 0.2);
}

.master-download-action-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(174, 255, 0, 0.38);
}

.master-scope-action-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  height: 48px;
  padding: 0 22px;
  font-size: 14px;
  font-weight: 600;
  border-radius: 12px;
  white-space: nowrap;
  box-sizing: border-box;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.16);
  color: #ffffff;
  text-decoration: none;
  cursor: pointer;
  transition: all 0.2s ease;
}

.master-scope-action-btn:hover {
  background: rgba(255, 255, 255, 0.09);
  border-color: rgba(255, 255, 255, 0.3);
  transform: translateY(-2px);
  color: #ffffff;
}

.master-hero-side-card {
  display: flex;
  flex-direction: column;
  background: rgba(255, 255, 255, 0.02);
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 20px;
  padding: 24px;
  justify-content: flex-start;
}

.master-highlights-box {
  display: flex;
  flex-direction: column;
  gap: 14px;
  height: 100%;
}

.highlights-header-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 2px;
}

.highlights-header {
  font-family: var(--font-display);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.12em;
  color: var(--lime);
}

.highlights-tag {
  font-family: var(--font-display);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.1em;
  background: rgba(174, 255, 0, 0.12);
  color: var(--lime);
  padding: 3px 8px;
  border-radius: 6px;
}

.master-highlights-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.master-highlight-row {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: 13.5px;
  color: #e2e8f0;
  line-height: 1.45;
  background: rgba(255, 255, 255, 0.025);
  padding: 10px 14px;
  border-radius: 10px;
  border: 1px solid rgba(255, 255, 255, 0.04);
}

.highlight-check {
  color: var(--lime);
  font-weight: 800;
  font-size: 13px;
  flex-shrink: 0;
  margin-top: 1px;
}

.master-scope-note {
  margin-top: auto;
  padding-top: 16px;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
  font-size: 12px;
  color: var(--text-sub);
  line-height: 1.55;
}

.proposals-sub-header {
  margin-bottom: 24px;
}

.proposals-sub-header h3 {
  font-size: clamp(20px, 2.2vw, 26px);
  color: #ffffff;
  margin: 6px 0 0;
}

.proposals-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));
  gap: 28px;
}

.proposal-card {
  background: var(--card-bg);
  border: 1px solid var(--card-border);
  border-radius: 24px;
  padding: 32px;
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  display: flex;
  flex-direction: column;
  transition: all 0.25s ease;
  position: relative;
}

.proposal-card:hover {
  border-color: rgba(174, 255, 0, 0.4);
  transform: translateY(-4px);
  box-shadow: 0 20px 48px rgba(0, 0, 0, 0.45);
}

.proposal-card-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 14px;
}

.proposal-num {
  font-family: var(--font-display);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.12em;
  color: var(--lime);
}

.proposal-cat {
  font-family: var(--font-display);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.1em;
  color: var(--text-dim);
  background: rgba(255, 255, 255, 0.05);
  padding: 3px 8px;
  border-radius: 4px;
}

.proposal-title {
  font-size: clamp(19px, 2vw, 22px);
  color: #ffffff;
  margin: 0 0 12px;
  line-height: 1.3;
}

.proposal-desc {
  font-size: 14px;
  color: var(--text-sub);
  line-height: 1.55;
  margin: 0 0 20px;
  flex-grow: 1;
}

.proposal-meta-row {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.05);
  padding: 12px 16px;
  border-radius: 12px;
  margin-bottom: 20px;
}

.proposal-meta-row small {
  display: block;
  font-family: var(--font-display);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.1em;
  color: var(--lime);
  margin-bottom: 2px;
}

.proposal-meta-row strong,
.proposal-meta-row span {
  font-size: 13px;
  color: #ffffff;
  font-weight: 600;
}

.proposal-meta-row span {
  font-weight: 400;
  color: var(--text-sub);
  font-size: 12px;
}

.proposal-stack-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 20px;
}

.stack-pill {
  font-family: var(--font-display);
  font-size: 11px;
  background: rgba(174, 255, 0, 0.08);
  border: 1px solid rgba(174, 255, 0, 0.2);
  color: var(--lime);
  padding: 3px 8px;
  border-radius: 6px;
}

.proposal-highlights-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-bottom: 24px;
  padding-top: 16px;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
}

.highlight-row {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  font-size: 13px;
  color: var(--text-sub);
  line-height: 1.45;
}

.highlight-dot {
  color: var(--lime);
  font-weight: 700;
  font-size: 12px;
  flex-shrink: 0;
  margin-top: 1px;
}

.proposal-actions {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-top: auto;
}

.proposal-download-btn {
  justify-content: center;
  font-weight: 700;
  padding: 11px 18px;
  font-size: 13.5px;
}

@media (max-width: 960px) {
  .master-proposal-hero {
    grid-template-columns: 1fr;
    padding: 24px;
    gap: 28px;
  }

  .master-primary-actions {
    flex-direction: column;
    align-items: stretch;
    width: 100%;
  }

  .master-download-action-btn,
  .master-scope-action-btn {
    width: 100%;
  }
}

/* ==========================================================================
   11. PRICING & INVESTMENT PAGE (.pricing-page)
   ========================================================================== */
.pricing-page {
  max-width: var(--content-max);
  margin: var(--section-space) auto;
  padding: 0 var(--gutter);
}

.pricing-intro {
  margin-bottom: 40px;
  max-width: 760px;
}

.pricing-intro h2 {
  font-size: clamp(28px, 3.4vw, 44px);
  margin: 0 0 14px;
  line-height: 1.2;
}

.pricing-intro p {
  font-size: 16px;
  color: var(--text-sub);
  line-height: 1.6;
  margin: 0;
}

.pricing-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 24px;
  margin-bottom: 56px;
}

.pricing-card {
  background: var(--card-bg);
  border: 1px solid var(--card-border);
  border-radius: 24px;
  padding: 32px;
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  display: flex;
  flex-direction: column;
  position: relative;
  transition: all 0.25s ease;
}

.pricing-card.popular {
  background: linear-gradient(135deg, rgba(14, 28, 48, 0.9) 0%, rgba(6, 14, 24, 0.96) 100%);
  border: 1px solid rgba(0, 229, 153, 0.45);
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.5), inset 0 1px 0 rgba(255, 255, 255, 0.15);
  transform: scale(1.02);
}

@media (max-width: 1100px) {
  .pricing-card.popular {
    transform: none;
  }
}

.pricing-card:hover {
  border-color: rgba(0, 229, 153, 0.4);
  transform: translateY(-4px);
}

.popular-ribbon {
  position: absolute;
  top: -12px;
  right: 24px;
  background: var(--emerald-aurora);
  color: #03070d;
  font-family: var(--font-display);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.1em;
  padding: 4px 10px;
  border-radius: 9999px;
  box-shadow: 0 4px 16px rgba(0, 229, 153, 0.4);
}

.pricing-badge {
  font-family: var(--font-display);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.14em;
  color: var(--emerald-aurora);
  background: rgba(0, 229, 153, 0.12);
  padding: 3px 8px;
  border-radius: 4px;
  display: inline-block;
  margin-bottom: 12px;
}

.pricing-tier-name {
  font-size: 20px;
  color: #ffffff;
  margin: 0 0 12px;
}

.pricing-amount {
  display: flex;
  align-items: baseline;
  gap: 8px;
  margin-bottom: 14px;
}

.pricing-amount strong {
  font-size: clamp(24px, 2.5vw, 32px);
  color: #ffffff;
  font-weight: 800;
  font-family: var(--font-display);
}

.pricing-amount small {
  font-size: 13px;
  color: var(--text-dim);
}

.pricing-desc {
  font-size: 13px;
  color: var(--text-sub);
  line-height: 1.5;
  margin: 0 0 20px;
}

.pricing-deliverables {
  padding-top: 18px;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
  margin-bottom: 24px;
  flex-grow: 1;
}

.deliverables-heading {
  display: block;
  font-family: var(--font-display);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.12em;
  color: var(--text-dim);
  margin-bottom: 12px;
}

.pricing-deliverables ul {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.pricing-deliverables li {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  font-size: 13px;
  color: var(--text-sub);
  line-height: 1.45;
}

.check-icon {
  color: var(--emerald-aurora);
  font-weight: 700;
  font-size: 12px;
  flex-shrink: 0;
  margin-top: 1px;
}

.pricing-card-footer {
  margin-top: auto;
}

.pricing-guarantees {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 20px;
}

.guarantee-box {
  background: rgba(255, 255, 255, 0.02);
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 18px;
  padding: 24px;
}

.guarantee-icon {
  font-size: 24px;
  display: block;
  margin-bottom: 12px;
}

.guarantee-box h4 {
  font-size: 15px;
  color: #ffffff;
  margin: 0 0 8px;
}

.guarantee-box p {
  font-size: 13px;
  color: var(--text-sub);
  line-height: 1.5;
  margin: 0;
}

/* ==========================================================================
   12. SOLUTIONS MATRIX PAGE (.use-cases-page-wrapper)
   ========================================================================== */
.use-cases-page-wrapper {
  max-width: var(--content-max);
  margin: var(--section-space) auto;
  padding: 0 var(--gutter);
}

/* ==========================================================================
   13. FOOTER LEGAL LINKS & BUTTON MODAL TRIGGERS
   ========================================================================== */
.btn-modal-trigger {
  cursor: pointer;
  border: none;
  font-family: inherit;
}

.footer-legal-links {
  display: flex;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
}

.footer-legal-links a {
  color: var(--text-dim);
  font-size: 12px;
  font-family: var(--font-display);
  transition: color 0.2s ease;
}

.footer-legal-links a:hover {
  color: var(--emerald-aurora);
}

/* ==========================================================================
   14. LUXURY TRANSPARENCY PROJECT INTAKE POPUP MODAL
   ========================================================================== */
.project-modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 9999;
  background: rgba(2, 6, 12, 0.82);
  backdrop-filter: blur(24px);
  -webkit-backdrop-filter: blur(24px);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  animation: modalFadeIn 0.25s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

@keyframes modalFadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

.project-modal-window {
  width: 100%;
  max-width: 820px;
  max-height: 90vh;
  overflow-y: auto;
  background: linear-gradient(135deg, rgba(14, 28, 48, 0.96) 0%, rgba(6, 14, 24, 0.98) 100%);
  border: 1px solid rgba(0, 229, 153, 0.35);
  box-shadow: 0 32px 80px rgba(0, 0, 0, 0.7), inset 0 1px 0 rgba(255, 255, 255, 0.2);
  border-radius: 28px;
  padding: clamp(24px, 4vw, 40px);
  display: flex;
  flex-direction: column;
  position: relative;
  animation: modalSlideUp 0.3s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

@keyframes modalSlideUp {
  from {
    opacity: 0;
    transform: scale(0.96) translateY(20px);
  }
  to {
    opacity: 1;
    transform: scale(1) translateY(0);
  }
}

.modal-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 20px;
  margin-bottom: 20px;
}

.modal-header-info {
  flex-grow: 1;
}

.modal-badge-row {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 8px;
}

.modal-kicker {
  font-family: var(--font-display);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.12em;
  color: var(--emerald-aurora);
  background: rgba(0, 229, 153, 0.12);
  padding: 3px 8px;
  border-radius: 4px;
}

.modal-step-counter {
  font-family: var(--font-display);
  font-size: 11px;
  font-weight: 700;
  color: var(--text-dim);
  letter-spacing: 0.08em;
}

.modal-title {
  font-size: clamp(22px, 2.6vw, 30px);
  color: #ffffff;
  margin: 0 0 6px;
  line-height: 1.2;
}

.modal-subtitle {
  font-size: 14px;
  color: var(--text-sub);
  margin: 0;
  line-height: 1.5;
}

.modal-close-btn {
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.1);
  color: var(--text-sub);
  width: 38px;
  height: 38px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.2s ease;
  flex-shrink: 0;
}

.modal-close-btn:hover {
  background: rgba(255, 255, 255, 0.15);
  color: #ffffff;
  border-color: rgba(255, 255, 255, 0.25);
  transform: rotate(90deg);
}

.modal-progress-track {
  width: 100%;
  height: 4px;
  background: rgba(255, 255, 255, 0.06);
  border-radius: 9999px;
  overflow: hidden;
  margin-bottom: 28px;
}

.modal-progress-bar {
  height: 100%;
  background: linear-gradient(90deg, var(--emerald-aurora) 0%, #00b4d8 100%);
  border-radius: 9999px;
  transition: width 0.35s ease;
}

.modal-body-form {
  display: flex;
  flex-direction: column;
  flex-grow: 1;
}

.modal-step-content {
  margin-bottom: 28px;
  animation: stepFade 0.25s ease forwards;
}

@keyframes stepFade {
  from {
    opacity: 0;
    transform: translateY(6px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.modal-services-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 14px;
}

.modal-service-card {
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 18px;
  padding: 18px;
  cursor: pointer;
  transition: all 0.2s ease;
  display: flex;
  flex-direction: column;
}

.modal-service-card:hover {
  background: rgba(255, 255, 255, 0.06);
  border-color: rgba(0, 229, 153, 0.35);
  transform: translateY(-2px);
}

.modal-service-card.selected {
  background: rgba(0, 229, 153, 0.08);
  border-color: var(--emerald-aurora);
  box-shadow: 0 0 20px rgba(0, 229, 153, 0.2);
}

.card-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 12px;
}

.service-tag {
  font-family: var(--font-display);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 0.1em;
  color: var(--emerald-aurora);
  background: rgba(0, 229, 153, 0.1);
  padding: 2px 6px;
  border-radius: 4px;
}

.custom-radio {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  border: 1px solid rgba(255, 255, 255, 0.2);
  display: flex;
  align-items: center;
  justify-content: center;
}

.modal-service-card.selected .custom-radio {
  border-color: var(--emerald-aurora);
}

.radio-inner {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--emerald-aurora);
}

.service-title {
  font-size: 15px;
  color: #ffffff;
  margin: 0 0 6px;
  font-weight: 600;
}

.service-desc {
  font-size: 12px;
  color: var(--text-sub);
  margin: 0;
  line-height: 1.45;
}

.form-group-block {
  margin-bottom: 24px;
}

.group-label {
  display: block;
  font-family: var(--font-display);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.1em;
  color: var(--text-dim);
  margin-bottom: 12px;
}

.modal-pills-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.modal-pill-option {
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 9999px;
  padding: 10px 18px;
  color: var(--text-sub);
  font-size: 13px;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 8px;
  transition: all 0.2s ease;
  font-family: inherit;
}

.modal-pill-option:hover {
  background: rgba(255, 255, 255, 0.08);
  color: #ffffff;
  border-color: rgba(255, 255, 255, 0.2);
}

.modal-pill-option.active {
  background: rgba(0, 229, 153, 0.12);
  border-color: var(--emerald-aurora);
  color: #ffffff;
  font-weight: 600;
}

.pill-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.3);
}

.modal-pill-option.active .pill-dot {
  background: var(--emerald-aurora);
}

.modal-fields-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 16px;
}

@media (max-width: 640px) {
  .modal-fields-grid {
    grid-template-columns: 1fr;
  }
}

.modal-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.modal-field.full-width {
  grid-column: 1 / -1;
}

.modal-field label {
  font-size: 12px;
  font-family: var(--font-display);
  font-weight: 600;
  color: var(--text-sub);
}

.modal-field label .req {
  color: var(--emerald-aurora);
}

.modal-field label .opt {
  color: var(--text-dim);
  font-weight: 400;
}

.modal-field input,
.modal-field textarea {
  background: rgba(0, 0, 0, 0.35);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 12px;
  padding: 12px 16px;
  color: #ffffff;
  font-size: 14px;
  font-family: inherit;
  transition: all 0.2s ease;
}

.modal-field input:focus,
.modal-field textarea:focus {
  outline: none;
  border-color: var(--emerald-aurora);
  box-shadow: 0 0 16px rgba(0, 229, 153, 0.2);
  background: rgba(0, 0, 0, 0.5);
}

.review-summary-card {
  background: rgba(0, 229, 153, 0.05);
  border: 1px solid rgba(0, 229, 153, 0.3);
  border-radius: 20px;
  padding: 24px;
  margin-bottom: 24px;
}

.summary-header {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 20px;
  padding-bottom: 16px;
  border-bottom: 1px solid rgba(0, 229, 153, 0.2);
}

.summary-check-icon {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: var(--emerald-aurora);
  color: #03070d;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 800;
  flex-shrink: 0;
}

.summary-header h4 {
  font-size: 18px;
  color: #ffffff;
  margin: 0 0 4px;
}

.summary-header span {
  font-size: 13px;
  color: var(--emerald-aurora);
}

.summary-details-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 14px;
}

.summary-item small {
  display: block;
  font-family: var(--font-display);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.1em;
  color: var(--text-dim);
  margin-bottom: 4px;
}

.summary-item strong {
  font-size: 13px;
  color: #ffffff;
}

.dispatch-action-options {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 14px;
}

.dispatch-btn {
  justify-content: center;
  padding: 14px 20px;
  font-weight: 700;
}

.modal-footer-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding-top: 20px;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  flex-wrap: wrap;
}

.modal-back-btn {
  background: none;
  border: none;
  color: var(--text-sub);
  font-size: 13px;
  font-family: var(--font-display);
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 6px;
  transition: color 0.2s ease;
}

.modal-back-btn:hover {
  color: #ffffff;
}

.modal-guarantee-note {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  color: var(--text-dim);
}

.modal-next-btn {
  margin-left: auto;
}

/* ==========================================================================
   15. LEGAL & GOVERNANCE PAGES (.legal-page-container, .legal-card)
   ========================================================================== */
.legal-page-container {
  max-width: var(--content-max);
  margin: var(--section-space) auto;
  padding: 0 var(--gutter);
}

.legal-intro-card {
  background: var(--card-bg);
  border: 1px solid var(--card-border);
  border-radius: 24px;
  padding: clamp(28px, 4vw, 40px);
  margin-bottom: 40px;
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
}

.legal-intro-card h2 {
  font-size: clamp(26px, 3vw, 38px);
  margin: 12px 0 14px;
  line-height: 1.25;
}

.legal-intro-card p {
  font-size: 16px;
  color: var(--text-sub);
  line-height: 1.6;
  margin: 0;
}

.legal-sections-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(360px, 1fr));
  gap: 24px;
}

.legal-card {
  background: var(--card-bg);
  border: 1px solid var(--card-border);
  border-radius: 20px;
  padding: 28px;
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  transition: all 0.2s ease;
  display: flex;
  flex-direction: column;
}

.legal-card:hover {
  border-color: rgba(0, 229, 153, 0.35);
  transform: translateY(-2px);
}

.legal-num {
  font-family: var(--font-display);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.12em;
  color: var(--emerald-aurora);
  background: rgba(0, 229, 153, 0.1);
  padding: 3px 8px;
  border-radius: 4px;
  width: fit-content;
  margin-bottom: 14px;
}

.legal-card h3 {
  font-size: 18px;
  color: #ffffff;
  margin: 0 0 10px;
  line-height: 1.35;
}

.legal-card p {
  font-size: 14px;
  color: var(--text-sub);
  line-height: 1.6;
  margin: 0;
}

/* ==========================================================================
   16. SITE DIRECTORY & ARCHITECTURE TREE (.sitemap-page-container)
   ========================================================================== */
.sitemap-page-container {
  max-width: var(--content-max);
  margin: var(--section-space) auto;
  padding: 0 var(--gutter);
}

.sitemap-intro-card {
  background: var(--card-bg);
  border: 1px solid var(--card-border);
  border-radius: 24px;
  padding: clamp(28px, 4vw, 40px);
  margin-bottom: 40px;
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
}

.sitemap-intro-card h2 {
  font-size: clamp(26px, 3vw, 38px);
  margin: 12px 0 14px;
  line-height: 1.25;
}

.sitemap-intro-card p {
  font-size: 16px;
  color: var(--text-sub);
  line-height: 1.6;
  margin: 0;
}

.sitemap-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(360px, 1fr));
  gap: 28px;
}

.sitemap-column-card {
  background: var(--card-bg);
  border: 1px solid var(--card-border);
  border-radius: 24px;
  padding: 28px;
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  display: flex;
  flex-direction: column;
}

.sitemap-card-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 20px;
  padding-bottom: 14px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.sitemap-badge {
  font-family: var(--font-display);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.12em;
  color: var(--emerald-aurora);
  background: rgba(0, 229, 153, 0.12);
  padding: 3px 8px;
  border-radius: 4px;
}

.sitemap-category {
  font-size: 14px;
  color: #ffffff;
  margin: 0;
  font-family: var(--font-display);
  letter-spacing: 0.05em;
}

.sitemap-links-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.sitemap-link-item {
  background: rgba(255, 255, 255, 0.02);
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 14px;
  padding: 14px 18px;
  text-decoration: none;
  transition: all 0.2s ease;
  display: block;
}

.sitemap-link-item:hover {
  background: rgba(0, 229, 153, 0.06);
  border-color: rgba(0, 229, 153, 0.3);
  transform: translateX(4px);
}

.sitemap-link-head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-bottom: 4px;
  flex-wrap: wrap;
  gap: 8px;
}

.sitemap-link-head strong {
  font-size: 14px;
  color: #ffffff;
  font-weight: 600;
}

.sitemap-path {
  font-family: var(--font-mono, monospace);
  font-size: 11px;
  color: var(--emerald-aurora);
  background: rgba(0, 229, 153, 0.08);
  padding: 2px 6px;
  border-radius: 4px;
}

.sitemap-link-item p {
  font-size: 12px;
  color: var(--text-sub);
  margin: 0;
  line-height: 1.45;
}

/* ==========================================================================
   17. REFINED COMPACT & RESPONSIVE FLOATING WHATSAPP BUTTON
   ========================================================================== */
.floating-whatsapp-widget {
  position: fixed;
  bottom: 22px;
  right: 22px;
  z-index: 9990;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 14px 6px 8px;
  background: linear-gradient(135deg, #25D366 0%, #128C7E 100%);
  border: 1px solid rgba(255, 255, 255, 0.4);
  border-radius: 9999px;
  box-shadow: 0 8px 24px rgba(37, 211, 102, 0.38), 0 3px 10px rgba(0, 0, 0, 0.5), inset 0 1px 0 rgba(255, 255, 255, 0.4);
  text-decoration: none;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  transition: all 0.22s cubic-bezier(0.16, 1, 0.3, 1);
  color: #ffffff !important;
  cursor: pointer;
}

.floating-whatsapp-widget:hover {
  background: linear-gradient(135deg, #2ee872 0%, #15a191 100%);
  border-color: rgba(255, 255, 255, 0.7);
  transform: translateY(-3px) scale(1.02);
  box-shadow: 0 12px 30px rgba(37, 211, 102, 0.5), 0 5px 14px rgba(0, 0, 0, 0.6), inset 0 1px 0 rgba(255, 255, 255, 0.6);
  color: #ffffff !important;
}

.floating-whatsapp-icon-box {
  position: relative;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.22);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #ffffff;
  flex-shrink: 0;
}

.floating-whatsapp-icon-box .whatsapp-icon {
  width: 16px;
  height: 16px;
  fill: #ffffff !important;
  color: #ffffff !important;
}

.online-indicator {
  position: absolute;
  bottom: -1px;
  right: -1px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #00ff88;
  border: 1.5px solid #128C7E;
  box-shadow: 0 0 5px #00ff88;
  animation: pulsePresence 2s infinite ease-in-out;
}

@keyframes pulsePresence {
  0%, 100% {
    transform: scale(1);
    opacity: 1;
  }
  50% {
    transform: scale(1.25);
    opacity: 0.8;
  }
}

.floating-whatsapp-text {
  display: flex;
  flex-direction: column;
  line-height: 1.15;
}

.floating-whatsapp-text .whatsapp-title {
  font-family: var(--font-display);
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: 0.01em;
  color: #ffffff !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.35);
}

.floating-whatsapp-text .whatsapp-status {
  font-family: var(--font-display);
  font-size: 9px;
  font-weight: 600;
  letter-spacing: 0.04em;
  color: rgba(255, 255, 255, 0.9) !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
}

.floating-whatsapp-widget .floating-arrow {
  color: #ffffff !important;
  width: 12px;
  height: 12px;
  transition: transform 0.2s ease;
  flex-shrink: 0;
}

.floating-whatsapp-widget:hover .floating-arrow {
  transform: translate(2px, -2px);
}

@media (max-width: 900px) {
  .floating-whatsapp-widget {
    bottom: 18px;
    right: 18px;
    padding: 5px 12px 5px 7px;
    gap: 7px;
  }
}

@media (max-width: 640px) {
  .floating-whatsapp-widget {
    bottom: 14px;
    right: 14px;
    padding: 5px 10px 5px 6px;
    gap: 6px;
  }
  .floating-whatsapp-icon-box {
    width: 24px;
    height: 24px;
  }
  .floating-whatsapp-icon-box .whatsapp-icon {
    width: 14px;
    height: 14px;
  }
  .floating-whatsapp-text .whatsapp-title {
    font-size: 11.5px;
  }
  .floating-whatsapp-text .whatsapp-status {
    display: none;
  }
}

/* ==========================================================================
   18. MOBILE NAVIGATION TOGGLE & SLIDE-DOWN DRAWER
   ========================================================================== */
.mobile-menu-toggle-btn {
  display: none;
  width: 38px;
  height: 38px;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.12);
  color: var(--text-sub);
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.2s ease;
}

.mobile-menu-toggle-btn:hover {
  background: rgba(255, 255, 255, 0.12);
  color: #ffffff;
  border-color: var(--emerald-aurora);
}

.header-actions {
  display: flex;
  align-items: center;
  gap: 12px;
}

@media (max-width: 992px) {
  .site-nav {
    display: none;
  }
  .mobile-menu-toggle-btn {
    display: flex;
  }
}

.mobile-nav-drawer {
  background: rgba(6, 12, 22, 0.98);
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  padding: 18px 0 12px;
  margin-top: 10px;
  border-radius: 0 0 18px 18px;
  animation: mobileNavFade 0.2s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

@keyframes mobileNavFade {
  from {
    opacity: 0;
    transform: translateY(-8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.mobile-nav-links {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.mobile-nav-link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 11px 16px;
  border-radius: 10px;
  color: var(--text-sub);
  font-family: var(--font-display);
  font-size: 14px;
  font-weight: 500;
  text-decoration: none;
  transition: all 0.2s ease;
}

.mobile-nav-link:hover {
  background: rgba(0, 229, 153, 0.08);
  color: var(--emerald-aurora);
  padding-left: 20px;
}

.mobile-nav-link svg {
  color: var(--text-dim);
  transition: transform 0.2s ease;
}

.mobile-nav-link:hover svg {
  color: var(--emerald-aurora);
  transform: translate(2px, -2px);
}

/* ==========================================================================
   19. COMPREHENSIVE FULL-SITE MOBILE & TABLET RESPONSIVENESS ENHANCEMENTS
   ========================================================================== */
@media (max-width: 768px) {
  .brand-logo-img {
    height: clamp(38px, 6vw, 48px);
    max-width: 170px;
  }
  
  .footer-logo {
    height: clamp(46px, 7vw, 60px);
    max-width: 210px;
  }

  .button-header-cta {
    padding: 7px 12px;
    font-size: 12px;
  }

  .announcement-ribbon {
    padding: 6px var(--gutter);
  }

  .announcement-text {
    font-size: 11.5px;
    text-align: center;
  }

  .hero-actions {
    flex-direction: column;
    width: 100%;
  }

  .hero-actions .button {
    width: 100%;
    justify-content: center;
  }

  .work-cases-grid {
    grid-template-columns: 1fr;
  }

  .client-pipeline-flow {
    flex-wrap: wrap;
    gap: 6px;
  }

  .flow-stage-pill {
    font-size: 11px;
    padding: 3px 8px;
  }

  .legal-sections-grid {
    grid-template-columns: 1fr;
  }

  .sitemap-grid {
    grid-template-columns: 1fr;
  }

  .proposals-grid {
    grid-template-columns: 1fr;
  }

  .pricing-grid {
    grid-template-columns: 1fr;
  }

  .use-cases-grid {
    grid-template-columns: 1fr;
  }

  .direct-contacts-grid {
    grid-template-columns: 1fr;
  }

  .office-hubs-grid {
    grid-template-columns: 1fr;
  }

  .crm-top-bar {
    flex-direction: column;
    align-items: stretch;
  }

  .crm-kanban-board {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 12px;
  }
}

/* ==========================================================================
   20. SME TOTAL COST OF OWNERSHIP (TCO) & ROI CALCULATOR
   ========================================================================== */
.tco-calculator-section {
  margin: 56px 0 64px;
  width: 100%;
}

.tco-calculator-card {
  background: linear-gradient(135deg, rgba(14, 28, 48, 0.95) 0%, rgba(6, 14, 24, 0.98) 100%);
  border: 1px solid rgba(0, 229, 153, 0.35);
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.6), inset 0 1px 0 rgba(255, 255, 255, 0.15);
  border-radius: 28px;
  padding: clamp(24px, 4vw, 44px);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
}

.tco-card-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 28px;
  margin-bottom: 36px;
  padding-bottom: 28px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  flex-wrap: wrap;
}

.tco-title {
  font-size: clamp(24px, 2.8vw, 36px);
  color: #ffffff;
  margin: 10px 0 8px;
  line-height: 1.25;
}

.tco-subtitle {
  font-size: 15px;
  color: var(--text-sub);
  margin: 0;
  max-width: 680px;
  line-height: 1.6;
}

.tco-badge-savings {
  background: rgba(0, 229, 153, 0.12);
  border: 1px solid rgba(0, 229, 153, 0.4);
  border-radius: 18px;
  padding: 16px 24px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  flex-shrink: 0;
  box-shadow: 0 8px 24px rgba(0, 229, 153, 0.15);
}

.tco-badge-savings small {
  font-family: var(--font-display);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.12em;
  color: var(--emerald-aurora);
  margin-bottom: 4px;
}

.tco-badge-savings strong {
  font-size: clamp(26px, 3vw, 36px);
  color: #ffffff;
  font-family: var(--font-display);
  font-weight: 800;
  line-height: 1.1;
  text-shadow: 0 0 16px rgba(0, 229, 153, 0.4);
}

.tco-badge-savings span {
  font-size: 12px;
  color: var(--text-sub);
  margin-top: 4px;
}

.tco-interactive-grid {
  display: grid;
  grid-template-columns: 1fr 1.35fr;
  gap: 36px;
}

@media (max-width: 1024px) {
  .tco-interactive-grid {
    grid-template-columns: 1fr;
  }
}

.tco-controls-panel {
  display: flex;
  flex-direction: column;
  gap: 24px;
  background: rgba(255, 255, 255, 0.02);
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 20px;
  padding: 24px;
}

.controls-heading {
  font-family: var(--font-display);
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.08em;
  color: var(--text-dim);
  text-transform: uppercase;
  margin: 0 0 8px;
}

.control-group {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.control-label-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.control-label-row label,
.control-label {
  font-family: var(--font-display);
  font-size: 13px;
  font-weight: 700;
  color: #ffffff;
}

.control-val-badge {
  font-family: var(--font-display);
  font-size: 12px;
  font-weight: 800;
  color: var(--emerald-aurora);
  background: rgba(0, 229, 153, 0.12);
  padding: 3px 10px;
  border-radius: 6px;
}

.tco-range-slider {
  -webkit-appearance: none;
  appearance: none;
  width: 100%;
  height: 6px;
  border-radius: 9999px;
  background: rgba(255, 255, 255, 0.1);
  outline: none;
  transition: all 0.2s ease;
}

.tco-range-slider::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: var(--emerald-aurora);
  cursor: pointer;
  box-shadow: 0 0 14px rgba(0, 229, 153, 0.8);
  border: 2px solid #03070d;
  transition: transform 0.15s ease;
}

.tco-range-slider::-webkit-slider-thumb:hover {
  transform: scale(1.2);
}

.slider-ticks {
  display: flex;
  justify-content: space-between;
  font-size: 11px;
  color: var(--text-dim);
  font-family: var(--font-display);
}

.complexity-options-grid {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.complexity-btn {
  background: rgba(255, 255, 255, 0.025);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 14px;
  padding: 12px 16px;
  text-align: left;
  cursor: pointer;
  transition: all 0.2s ease;
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.complexity-btn strong {
  font-size: 14px;
  color: #ffffff;
}

.complexity-btn small {
  font-size: 12px;
  color: var(--text-sub);
}

.complexity-btn:hover {
  background: rgba(255, 255, 255, 0.06);
  border-color: rgba(0, 229, 153, 0.3);
}

.complexity-btn.active {
  background: rgba(0, 229, 153, 0.09);
  border-color: var(--emerald-aurora);
  box-shadow: 0 0 16px rgba(0, 229, 153, 0.15);
}

.timeframe-switch-row {
  display: flex;
  gap: 8px;
}

.timeframe-pill {
  flex: 1;
  padding: 10px;
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 10px;
  color: var(--text-sub);
  font-size: 13px;
  font-weight: 600;
  font-family: var(--font-display);
  cursor: pointer;
  transition: all 0.2s ease;
}

.timeframe-pill:hover {
  background: rgba(255, 255, 255, 0.08);
  color: #ffffff;
}

.timeframe-pill.active {
  background: rgba(0, 229, 153, 0.12);
  border-color: var(--emerald-aurora);
  color: #ffffff;
  font-weight: 700;
}

.tco-results-panel {
  display: flex;
  flex-direction: column;
}

.comparison-columns-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  margin-top: 14px;
}

@media (max-width: 860px) {
  .comparison-columns-grid {
    grid-template-columns: 1fr;
  }
}

.comparison-col {
  background: rgba(255, 255, 255, 0.02);
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 18px;
  padding: 20px;
  display: flex;
  flex-direction: column;
  position: relative;
}

.comparison-col.fimriq-winner {
  background: linear-gradient(135deg, rgba(0, 229, 153, 0.08) 0%, rgba(6, 24, 20, 0.95) 100%);
  border: 1px solid var(--emerald-aurora);
  box-shadow: 0 16px 40px rgba(0, 229, 153, 0.18);
  transform: scale(1.02);
}

@media (max-width: 860px) {
  .comparison-col.fimriq-winner {
    transform: none;
  }
}

.col-tag {
  font-family: var(--font-display);
  font-size: 9.5px;
  font-weight: 800;
  letter-spacing: 0.1em;
  color: var(--text-dim);
  margin-bottom: 6px;
  display: block;
}

.col-winner-badge {
  font-family: var(--font-display);
  font-size: 9.5px;
  font-weight: 800;
  letter-spacing: 0.1em;
  color: #03070d;
  background: var(--emerald-aurora);
  padding: 3px 8px;
  border-radius: 9999px;
  margin-bottom: 8px;
  display: inline-block;
  width: fit-content;
  box-shadow: 0 2px 8px rgba(0, 229, 153, 0.4);
}

.col-title {
  font-size: 15px;
  color: #ffffff;
  margin: 0 0 12px;
}

.col-price-block {
  margin-bottom: 16px;
  padding-bottom: 14px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.col-price-block strong {
  font-family: var(--font-display);
  font-size: 28px;
  color: #ffffff;
  display: block;
  line-height: 1.1;
}

.col-price-block strong.emerald-highlight {
  color: var(--emerald-aurora);
  text-shadow: 0 0 12px rgba(0, 229, 153, 0.4);
}

.col-price-block small {
  font-size: 11px;
  color: var(--text-sub);
  margin-top: 4px;
  display: block;
}

.col-points {
  list-style: none;
  padding: 0;
  margin: 0 0 20px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  font-size: 12.5px;
  color: var(--text-sub);
  flex-grow: 1;
}

.col-points li {
  line-height: 1.4;
  display: flex;
  align-items: flex-start;
  gap: 6px;
}

.col-points li svg {
  color: var(--emerald-aurora);
  width: 14px;
  height: 14px;
  flex-shrink: 0;
  margin-top: 2px;
}

.winner-action-box {
  margin-top: auto;
}

/* ==========================================================================
   21. DEDICATED DEEP-DIVE CASE STUDY PAGES
   ========================================================================== */
.case-detail-hero {
  padding: 140px 24px 60px;
  background: radial-gradient(circle at 50% 10%, rgba(0, 229, 153, 0.12) 0%, rgba(3, 7, 13, 0.98) 70%);
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.case-detail-hero-inner {
  max-width: 1200px;
  margin: 0 auto;
}

.case-breadcrumb-nav {
  display: flex;
  align-items: center;
  gap: 10px;
  font-family: var(--font-display);
  font-size: 13px;
  margin-bottom: 24px;
}

.case-back-link {
  color: var(--emerald-aurora);
  display: inline-flex;
  align-items: center;
  gap: 6px;
  text-decoration: none;
  font-weight: 700;
  transition: all 0.2s ease;
}

.case-back-link:hover {
  color: #ffffff;
  transform: translateX(-3px);
}

.breadcrumb-sep {
  color: var(--text-dim);
}

.breadcrumb-curr {
  color: var(--text-sub);
  font-weight: 700;
}

.case-hero-meta-row {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 20px;
}

.case-num-badge {
  font-family: var(--font-display);
  font-size: 11px;
  font-weight: 800;
  color: #03070d;
  background: var(--emerald-aurora);
  padding: 4px 10px;
  border-radius: 9999px;
  letter-spacing: 0.08em;
}

.case-cat-pill {
  font-family: var(--font-display);
  font-size: 11px;
  font-weight: 700;
  color: #ffffff;
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.12);
  padding: 4px 12px;
  border-radius: 9999px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.case-region-pill {
  font-family: var(--font-display);
  font-size: 12px;
  font-weight: 700;
  color: var(--text-sub);
}

.case-detail-title {
  font-size: clamp(32px, 4.5vw, 56px);
  line-height: 1.15;
  color: #ffffff;
  margin: 0 0 16px;
  max-width: 900px;
}

.case-detail-sub {
  font-size: clamp(16px, 1.8vw, 20px);
  color: var(--text-sub);
  line-height: 1.6;
  max-width: 820px;
  margin: 0 0 36px;
}

.case-quick-facts-bar {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 18px;
  background: rgba(255, 255, 255, 0.025);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 18px;
  padding: 20px 24px;
  backdrop-filter: blur(16px);
}

@media (max-width: 992px) {
  .case-quick-facts-bar {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 580px) {
  .case-quick-facts-bar {
    grid-template-columns: 1fr;
  }
}

.quick-fact-item {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.quick-fact-item small {
  font-family: var(--font-display);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.1em;
  color: var(--text-dim);
}

.quick-fact-item strong {
  font-size: 14px;
  color: #ffffff;
}

.quick-fact-doc-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--emerald-aurora);
  font-family: var(--font-display);
  font-size: 13px;
  font-weight: 700;
  text-decoration: none;
  transition: all 0.2s ease;
}

.quick-fact-doc-link:hover {
  color: #ffffff;
  text-decoration: underline;
}

.case-detail-body-container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 60px 24px 100px;
  display: flex;
  flex-direction: column;
  gap: 64px;
}

.case-quote-card {
  position: relative;
  background: linear-gradient(135deg, rgba(0, 229, 153, 0.06) 0%, rgba(10, 24, 38, 0.9) 100%);
  border: 1px solid rgba(0, 229, 153, 0.3);
  border-radius: 24px;
  padding: 40px clamp(24px, 4vw, 48px);
  box-shadow: 0 16px 50px rgba(0, 0, 0, 0.4);
}

.quote-mark {
  position: absolute;
  top: 16px;
  left: 24px;
  font-size: 80px;
  line-height: 1;
  color: rgba(0, 229, 153, 0.15);
  font-family: Georgia, serif;
  pointer-events: none;
}

.quote-text {
  font-size: clamp(17px, 2vw, 22px);
  line-height: 1.6;
  color: #ffffff;
  font-style: italic;
  margin: 0 0 20px;
  position: relative;
  z-index: 1;
}

.quote-author-block {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.quote-author-block strong {
  font-size: 15px;
  color: var(--emerald-aurora);
  font-family: var(--font-display);
}

.quote-author-block span {
  font-size: 13px;
  color: var(--text-sub);
}

.case-section-block {
  display: flex;
  flex-direction: column;
  gap: 28px;
}

.case-block-head h2 {
  font-size: clamp(24px, 3vw, 36px);
  color: #ffffff;
  margin: 10px 0 6px;
}

.case-block-head p {
  font-size: 15px;
  color: var(--text-sub);
  margin: 0;
  max-width: 700px;
}

.case-metrics-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;
}

@media (max-width: 768px) {
  .case-metrics-grid {
    grid-template-columns: 1fr;
  }
}

.metric-delta-card {
  background: rgba(255, 255, 255, 0.02);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 20px;
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  transition: all 0.2s ease;
}

.metric-delta-card:hover {
  border-color: rgba(0, 229, 153, 0.35);
  background: rgba(255, 255, 255, 0.04);
}

.metric-label {
  font-family: var(--font-display);
  font-size: 13px;
  font-weight: 800;
  color: var(--text-dim);
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.delta-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  background: rgba(0, 0, 0, 0.3);
  border-radius: 14px;
  padding: 14px 18px;
}

.before-box,
.after-box {
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.before-box small,
.after-box small {
  font-family: var(--font-display);
  font-size: 9.5px;
  font-weight: 800;
  letter-spacing: 0.1em;
  color: var(--text-dim);
}

.before-box span {
  font-size: 13px;
  color: #ff6b6b;
  text-decoration: line-through;
}

.after-box strong {
  font-size: 16px;
  color: var(--emerald-aurora);
  font-family: var(--font-display);
}

.arrow-sep {
  color: var(--text-dim);
  font-size: 16px;
}

.impact-pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: rgba(0, 229, 153, 0.1);
  border: 1px solid rgba(0, 229, 153, 0.25);
  border-radius: 10px;
  padding: 8px 12px;
  font-size: 13px;
  font-weight: 700;
  color: #ffffff;
  font-family: var(--font-display);
}

.impact-check {
  color: var(--emerald-aurora);
  font-weight: 900;
}

.case-narrative-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
}

@media (max-width: 768px) {
  .case-narrative-grid {
    grid-template-columns: 1fr;
  }
}

.narrative-card {
  border-radius: 22px;
  padding: 32px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.narrative-card.challenge {
  background: linear-gradient(135deg, rgba(255, 75, 75, 0.04) 0%, rgba(18, 12, 14, 0.9) 100%);
  border: 1px solid rgba(255, 75, 75, 0.2);
}

.narrative-card.solution {
  background: linear-gradient(135deg, rgba(0, 229, 153, 0.05) 0%, rgba(6, 20, 26, 0.95) 100%);
  border: 1px solid rgba(0, 229, 153, 0.3);
}

.narrative-badge {
  font-family: var(--font-display);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.1em;
  padding: 4px 10px;
  border-radius: 9999px;
  width: fit-content;
}

.narrative-badge.red {
  background: rgba(255, 75, 75, 0.15);
  color: #ff6b6b;
  border: 1px solid rgba(255, 75, 75, 0.3);
}

.narrative-badge.emerald {
  background: rgba(0, 229, 153, 0.15);
  color: var(--emerald-aurora);
  border: 1px solid rgba(0, 229, 153, 0.3);
}

.narrative-card h3 {
  font-size: 20px;
  color: #ffffff;
  margin: 0;
}

.narrative-card p {
  font-size: 14.5px;
  color: var(--text-sub);
  line-height: 1.65;
  margin: 0;
}

.architecture-tiers-flow {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 20px;
}

.arch-tier-node {
  background: rgba(255, 255, 255, 0.02);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 20px;
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  position: relative;
  transition: all 0.2s ease;
}

.arch-tier-node:hover {
  border-color: var(--emerald-aurora);
  box-shadow: 0 12px 36px rgba(0, 229, 153, 0.12);
}

.arch-tier-header {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.tier-step-num {
  font-family: var(--font-display);
  font-size: 11px;
  font-weight: 800;
  color: var(--emerald-aurora);
}

.tier-badge-label {
  font-family: var(--font-display);
  font-size: 9.5px;
  font-weight: 800;
  letter-spacing: 0.1em;
  color: var(--text-dim);
  background: rgba(255, 255, 255, 0.05);
  padding: 2px 8px;
  border-radius: 4px;
  width: fit-content;
}

.tier-name {
  font-size: 16px;
  color: #ffffff;
  margin: 4px 0 0;
}

.tier-desc {
  font-size: 13px;
  color: var(--text-sub);
  line-height: 1.55;
  margin: 0;
  flex-grow: 1;
}

.tier-tech-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 8px;
}

.tier-tech-pills .tech-pill {
  font-size: 11px;
  font-family: var(--font-display);
  background: rgba(0, 229, 153, 0.08);
  border: 1px solid rgba(0, 229, 153, 0.2);
  color: #ffffff;
  padding: 3px 8px;
  border-radius: 6px;
}

.milestones-timeline-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 16px;
}

.milestone-card {
  background: rgba(255, 255, 255, 0.02);
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 18px;
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.ms-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.ms-phase {
  font-family: var(--font-display);
  font-size: 10px;
  font-weight: 800;
  color: var(--emerald-aurora);
  letter-spacing: 0.08em;
}

.ms-duration {
  font-family: var(--font-display);
  font-size: 11px;
  font-weight: 700;
  color: var(--text-dim);
}

.ms-title {
  font-size: 15px;
  color: #ffffff;
  margin: 0;
}

.ms-outcome {
  font-size: 13px;
  color: var(--text-sub);
  line-height: 1.5;
  margin: 0;
}

.case-bottom-cta-box {
  background: linear-gradient(135deg, rgba(14, 28, 48, 0.95) 0%, rgba(6, 14, 24, 0.98) 100%);
  border: 1px solid rgba(0, 229, 153, 0.35);
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.6);
  border-radius: 24px;
  padding: clamp(24px, 4vw, 40px);
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 28px;
  flex-wrap: wrap;
}

.cta-doc-info {
  display: flex;
  align-items: center;
  gap: 20px;
}

.doc-icon-wrapper {
  width: 56px;
  height: 56px;
  border-radius: 16px;
  background: rgba(0, 229, 153, 0.12);
  border: 1px solid rgba(0, 229, 153, 0.3);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--emerald-aurora);
  font-size: 24px;
  flex-shrink: 0;
}

.doc-label {
  font-family: var(--font-display);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.1em;
  color: var(--emerald-aurora);
  margin-bottom: 4px;
  display: block;
}

.cta-doc-info h4 {
  font-size: 18px;
  color: #ffffff;
  margin: 0 0 4px;
}

.cta-doc-info p {
  font-size: 13.5px;
  color: var(--text-sub);
  margin: 0;
}

.cta-btn-group {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}

/* ==========================================================================
   22. LIVE PLATFORM TELEMETRY & SYSTEM STATUS HUB
   ========================================================================== */
.status-page-container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 40px 24px 100px;
  display: flex;
  flex-direction: column;
  gap: 56px;
}

.status-hero-card {
  background: linear-gradient(135deg, rgba(14, 28, 48, 0.95) 0%, rgba(6, 14, 24, 0.98) 100%);
  border: 1px solid rgba(0, 229, 153, 0.35);
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.6);
  border-radius: 28px;
  padding: clamp(24px, 4vw, 44px);
  backdrop-filter: blur(20px);
}

.status-indicator-badge {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 6px 14px;
  border-radius: 9999px;
  font-family: var(--font-display);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.1em;
  margin-bottom: 16px;
}

.status-indicator-badge.operational {
  background: rgba(0, 229, 153, 0.12);
  border: 1px solid rgba(0, 229, 153, 0.4);
  color: var(--emerald-aurora);
}

.live-pulsing-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--emerald-aurora);
  box-shadow: 0 0 10px rgba(0, 229, 153, 0.9);
  animation: liveBeaconPulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}

@keyframes liveBeaconPulse {
  0%, 100% {
    transform: scale(1);
    opacity: 1;
  }
  50% {
    transform: scale(1.4);
    opacity: 0.5;
  }
}

.status-heading {
  font-size: clamp(26px, 3.5vw, 42px);
  color: #ffffff;
  margin: 0 0 12px;
  line-height: 1.2;
}

.status-intro-text {
  font-size: 15px;
  color: var(--text-sub);
  line-height: 1.6;
  max-width: 800px;
  margin: 0 0 36px;
}

.status-kpis-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 18px;
  background: rgba(255, 255, 255, 0.02);
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 20px;
  padding: 20px 24px;
}

@media (max-width: 900px) {
  .status-kpis-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 540px) {
  .status-kpis-grid {
    grid-template-columns: 1fr;
  }
}

.status-kpi-item {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.status-kpi-item small {
  font-family: var(--font-display);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.1em;
  color: var(--text-dim);
}

.status-kpi-item strong {
  font-family: var(--font-display);
  font-size: clamp(22px, 2.5vw, 32px);
  color: #ffffff;
  line-height: 1.15;
}

.status-kpi-item strong.emerald-highlight {
  color: var(--emerald-aurora);
  text-shadow: 0 0 14px rgba(0, 229, 153, 0.4);
}

.status-kpi-item span {
  font-size: 12px;
  color: var(--text-sub);
}

.status-block-wrapper {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.status-block-head h3 {
  font-size: clamp(22px, 2.6vw, 32px);
  color: #ffffff;
  margin: 8px 0 4px;
}

.status-block-head p {
  font-size: 14.5px;
  color: var(--text-sub);
  margin: 0;
  max-width: 700px;
}

.system-nodes-list {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.system-node-card {
  background: rgba(255, 255, 255, 0.02);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 20px;
  padding: 24px clamp(18px, 3vw, 28px);
  display: flex;
  flex-direction: column;
  gap: 14px;
  transition: all 0.2s ease;
}

.system-node-card:hover {
  border-color: rgba(0, 229, 153, 0.3);
  background: rgba(255, 255, 255, 0.035);
}

.node-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 16px;
  flex-wrap: wrap;
}

.node-category {
  font-family: var(--font-display);
  font-size: 9.5px;
  font-weight: 800;
  letter-spacing: 0.1em;
  color: var(--text-dim);
  display: block;
  margin-bottom: 4px;
}

.node-name {
  font-size: 17px;
  color: #ffffff;
  margin: 0;
}

.node-status-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: rgba(0, 229, 153, 0.1);
  border: 1px solid rgba(0, 229, 153, 0.25);
  color: var(--emerald-aurora);
  padding: 4px 10px;
  border-radius: 9999px;
  font-family: var(--font-display);
  font-size: 11px;
  font-weight: 700;
}

.mini-green-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--emerald-aurora);
}

.node-desc {
  font-size: 13.5px;
  color: var(--text-sub);
  line-height: 1.5;
  margin: 0;
}

.node-uptime-row {
  display: flex;
  flex-direction: column;
  gap: 8px;
  background: rgba(0, 0, 0, 0.25);
  border-radius: 12px;
  padding: 12px 16px;
}

.uptime-bar-label {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-family: var(--font-display);
  font-size: 11px;
  color: var(--text-dim);
}

.uptime-bar-label .uptime-pct {
  color: var(--emerald-aurora);
  font-weight: 800;
}

.uptime-ticks-container {
  display: grid;
  grid-template-columns: repeat(45, 1fr);
  gap: 3px;
  height: 24px;
  align-items: center;
}

.uptime-tick-bar {
  height: 100%;
  border-radius: 2px;
  transition: opacity 0.15s ease;
}

.uptime-tick-bar.operational {
  background: var(--emerald-aurora);
  opacity: 0.85;
}

.uptime-tick-bar:hover {
  opacity: 1;
  transform: scaleY(1.15);
}

.regional-latency-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 16px;
}

.latency-region-card {
  background: rgba(255, 255, 255, 0.02);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 16px;
  padding: 18px 20px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
}

.region-meta {
  display: flex;
  align-items: center;
  gap: 10px;
}

.region-flag {
  font-size: 20px;
}

.region-name {
  font-size: 13.5px;
  color: #ffffff;
  font-family: var(--font-display);
}

.latency-val-block {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 2px;
}

.latency-num {
  font-family: var(--font-display);
  font-size: 16px;
  font-weight: 800;
  color: var(--emerald-aurora);
}

.latency-status-tag {
  font-size: 10px;
  font-family: var(--font-display);
  color: var(--text-dim);
  text-transform: uppercase;
}

.maintenance-logs-list {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.maintenance-log-card {
  background: rgba(255, 255, 255, 0.02);
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 16px;
  padding: 18px 22px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.log-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.log-date {
  font-family: var(--font-display);
  font-size: 11px;
  font-weight: 700;
  color: var(--text-dim);
}

.log-impact-badge {
  font-family: var(--font-display);
  font-size: 10px;
  font-weight: 800;
  color: #03070d;
  background: var(--emerald-aurora);
  padding: 2px 8px;
  border-radius: 4px;
}

.log-title {
  font-size: 15px;
  color: #ffffff;
  margin: 2px 0 0;
}

.log-details {
  font-size: 13px;
  color: var(--text-sub);
  line-height: 1.5;
  margin: 0;
}

.status-footer-cta {
  background: linear-gradient(135deg, rgba(14, 28, 48, 0.95) 0%, rgba(6, 14, 24, 0.98) 100%);
  border: 1px solid rgba(0, 229, 153, 0.35);
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.6);
  border-radius: 24px;
  padding: clamp(24px, 4vw, 40px);
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 28px;
  flex-wrap: wrap;
}

.status-cta-text h4 {
  font-size: 20px;
  color: #ffffff;
  margin: 0 0 6px;
}

.status-cta-text p {
  font-size: 14px;
  color: var(--text-sub);
  margin: 0;
  max-width: 620px;
}

.status-cta-actions {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}

/* ==========================================================================
   23. INTERACTIVE 1-MINUTE ARCHITECTURE BLUEPRINT BUILDER
   ========================================================================== */
.blueprint-builder-section {
  margin: 60px 0 80px;
  width: 100%;
}

.blueprint-builder-card {
  background: linear-gradient(135deg, rgba(14, 28, 48, 0.95) 0%, rgba(6, 14, 24, 0.98) 100%);
  border: 1px solid rgba(0, 229, 153, 0.35);
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.6), inset 0 1px 0 rgba(255, 255, 255, 0.15);
  border-radius: 28px;
  padding: clamp(24px, 4vw, 44px);
  backdrop-filter: blur(20px);
}

.blueprint-header-row {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 28px;
  margin-bottom: 36px;
  padding-bottom: 28px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  flex-wrap: wrap;
}

.blueprint-heading {
  font-size: clamp(24px, 2.8vw, 36px);
  color: #ffffff;
  margin: 10px 0 8px;
  line-height: 1.25;
}

.blueprint-subtext {
  font-size: 15px;
  color: var(--text-sub);
  margin: 0;
  max-width: 680px;
  line-height: 1.6;
}

.blueprint-summary-badge {
  background: rgba(0, 229, 153, 0.12);
  border: 1px solid rgba(0, 229, 153, 0.4);
  border-radius: 18px;
  padding: 16px 24px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  flex-shrink: 0;
  box-shadow: 0 8px 24px rgba(0, 229, 153, 0.15);
}

.blueprint-summary-badge small {
  font-family: var(--font-display);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.12em;
  color: var(--emerald-aurora);
  margin-bottom: 4px;
}

.blueprint-summary-badge strong {
  font-size: clamp(24px, 2.8vw, 32px);
  color: #ffffff;
  font-family: var(--font-display);
  font-weight: 800;
  line-height: 1.1;
  text-shadow: 0 0 16px rgba(0, 229, 153, 0.4);
}

.blueprint-summary-badge span {
  font-size: 12px;
  color: var(--text-sub);
  margin-top: 4px;
}

.blueprint-configurator-layout {
  display: grid;
  grid-template-columns: 1.25fr 1fr;
  gap: 36px;
}

@media (max-width: 1024px) {
  .blueprint-configurator-layout {
    grid-template-columns: 1fr;
  }
}

.blueprint-selectors-column {
  display: flex;
  flex-direction: column;
  gap: 28px;
}

.layer-group {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.layer-step-tag {
  font-family: var(--font-display);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.1em;
  color: var(--text-dim);
  text-transform: uppercase;
}

.options-selector-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 12px;
}

.blueprint-option-btn {
  background: rgba(255, 255, 255, 0.025);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 16px;
  padding: 16px 18px;
  text-align: left;
  cursor: pointer;
  transition: all 0.2s ease;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.blueprint-option-btn:hover {
  background: rgba(255, 255, 255, 0.06);
  border-color: rgba(0, 229, 153, 0.3);
}

.blueprint-option-btn.active {
  background: rgba(0, 229, 153, 0.09);
  border-color: var(--emerald-aurora);
  box-shadow: 0 0 18px rgba(0, 229, 153, 0.15);
}

.opt-cat {
  font-family: var(--font-display);
  font-size: 9.5px;
  font-weight: 800;
  letter-spacing: 0.1em;
  color: var(--emerald-aurora);
}

.opt-name {
  font-size: 14.5px;
  color: #ffffff;
  font-family: var(--font-display);
}

.opt-desc {
  font-size: 12px;
  color: var(--text-sub);
  line-height: 1.45;
  margin: 0;
}

.opt-check-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.checked-indicator {
  color: #03070d;
  background: var(--emerald-aurora);
  font-size: 10px;
  font-weight: 900;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.blueprint-canvas-column {
  display: flex;
  flex-direction: column;
}

.live-topology-card {
  background: rgba(255, 255, 255, 0.02);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 24px;
  padding: 28px;
  display: flex;
  flex-direction: column;
  gap: 24px;
  position: sticky;
  top: 100px;
}

.topology-card-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.live-active-tag {
  font-family: var(--font-display);
  font-size: 10.5px;
  font-weight: 800;
  color: var(--emerald-aurora);
  letter-spacing: 0.08em;
}

.topology-node-chain {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.topology-node {
  background: rgba(0, 0, 0, 0.35);
  border: 1px solid rgba(0, 229, 153, 0.25);
  border-radius: 16px;
  padding: 16px 18px;
  display: flex;
  align-items: center;
  gap: 16px;
  transition: all 0.2s ease;
}

.topology-node:hover {
  border-color: var(--emerald-aurora);
  box-shadow: 0 4px 18px rgba(0, 229, 153, 0.15);
}

.topology-node.integrations-node {
  border-color: rgba(255, 255, 255, 0.15);
}

.node-icon-box {
  font-size: 24px;
  flex-shrink: 0;
}

.node-details {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.node-details small {
  font-family: var(--font-display);
  font-size: 9.5px;
  font-weight: 800;
  letter-spacing: 0.1em;
  color: var(--text-dim);
}

.node-details strong {
  font-size: 14.5px;
  color: #ffffff;
  font-family: var(--font-display);
}

.tech-badge {
  font-size: 11.5px;
  color: var(--emerald-aurora);
}

.topology-connector-arrow {
  text-align: center;
  font-family: var(--font-display);
  font-size: 11px;
  color: var(--text-dim);
  font-weight: 700;
  padding: 2px 0;
}

.blueprint-investment-box {
  background: linear-gradient(135deg, rgba(0, 229, 153, 0.08) 0%, rgba(6, 20, 28, 0.95) 100%);
  border: 1px solid rgba(0, 229, 153, 0.35);
  border-radius: 18px;
  padding: 22px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.investment-header-row {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 16px;
  flex-wrap: wrap;
}

.investment-header-row small {
  font-family: var(--font-display);
  font-size: 9.5px;
  font-weight: 800;
  letter-spacing: 0.1em;
  color: var(--text-dim);
  display: block;
  margin-bottom: 4px;
}

.investment-header-row strong.emerald-highlight {
  font-family: var(--font-display);
  font-size: 22px;
  color: var(--emerald-aurora);
  text-shadow: 0 0 12px rgba(0, 229, 153, 0.4);
}

.investment-header-row strong.white-highlight {
  font-family: var(--font-display);
  font-size: 20px;
  color: #ffffff;
}

.blueprint-features-list {
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-size: 12.5px;
  color: var(--text-sub);
}

.blueprint-features-list div {
  display: flex;
  align-items: center;
  gap: 8px;
}

.blueprint-features-list div svg {
  color: var(--emerald-aurora);
  width: 14px;
  height: 14px;
}

.blueprint-actions-grid {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-top: 6px;
}

/* ==========================================================================
   24. REGIONAL CURRENCY & LOCATION SWITCHER
   ========================================================================== */
.currency-switcher-wrapper {
  position: relative;
  display: inline-block;
}

.currency-switcher-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 9999px;
  padding: 6px 12px;
  cursor: pointer;
  transition: all 0.2s ease;
  color: #ffffff;
  font-family: var(--font-display);
  font-size: 11.5px;
  font-weight: 700;
}

.currency-switcher-btn:hover {
  background: rgba(0, 229, 153, 0.1);
  border-color: rgba(0, 229, 153, 0.35);
  color: var(--emerald-aurora);
}

.curr-flag {
  font-size: 13px;
  line-height: 1;
}

.curr-code {
  letter-spacing: 0.05em;
}

.curr-arrow {
  font-size: 8px;
  color: var(--text-dim);
}

.currency-dropdown-menu {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  width: 280px;
  background: rgba(6, 14, 24, 0.96);
  border: 1px solid rgba(0, 229, 153, 0.3);
  box-shadow: 0 16px 45px rgba(0, 0, 0, 0.8), 0 0 20px rgba(0, 229, 153, 0.12);
  border-radius: 16px;
  padding: 10px;
  z-index: 1000;
  backdrop-filter: blur(24px);
  animation: dropdownFadeIn 0.15s ease-out;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

@keyframes dropdownFadeIn {
  from {
    opacity: 0;
    transform: translateY(-6px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.dropdown-title {
  font-family: var(--font-display);
  font-size: 9.5px;
  font-weight: 800;
  letter-spacing: 0.1em;
  color: var(--text-dim);
  padding: 6px 10px 4px;
}

.currency-menu-item {
  display: flex;
  align-items: center;
  gap: 12px;
  background: transparent;
  border: none;
  border-radius: 10px;
  padding: 8px 10px;
  cursor: pointer;
  text-align: left;
  transition: all 0.15s ease;
  width: 100%;
}

.currency-menu-item:hover {
  background: rgba(0, 229, 153, 0.08);
}

.currency-menu-item.active {
  background: rgba(0, 229, 153, 0.14);
  border: 1px solid rgba(0, 229, 153, 0.3);
}

.menu-flag {
  font-size: 20px;
}

.menu-labels {
  display: flex;
  flex-direction: column;
  flex-grow: 1;
}

.menu-labels strong {
  font-size: 13px;
  color: #ffffff;
  font-family: var(--font-display);
}

.menu-labels small {
  font-size: 11px;
  color: var(--text-sub);
}

.menu-check {
  color: var(--emerald-aurora);
  font-weight: 800;
  font-size: 13px;
}

/* Pricing Page Currency Switcher Header */
.pricing-tiers-wrapper {
  display: flex;
  flex-direction: column;
  gap: 32px;
}

.pricing-currency-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
  background: rgba(255, 255, 255, 0.02);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 16px;
  padding: 12px 20px;
}

.currency-pills-bar {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.currency-bar-label {
  font-family: var(--font-display);
  font-size: 10.5px;
  font-weight: 800;
  letter-spacing: 0.1em;
  color: var(--text-dim);
  margin-right: 4px;
}

.currency-pill-btn {
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.1);
  color: var(--text-sub);
  border-radius: 9999px;
  padding: 6px 14px;
  font-family: var(--font-display);
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
  transition: all 0.2s ease;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.currency-pill-btn:hover {
  background: rgba(255, 255, 255, 0.08);
  color: #ffffff;
}

.currency-pill-btn.active {
  background: rgba(0, 229, 153, 0.14);
  border-color: var(--emerald-aurora);
  color: var(--emerald-aurora);
  box-shadow: 0 0 12px rgba(0, 229, 153, 0.25);
}

.regional-office-indicator {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 12.5px;
}

.office-flag {
  font-size: 16px;
}

.office-region {
  font-family: var(--font-display);
  font-weight: 700;
  color: #ffffff;
}

.office-note {
  color: var(--text-sub);
}

/* ==========================================================================
   25. TECHNICAL INSIGHTS & THOUGHT LEADERSHIP HUB
   ========================================================================== */
.insights-page-container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 20px 24px 100px;
  display: flex;
  flex-direction: column;
  gap: 40px;
}

.insights-filter-bar {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  padding-bottom: 20px;
}

.insight-filter-btn {
  background: rgba(255, 255, 255, 0.02);
  border: 1px solid rgba(255, 255, 255, 0.08);
  color: var(--text-sub);
  padding: 8px 16px;
  border-radius: 9999px;
  font-family: var(--font-display);
  font-size: 11.5px;
  font-weight: 700;
  cursor: pointer;
  transition: all 0.2s ease;
}

.insight-filter-btn:hover {
  background: rgba(255, 255, 255, 0.06);
  color: #ffffff;
}

.insight-filter-btn.active {
  background: rgba(0, 229, 153, 0.12);
  border-color: var(--emerald-aurora);
  color: var(--emerald-aurora);
  box-shadow: 0 0 12px rgba(0, 229, 153, 0.2);
}

.insights-articles-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
  gap: 24px;
}

@media (max-width: 768px) {
  .insights-articles-grid {
    grid-template-columns: 1fr;
  }
}

.insight-card {
  background: linear-gradient(135deg, rgba(14, 28, 48, 0.95) 0%, rgba(6, 14, 24, 0.98) 100%);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 24px;
  padding: clamp(22px, 3vw, 32px);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 16px;
  cursor: pointer;
  transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.4);
}

.insight-card:hover {
  border-color: rgba(0, 229, 153, 0.4);
  transform: translateY(-4px);
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.6), 0 0 30px rgba(0, 229, 153, 0.15);
}

.insight-card.featured-card {
  border-color: rgba(0, 229, 153, 0.35);
  background: linear-gradient(135deg, rgba(16, 36, 60, 0.95) 0%, rgba(6, 16, 28, 0.98) 100%);
  grid-column: 1 / -1;
}

.insight-card-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
}

.insight-category-tag {
  font-family: var(--font-display);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.1em;
  color: var(--emerald-aurora);
  background: rgba(0, 229, 153, 0.08);
  border: 1px solid rgba(0, 229, 153, 0.25);
  padding: 4px 10px;
  border-radius: 6px;
}

.insight-read-time {
  font-family: var(--font-display);
  font-size: 11px;
  color: var(--text-dim);
  font-weight: 700;
}

.insight-title-btn {
  background: transparent;
  border: none;
  padding: 0;
  text-align: left;
  cursor: pointer;
  width: 100%;
}

.insight-card-title {
  font-size: clamp(18px, 2.2vw, 24px);
  color: #ffffff;
  margin: 0;
  line-height: 1.3;
  transition: color 0.2s ease;
}

.insight-title-btn:hover .insight-card-title {
  color: var(--emerald-aurora);
}

.insight-card.featured-card .insight-card-title {
  font-size: clamp(22px, 2.6vw, 30px);
}

.insight-card-summary {
  font-size: 14px;
  color: var(--text-sub);
  line-height: 1.6;
  margin: 0;
  flex-grow: 1;
}

.insight-tags-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 4px 0 8px;
}

.insight-mini-tag {
  font-family: var(--font-display);
  font-size: 10.5px;
  color: var(--text-dim);
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.06);
  padding: 2px 8px;
  border-radius: 4px;
}

.insight-card-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  padding-top: 16px;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
  flex-wrap: wrap;
}

.insight-author-meta {
  display: flex;
  align-items: center;
  gap: 10px;
}

.author-avatar {
  font-size: 20px;
}

.insight-author-meta div {
  display: flex;
  flex-direction: column;
}

.insight-author-meta strong {
  font-size: 12.5px;
  color: #ffffff;
  font-family: var(--font-display);
}

.insight-author-meta small {
  font-size: 11px;
  color: var(--text-dim);
}

.insight-read-btn {
  background: transparent;
  border: none;
  color: var(--emerald-aurora);
  font-family: var(--font-display);
  font-size: 12px;
  font-weight: 800;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  cursor: pointer;
  transition: gap 0.2s ease;
  padding: 0;
}

.insight-read-btn:hover {
  gap: 10px;
  text-decoration: underline;
}

/* ==========================================================================
   ARTICLE MODAL READER
   ========================================================================== */
.article-modal-overlay {
  position: fixed;
  inset: 0;
  background: rgba(3, 7, 13, 0.88);
  backdrop-filter: blur(16px);
  z-index: 10000;
  display: flex;
  justify-content: center;
  align-items: flex-start;
  padding: clamp(20px, 4vw, 60px) 16px;
  overflow-y: auto;
}

.article-modal-container {
  background: linear-gradient(135deg, rgba(14, 28, 48, 0.98) 0%, rgba(6, 14, 24, 0.99) 100%);
  border: 1px solid rgba(0, 229, 153, 0.35);
  box-shadow: 0 30px 90px rgba(0, 0, 0, 0.9), 0 0 40px rgba(0, 229, 153, 0.15);
  border-radius: 28px;
  max-width: 860px;
  width: 100%;
  padding: clamp(24px, 4vw, 48px);
  display: flex;
  flex-direction: column;
  gap: 28px;
  position: relative;
  animation: modalSlideUp 0.25s cubic-bezier(0.16, 1, 0.3, 1);
}

@keyframes modalSlideUp {
  from {
    opacity: 0;
    transform: translateY(24px) scale(0.98);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

.article-modal-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.modal-close-btn {
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.12);
  color: #ffffff;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  transition: all 0.2s ease;
}

.modal-close-btn:hover {
  background: rgba(255, 255, 255, 0.15);
  color: var(--emerald-aurora);
}

.article-modal-title {
  font-size: clamp(24px, 3.2vw, 36px);
  color: #ffffff;
  line-height: 1.25;
  margin: 0;
}

.article-modal-author-bar {
  display: flex;
  align-items: center;
  gap: 14px;
  padding-bottom: 20px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.author-avatar-lg {
  font-size: 28px;
}

.article-modal-author-bar div {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.article-modal-author-bar strong {
  font-size: 14px;
  color: #ffffff;
  font-family: var(--font-display);
}

.article-modal-author-bar span {
  font-size: 12px;
  color: var(--text-dim);
}

.article-modal-body {
  display: flex;
  flex-direction: column;
  gap: 28px;
}

.article-lead-paragraph {
  font-size: 16px;
  color: #ffffff;
  line-height: 1.7;
  font-style: italic;
  border-left: 3px solid var(--emerald-aurora);
  padding-left: 18px;
  margin: 0;
}

.article-content-section {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.article-content-section h3 {
  font-size: clamp(18px, 2.2vw, 22px);
  color: #ffffff;
  margin: 12px 0 0;
}

.article-content-section p {
  font-size: 14.5px;
  color: var(--text-sub);
  line-height: 1.7;
  margin: 0;
}

.article-takeaways-box {
  background: rgba(0, 229, 153, 0.06);
  border: 1px solid rgba(0, 229, 153, 0.25);
  border-radius: 16px;
  padding: 18px 22px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin: 8px 0;
}

.takeaways-title {
  font-family: var(--font-display);
  font-size: 10.5px;
  font-weight: 800;
  letter-spacing: 0.1em;
  color: var(--emerald-aurora);
}

.article-takeaways-box ul {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.article-takeaways-box li {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: 13.5px;
  color: #ffffff;
  line-height: 1.5;
}

.article-takeaways-box li svg {
  color: var(--emerald-aurora);
  width: 14px;
  height: 14px;
  flex-shrink: 0;
  margin-top: 2px;
}

.article-code-wrapper {
  background: #02060b;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 14px;
  overflow: hidden;
  margin: 8px 0;
}

.code-header {
  background: rgba(255, 255, 255, 0.03);
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  padding: 8px 16px;
  font-family: var(--font-mono);
  font-size: 10.5px;
  font-weight: 700;
  color: var(--text-dim);
  letter-spacing: 0.05em;
}

.article-code-block {
  padding: 16px;
  margin: 0;
  overflow-x: auto;
}

.article-code-block code {
  font-family: var(--font-mono);
  font-size: 12.5px;
  color: var(--emerald-aurora);
  line-height: 1.55;
}

.article-modal-footer-cta {
  background: rgba(255, 255, 255, 0.02);
  border: 1px solid rgba(0, 229, 153, 0.3);
  border-radius: 20px;
  padding: 24px clamp(18px, 3vw, 28px);
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 20px;
  flex-wrap: wrap;
  margin-top: 12px;
}

.article-modal-footer-cta h4 {
  font-size: 17px;
  color: #ffffff;
  margin: 0 0 4px;
}

.article-modal-footer-cta p {
  font-size: 13.5px;
  color: var(--text-sub);
  margin: 0;
}

.article-footer-btns {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

/* ==========================================================================
   26. PRODUCT ACCELERATORS SUITE & INTERACTIVE SANDBOXES
   ========================================================================== */
.products-overview-section {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 24px 80px;
}

.products-grid-catalog {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(360px, 1fr));
  gap: 28px;
}

@media (max-width: 768px) {
  .products-grid-catalog {
    grid-template-columns: 1fr;
  }
}

.product-catalog-card {
  background: linear-gradient(135deg, rgba(14, 28, 48, 0.95) 0%, rgba(6, 14, 24, 0.98) 100%);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 28px;
  padding: clamp(24px, 3.5vw, 36px);
  display: flex;
  flex-direction: column;
  gap: 20px;
  transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.4);
}

.product-catalog-card:hover {
  border-color: rgba(0, 229, 153, 0.4);
  transform: translateY(-4px);
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.6), 0 0 30px rgba(0, 229, 153, 0.15);
}

.card-top-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}

.prod-badge {
  font-family: var(--font-display);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.1em;
  color: var(--emerald-aurora);
  background: rgba(0, 229, 153, 0.08);
  border: 1px solid rgba(0, 229, 153, 0.25);
  padding: 4px 10px;
  border-radius: 6px;
}

.single-tenant-pill {
  font-family: var(--font-mono);
  font-size: 10px;
  font-weight: 700;
  color: var(--text-dim);
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.06);
  padding: 3px 8px;
  border-radius: 4px;
}

.prod-name {
  font-size: clamp(24px, 2.8vw, 32px);
  color: #ffffff;
  margin: 0;
  line-height: 1.2;
}

.prod-tagline {
  font-size: 14.5px;
  font-weight: 600;
  color: var(--emerald-aurora);
  margin: 0;
  line-height: 1.4;
}

.prod-summary {
  font-size: 13.5px;
  color: var(--text-sub);
  line-height: 1.6;
  margin: 0;
  flex-grow: 1;
}

.prod-metrics-strip {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  padding: 14px 16px;
  background: rgba(0, 0, 0, 0.3);
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 14px;
}

.prod-metric-box {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.metric-val {
  font-family: var(--font-display);
  font-size: 20px;
  font-weight: 800;
  color: var(--emerald-aurora);
}

.metric-lbl {
  font-size: 10px;
  color: var(--text-dim);
  font-weight: 700;
  letter-spacing: 0.05em;
}

.prod-benefits-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.prod-benefit-item {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: 13px;
  color: var(--text-sub);
  line-height: 1.45;
}

.prod-benefit-item svg {
  color: var(--emerald-aurora);
  width: 14px;
  height: 14px;
  flex-shrink: 0;
  margin-top: 2px;
}

.prod-card-actions {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-top: 6px;
}

.product-enterprise-banner {
  max-width: 1280px;
  margin: 0 auto 80px;
  padding: 0 24px;
}

.banner-content-box {
  background: linear-gradient(135deg, rgba(16, 36, 60, 0.95) 0%, rgba(6, 16, 28, 0.98) 100%);
  border: 1px solid rgba(0, 229, 153, 0.35);
  border-radius: 28px;
  padding: clamp(28px, 4vw, 56px);
  display: flex;
  flex-direction: column;
  gap: 18px;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.6);
}

.banner-btn-group {
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
  margin-top: 10px;
}

/* ==========================================================================
   PRODUCT DETAIL HERO & SPECIFICATIONS
   ========================================================================== */
.product-hero-meta-strip {
  display: flex;
  gap: 24px;
  flex-wrap: wrap;
  margin-top: 16px;
  padding-top: 20px;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.hero-meta-item {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.hero-meta-item small {
  font-family: var(--font-display);
  font-size: 10px;
  font-weight: 800;
  color: var(--text-dim);
  letter-spacing: 0.1em;
}

.hero-meta-item strong {
  font-size: 13.5px;
  color: #ffffff;
}

.product-kpis-section {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 24px 50px;
}

.kpis-inner-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 20px;
}

.kpi-block-card {
  background: rgba(14, 28, 48, 0.8);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 20px;
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.kpi-value-text {
  font-family: var(--font-display);
  font-size: clamp(28px, 3.5vw, 38px);
  font-weight: 800;
  color: var(--emerald-aurora);
  line-height: 1.1;
}

.kpi-label-text {
  font-family: var(--font-display);
  font-size: 11.5px;
  font-weight: 800;
  color: #ffffff;
  letter-spacing: 0.05em;
  margin-top: 6px;
}

.kpi-sub-text {
  font-size: 12px;
  color: var(--text-dim);
}

.product-interactive-sandbox-section {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 24px 80px;
}

.sandbox-wrapper-container {
  width: 100%;
}

.product-architecture-specs-section {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 24px 80px;
}

.specs-head {
  max-width: 760px;
  margin-bottom: 36px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.specs-layers-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 20px;
}

.spec-layer-card {
  background: rgba(14, 28, 48, 0.85);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 20px;
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.layer-tag {
  font-family: var(--font-mono);
  font-size: 10px;
  font-weight: 700;
  color: var(--emerald-aurora);
  letter-spacing: 0.05em;
}

.spec-layer-card h3 {
  font-size: 18px;
  color: #ffffff;
  margin: 0;
}

.spec-layer-card p {
  font-size: 13px;
  color: var(--text-sub);
  line-height: 1.5;
  margin: 0;
}

.product-features-section {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 24px 80px;
}

.features-inner-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
}

@media (max-width: 860px) {
  .features-inner-grid {
    grid-template-columns: 1fr;
  }
}

.features-intro-col {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.compliance-pills-row {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: 16px;
}

.comp-label {
  font-family: var(--font-display);
  font-size: 10.5px;
  font-weight: 800;
  letter-spacing: 0.1em;
  color: var(--text-dim);
}

.comp-pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: #ffffff;
}

.comp-pill svg {
  color: var(--emerald-aurora);
  width: 14px;
  height: 14px;
}

.features-cards-col {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.product-feature-card {
  background: rgba(14, 28, 48, 0.85);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 18px;
  padding: 22px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.product-feature-card h4 {
  font-size: 16px;
  color: #ffffff;
  margin: 0;
}

.product-feature-card p {
  font-size: 13.5px;
  color: var(--text-sub);
  line-height: 1.5;
  margin: 0;
}

.product-detail-cta-banner {
  max-width: 1280px;
  margin: 0 auto 100px;
  padding: 0 24px;
}

.cta-banner-card {
  background: linear-gradient(135deg, rgba(16, 36, 60, 0.95) 0%, rgba(6, 16, 28, 0.98) 100%);
  border: 1px solid rgba(0, 229, 153, 0.35);
  border-radius: 28px;
  padding: clamp(28px, 4vw, 48px);
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 32px;
  flex-wrap: wrap;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.6);
}

.cta-action-buttons {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}

/* ==========================================================================
   INTERACTIVE DEMO SANDBOXES SHARED STYLES
   ========================================================================== */
.product-demo-sandbox {
  background: linear-gradient(135deg, rgba(10, 22, 38, 0.98) 0%, rgba(4, 10, 18, 0.99) 100%);
  border: 1px solid rgba(0, 229, 153, 0.3);
  border-radius: 28px;
  padding: clamp(20px, 3vw, 36px);
  display: flex;
  flex-direction: column;
  gap: 28px;
  box-shadow: 0 25px 80px rgba(0, 0, 0, 0.8), 0 0 40px rgba(0, 229, 153, 0.1);
}

.demo-header-bar {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 20px;
  flex-wrap: wrap;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  padding-bottom: 20px;
}

.demo-title-group {
  display: flex;
  flex-direction: column;
  gap: 8px;
  max-width: 700px;
}

.demo-badge {
  font-family: var(--font-display);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.1em;
  color: var(--emerald-aurora);
}

.demo-title-group h3 {
  font-size: clamp(20px, 2.5vw, 26px);
  color: #ffffff;
  margin: 0;
}

.demo-title-group p {
  font-size: 13.5px;
  color: var(--text-sub);
  margin: 0;
  line-height: 1.5;
}

.sample-selector-pills {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.sample-label {
  font-family: var(--font-display);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.08em;
  color: var(--text-dim);
}

.sample-pill-btn {
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.1);
  color: var(--text-sub);
  padding: 6px 14px;
  border-radius: 9999px;
  font-family: var(--font-display);
  font-size: 11.5px;
  font-weight: 700;
  cursor: pointer;
  transition: all 0.2s ease;
}

.sample-pill-btn:hover {
  background: rgba(255, 255, 255, 0.08);
  color: #ffffff;
}

.sample-pill-btn.active {
  background: rgba(0, 229, 153, 0.14);
  border-color: var(--emerald-aurora);
  color: var(--emerald-aurora);
  box-shadow: 0 0 12px rgba(0, 229, 153, 0.25);
}

.demo-workspace-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
}

@media (max-width: 900px) {
  .demo-workspace-grid {
    grid-template-columns: 1fr;
  }
}

/* ==========================================================================
   DOCUVAULT STYLES
   ========================================================================== */
.doc-scanner-canvas {
  background: #040a12;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 20px;
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  position: relative;
}

.scanner-top-bar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 12px;
}

.scanner-file-name {
  font-family: var(--font-mono);
  color: #ffffff;
}

.scanner-status-tag {
  font-family: var(--font-display);
  font-size: 10px;
  font-weight: 800;
  color: var(--emerald-aurora);
  letter-spacing: 0.05em;
}

.doc-preview-wrapper {
  background: #ffffff;
  color: #111827;
  border-radius: 12px;
  padding: 20px;
  position: relative;
  overflow: hidden;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
}

.scanning-laser-beam {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 4px;
  background: var(--emerald-aurora);
  box-shadow: 0 0 16px var(--emerald-aurora);
  animation: scanLaser 1.5s ease-in-out infinite alternate;
  z-index: 10;
}

@keyframes scanLaser {
  0% { transform: translateY(0); }
  100% { transform: translateY(300px); }
}

.mock-invoice-paper {
  display: flex;
  flex-direction: column;
  gap: 12px;
  font-size: 11.5px;
}

.mock-inv-head {
  display: flex;
  justify-content: space-between;
  border-bottom: 2px solid #e5e7eb;
  padding-bottom: 8px;
}

.mock-inv-head h4 {
  font-size: 13.5px;
  margin: 0 0 2px;
  color: #111827;
}

.mock-inv-meta {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
}

.mock-inv-po-row {
  display: flex;
  justify-content: space-between;
  font-size: 11px;
  color: #4b5563;
}

.mock-inv-table {
  display: flex;
  flex-direction: column;
  border: 1px solid #e5e7eb;
  border-radius: 6px;
  overflow: hidden;
}

.mock-table-head {
  background: #f3f4f6;
  display: grid;
  grid-template-columns: 2fr 1fr 1fr;
  padding: 6px 10px;
  font-weight: 700;
  font-size: 10.5px;
}

.mock-table-row {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr;
  padding: 6px 10px;
  border-top: 1px solid #f3f4f6;
}

.mock-inv-total-box {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 3px;
  padding-top: 6px;
}

.mock-total-line {
  display: flex;
  gap: 20px;
}

.mock-total-line.grand {
  font-size: 13px;
  border-top: 1px solid #111827;
  padding-top: 4px;
}

.zero-retention-strip {
  display: flex;
  align-items: center;
  gap: 10px;
  background: rgba(0, 229, 153, 0.08);
  border: 1px solid rgba(0, 229, 153, 0.25);
  border-radius: 12px;
  padding: 10px 14px;
}

.guard-icon {
  font-size: 18px;
}

.zero-retention-strip strong {
  font-size: 12px;
  color: var(--emerald-aurora);
}

.zero-retention-strip p {
  font-size: 11px;
  color: var(--text-sub);
  margin: 0;
}

.doc-extracted-panel {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.panel-tab-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.panel-tab-title {
  font-family: var(--font-display);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.08em;
  color: #ffffff;
}

.zod-badge {
  font-family: var(--font-mono);
  font-size: 10px;
  font-weight: 700;
  color: var(--emerald-aurora);
  background: rgba(0, 229, 153, 0.12);
  border: 1px solid rgba(0, 229, 153, 0.3);
  padding: 3px 8px;
  border-radius: 6px;
}

.match-card-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

.match-status-card {
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 14px;
  padding: 14px;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.match-status-card.matched strong {
  color: var(--emerald-aurora);
  font-size: 18px;
  font-family: var(--font-display);
}

.match-status-card.speed strong {
  color: #ffffff;
  font-size: 18px;
  font-family: var(--font-display);
}

.match-card-label {
  font-size: 9.5px;
  font-weight: 800;
  letter-spacing: 0.05em;
  color: var(--text-dim);
}

.match-status-card small {
  font-size: 11px;
  color: var(--text-dim);
}

.extracted-fields-list {
  background: rgba(0, 0, 0, 0.4);
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 16px;
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  font-size: 12.5px;
}

.extracted-field-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
}

.field-key {
  color: var(--text-dim);
  font-family: var(--font-mono);
  font-size: 11px;
}

.field-val {
  color: #ffffff;
  font-family: var(--font-display);
  font-weight: 600;
  text-align: right;
}

.field-val.highlight {
  color: var(--emerald-aurora);
}

.extracted-field-row.total-highlight {
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  padding-top: 8px;
}

.field-val-total {
  font-family: var(--font-display);
  font-size: 16px;
  font-weight: 800;
  color: var(--emerald-aurora);
}

.erp-sync-container {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.sync-title {
  font-family: var(--font-display);
  font-size: 10.5px;
  font-weight: 800;
  letter-spacing: 0.08em;
  color: var(--text-dim);
}

.sync-buttons-row {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.sync-btn {
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.12);
  color: #ffffff;
  padding: 8px 14px;
  border-radius: 8px;
  font-family: var(--font-display);
  font-size: 11.5px;
  font-weight: 700;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  transition: all 0.2s ease;
}

.sync-btn:hover {
  background: rgba(0, 229, 153, 0.15);
  border-color: var(--emerald-aurora);
  color: var(--emerald-aurora);
}

.sync-notification-badge {
  background: rgba(0, 229, 153, 0.1);
  border: 1px solid var(--emerald-aurora);
  color: var(--emerald-aurora);
  padding: 10px 14px;
  border-radius: 8px;
  font-size: 12px;
  display: flex;
  align-items: center;
  gap: 8px;
  animation: modalSlideUp 0.2s ease;
}

/* ==========================================================================
   FIELDPULSE STYLES
   ========================================================================== */
.demo-mode-switcher {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.mode-switch-btn {
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.1);
  color: var(--text-sub);
  padding: 8px 16px;
  border-radius: 10px;
  font-family: var(--font-display);
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
  transition: all 0.2s ease;
}

.mode-switch-btn:hover {
  background: rgba(255, 255, 255, 0.08);
  color: #ffffff;
}

.mode-switch-btn.active {
  background: rgba(0, 229, 153, 0.14);
  border-color: var(--emerald-aurora);
  color: var(--emerald-aurora);
}

.fieldpulse-dispatch-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
}

@media (max-width: 860px) {
  .fieldpulse-dispatch-grid {
    grid-template-columns: 1fr;
  }
}

.fp-column-card {
  background: rgba(14, 28, 48, 0.8);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 20px;
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.fp-card-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.fp-card-header h4 {
  font-size: 15px;
  color: #ffffff;
  margin: 0;
}

.gps-live-tag, .queue-count-tag {
  font-family: var(--font-mono);
  font-size: 10px;
  font-weight: 700;
  color: var(--emerald-aurora);
}

.fp-techs-list, .fp-orders-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.fp-tech-item {
  background: rgba(255, 255, 255, 0.02);
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 14px;
  padding: 12px 14px;
  display: flex;
  align-items: center;
  gap: 12px;
}

.tech-avatar-circle {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: rgba(0, 229, 153, 0.15);
  color: var(--emerald-aurora);
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-display);
  font-weight: 800;
  font-size: 12px;
}

.tech-details {
  flex-grow: 1;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.tech-name-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.tech-status-tag {
  font-family: var(--font-display);
  font-size: 9.5px;
  font-weight: 800;
  padding: 2px 6px;
  border-radius: 4px;
  text-transform: uppercase;
}

.tech-status-tag.available {
  background: rgba(0, 229, 153, 0.12);
  color: var(--emerald-aurora);
}

.tech-status-tag.en_route {
  background: rgba(255, 179, 0, 0.15);
  color: #ffb300;
}

.tech-region {
  font-size: 11.5px;
  color: var(--text-dim);
}

.tech-skills-row {
  display: flex;
  gap: 6px;
  margin-top: 4px;
}

.skill-pill {
  font-size: 9.5px;
  background: rgba(255, 255, 255, 0.04);
  padding: 1px 6px;
  border-radius: 4px;
  color: var(--text-sub);
}

.battery-pill {
  font-size: 9.5px;
  color: var(--text-dim);
}

.fp-order-card {
  background: rgba(255, 255, 255, 0.02);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 14px;
  padding: 14px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.order-head-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.order-id {
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--text-dim);
}

.priority-badge {
  font-family: var(--font-display);
  font-size: 9.5px;
  font-weight: 800;
  padding: 2px 6px;
  border-radius: 4px;
}

.priority-badge.emergency {
  background: rgba(239, 68, 68, 0.15);
  color: #ef4444;
}

.priority-badge.high {
  background: rgba(255, 179, 0, 0.15);
  color: #ffb300;
}

.priority-badge.medium {
  background: rgba(0, 229, 153, 0.1);
  color: var(--emerald-aurora);
}

.order-title {
  font-size: 13.5px;
  color: #ffffff;
  margin: 0;
}

.order-customer {
  font-size: 12px;
  color: var(--text-sub);
  margin: 0;
}

.tech-select-dropdown {
  background: rgba(0, 0, 0, 0.5);
  border: 1px solid rgba(255, 255, 255, 0.12);
  color: #ffffff;
  padding: 6px 10px;
  border-radius: 6px;
  font-size: 11.5px;
  cursor: pointer;
  width: 100%;
}

.assigned-status-badge {
  font-size: 11.5px;
  color: var(--emerald-aurora);
  display: flex;
  align-items: center;
  gap: 6px;
}

/* PWA Mobile Simulator */
.pwa-simulator-wrapper {
  display: grid;
  grid-template-columns: 340px 1fr;
  gap: 32px;
  align-items: flex-start;
}

@media (max-width: 768px) {
  .pwa-simulator-wrapper {
    grid-template-columns: 1fr;
  }
}

.pwa-device-frame {
  background: #02060b;
  border: 3px solid rgba(255, 255, 255, 0.15);
  border-radius: 36px;
  padding: 12px;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.8);
}

.pwa-app-screen {
  background: #08121e;
  border-radius: 26px;
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.pwa-status-bar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 11px;
}

.offline-toggle-btn {
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.1);
  color: #ffffff;
  padding: 3px 8px;
  border-radius: 9999px;
  font-size: 9.5px;
  cursor: pointer;
}

.pwa-job-header h3 {
  font-size: 14.5px;
  color: #ffffff;
  margin: 4px 0 2px;
}

.pwa-job-tag {
  font-family: var(--font-mono);
  font-size: 9.5px;
  color: var(--emerald-aurora);
}

.pwa-checklist-section {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.checklist-title {
  font-family: var(--font-display);
  font-size: 9.5px;
  font-weight: 800;
  letter-spacing: 0.05em;
  color: var(--text-dim);
}

.checklist-item {
  background: rgba(0, 0, 0, 0.3);
  border-radius: 8px;
  padding: 6px 8px;
  font-size: 11px;
  display: flex;
  align-items: center;
  gap: 6px;
  color: #ffffff;
}

.check-icon {
  color: var(--emerald-aurora);
  font-weight: 800;
}

.pwa-sign-box {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.sign-label {
  font-family: var(--font-display);
  font-size: 9.5px;
  font-weight: 800;
  color: var(--text-dim);
}

.sign-canvas {
  height: 70px;
  border: 1px dashed rgba(255, 255, 255, 0.2);
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0, 0, 0, 0.3);
}

.sign-canvas.signed {
  border-style: solid;
  border-color: var(--emerald-aurora);
}

.mock-signature {
  display: flex;
  flex-direction: column;
  align-items: center;
  color: var(--emerald-aurora);
}

.mock-signature em {
  font-family: cursive;
  font-size: 16px;
}

.mock-signature small {
  font-size: 8.5px;
  color: var(--text-dim);
}

.sign-prompt {
  font-size: 10px;
  color: var(--text-dim);
}

.whatsapp-dispatch-card {
  background: rgba(0, 229, 153, 0.08);
  border: 1px solid rgba(0, 229, 153, 0.3);
  border-radius: 10px;
  padding: 8px 10px;
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 11px;
}

.whatsapp-dispatch-card strong {
  color: var(--emerald-aurora);
  display: block;
}

.whatsapp-dispatch-card p {
  margin: 0;
  color: var(--text-sub);
}

.pwa-explainer-side {
  display: flex;
  flex-direction: column;
}

.explainer-card {
  background: rgba(14, 28, 48, 0.8);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 20px;
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.explainer-badge {
  font-family: var(--font-display);
  font-size: 10px;
  font-weight: 800;
  color: var(--emerald-aurora);
}

.explainer-card h4 {
  font-size: 18px;
  color: #ffffff;
  margin: 0;
}

.explainer-card p {
  font-size: 13.5px;
  color: var(--text-sub);
  line-height: 1.5;
  margin: 0;
}

.explainer-card ul {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.explainer-card li {
  font-size: 13px;
  color: var(--text-sub);
  display: flex;
  align-items: flex-start;
  gap: 8px;
}

.explainer-card li svg {
  color: var(--emerald-aurora);
  width: 14px;
  height: 14px;
  flex-shrink: 0;
  margin-top: 2px;
}

/* ==========================================================================
   PAYFLOW STYLES
   ========================================================================== */
.payflow-dashboard-grid {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 24px;
}

@media (max-width: 860px) {
  .payflow-dashboard-grid {
    grid-template-columns: 1fr;
  }
}

.payflow-vault-card {
  background: rgba(14, 28, 48, 0.85);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 20px;
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.vault-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}

.vault-badge {
  font-family: var(--font-mono);
  font-size: 10px;
  color: var(--emerald-aurora);
  display: block;
}

.vault-header h4 {
  font-size: 18px;
  color: #ffffff;
  margin: 4px 0 0;
}

.vault-security-pill {
  font-family: var(--font-mono);
  font-size: 9.5px;
  font-weight: 700;
  color: var(--emerald-aurora);
  background: rgba(0, 229, 153, 0.08);
  padding: 3px 8px;
  border-radius: 4px;
}

.milestones-track-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.milestone-row-card {
  background: rgba(0, 0, 0, 0.3);
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 14px;
  padding: 14px;
  display: flex;
  gap: 14px;
}

.milestone-status-indicator {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.05);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  flex-shrink: 0;
}

.milestone-row-card.released .milestone-status-indicator {
  background: rgba(0, 229, 153, 0.15);
  color: var(--emerald-aurora);
}

.milestone-content {
  flex-grow: 1;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.milestone-title-bar {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.milestone-amount {
  font-family: var(--font-display);
  font-size: 13.5px;
  font-weight: 800;
  color: var(--emerald-aurora);
}

.milestone-deliverable {
  font-size: 12px;
  color: var(--text-sub);
  margin: 0;
}

.released-tag {
  font-size: 11px;
  color: var(--emerald-aurora);
  display: flex;
  align-items: center;
  gap: 4px;
}

.escrow-lock-actions {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  padding-top: 6px;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
}

.escrow-holding-text {
  font-size: 11px;
  color: var(--text-dim);
}

.button-sm {
  padding: 6px 12px !important;
  font-size: 11.5px !important;
}

.pending-deposit-tag {
  font-size: 11px;
  color: var(--text-dim);
}

.vault-release-banner {
  background: rgba(0, 229, 153, 0.1);
  border: 1px solid var(--emerald-aurora);
  color: var(--emerald-aurora);
  padding: 12px 16px;
  border-radius: 12px;
  font-size: 12.5px;
  display: flex;
  align-items: center;
  gap: 8px;
}

.payflow-side-column {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.clearing-rail-card, .dunning-simulator-card {
  background: rgba(14, 28, 48, 0.85);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 20px;
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.rail-badge, .dunning-tag {
  font-family: var(--font-display);
  font-size: 10px;
  font-weight: 800;
  color: var(--emerald-aurora);
}

.clearing-rail-card h4 {
  font-size: 16px;
  color: #ffffff;
  margin: 0;
}

.rail-kpis {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  padding: 12px;
  background: rgba(0, 0, 0, 0.3);
  border-radius: 12px;
}

.rail-kpis div {
  display: flex;
  flex-direction: column;
}

.rail-kpis small {
  font-size: 10px;
  color: var(--text-dim);
}

.rail-kpis strong {
  font-size: 12px;
  color: #ffffff;
}

.dunning-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.dunning-trigger-btn {
  background: rgba(0, 229, 153, 0.1);
  border: 1px solid var(--emerald-aurora);
  color: var(--emerald-aurora);
  padding: 4px 10px;
  border-radius: 6px;
  font-family: var(--font-display);
  font-size: 10.5px;
  font-weight: 800;
  cursor: pointer;
}

.mock-whatsapp-message {
  background: #054d40;
  border-radius: 14px;
  padding: 12px;
  color: #ffffff;
  font-size: 12px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.wa-bubble-head {
  display: flex;
  justify-content: space-between;
  font-size: 10.5px;
  color: rgba(255, 255, 255, 0.7);
}

.wa-pay-cta {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}

.wa-btn-mock {
  background: rgba(255, 255, 255, 0.15);
  padding: 4px 8px;
  border-radius: 6px;
  font-size: 10.5px;
}

.dunning-alert-success {
  background: rgba(0, 229, 153, 0.1);
  border: 1px solid var(--emerald-aurora);
  color: var(--emerald-aurora);
  padding: 8px 12px;
  border-radius: 8px;
  font-size: 11.5px;
  display: flex;
  align-items: center;
  gap: 6px;
}

/* ==========================================================================
   VENDORPORTAL STYLES
   ========================================================================== */
.vendorportal-grid {
  display: grid;
  grid-template-columns: 1.1fr 1fr;
  gap: 24px;
}

@media (max-width: 860px) {
  .vendorportal-grid {
    grid-template-columns: 1fr;
  }
}

.wholesale-config-card, .po-approval-card {
  background: rgba(14, 28, 48, 0.85);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 20px;
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.config-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.sku-tag {
  font-family: var(--font-mono);
  font-size: 10px;
  color: var(--emerald-aurora);
}

.stock-tag {
  font-size: 11px;
  color: var(--text-dim);
}

.product-display-name {
  font-size: 18px;
  color: #ffffff;
  margin: 0;
}

.category-subtitle {
  font-size: 12px;
  color: var(--text-dim);
}

.qty-slider-box {
  background: rgba(0, 0, 0, 0.3);
  border-radius: 14px;
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.qty-label-row {
  display: flex;
  justify-content: space-between;
  font-size: 13px;
  color: #ffffff;
}

.qty-value-highlight {
  color: var(--emerald-aurora);
  font-size: 16px;
}

.tier-indicator-badge {
  background: rgba(0, 229, 153, 0.08);
  border: 1px solid rgba(0, 229, 153, 0.25);
  border-radius: 8px;
  padding: 8px 12px;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.tier-indicator-badge span {
  font-size: 9.5px;
  color: var(--text-dim);
  font-weight: 800;
}

.tier-indicator-badge strong {
  font-size: 12px;
  color: var(--emerald-aurora);
}

.pricing-math-breakdown {
  display: flex;
  flex-direction: column;
  gap: 8px;
  font-size: 13px;
}

.math-row {
  display: flex;
  justify-content: space-between;
  color: var(--text-sub);
}

.discount-val {
  color: var(--emerald-aurora);
  font-weight: 800;
}

.grand-total-row {
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  padding-top: 10px;
  color: #ffffff;
}

.total-po-amt {
  font-size: 18px;
  color: var(--emerald-aurora);
  font-family: var(--font-display);
}

.po-head-bar {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.po-number {
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--text-dim);
}

.po-status-badge {
  font-family: var(--font-display);
  font-size: 9.5px;
  font-weight: 800;
  color: var(--emerald-aurora);
  background: rgba(0, 229, 153, 0.1);
  padding: 3px 8px;
  border-radius: 4px;
}

.approval-stepper {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.step-node {
  display: flex;
  align-items: center;
  gap: 12px;
  opacity: 0.4;
  transition: opacity 0.2s ease;
}

.step-node.completed, .step-node.active {
  opacity: 1;
}

.step-circle {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.15);
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-display);
  font-size: 12px;
  color: #ffffff;
}

.step-node.completed .step-circle {
  background: rgba(0, 229, 153, 0.15);
  border-color: var(--emerald-aurora);
  color: var(--emerald-aurora);
}

.step-node div {
  display: flex;
  flex-direction: column;
}

.step-node strong {
  font-size: 13px;
  color: #ffffff;
}

.step-node small {
  font-size: 11px;
  color: var(--text-dim);
}

.po-success-notification {
  background: rgba(0, 229, 153, 0.1);
  border: 1px solid var(--emerald-aurora);
  color: var(--emerald-aurora);
  padding: 12px;
  border-radius: 10px;
  font-size: 12.5px;
  display: flex;
  align-items: center;
  gap: 8px;
}

/* ==========================================================================
   CLINIXCARE STYLES
   ========================================================================== */
.clinixcare-grid {
  display: grid;
  grid-template-columns: 1fr 1.1fr;
  gap: 24px;
}

@media (max-width: 860px) {
  .clinixcare-grid {
    grid-template-columns: 1fr;
  }
}

.wa-booking-phone-card {
  background: #02060b;
  border: 2px solid rgba(255, 255, 255, 0.12);
  border-radius: 24px;
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.wa-phone-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  padding-bottom: 10px;
}

.wa-clinic-meta {
  display: flex;
  align-items: center;
  gap: 8px;
}

.clinic-avatar {
  font-size: 22px;
}

.wa-clinic-meta strong {
  font-size: 12.5px;
  color: #ffffff;
  display: block;
}

.wa-clinic-meta small {
  font-size: 10px;
  color: var(--text-dim);
}

.wa-verified-check {
  background: var(--emerald-aurora);
  color: #000;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 10px;
  font-weight: 800;
}

.wa-chat-container {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.wa-bubble {
  padding: 12px;
  border-radius: 12px;
  font-size: 12px;
  line-height: 1.45;
}

.wa-bubble.incoming {
  background: #1f2c34;
  color: #ffffff;
  align-self: flex-start;
  max-width: 90%;
}

.wa-bubble.outgoing {
  background: #005c4b;
  color: #ffffff;
  align-self: flex-end;
  max-width: 80%;
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 8px;
}

.wa-time-stamp {
  font-size: 9.5px;
  color: rgba(255, 255, 255, 0.6);
}

.slot-selection-title {
  display: block;
  font-size: 10px;
  font-weight: 800;
  color: var(--emerald-aurora);
  margin: 8px 0 6px;
}

.wa-slot-pills {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.wa-slot-btn {
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.15);
  color: #ffffff;
  padding: 6px 10px;
  border-radius: 6px;
  font-size: 11.5px;
  cursor: pointer;
  text-align: left;
}

.wa-slot-btn.active {
  background: rgba(0, 229, 153, 0.2);
  border-color: var(--emerald-aurora);
  color: var(--emerald-aurora);
}

.confirmed-bubble {
  background: rgba(0, 229, 153, 0.15) !important;
  border: 1px solid var(--emerald-aurora);
}

.confirmed-head {
  display: flex;
  align-items: center;
  gap: 6px;
  color: var(--emerald-aurora);
  font-size: 13px;
  margin-bottom: 4px;
}

.clinical-chart-card {
  background: rgba(14, 28, 48, 0.85);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 20px;
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.chart-badge {
  font-family: var(--font-display);
  font-size: 10px;
  font-weight: 800;
  color: var(--emerald-aurora);
}

.clinical-chart-card h4 {
  font-size: 17px;
  color: #ffffff;
  margin: 4px 0 0;
}

.patient-vitals-strip {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  background: rgba(0, 0, 0, 0.3);
  border-radius: 12px;
  padding: 12px;
}

.vital-item {
  display: flex;
  flex-direction: column;
}

.vital-item small {
  font-size: 10px;
  color: var(--text-dim);
}

.vital-item strong {
  font-size: 13px;
  color: var(--emerald-aurora);
}

.clinical-notes-box {
  background: rgba(0, 0, 0, 0.25);
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 12px;
  padding: 14px;
}

.notes-label {
  font-family: var(--font-display);
  font-size: 10px;
  font-weight: 800;
  color: var(--text-dim);
  display: block;
  margin-bottom: 6px;
}

.clinical-notes-box p {
  font-size: 12.5px;
  color: var(--text-sub);
  line-height: 1.5;
  margin: 0;
}

.prescription-action-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}

.rx-summary-card {
  display: flex;
  flex-direction: column;
}

.rx-tag {
  font-family: var(--font-mono);
  font-size: 9.5px;
  color: var(--emerald-aurora);
}

.rx-summary-card strong {
  font-size: 13px;
  color: #ffffff;
}

.rx-summary-card small {
  font-size: 11px;
  color: var(--text-dim);
}

.rx-preview-alert {
  background: rgba(0, 229, 153, 0.1);
  border: 1px solid var(--emerald-aurora);
  border-radius: 12px;
  padding: 14px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.rx-preview-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  color: var(--emerald-aurora);
  font-size: 12px;
}

.close-rx-btn {
  background: transparent;
  border: none;
  color: #ffffff;
  cursor: pointer;
}

/* ==========================================================================
   TALENTOPS STYLES
   ========================================================================== */
.semantic-speed-badge {
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--emerald-aurora);
  background: rgba(0, 229, 153, 0.08);
  border: 1px solid rgba(0, 229, 153, 0.25);
  padding: 6px 12px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  gap: 6px;
}

.talentops-kanban-board {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
}

@media (max-width: 960px) {
  .talentops-kanban-board {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 600px) {
  .talentops-kanban-board {
    grid-template-columns: 1fr;
  }
}

.kanban-stage-column {
  background: rgba(14, 28, 48, 0.7);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 18px;
  padding: 14px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-height: 280px;
}

.stage-column-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
  padding-bottom: 8px;
}

.stage-title {
  font-family: var(--font-display);
  font-size: 11px;
  font-weight: 800;
  color: #ffffff;
}

.stage-count {
  background: rgba(255, 255, 255, 0.05);
  padding: 2px 6px;
  border-radius: 9999px;
  font-size: 10.5px;
  color: var(--text-dim);
}

.stage-candidates-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.candidate-card {
  background: rgba(0, 0, 0, 0.4);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 14px;
  padding: 12px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  transition: all 0.2s ease;
}

.candidate-card:hover {
  border-color: rgba(0, 229, 153, 0.3);
}

.candidate-card-top {
  display: flex;
  align-items: center;
  gap: 8px;
  position: relative;
}

.cand-avatar {
  font-size: 20px;
}

.candidate-card-top div {
  display: flex;
  flex-direction: column;
  flex-grow: 1;
}

.candidate-card-top strong {
  font-size: 12.5px;
  color: #ffffff;
}

.candidate-card-top small {
  font-size: 10.5px;
  color: var(--text-dim);
}

.vector-score-badge {
  font-family: var(--font-mono);
  font-size: 9.5px;
  font-weight: 700;
  color: var(--emerald-aurora);
  background: rgba(0, 229, 153, 0.1);
  padding: 2px 6px;
  border-radius: 4px;
}

.cand-experience-row {
  font-size: 11px;
  color: var(--text-dim);
}

.cand-skills-row {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}

.cand-skill-pill {
  font-size: 9px;
  background: rgba(255, 255, 255, 0.03);
  padding: 1px 5px;
  border-radius: 3px;
  color: var(--text-sub);
}

.advance-stage-btn {
  background: rgba(0, 229, 153, 0.1);
  border: 1px solid rgba(0, 229, 153, 0.3);
  color: var(--emerald-aurora);
  padding: 5px 8px;
  border-radius: 6px;
  font-family: var(--font-display);
  font-size: 10.5px;
  font-weight: 800;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
}

.advance-stage-btn:hover {
  background: var(--emerald-aurora);
  color: #000000;
}

.offer-issued-badge {
  font-size: 11px;
  color: var(--emerald-aurora);
  display: flex;
  align-items: center;
  gap: 4px;
  font-weight: 700;
}

.talent-alert-banner {
  background: rgba(0, 229, 153, 0.1);
  border: 1px solid var(--emerald-aurora);
  color: var(--emerald-aurora);
  padding: 12px 16px;
  border-radius: 12px;
  font-size: 12.5px;
  display: flex;
  align-items: center;
  gap: 8px;
}

/* Blueprint builder preset pills */
.blueprint-preset-pills-row {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: center;
  margin-top: 14px;
}

.preset-label {
  font-family: var(--font-display);
  font-size: 10.5px;
  font-weight: 800;
  letter-spacing: 0.08em;
  color: var(--text-dim);
}

.preset-btn {
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.1);
  color: var(--text-sub);
  padding: 6px 12px;
  border-radius: 9999px;
  font-family: var(--font-display);
  font-size: 11px;
  font-weight: 700;
  cursor: pointer;
  transition: all 0.2s ease;
}

.preset-btn:hover {
  background: rgba(0, 229, 153, 0.14);
  border-color: var(--emerald-aurora);
  color: var(--emerald-aurora);
}

/* ==========================================================================
   27. LEAD GENERATION ENGINE, PROPOSAL GENERATOR & BOOKING SCHEDULER
   ========================================================================== */

/* Submitted Lead Alert Card in Project Form */
.submitted-lead-alert {
  background: rgba(0, 229, 153, 0.08);
  border: 1px solid rgba(0, 229, 153, 0.4);
  border-radius: 16px;
  padding: 20px;
  margin-top: 16px;
}

.lead-dispatch-info {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  color: var(--emerald-aurora);
  margin-bottom: 16px;
}

.lead-dispatch-info strong {
  font-size: 14px;
  display: block;
  margin-bottom: 4px;
}

.lead-dispatch-info p {
  color: var(--text-sub);
  font-size: 13px;
  margin: 0;
}

.submitted-cta-row {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}

/* Proposal Generator Modal */
.proposal-modal-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.85);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  overflow-y: auto;
}

.proposal-modal-container {
  background: #08111e;
  border: 1px solid rgba(0, 229, 153, 0.35);
  box-shadow: 0 24px 80px rgba(0, 0, 0, 0.8);
  border-radius: 24px;
  width: 100%;
  max-width: 920px;
  max-height: 90vh;
  overflow-y: auto;
  padding: clamp(20px, 3vw, 36px);
  position: relative;
}

.proposal-modal-top-bar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-bottom: 20px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  margin-bottom: 24px;
}

.top-bar-branding {
  display: flex;
  align-items: center;
  gap: 12px;
}

.spec-badge {
  font-family: var(--font-display);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.12em;
  background: rgba(0, 229, 153, 0.12);
  color: var(--emerald-aurora);
  padding: 4px 10px;
  border-radius: 9999px;
  border: 1px solid rgba(0, 229, 153, 0.3);
}

.modal-close-btn {
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.1);
  color: var(--text-sub);
  width: 36px;
  height: 36px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  cursor: pointer;
  transition: all 0.2s ease;
}

.modal-close-btn:hover {
  background: rgba(255, 255, 255, 0.15);
  color: #ffffff;
}

/* Proposal Input Form */
.form-intro-box h3 {
  font-size: 22px;
  color: #ffffff;
  margin: 0 0 8px;
}

.form-intro-box p {
  color: var(--text-sub);
  font-size: 14px;
  margin: 0 0 24px;
}

.form-fields-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  margin-bottom: 24px;
}

.form-field-group {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.form-field-group.full-col {
  grid-column: 1 / -1;
}

.form-field-group label {
  font-size: 12px;
  font-weight: 700;
  color: var(--text-dim);
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

.form-field-group input {
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 12px;
  padding: 12px 16px;
  color: #ffffff;
  font-size: 14px;
  transition: border-color 0.2s ease;
}

.form-field-group input:focus {
  outline: none;
  border-color: var(--emerald-aurora);
  box-shadow: 0 0 0 2px rgba(0, 229, 153, 0.2);
}

.selected-stack-preview-box {
  background: rgba(0, 0, 0, 0.3);
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 14px;
  padding: 16px 20px;
  margin-bottom: 24px;
}

.preview-label {
  font-family: var(--font-display);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.1em;
  color: var(--emerald-aurora);
  display: block;
  margin-bottom: 8px;
}

.selected-stack-preview-box ul {
  list-style: none;
  padding: 0;
  margin: 0 0 12px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-size: 13px;
  color: var(--text-sub);
}

.selected-stack-preview-box ul strong {
  color: #ffffff;
}

.preview-timeline-val {
  display: flex;
  justify-content: space-between;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  padding-top: 10px;
  font-family: var(--font-display);
  font-size: 12px;
  font-weight: 800;
  color: var(--emerald-aurora);
}

.form-actions-row {
  display: flex;
  justify-content: flex-end;
  gap: 12px;
}

/* Printable Document Paper */
.document-actions-floating-bar {
  display: flex;
  gap: 10px;
  margin-bottom: 20px;
  flex-wrap: wrap;
}

.printable-proposal-paper {
  background: #ffffff;
  color: #0b1523;
  border-radius: 12px;
  padding: clamp(24px, 4vw, 48px);
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.4);
}

.doc-paper-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  border-bottom: 2px solid #00e599;
  padding-bottom: 20px;
  margin-bottom: 24px;
}

.doc-logo-title {
  font-family: var(--font-display);
  font-size: 22px;
  font-weight: 900;
  color: #04101e;
  margin: 0 0 4px;
  letter-spacing: -0.02em;
}

.doc-type-tag {
  font-family: var(--font-display);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.1em;
  color: #0b6b47;
}

.doc-meta-right {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  font-size: 12px;
  color: #4a5568;
}

.seal-text {
  font-weight: 800;
  color: #0b6b47;
  margin-top: 4px;
}

.doc-client-strip {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 16px;
  background: #f4f7fa;
  border-radius: 8px;
  padding: 14px 18px;
  margin-bottom: 28px;
}

.doc-client-strip small {
  font-size: 10px;
  font-weight: 800;
  color: #718096;
  display: block;
  margin-bottom: 2px;
}

.doc-client-strip strong {
  font-size: 14px;
  color: #0f172a;
}

.doc-section {
  margin-bottom: 28px;
}

.doc-section h3 {
  font-size: 16px;
  font-weight: 800;
  color: #0f172a;
  border-bottom: 1px solid #e2e8f0;
  padding-bottom: 6px;
  margin-bottom: 12px;
}

.doc-section p {
  font-size: 13.5px;
  line-height: 1.6;
  color: #334155;
  margin: 0;
}

.doc-spec-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 12.5px;
  margin-top: 8px;
}

.doc-spec-table th,
.doc-spec-table td {
  padding: 10px 12px;
  text-align: left;
  border: 1px solid #e2e8f0;
}

.doc-spec-table th {
  background: #f8fafc;
  color: #475569;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.06em;
}

.doc-milestones-grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 12px;
  margin-top: 10px;
}

.milestone-box {
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  padding: 14px;
  display: flex;
  flex-direction: column;
}

.m-num {
  font-size: 9.5px;
  font-weight: 800;
  letter-spacing: 0.08em;
  color: #0b6b47;
  margin-bottom: 4px;
}

.milestone-box strong {
  font-size: 13px;
  color: #0f172a;
  margin-bottom: 6px;
}

.milestone-box p {
  font-size: 11.5px;
  color: #64748b;
  flex-grow: 1;
  margin-bottom: 8px;
}

.m-price {
  font-family: var(--font-display);
  font-weight: 800;
  font-size: 15px;
  color: #0f172a;
}

.doc-bullets {
  margin: 0;
  padding-left: 18px;
  font-size: 13px;
  color: #334155;
  line-height: 1.6;
}

.doc-sign-off-footer {
  display: flex;
  justify-content: space-between;
  border-top: 1px solid #e2e8f0;
  padding-top: 16px;
  margin-top: 36px;
  font-size: 12px;
  color: #64748b;
}

.doc-sign-off-footer small {
  font-size: 9.5px;
  font-weight: 800;
  color: #94a3b8;
  display: block;
}

.doc-sign-off-footer strong {
  color: #0f172a;
  display: block;
}

/* Print Media Styles */
@media print {
  body * {
    visibility: hidden;
  }
  .printable-proposal-paper,
  .printable-proposal-paper * {
    visibility: visible;
  }
  .printable-proposal-paper {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    margin: 0;
    padding: 20px;
    box-shadow: none;
  }
  .no-print {
    display: none !important;
  }
}

/* ==========================================================================
   INTERACTIVE BOOKING SCHEDULER WIDGET
   ========================================================================== */
.booking-scheduler-container {
  background: linear-gradient(135deg, rgba(10, 22, 38, 0.95) 0%, rgba(4, 11, 20, 0.98) 100%);
  border: 1px solid rgba(0, 229, 153, 0.3);
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.6);
  border-radius: 24px;
  padding: clamp(24px, 4vw, 44px);
  margin: 48px 0;
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
}

.pricing-embedded-scheduler {
  margin: 64px 0 32px;
}

.scheduler-header {
  margin-bottom: 32px;
  text-align: left;
}

.sched-badge {
  font-family: var(--font-display);
  font-size: 10.5px;
  font-weight: 800;
  letter-spacing: 0.12em;
  color: var(--emerald-aurora);
  background: rgba(0, 229, 153, 0.1);
  border: 1px solid rgba(0, 229, 153, 0.3);
  padding: 4px 12px;
  border-radius: 9999px;
  display: inline-block;
  margin-bottom: 12px;
}

.sched-title {
  font-size: clamp(22px, 2.5vw, 32px);
  color: #ffffff;
  margin: 0 0 10px;
  line-height: 1.25;
}

.sched-subtitle {
  font-size: 14.5px;
  color: var(--text-sub);
  margin: 0;
  max-width: 680px;
  line-height: 1.6;
}

.scheduler-grid {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 32px;
}

@media (max-width: 900px) {
  .scheduler-grid {
    grid-template-columns: 1fr;
  }
}

.scheduler-calendar-pane {
  background: rgba(0, 0, 0, 0.35);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 18px;
  padding: 24px;
}

.tz-selector-row {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 20px;
  flex-wrap: wrap;
}

.tz-selector-row label {
  font-family: var(--font-display);
  font-size: 10.5px;
  font-weight: 800;
  letter-spacing: 0.08em;
  color: var(--text-dim);
}

.tz-select-dropdown {
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.15);
  border-radius: 10px;
  padding: 8px 12px;
  color: #ffffff;
  font-size: 13px;
  cursor: pointer;
}

.tz-select-dropdown option {
  background: #0b1523;
  color: #ffffff;
}

.days-tab-row {
  display: flex;
  gap: 8px;
  margin-bottom: 24px;
  overflow-x: auto;
  padding-bottom: 6px;
}

.day-tab-btn {
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 12px;
  padding: 10px 14px;
  display: flex;
  flex-direction: column;
  align-items: center;
  cursor: pointer;
  transition: all 0.2s ease;
  min-width: 88px;
}

.day-tab-btn:hover {
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, 0.2);
}

.day-tab-btn.active {
  background: rgba(0, 229, 153, 0.15);
  border-color: var(--emerald-aurora);
}

.day-label {
  font-size: 12px;
  font-weight: 700;
  color: #ffffff;
}

.day-date {
  font-size: 10px;
  color: var(--text-dim);
}

.day-tab-btn.active .day-date {
  color: var(--emerald-aurora);
}

.slots-title {
  font-family: var(--font-display);
  font-size: 10.5px;
  font-weight: 800;
  letter-spacing: 0.08em;
  color: var(--text-dim);
  display: block;
  margin-bottom: 12px;
}

.slots-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(110px, 1fr));
  gap: 10px;
}

.time-slot-btn {
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 10px;
  padding: 10px 8px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  cursor: pointer;
  transition: all 0.2s ease;
}

.time-slot-btn:hover {
  background: rgba(0, 229, 153, 0.1);
  border-color: var(--emerald-aurora);
}

.time-slot-btn.selected {
  background: var(--emerald-aurora);
  border-color: var(--emerald-aurora);
}

.slot-time {
  font-size: 13px;
  font-weight: 700;
  color: #ffffff;
}

.time-slot-btn.selected .slot-time {
  color: #000000;
}

.slot-avail {
  font-size: 9.5px;
  color: var(--emerald-aurora);
}

.time-slot-btn.selected .slot-avail {
  color: #042e1d;
  font-weight: 700;
}

/* Scheduler Form Pane */
.scheduler-form-pane {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.form-pane-heading {
  margin-bottom: 20px;
}

.form-pane-heading strong {
  font-size: 16px;
  color: #ffffff;
  display: block;
}

.form-pane-heading small {
  font-size: 12.5px;
  color: var(--emerald-aurora);
}

.sched-fields {
  display: flex;
  flex-direction: column;
  gap: 14px;
  margin-bottom: 20px;
}

.btn-confirm-booking {
  margin-bottom: 14px;
}

.meeting-reassurance {
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: 11.5px;
  color: var(--text-dim);
}

/* Booking Confirmed Card */
.booking-confirmed-card {
  background: rgba(0, 229, 153, 0.08);
  border: 1px solid rgba(0, 229, 153, 0.4);
  border-radius: 20px;
  padding: 36px;
  text-align: center;
  max-width: 640px;
  margin: 0 auto;
}

.confirmed-icon-circle {
  width: 56px;
  height: 56px;
  background: var(--emerald-aurora);
  color: #000000;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
  margin: 0 auto 16px;
}

.booking-confirmed-card h3 {
  font-size: 24px;
  color: #ffffff;
  margin: 0 0 8px;
}

.confirmed-subtext {
  font-size: 14px;
  color: var(--text-sub);
  margin: 0 0 24px;
}

.confirmed-details-box {
  background: rgba(0, 0, 0, 0.4);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 14px;
  padding: 20px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  text-align: left;
  margin-bottom: 28px;
}

.conf-item small {
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.08em;
  color: var(--text-dim);
  display: block;
  margin-bottom: 4px;
}

.conf-item strong {
  font-size: 13.5px;
  color: #ffffff;
}

.confirmed-actions-row {
  display: flex;
  justify-content: center;
  gap: 14px;
  flex-wrap: wrap;
}

/* ==========================================================================
   SECTION 28: CARGOFLOW, PROPOPS, KITCHENOPS & EDUCORE STYLES
   ========================================================================== */

/* Products Category Filter Pills */
.product-category-filters-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 32px;
  justify-content: center;
}

.filter-pill-btn {
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.12);
  color: var(--text-sub);
  padding: 8px 16px;
  border-radius: 20px;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s ease;
}

.filter-pill-btn:hover {
  background: rgba(255, 255, 255, 0.1);
  color: #ffffff;
}

.filter-pill-btn.active {
  background: var(--emerald-aurora);
  border-color: var(--emerald-aurora);
  color: #000000;
  font-weight: 700;
}

/* CARGOFLOW STYLES */
.cargoflow-controls-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  margin-bottom: 24px;
  flex-wrap: wrap;
}

.truck-selector-group {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.truck-selector-group span {
  font-size: 11px;
  font-weight: 800;
  color: var(--text-dim);
  letter-spacing: 0.06em;
}

.truck-btn {
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.12);
  color: var(--text-sub);
  padding: 8px 14px;
  border-radius: 8px;
  font-size: 12.5px;
  cursor: pointer;
  transition: all 0.2s ease;
}

.truck-btn.active {
  background: rgba(0, 229, 153, 0.12);
  border-color: var(--emerald-aurora);
  color: var(--emerald-aurora);
  font-weight: 700;
}

.button-warning-amber {
  background: rgba(255, 179, 0, 0.15);
  border: 1px solid rgba(255, 179, 0, 0.5);
  color: #ffb300;
  padding: 8px 16px;
  border-radius: 8px;
  font-size: 12.5px;
  font-weight: 700;
  cursor: pointer;
}

.cargoflow-grid {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 24px;
}

@media (max-width: 900px) {
  .cargoflow-grid {
    grid-template-columns: 1fr;
  }
}

.telemetry-pane,
.route-epod-pane {
  background: rgba(0, 0, 0, 0.35);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 14px;
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.telemetry-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  padding-bottom: 14px;
}

.telemetry-header small {
  font-size: 10px;
  font-weight: 800;
  color: var(--text-dim);
  display: block;
}

.telemetry-header strong {
  font-size: 13px;
  color: #ffffff;
}

.live-temp-badge {
  padding: 8px 14px;
  border-radius: 10px;
  text-align: right;
}

.live-temp-badge.normal {
  background: rgba(0, 229, 153, 0.12);
  border: 1px solid var(--emerald-aurora);
}

.live-temp-badge.critical {
  background: rgba(255, 68, 68, 0.2);
  border: 1px solid #ff4444;
  animation: pulseCritical 1.5s infinite;
}

@keyframes pulseCritical {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.7; }
}

.temp-val {
  font-size: 20px;
  font-weight: 900;
  display: block;
}

.live-temp-badge.normal .temp-val {
  color: var(--emerald-aurora);
}

.live-temp-badge.critical .temp-val {
  color: #ff5555;
}

.sensor-ticks-container {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.ticks-label {
  font-size: 10px;
  font-weight: 800;
  color: var(--text-dim);
  letter-spacing: 0.06em;
}

.sensor-ticks-stream {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.sensor-log-row {
  display: grid;
  grid-template-columns: 60px 80px 80px 100px 1fr;
  padding: 8px 12px;
  background: rgba(255, 255, 255, 0.03);
  border-radius: 6px;
  font-size: 12px;
  color: var(--text-sub);
  align-items: center;
}

.sensor-log-row.critical-row {
  background: rgba(255, 68, 68, 0.15);
  border: 1px solid rgba(255, 68, 68, 0.4);
  color: #ff8888;
  font-weight: 700;
}

.alarm-notification-box {
  background: rgba(255, 68, 68, 0.12);
  border: 1px solid #ff4444;
  border-radius: 10px;
  padding: 14px;
  display: flex;
  gap: 12px;
  align-items: flex-start;
}

.alarm-notification-box strong {
  font-size: 12.5px;
  color: #ff5555;
  display: block;
}

.alarm-notification-box p {
  font-size: 12px;
  color: var(--text-sub);
  margin: 4px 0 0;
}

.geofence-card {
  background: rgba(0, 0, 0, 0.4);
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 10px;
  padding: 14px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.geo-header {
  display: flex;
  justify-content: space-between;
  font-size: 11px;
}

.geo-title {
  font-weight: 800;
  color: var(--emerald-aurora);
}

.geo-stat {
  color: var(--text-dim);
}

.geo-route-info {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: rgba(255, 255, 255, 0.04);
  border-radius: 8px;
  padding: 10px 14px;
}

.geo-route-info small {
  font-size: 9.5px;
  font-weight: 800;
  color: var(--text-dim);
  display: block;
}

.geo-route-info strong {
  font-size: 12.5px;
  color: #ffffff;
}

.geo-arrow {
  color: var(--emerald-aurora);
  font-size: 16px;
}

.geofence-alert-box {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 11.5px;
  color: var(--emerald-aurora);
}

.epod-dispatch-box {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.epod-dispatch-box h4 {
  font-size: 14px;
  color: #ffffff;
  margin: 0;
}

.epod-dispatch-box p {
  font-size: 12px;
  color: var(--text-sub);
  margin: 0;
}

.epod-success-alert {
  background: rgba(0, 229, 153, 0.1);
  border: 1px solid var(--emerald-aurora);
  border-radius: 8px;
  padding: 12px;
  display: flex;
  gap: 10px;
  align-items: center;
}

.epod-success-alert strong {
  font-size: 12.5px;
  color: var(--emerald-aurora);
  display: block;
}

.epod-success-alert small {
  font-size: 11px;
  color: var(--text-sub);
}

/* PROPOPS STYLES */
.propops-tabs-bar {
  display: flex;
  gap: 10px;
  margin-bottom: 20px;
}

.prop-tab-btn {
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.12);
  color: var(--text-sub);
  padding: 8px 16px;
  border-radius: 8px;
  font-size: 13px;
  cursor: pointer;
  transition: all 0.2s ease;
}

.prop-tab-btn.active {
  background: rgba(0, 229, 153, 0.12);
  border-color: var(--emerald-aurora);
  color: var(--emerald-aurora);
  font-weight: 700;
}

.cpi-simulator-strip {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 20px;
  background: rgba(0, 0, 0, 0.35);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 12px;
  padding: 16px 20px;
  margin-bottom: 20px;
  flex-wrap: wrap;
}

.cpi-slider-group {
  display: flex;
  flex-direction: column;
  gap: 8px;
  flex: 1;
  min-width: 260px;
}

.cpi-slider-group label {
  font-size: 11px;
  font-weight: 800;
  color: var(--text-dim);
}

.cpi-slider-group strong {
  color: var(--emerald-aurora);
  font-size: 14px;
}

.cpi-slider {
  width: 100%;
  accent-color: var(--emerald-aurora);
  cursor: pointer;
}

.portfolio-kpi-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  margin-bottom: 20px;
}

@media (max-width: 700px) {
  .portfolio-kpi-grid {
    grid-template-columns: 1fr;
  }
}

.port-kpi-card {
  background: rgba(0, 0, 0, 0.3);
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 10px;
  padding: 14px;
}

.port-kpi-card small {
  font-size: 10px;
  font-weight: 800;
  color: var(--text-dim);
  display: block;
  margin-bottom: 4px;
}

.port-kpi-card strong {
  font-size: 18px;
  color: #ffffff;
}

.rent-roll-table-wrapper {
  overflow-x: auto;
  background: rgba(0, 0, 0, 0.35);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 12px;
}

.rent-roll-table {
  width: 100%;
  border-collapse: collapse;
  text-align: left;
  font-size: 12.5px;
}

.rent-roll-table th {
  padding: 12px 16px;
  font-size: 10.5px;
  font-weight: 800;
  color: var(--text-dim);
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.rent-roll-table td {
  padding: 14px 16px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.04);
  color: var(--text-sub);
}

.rent-roll-table strong {
  display: block;
  color: #ffffff;
}

.rent-roll-table small {
  font-size: 11px;
  color: var(--text-dim);
}

.indexed-cell {
  color: var(--emerald-aurora);
  font-weight: 700;
}

.monthly-cell {
  font-weight: 600;
  color: #ffffff;
}

.expiry-badge {
  padding: 4px 8px;
  border-radius: 6px;
  font-size: 11px;
}

.expiry-badge.current {
  background: rgba(0, 229, 153, 0.1);
  color: var(--emerald-aurora);
}

.expiry-badge.due_soon {
  background: rgba(255, 179, 0, 0.15);
  color: #ffb300;
}

.table-action-btn {
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.12);
  color: #ffffff;
  padding: 6px 12px;
  border-radius: 6px;
  font-size: 11.5px;
  cursor: pointer;
  transition: all 0.2s ease;
}

.table-action-btn:hover {
  background: rgba(0, 229, 153, 0.2);
  border-color: var(--emerald-aurora);
  color: var(--emerald-aurora);
}

.work-order-cards-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}

@media (max-width: 768px) {
  .work-order-cards-grid {
    grid-template-columns: 1fr;
  }
}

.work-order-card {
  background: rgba(0, 0, 0, 0.35);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 12px;
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.wo-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.wo-badge {
  padding: 4px 8px;
  border-radius: 6px;
  font-size: 10px;
  font-weight: 800;
}

.wo-badge.critical {
  background: rgba(255, 68, 68, 0.15);
  color: #ff5555;
}

.wo-badge.normal {
  background: rgba(0, 229, 153, 0.1);
  color: var(--emerald-aurora);
}

.wo-ref {
  font-size: 11px;
  color: var(--text-dim);
}

.work-order-card h4 {
  font-size: 15px;
  color: #ffffff;
  margin: 0;
}

.work-order-card p {
  font-size: 12.5px;
  color: var(--text-sub);
  margin: 0;
}

.wo-meta-row {
  display: flex;
  justify-content: space-between;
  font-size: 11px;
  color: var(--text-dim);
  border-top: 1px solid rgba(255, 255, 255, 0.06);
  padding-top: 10px;
}

/* KITCHENOPS STYLES */
.dish-selector-row {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 24px;
  flex-wrap: wrap;
}

.dish-selector-row span {
  font-size: 11px;
  font-weight: 800;
  color: var(--text-dim);
}

.dish-tab-btn {
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.12);
  color: var(--text-sub);
  padding: 8px 16px;
  border-radius: 8px;
  font-size: 13px;
  cursor: pointer;
}

.dish-tab-btn.active {
  background: rgba(0, 229, 153, 0.12);
  border-color: var(--emerald-aurora);
  color: var(--emerald-aurora);
  font-weight: 700;
}

.kitchenops-grid {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 24px;
}

@media (max-width: 900px) {
  .kitchenops-grid {
    grid-template-columns: 1fr;
  }
}

.recipe-bom-pane,
.margin-replenish-pane {
  background: rgba(0, 0, 0, 0.35);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 14px;
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.bom-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.bom-header h4 {
  font-size: 14px;
  color: #ffffff;
  margin: 0;
}

.menu-price-tag {
  font-size: 12px;
  font-weight: 700;
  color: var(--emerald-aurora);
}

.ingredient-slider-box {
  background: rgba(255, 255, 255, 0.03);
  border-radius: 8px;
  padding: 12px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.ingredient-slider-box label {
  font-size: 10.5px;
  font-weight: 800;
  color: var(--text-dim);
}

.ingredient-slider-box strong {
  color: #ffb300;
}

.ingredients-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.ingredient-item-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px 12px;
  background: rgba(255, 255, 255, 0.02);
  border-radius: 6px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.04);
}

.ingredient-item-row strong {
  font-size: 12.5px;
  color: #ffffff;
  display: block;
}

.ingredient-item-row small {
  font-size: 10.5px;
  color: var(--text-dim);
}

.ing-cost {
  font-size: 13px;
  font-weight: 700;
  color: var(--text-sub);
  display: flex;
  align-items: center;
  gap: 8px;
}

.inflation-pill {
  font-size: 10px;
  background: rgba(255, 179, 0, 0.15);
  color: #ffb300;
  padding: 2px 6px;
  border-radius: 4px;
}

.margin-gauge-card {
  background: rgba(0, 0, 0, 0.4);
  border-radius: 12px;
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.margin-gauge-card.optimal {
  border: 1px solid var(--emerald-aurora);
}

.margin-gauge-card.warning {
  border: 1px solid #ffb300;
}

.gauge-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.gauge-label {
  font-size: 11px;
  font-weight: 800;
  color: var(--text-dim);
}

.food-cost-num {
  font-size: 28px;
  font-weight: 900;
}

.margin-gauge-card.optimal .food-cost-num {
  color: var(--emerald-aurora);
}

.margin-gauge-card.warning .food-cost-num {
  color: #ffb300;
}

.margin-breakdown-row {
  display: flex;
  justify-content: space-between;
  background: rgba(255, 255, 255, 0.03);
  border-radius: 8px;
  padding: 12px;
}

.margin-breakdown-row small {
  font-size: 10px;
  font-weight: 800;
  color: var(--text-dim);
  display: block;
}

.margin-breakdown-row strong {
  font-size: 15px;
  color: #ffffff;
}

.margin-alert-box {
  font-size: 12px;
  padding: 10px 14px;
  border-radius: 8px;
}

.margin-alert-box.success {
  background: rgba(0, 229, 153, 0.08);
  color: var(--emerald-aurora);
  display: flex;
  align-items: center;
  gap: 8px;
}

.margin-alert-box.critical {
  background: rgba(255, 179, 0, 0.12);
  color: #ffb300;
  line-height: 1.4;
}

.commissary-indent-box {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.commissary-indent-box h4 {
  font-size: 14px;
  color: #ffffff;
  margin: 0;
}

.commissary-indent-box p {
  font-size: 12px;
  color: var(--text-sub);
  margin: 0;
}

/* EDUCORE STYLES */
.educore-pipeline-section {
  background: rgba(0, 0, 0, 0.35);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 14px;
  padding: 20px;
  margin-bottom: 24px;
}

.pipeline-heading {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
  flex-wrap: wrap;
}

.pipeline-heading h4 {
  font-size: 15px;
  color: #ffffff;
  margin: 0;
}

.pipeline-note {
  font-size: 11.5px;
  color: var(--text-dim);
}

.pipeline-columns-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
}

@media (max-width: 900px) {
  .pipeline-columns-grid {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 550px) {
  .pipeline-columns-grid {
    grid-template-columns: 1fr;
  }
}

.pipeline-col {
  background: rgba(255, 255, 255, 0.02);
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 10px;
  padding: 12px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.col-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
  padding-bottom: 8px;
}

.col-title {
  font-size: 10.5px;
  font-weight: 800;
  color: var(--emerald-aurora);
  letter-spacing: 0.06em;
}

.col-count {
  font-size: 10px;
  background: rgba(255, 255, 255, 0.1);
  color: #ffffff;
  padding: 2px 6px;
  border-radius: 10px;
  font-weight: 700;
}

.col-cards {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.applicant-card {
  background: rgba(0, 0, 0, 0.5);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 8px;
  padding: 10px;
  cursor: pointer;
  transition: all 0.2s ease;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.applicant-card:hover,
.applicant-card.active {
  border-color: var(--emerald-aurora);
  background: rgba(0, 229, 153, 0.04);
}

.app-top {
  display: flex;
  justify-content: space-between;
  font-size: 12px;
  color: #ffffff;
}

.app-country {
  font-size: 11px;
}

.app-course {
  font-size: 10.5px;
  color: var(--text-sub);
  margin: 0;
  line-height: 1.35;
}

.app-bottom {
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
  padding-top: 6px;
}

.app-fee {
  font-size: 11px;
  font-weight: 700;
  color: var(--emerald-aurora);
}

.advance-stage-btn {
  background: rgba(0, 229, 153, 0.15);
  border: 1px solid var(--emerald-aurora);
  color: var(--emerald-aurora);
  padding: 3px 8px;
  border-radius: 4px;
  font-size: 10px;
  font-weight: 700;
  cursor: pointer;
}

.enrolled-check {
  font-size: 10px;
  color: var(--emerald-aurora);
  font-weight: 700;
}

.educore-lower-grid {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 24px;
}

@media (max-width: 850px) {
  .educore-lower-grid {
    grid-template-columns: 1fr;
  }
}

.tuition-vault-pane,
.certificate-vault-pane {
  background: rgba(0, 0, 0, 0.35);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 14px;
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.vault-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.vault-head h4 {
  font-size: 14px;
  color: #ffffff;
  margin: 0;
}

.student-tag {
  font-size: 11px;
  color: var(--emerald-aurora);
  font-weight: 700;
}

.installment-select-row {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  font-size: 11px;
  color: var(--text-dim);
}

.split-btn {
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.1);
  color: var(--text-sub);
  padding: 6px 12px;
  border-radius: 6px;
  font-size: 11.5px;
  cursor: pointer;
}

.split-btn.active {
  background: rgba(0, 229, 153, 0.12);
  border-color: var(--emerald-aurora);
  color: var(--emerald-aurora);
  font-weight: 700;
}

.installment-table-box {
  background: rgba(255, 255, 255, 0.02);
  border-radius: 8px;
  overflow: hidden;
}

.installment-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 12px;
  text-align: left;
}

.installment-table th {
  padding: 8px 12px;
  font-size: 10px;
  font-weight: 800;
  color: var(--text-dim);
  background: rgba(0, 0, 0, 0.3);
}

.installment-table td {
  padding: 10px 12px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.04);
  color: var(--text-sub);
}

.status-pill.paid {
  color: var(--emerald-aurora);
  font-weight: 700;
}

.status-pill.scheduled {
  color: var(--text-dim);
}

.cert-head h4 {
  font-size: 14px;
  color: #ffffff;
  margin: 0 0 2px;
}

.cert-head small {
  font-size: 10px;
  color: var(--text-dim);
}

.cert-preview-card {
  background: #0d161d;
  border: 2px solid rgba(0, 229, 153, 0.3);
  border-radius: 10px;
  padding: 16px;
}

.cert-border-inner {
  border: 1px dashed rgba(0, 229, 153, 0.4);
  border-radius: 6px;
  padding: 16px;
  text-align: center;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.cert-seal {
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.08em;
  color: var(--emerald-aurora);
}

.cert-border-inner h5 {
  font-size: 15px;
  color: #ffffff;
  margin: 0;
}

.cert-awarded {
  font-size: 12px;
  color: var(--text-sub);
  margin: 0;
}

.cert-border-inner small {
  font-size: 11px;
  color: var(--text-dim);
}

.cert-qr-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
  padding-top: 8px;
  font-size: 10.5px;
}

.cert-hash {
  color: var(--text-dim);
}

.qr-badge {
  background: rgba(0, 229, 153, 0.15);
  color: var(--emerald-aurora);
  padding: 2px 6px;
  border-radius: 4px;
  font-weight: 700;
}

/* ==========================================================================
   SECTION 29: INTERACTIVE ARCHITECTURE BLUEPRINT BUILDER UI/UX
   ========================================================================== */

.blueprint-builder-section {
  position: relative;
  max-width: var(--content-max);
  margin: var(--section-space) auto;
  padding: 0 var(--gutter);
  box-sizing: border-box;
}

.blueprint-builder-card {
  position: relative;
  background: var(--card-bg);
  border: 1px solid var(--card-border);
  border-radius: 24px;
  padding: clamp(28px, 3.5vw, 44px);
  backdrop-filter: blur(24px);
  -webkit-backdrop-filter: blur(24px);
  box-shadow: 0 24px 64px rgba(0, 0, 0, 0.5), inset 0 1px 0 rgba(255, 255, 255, 0.1);
  overflow: hidden;
}

.blueprint-builder-card::before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(0, 229, 153, 0.12) 0%, rgba(6, 182, 212, 0.04) 50%, transparent 70%);
  pointer-events: none;
  z-index: 0;
}

.blueprint-header-row {
  position: relative;
  z-index: 1;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 32px;
  margin-bottom: 32px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  padding-bottom: 24px;
}

@media (max-width: 960px) {
  .blueprint-header-row {
    flex-direction: column;
  }
}

.blueprint-heading {
  font-size: clamp(24px, 2.6vw, 34px);
  line-height: 1.18;
  margin: 8px 0 12px;
  color: #ffffff;
}

.blueprint-subtext {
  font-size: 14.5px;
  color: var(--text-sub);
  line-height: 1.6;
  max-width: 720px;
  margin-bottom: 20px;
}

.blueprint-preset-pills-row {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.preset-label {
  font-family: var(--font-display);
  font-size: 10.5px;
  font-weight: 800;
  letter-spacing: 0.08em;
  color: var(--text-dim);
  text-transform: uppercase;
  margin-right: 4px;
}

.preset-btn {
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.1);
  color: var(--text-sub);
  padding: 6px 12px;
  border-radius: 9999px;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s ease;
  white-space: nowrap;
}

.preset-btn:hover {
  background: rgba(0, 229, 153, 0.12);
  border-color: rgba(0, 229, 153, 0.4);
  color: #ffffff;
  transform: translateY(-1px);
}

.blueprint-summary-badge {
  background: rgba(0, 229, 153, 0.08);
  border: 1px solid rgba(0, 229, 153, 0.3);
  border-radius: 16px;
  padding: 16px 22px;
  text-align: center;
  min-width: 180px;
  flex-shrink: 0;
  box-shadow: 0 4px 20px rgba(0, 229, 153, 0.1);
}

.blueprint-summary-badge small {
  font-family: var(--font-display);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.08em;
  color: var(--emerald-aurora);
  display: block;
  margin-bottom: 4px;
}

.blueprint-summary-badge strong {
  font-size: 26px;
  font-weight: 800;
  color: #ffffff;
  display: block;
  line-height: 1.1;
  margin-bottom: 4px;
}

.blueprint-summary-badge span {
  font-size: 11px;
  color: var(--text-dim);
  display: block;
}

/* Configurator Layout: 2 Columns */
.blueprint-configurator-layout {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: 1.15fr 0.85fr;
  gap: 32px;
  align-items: start;
}

@media (max-width: 1024px) {
  .blueprint-configurator-layout {
    grid-template-columns: 1fr;
  }
}

.blueprint-selectors-column {
  display: flex;
  flex-direction: column;
  gap: 28px;
}

.layer-group {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.layer-step-tag {
  font-family: var(--font-display);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.1em;
  color: var(--emerald-aurora);
  text-transform: uppercase;
}

.options-selector-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 12px;
}

.blueprint-option-btn {
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 14px;
  padding: 16px;
  text-align: left;
  cursor: pointer;
  transition: all 0.22s cubic-bezier(0.16, 1, 0.3, 1);
  display: flex;
  flex-direction: column;
  gap: 6px;
  position: relative;
}

.blueprint-option-btn:hover {
  background: rgba(255, 255, 255, 0.06);
  border-color: rgba(255, 255, 255, 0.2);
  transform: translateY(-2px);
}

.blueprint-option-btn.active {
  background: rgba(0, 229, 153, 0.08);
  border-color: var(--emerald-aurora);
  box-shadow: 0 0 20px rgba(0, 229, 153, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.2);
}

.opt-cat {
  font-family: var(--font-display);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.06em;
  color: var(--text-dim);
}

.blueprint-option-btn.active .opt-cat {
  color: var(--emerald-aurora);
}

.opt-name {
  font-size: 14px;
  font-weight: 700;
  color: #ffffff;
  line-height: 1.3;
}

.opt-desc {
  font-size: 11.5px;
  color: var(--text-sub);
  line-height: 1.45;
  margin: 0;
}

.opt-check-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.checked-indicator {
  width: 18px;
  height: 18px;
  background: var(--emerald-aurora);
  color: #04080f;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  font-weight: 800;
}

/* Right Column: Live Topology Canvas & Investment Estimator */
.blueprint-canvas-column {
  position: sticky;
  top: 100px;
}

.live-topology-card {
  background: rgba(5, 12, 22, 0.85);
  border: 1px solid rgba(0, 229, 153, 0.28);
  border-radius: 20px;
  padding: 24px;
  backdrop-filter: blur(20px);
  box-shadow: 0 16px 48px rgba(0, 0, 0, 0.6);
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.topology-card-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  padding-bottom: 14px;
}

.live-active-tag {
  font-family: var(--font-display);
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 0.06em;
  color: var(--emerald-aurora);
}

.topology-node-chain {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.topology-node {
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 12px;
  padding: 12px 14px;
  display: flex;
  align-items: center;
  gap: 12px;
}

.node-icon-box {
  width: 38px;
  height: 38px;
  background: rgba(0, 229, 153, 0.1);
  border: 1px solid rgba(0, 229, 153, 0.25);
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  flex-shrink: 0;
}

.node-details {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

.node-details small {
  font-family: var(--font-display);
  font-size: 9.5px;
  font-weight: 800;
  letter-spacing: 0.08em;
  color: var(--text-dim);
}

.node-details strong {
  font-size: 13px;
  color: #ffffff;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.tech-badge {
  font-size: 10.5px;
  color: var(--emerald-aurora);
}

.topology-connector-arrow {
  text-align: center;
  font-size: 10px;
  font-weight: 700;
  color: var(--text-dim);
  letter-spacing: 0.06em;
  padding: 2px 0;
}

.blueprint-investment-box {
  background: rgba(0, 0, 0, 0.4);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 14px;
  padding: 18px;
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.investment-header-row {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  padding-bottom: 12px;
}

.investment-header-row small {
  font-family: var(--font-display);
  font-size: 9.5px;
  font-weight: 800;
  letter-spacing: 0.08em;
  color: var(--text-dim);
  display: block;
  margin-bottom: 2px;
}

.emerald-highlight {
  font-size: 18px;
  color: var(--emerald-aurora);
  font-weight: 800;
}

.white-highlight {
  font-size: 16px;
  color: #ffffff;
  font-weight: 700;
}

.blueprint-features-list {
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-size: 11.5px;
  color: var(--text-sub);
}

.blueprint-features-list div {
  display: flex;
  align-items: center;
  gap: 6px;
}

.blueprint-features-list div svg {
  color: var(--emerald-aurora);
  width: 13px;
  height: 13px;
  flex-shrink: 0;
}

.blueprint-actions-grid {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-top: 4px;
}

/* ==========================================================================
   SECTION 30: FIMRIQ STUDIO, SAAS TAX CALCULATOR & AUDIT WIZARD UI/UX
   ========================================================================== */

/* 1. FIMRIQ STUDIO */
.studio-card-container {
  max-width: var(--content-max);
  margin: var(--section-space) auto;
  padding: 0 var(--gutter);
  box-sizing: border-box;
}

.studio-top-bar {
  background: var(--card-bg);
  border: 1px solid var(--card-border);
  border-radius: 20px 20px 0 0;
  padding: 20px 28px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 20px;
  backdrop-filter: blur(20px);
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

@media (max-width: 900px) {
  .studio-top-bar {
    flex-direction: column;
    align-items: flex-start;
  }
}

.studio-client-identity {
  display: flex;
  align-items: center;
  gap: 14px;
}

.studio-live-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--emerald-aurora);
  box-shadow: 0 0 12px var(--emerald-aurora);
  animation: pulse 2s infinite;
}

.studio-client-title {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.studio-client-title strong {
  font-family: var(--font-display);
  font-size: 14px;
  color: #ffffff;
}

.studio-env-pill {
  font-size: 11px;
  font-weight: 700;
  background: rgba(0, 229, 153, 0.12);
  color: var(--emerald-aurora);
  border: 1px solid rgba(0, 229, 153, 0.3);
  padding: 2px 8px;
  border-radius: 6px;
}

.studio-meta-sub {
  font-size: 11px;
  color: var(--text-dim);
  font-family: var(--font-mono);
  display: block;
  margin-top: 2px;
}

.studio-top-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.studio-tab-pill {
  font-family: var(--font-display);
  font-size: 12.5px;
  font-weight: 600;
  color: var(--text-sub);
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.08);
  padding: 6px 14px;
  border-radius: 9999px;
  cursor: pointer;
  transition: all 0.2s ease;
}

.studio-tab-pill:hover {
  background: rgba(255, 255, 255, 0.08);
  color: #ffffff;
}

.studio-tab-pill.active {
  background: rgba(0, 229, 153, 0.15);
  border-color: var(--emerald-aurora);
  color: #ffffff;
}

.studio-milestones-view,
.studio-git-view,
.studio-vpc-view {
  background: var(--card-bg);
  border: 1px solid var(--card-border);
  border-top: none;
  border-radius: 0 0 20px 20px;
  padding: clamp(24px, 3.5vw, 36px);
  backdrop-filter: blur(20px);
  box-shadow: 0 24px 64px rgba(0, 0, 0, 0.5);
}

.milestone-stepper-row {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 14px;
  margin-bottom: 28px;
}

.milestone-step-card {
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 14px;
  padding: 16px;
  text-align: left;
  cursor: pointer;
  transition: all 0.2s ease;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.milestone-step-card:hover {
  background: rgba(255, 255, 255, 0.06);
  border-color: rgba(255, 255, 255, 0.2);
}

.milestone-step-card.active {
  background: rgba(0, 229, 153, 0.06);
  border-color: var(--emerald-aurora);
  box-shadow: 0 0 20px rgba(0, 229, 153, 0.15);
}

.step-card-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.sprint-num {
  font-family: var(--font-display);
  font-size: 10px;
  font-weight: 800;
  color: var(--text-dim);
}

.status-tag {
  font-size: 9.5px;
  font-weight: 800;
  padding: 2px 6px;
  border-radius: 4px;
}

.status-tag.completed {
  background: rgba(0, 229, 153, 0.15);
  color: var(--emerald-aurora);
}

.status-tag.active {
  background: rgba(6, 182, 212, 0.15);
  color: var(--cyan-glow);
}

.status-tag.upcoming {
  background: rgba(255, 255, 255, 0.05);
  color: var(--text-dim);
}

.step-name {
  font-size: 13px;
  color: #ffffff;
  line-height: 1.3;
}

.progress-bar-container {
  width: 100%;
  height: 4px;
  background: rgba(255, 255, 255, 0.08);
  border-radius: 9999px;
  overflow: hidden;
}

.progress-bar-fill {
  height: 100%;
  background: var(--emerald-aurora);
  border-radius: 9999px;
  transition: width 0.3s ease;
}

.step-footer-row {
  display: flex;
  justify-content: space-between;
  font-size: 11px;
  color: var(--text-dim);
}

.active-sprint-panel {
  background: rgba(0, 0, 0, 0.35);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 16px;
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.sprint-panel-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 20px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
  padding-bottom: 16px;
}

.sprint-panel-header h3 {
  font-size: 18px;
  margin: 6px 0 4px;
  color: #ffffff;
}

.sprint-panel-header p {
  font-size: 13px;
  color: var(--text-sub);
}

.sprint-kpi-badge {
  text-align: right;
  flex-shrink: 0;
}

.kpi-num {
  font-size: 28px;
  font-weight: 800;
  color: var(--emerald-aurora);
  display: block;
  line-height: 1;
}

.sprint-kpi-badge small {
  font-size: 10px;
  font-weight: 700;
  color: var(--text-dim);
}

.sprint-tasks-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.task-row-card {
  background: rgba(255, 255, 255, 0.02);
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 10px;
  padding: 14px 16px;
  display: flex;
  align-items: flex-start;
  gap: 14px;
  cursor: pointer;
  transition: all 0.2s ease;
}

.task-row-card:hover {
  background: rgba(255, 255, 255, 0.05);
  border-color: rgba(255, 255, 255, 0.15);
}

.task-row-card.completed {
  border-color: rgba(0, 229, 153, 0.25);
  background: rgba(0, 229, 153, 0.02);
}

.task-checkbox-box {
  padding-top: 2px;
}

.task-checkbox {
  width: 20px;
  height: 20px;
  border-radius: 6px;
  border: 1px solid rgba(255, 255, 255, 0.2);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  color: #03070d;
  font-weight: 800;
  transition: all 0.2s ease;
}

.task-checkbox.checked {
  background: var(--emerald-aurora);
  border-color: var(--emerald-aurora);
}

.task-content {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.task-title {
  font-size: 14px;
  color: #ffffff;
}

.task-row-card.completed .task-title {
  text-decoration: line-through;
  color: var(--text-dim);
}

.task-meta {
  display: flex;
  gap: 14px;
  font-size: 11.5px;
  color: var(--text-dim);
  flex-wrap: wrap;
}

.task-assignee {
  color: var(--emerald-aurora);
}

.staging-preview-deploy-box {
  background: rgba(0, 229, 153, 0.04);
  border: 1px solid rgba(0, 229, 153, 0.2);
  border-radius: 12px;
  padding: 16px 20px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 20px;
  flex-wrap: wrap;
}

.staging-preview-deploy-box strong {
  font-size: 13.5px;
  color: #ffffff;
  display: block;
}

.staging-preview-deploy-box p {
  font-size: 12px;
  color: var(--text-sub);
  margin-top: 2px;
}

.preview-deployed-alert {
  display: flex;
  align-items: center;
  gap: 10px;
  color: var(--emerald-aurora);
}

.preview-link {
  font-family: var(--font-mono);
  font-size: 12px;
  color: var(--emerald-aurora);
  text-decoration: underline;
}

.studio-git-view {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.git-view-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  padding-bottom: 14px;
}

.git-view-header h4 {
  font-size: 16px;
  color: #ffffff;
  margin: 0;
}

.git-branch-tag {
  font-family: var(--font-mono);
  font-size: 11.5px;
  color: var(--emerald-aurora);
  background: rgba(0, 229, 153, 0.1);
  padding: 3px 8px;
  border-radius: 6px;
}

.git-commit-timeline {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.git-commit-item {
  background: rgba(255, 255, 255, 0.02);
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 10px;
  padding: 12px 16px;
  display: flex;
  align-items: flex-start;
  gap: 14px;
}

.commit-hash {
  font-family: var(--font-mono);
  font-size: 12px;
  font-weight: 700;
  color: var(--emerald-aurora);
  background: rgba(0, 229, 153, 0.12);
  padding: 3px 8px;
  border-radius: 6px;
  flex-shrink: 0;
}

.commit-details {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.commit-details strong {
  font-size: 13px;
  color: #ffffff;
}

.commit-details small {
  font-size: 11.5px;
  color: var(--text-dim);
}

.studio-vpc-view {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.vpc-kpi-cards-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 16px;
}

.vpc-kpi-card {
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 14px;
  padding: 18px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.vpc-kpi-card small {
  font-family: var(--font-display);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.08em;
  color: var(--text-dim);
}

.emerald-text {
  font-size: 22px;
  color: var(--emerald-aurora);
  font-weight: 800;
}

.vpc-kpi-card span {
  font-size: 11.5px;
  color: var(--text-sub);
}

.vpc-architecture-box {
  background: rgba(0, 229, 153, 0.04);
  border: 1px solid rgba(0, 229, 153, 0.2);
  border-radius: 14px;
  padding: 20px;
}

.arch-head {
  display: flex;
  align-items: flex-start;
  gap: 14px;
}

.arch-head svg {
  color: var(--emerald-aurora);
  width: 24px;
  height: 24px;
  flex-shrink: 0;
  margin-top: 2px;
}

.arch-head strong {
  font-size: 14.5px;
  color: #ffffff;
  display: block;
}

.arch-head p {
  font-size: 12.5px;
  color: var(--text-sub);
  margin-top: 4px;
  line-height: 1.5;
}

/* 2. SAAS TAX CALCULATOR */
.saas-tax-calc-card {
  background: var(--card-bg);
  border: 1px solid var(--card-border);
  border-radius: 24px;
  padding: clamp(28px, 3.5vw, 44px);
  backdrop-filter: blur(24px);
  box-shadow: 0 24px 64px rgba(0, 0, 0, 0.5);
  margin-top: 36px;
}

.calc-header-row {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 28px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  padding-bottom: 24px;
  margin-bottom: 28px;
}

@media (max-width: 900px) {
  .calc-header-row {
    flex-direction: column;
  }
}

.calc-title {
  font-size: clamp(22px, 2.4vw, 32px);
  color: #ffffff;
  margin: 6px 0 8px;
}

.calc-subtitle {
  font-size: 14.5px;
  color: var(--text-sub);
  max-width: 680px;
}

.calc-crossover-badge {
  background: rgba(0, 229, 153, 0.08);
  border: 1px solid rgba(0, 229, 153, 0.3);
  border-radius: 14px;
  padding: 14px 20px;
  text-align: center;
  min-width: 170px;
  flex-shrink: 0;
}

.calc-crossover-badge small {
  font-size: 9.5px;
  font-weight: 800;
  color: var(--emerald-aurora);
  display: block;
}

.calc-crossover-badge strong {
  font-size: 22px;
  color: #ffffff;
  display: block;
}

.calc-crossover-badge span {
  font-size: 10.5px;
  color: var(--text-dim);
}

.saas-calc-grid {
  display: grid;
  grid-template-columns: 1.15fr 0.85fr;
  gap: 32px;
  align-items: start;
}

@media (max-width: 1024px) {
  .saas-calc-grid {
    grid-template-columns: 1fr;
  }
}

.calc-inputs-pane {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.seat-slider-box {
  background: rgba(255, 255, 255, 0.02);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 14px;
  padding: 18px 20px;
}

.seat-num-text {
  font-size: 18px;
  color: var(--emerald-aurora);
  font-weight: 800;
}

.saas-tools-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 12px;
  margin-top: 10px;
}

.saas-tool-card {
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 12px;
  padding: 14px;
  text-align: left;
  cursor: pointer;
  transition: all 0.2s ease;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.saas-tool-card:hover {
  background: rgba(255, 255, 255, 0.06);
  border-color: rgba(255, 255, 255, 0.18);
}

.saas-tool-card.selected {
  background: rgba(0, 229, 153, 0.06);
  border-color: var(--emerald-aurora);
  box-shadow: 0 0 16px rgba(0, 229, 153, 0.12);
}

.tool-card-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.tool-check {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.08);
  color: var(--text-dim);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
}

.tool-check.checked {
  background: var(--emerald-aurora);
  color: #03070d;
  font-weight: 800;
}

.tool-name {
  font-size: 13px;
  color: #ffffff;
  line-height: 1.3;
}

.tool-cost-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 11px;
  color: var(--text-dim);
}

.tool-price {
  color: var(--emerald-aurora);
  font-weight: 700;
}

.results-inner-card {
  background: rgba(5, 12, 22, 0.85);
  border: 1px solid rgba(0, 229, 153, 0.28);
  border-radius: 18px;
  padding: 22px;
  display: flex;
  flex-direction: column;
  gap: 18px;
}

.results-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  padding-bottom: 12px;
}

.res-tag {
  font-family: var(--font-display);
  font-size: 10.5px;
  font-weight: 800;
  color: var(--text-dim);
}

.res-highlight {
  font-size: 13px;
  font-weight: 800;
  color: var(--emerald-aurora);
}

.ledger-comparison-table {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.ledger-row {
  display: grid;
  grid-template-columns: 1.2fr 1fr 1.2fr;
  font-size: 12.5px;
  padding: 8px 10px;
  border-radius: 8px;
  align-items: center;
  background: rgba(255, 255, 255, 0.02);
}

.ledger-row.header {
  font-family: var(--font-display);
  font-size: 10px;
  font-weight: 800;
  color: var(--text-dim);
  background: transparent;
}

.saas-num {
  color: #f87171;
  font-weight: 600;
}

.saas-num.strike {
  text-decoration: line-through;
  opacity: 0.8;
}

.fimriq-col {
  color: var(--text-main);
  font-weight: 600;
  text-align: right;
}

.fimriq-col.highlight {
  color: var(--emerald-aurora);
  font-weight: 800;
}

.savings-callout-box {
  background: rgba(0, 229, 153, 0.08);
  border: 1px solid rgba(0, 229, 153, 0.25);
  border-radius: 12px;
  padding: 14px;
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: 12px;
}

.savings-callout-box strong {
  color: var(--emerald-aurora);
  display: block;
}

.savings-callout-box p {
  color: var(--text-sub);
  margin-top: 2px;
}

.calc-cta-group {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

/* 3. ARCHITECTURE AUDIT WIZARD */
.audit-wizard-card {
  max-width: var(--content-max);
  margin: var(--section-space) auto;
  padding: 0 var(--gutter);
  box-sizing: border-box;
}

.wizard-progress-bar-row {
  background: var(--card-bg);
  border: 1px solid var(--card-border);
  border-radius: 20px 20px 0 0;
  padding: 22px 28px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 20px;
  backdrop-filter: blur(20px);
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.wizard-step-info h3 {
  font-size: 20px;
  color: #ffffff;
  margin-top: 4px;
}

.wizard-step-badges {
  display: flex;
  gap: 8px;
}

.wizard-step-dot {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.1);
  color: var(--text-dim);
  font-family: var(--font-display);
  font-size: 11px;
  font-weight: 800;
  display: flex;
  align-items: center;
  justify-content: center;
}

.wizard-step-dot.active {
  background: rgba(0, 229, 153, 0.15);
  border-color: var(--emerald-aurora);
  color: #ffffff;
}

.wizard-step-dot.completed {
  background: var(--emerald-aurora);
  border-color: var(--emerald-aurora);
  color: #03070d;
}

.wizard-step-body {
  background: var(--card-bg);
  border: 1px solid var(--card-border);
  border-top: none;
  border-radius: 0 0 20px 20px;
  padding: clamp(24px, 3.5vw, 36px);
  backdrop-filter: blur(20px);
  box-shadow: 0 24px 64px rgba(0, 0, 0, 0.5);
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.step-intro h4 {
  font-size: 18px;
  color: #ffffff;
  margin-bottom: 6px;
}

.step-intro p {
  font-size: 13.5px;
  color: var(--text-sub);
}

.audit-options-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 14px;
}

.audit-choice-card {
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 14px;
  padding: 18px;
  text-align: left;
  cursor: pointer;
  transition: all 0.2s ease;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.audit-choice-card:hover {
  background: rgba(255, 255, 255, 0.06);
  border-color: rgba(255, 255, 255, 0.2);
}

.audit-choice-card.selected {
  background: rgba(0, 229, 153, 0.06);
  border-color: var(--emerald-aurora);
  box-shadow: 0 0 20px rgba(0, 229, 153, 0.15);
}

.choice-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.choice-cat {
  font-family: var(--font-display);
  font-size: 10px;
  font-weight: 800;
  color: var(--text-dim);
}

.choice-check {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.08);
  color: var(--text-dim);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
}

.choice-check.checked {
  background: var(--emerald-aurora);
  color: #03070d;
  font-weight: 800;
}

.scale-config-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
}

@media (max-width: 800px) {
  .scale-config-grid {
    grid-template-columns: 1fr;
  }
}

.config-block {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.config-block label {
  font-family: var(--font-display);
  font-size: 10.5px;
  font-weight: 800;
  color: var(--text-dim);
}

.pill-selector-row {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.pill-btn {
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 10px;
  padding: 10px 14px;
  text-align: left;
  font-size: 13px;
  color: var(--text-sub);
  cursor: pointer;
  transition: all 0.2s ease;
}

.pill-btn:hover {
  background: rgba(255, 255, 255, 0.06);
}

.pill-btn.active {
  background: rgba(0, 229, 153, 0.1);
  border-color: var(--emerald-aurora);
  color: #ffffff;
  font-weight: 700;
}

.wizard-nav-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
  padding-top: 18px;
}

.audit-results-card {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.score-hero-row {
  display: flex;
  align-items: center;
  gap: 24px;
  background: rgba(0, 0, 0, 0.4);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 16px;
  padding: 24px;
}

@media (max-width: 768px) {
  .score-hero-row {
    flex-direction: column;
    text-align: center;
  }
}

.score-badge {
  width: 100px;
  height: 100px;
  border-radius: 50%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.score-badge.critical {
  background: rgba(239, 68, 68, 0.15);
  border: 2px solid #ef4444;
  color: #ef4444;
}

.score-badge.warning {
  background: rgba(245, 158, 11, 0.15);
  border: 2px solid #f59e0b;
  color: #f59e0b;
}

.score-badge.optimal {
  background: rgba(0, 229, 153, 0.15);
  border: 2px solid var(--emerald-aurora);
  color: var(--emerald-aurora);
}

.score-num {
  font-size: 32px;
  font-weight: 900;
  line-height: 1;
}

.score-out-of {
  font-size: 11px;
  font-weight: 700;
}

.risk-pill {
  font-family: var(--font-display);
  font-size: 10.5px;
  font-weight: 800;
  padding: 3px 10px;
  border-radius: 9999px;
  display: inline-block;
  margin-bottom: 8px;
}

.risk-pill.critical {
  background: rgba(239, 68, 68, 0.2);
  color: #f87171;
  border: 1px solid #ef4444;
}

.risk-pill.warning {
  background: rgba(245, 158, 11, 0.2);
  color: #fbbf24;
  border: 1px solid #f59e0b;
}

.risk-pill.optimal {
  background: rgba(0, 229, 153, 0.2);
  color: var(--emerald-aurora);
  border: 1px solid var(--emerald-aurora);
}

.roadmap-recommendations-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 14px;
}

.rec-card {
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 12px;
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.rec-step {
  font-family: var(--font-display);
  font-size: 9.5px;
  font-weight: 800;
  color: var(--emerald-aurora);
}

.rec-card strong {
  font-size: 13.5px;
  color: #ffffff;
}

.rec-card p {
  font-size: 12px;
  color: var(--text-sub);
  line-height: 1.45;
}

.audit-action-banner {
  background: rgba(0, 229, 153, 0.06);
  border: 1px solid rgba(0, 229, 153, 0.25);
  border-radius: 16px;
  padding: 20px 24px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 20px;
  flex-wrap: wrap;
}

.action-buttons-group {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

















/* ==========================================================================
   FIMRIQ PRODUCTION THEME EXTENSIONS — 100% COVERAGE FOR ALL 28 TEMPLATES
   Nordic Titanium & Emerald Aurora Design System 3.0
   ========================================================================== */

/* 1. Currency Switcher Dropdown & Live Dot */
.currency-dropdown-wrap {
  position: relative;
  display: inline-block;
}

.currency-trigger-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 9999px;
  padding: 6px 14px;
  font-family: var(--font-display);
  font-size: 13px;
  font-weight: 600;
  color: var(--text-sub);
  transition: all 0.2s ease;
  cursor: pointer;
}

.currency-trigger-btn:hover {
  background: rgba(255, 255, 255, 0.1);
  border-color: var(--emerald-aurora);
  color: #fff;
}

.currency-flag {
  font-size: 14px;
}

.currency-code {
  font-weight: 700;
  color: #fff;
}

.currency-chevron {
  font-size: 10px;
  opacity: 0.6;
}

.currency-menu-card {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  width: 260px;
  background: rgba(10, 19, 32, 0.95);
  border: 1px solid rgba(255, 255, 255, 0.14);
  backdrop-filter: blur(24px);
  border-radius: 16px;
  padding: 12px;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.8), 0 0 20px rgba(0, 229, 153, 0.1);
  z-index: 1000;
}

.currency-menu-title {
  display: block;
  font-family: var(--font-display);
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 0.1em;
  color: var(--text-dim);
  margin-bottom: 8px;
  padding-left: 4px;
}

.currency-option-item,
.currency-menu-item {
  display: flex;
  align-items: center;
  width: 100%;
  gap: 12px;
  padding: 8px 10px;
  border-radius: 10px;
  background: transparent;
  border: none;
  color: var(--text-sub);
  cursor: pointer;
  transition: all 0.15s ease;
  text-align: left;
}

.currency-option-item:hover,
.currency-menu-item:hover {
  background: rgba(255, 255, 255, 0.08);
  color: #fff;
}

.currency-option-item.active,
.currency-menu-item.active {
  background: rgba(0, 229, 153, 0.12);
  color: var(--emerald-aurora);
}

.opt-flag,
.flag-icon {
  font-size: 16px;
  flex-shrink: 0;
}

.opt-text {
  flex-grow: 1;
}

.opt-text strong {
  display: block;
  font-size: 13px;
  font-weight: 600;
  color: inherit;
}

.opt-text small {
  display: block;
  font-size: 11px;
  color: var(--text-muted);
}

.menu-check {
  font-size: 13px;
  font-weight: 700;
  color: var(--emerald-aurora);
}

.live-dot-pulse {
  display: inline-block;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--emerald-aurora);
  box-shadow: 0 0 10px var(--emerald-aurora);
  animation: pulse 2s infinite;
}

.hero-btn-lg {
  padding: 14px 30px !important;
  font-size: 15.5px !important;
  font-weight: 700 !important;
}

/* 2. Footer CTA Band & Layout */
.footer-cta-band {
  background: linear-gradient(180deg, rgba(10, 19, 32, 0) 0%, rgba(10, 19, 32, 0.85) 100%);
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  padding: clamp(48px, 6vw, 84px) var(--gutter);
}

.footer-cta-inner {
  max-width: var(--content-max);
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 32px;
}

.footer-cta-copy {
  max-width: 680px;
}

.footer-cta-copy h2 {
  font-size: clamp(32px, 3.8vw, 48px);
  margin: 12px 0 16px;
  line-height: 1.1;
}

.footer-cta-copy p {
  font-size: 17px;
  color: var(--text-sub);
  line-height: 1.6;
}

.footer-cta-actions {
  display: flex;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
}

.footer-btn-lg {
  padding: 14px 28px !important;
  font-size: 15px !important;
}

.footer-brand-column {
  max-width: 320px;
}

/* 3. Modal Project Intake Dialog & Forms */
.project-modal-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(2, 6, 15, 0.85);
  backdrop-filter: blur(16px);
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  overflow-y: auto;
}

.project-modal-dialog {
  background: rgba(10, 19, 32, 0.95);
  border: 1px solid rgba(0, 229, 153, 0.25);
  border-radius: 24px;
  padding: clamp(28px, 4vw, 44px);
  max-width: 680px;
  width: 100%;
  position: relative;
  box-shadow: 0 30px 80px rgba(0, 0, 0, 0.9), 0 0 30px rgba(0, 229, 153, 0.15);
}

.modal-close-btn {
  position: absolute;
  top: 20px;
  right: 20px;
  width: 36px;
  height: 36px;
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 50%;
  color: var(--text-sub);
  font-size: 20px;
  line-height: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.2s ease;
}

.modal-close-btn:hover {
  background: rgba(255, 255, 255, 0.15);
  color: #fff;
}

.modal-step-tag {
  font-family: var(--font-display);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.14em;
  color: var(--emerald-aurora);
  display: inline-block;
  margin-bottom: 8px;
}

.modal-header h3 {
  font-size: clamp(22px, 2.5vw, 30px);
  margin-bottom: 8px;
}

.modal-header p {
  color: var(--text-muted);
  font-size: 14.5px;
  margin-bottom: 24px;
}

.form-step {
  margin-bottom: 24px;
}

.form-label {
  display: block;
  font-family: var(--font-display);
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: 0.1em;
  color: var(--text-muted);
  margin-bottom: 12px;
}

.form-options-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
}

.budget-grid {
  grid-template-columns: repeat(3, 1fr) !important;
}

.opt-card {
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.09);
  border-radius: 14px;
  padding: 16px;
  cursor: pointer;
  transition: all 0.2s ease;
  display: block;
  position: relative;
}

.opt-card input[type="radio"] {
  position: absolute;
  opacity: 0;
}

.opt-card:hover {
  background: rgba(255, 255, 255, 0.06);
  border-color: rgba(255, 255, 255, 0.2);
}

.opt-card.selected,
.opt-card:has(input:checked) {
  background: rgba(0, 229, 153, 0.08);
  border-color: var(--emerald-aurora);
  box-shadow: 0 0 16px rgba(0, 229, 153, 0.15);
}

.opt-card strong {
  display: block;
  font-family: var(--font-display);
  font-size: 14px;
  color: #fff;
  margin-bottom: 4px;
}

.opt-card small {
  display: block;
  font-size: 12px;
  color: var(--text-muted);
  line-height: 1.4;
}

.form-textarea {
  width: 100%;
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 14px;
  padding: 14px 16px;
  color: #fff;
  font-size: 14.5px;
  line-height: 1.5;
  resize: vertical;
  transition: border-color 0.2s ease;
}

.form-textarea:focus {
  border-color: var(--emerald-aurora);
  outline: none;
  box-shadow: 0 0 16px rgba(0, 229, 153, 0.15);
}

.form-inputs-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 14px;
}

.form-field label {
  display: block;
  font-family: var(--font-display);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.1em;
  color: var(--text-muted);
  margin-bottom: 6px;
}

.form-field input {
  width: 100%;
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 12px;
  padding: 12px 14px;
  color: #fff;
  font-size: 14px;
  transition: border-color 0.2s ease;
}

.form-field input:focus {
  border-color: var(--emerald-aurora);
  outline: none;
  box-shadow: 0 0 14px rgba(0, 229, 153, 0.15);
}

.modal-form-actions {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 12px;
  margin-top: 24px;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  padding-top: 20px;
}

.modal-feedback {
  margin-top: 16px;
  padding: 14px 18px;
  border-radius: 12px;
  font-size: 14px;
}

.modal-feedback.success {
  background: rgba(0, 229, 153, 0.12);
  border: 1px solid rgba(0, 229, 153, 0.35);
  color: #fff;
}

.modal-feedback.error {
  background: rgba(239, 68, 68, 0.12);
  border: 1px solid rgba(239, 68, 68, 0.35);
  color: #fca5a5;
}

/* 4. Services Deep Dive & Delivery Lifecycle */
.capabilities-deep-dive {
  max-width: var(--content-max);
  margin: 0 auto var(--section-space);
  padding: 0 var(--gutter);
  display: flex;
  flex-direction: column;
  gap: clamp(40px, 5vw, 64px);
}

.pillar-section {
  background: var(--card-bg);
  border: 1px solid var(--card-border);
  backdrop-filter: blur(20px);
  border-radius: 28px;
  padding: clamp(32px, 4vw, 48px);
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.08);
}

.pillar-header {
  max-width: 760px;
  margin-bottom: 32px;
}

.pillar-header h2 {
  font-size: clamp(26px, 3vw, 36px);
  margin: 12px 0 14px;
}

.pillar-header p {
  font-size: 16px;
  color: var(--text-sub);
  line-height: 1.6;
}

.pillar-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}

.feature-box {
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 16px;
  padding: 24px;
  transition: all 0.25s ease;
}

.feature-box:hover {
  background: rgba(255, 255, 255, 0.06);
  border-color: rgba(0, 229, 153, 0.3);
  transform: translateY(-2px);
}

.feature-box h4 {
  font-size: 18px;
  margin-bottom: 10px;
  color: #fff;
}

.feature-box p {
  font-size: 14px;
  color: var(--text-sub);
  line-height: 1.55;
}

.lifecycle-section {
  max-width: var(--content-max);
  margin: 0 auto var(--section-space);
  padding: 0 var(--gutter);
}

.lifecycle-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
  margin-top: 36px;
}

.lifecycle-card {
  background: var(--card-bg);
  border: 1px solid var(--card-border);
  backdrop-filter: blur(16px);
  border-radius: 20px;
  padding: 28px;
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.08);
  transition: all 0.25s ease;
}

.lifecycle-card:hover {
  border-color: rgba(0, 229, 153, 0.35);
  transform: translateY(-3px);
}

.step-badge {
  display: inline-block;
  font-family: var(--font-display);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.12em;
  color: var(--emerald-aurora);
  background: rgba(0, 229, 153, 0.12);
  border: 1px solid rgba(0, 229, 153, 0.3);
  border-radius: 9999px;
  padding: 4px 12px;
  margin-bottom: 16px;
}

.lifecycle-card h4 {
  font-size: 20px;
  margin-bottom: 10px;
}

.lifecycle-card p {
  font-size: 14px;
  color: var(--text-sub);
  line-height: 1.55;
}

.cta-banner-section {
  max-width: var(--content-max);
  margin: 0 auto var(--section-space);
  padding: 0 var(--gutter);
}

.banner-inner {
  background: linear-gradient(135deg, rgba(10, 19, 32, 0.95) 0%, rgba(14, 26, 44, 0.95) 100%);
  border: 1px solid rgba(0, 229, 153, 0.3);
  border-radius: 28px;
  padding: clamp(36px, 5vw, 60px);
  text-align: center;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.6), inset 0 1px rgba(255, 255, 255, 0.12);
}

.banner-inner h3 {
  font-size: clamp(28px, 3.5vw, 42px);
  margin-bottom: 14px;
}

.banner-inner p {
  font-size: 17px;
  color: var(--text-sub);
  max-width: 640px;
  margin: 0 auto 28px;
  line-height: 1.6;
}

.banner-actions {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
}

/* 5. Products Catalog & Compliance */
.products-catalog-client-wrapper {
  max-width: var(--content-max);
  margin: 0 auto;
  padding: 0 var(--gutter);
}

.product-compliance-section {
  max-width: var(--content-max);
  margin: 0 auto var(--section-space);
  padding: 0 var(--gutter);
}

.compliance-inner {
  background: var(--card-bg);
  border: 1px solid var(--card-border);
  border-radius: 24px;
  padding: 32px;
  text-align: center;
}

.compliance-badges-row {
  display: flex;
  justify-content: center;
  gap: 14px;
  flex-wrap: wrap;
  margin-top: 20px;
}

.comp-badge {
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 9999px;
  padding: 6px 16px;
  font-family: var(--font-display);
  font-size: 12px;
  font-weight: 700;
  color: var(--emerald-aurora);
}

.sandbox-loading-placeholder {
  min-height: 300px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--text-dim);
  font-family: var(--font-mono);
  font-size: 14px;
}

/* 6. Case Studies Overviews & Deep-Dives */
.case-studies-overview-section {
  max-width: var(--content-max);
  margin: 0 auto var(--section-space);
  padding: 0 var(--gutter);
}

.case-studies-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 28px;
}

.case-study-card {
  background: var(--card-bg);
  border: 1px solid var(--card-border);
  backdrop-filter: blur(20px);
  border-radius: 24px;
  padding: clamp(28px, 3.5vw, 40px);
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.08);
  transition: all 0.25s ease;
  display: flex;
  flex-direction: column;
}

.case-study-card:hover {
  background: var(--card-bg-hover);
  border-color: var(--card-border-hover);
  transform: translateY(-4px);
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.5), 0 0 20px rgba(0, 229, 153, 0.15);
}

.case-card-header {
  margin-bottom: 16px;
}

.case-subtitle {
  font-size: 15px;
  color: var(--emerald-aurora);
  font-weight: 600;
  margin-bottom: 12px;
}

.case-summary {
  font-size: 14.5px;
  color: var(--text-sub);
  line-height: 1.6;
  margin-bottom: 24px;
  flex-grow: 1;
}

.case-metrics-strip {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.07);
  border-radius: 16px;
  padding: 16px;
  margin-bottom: 24px;
}

.case-actions {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
}

.case-metrics-section,
.case-architecture-section,
.case-narrative-section,
.case-roadmap-section,
.case-quote-section {
  max-width: var(--content-max);
  margin: 0 auto var(--section-space);
  padding: 0 var(--gutter);
}

.impact-metrics-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}

.impact-card {
  background: var(--card-bg);
  border: 1px solid var(--card-border);
  backdrop-filter: blur(16px);
  border-radius: 20px;
  padding: 28px;
  text-align: center;
}

.impact-highlight-badge {
  font-family: var(--font-display);
  font-size: clamp(32px, 3.5vw, 44px);
  font-weight: 800;
  color: var(--emerald-aurora);
  display: block;
  line-height: 1;
  margin-bottom: 8px;
}

.impact-label {
  font-family: var(--font-display);
  font-size: 12.5px;
  font-weight: 700;
  color: #fff;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

.narrative-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
}

.narrative-box {
  background: var(--card-bg);
  border: 1px solid var(--card-border);
  border-radius: 20px;
  padding: 32px;
}

.narrative-box h3 {
  font-size: 22px;
  margin-bottom: 14px;
}

.narrative-box p {
  font-size: 15px;
  color: var(--text-sub);
  line-height: 1.65;
}

.quote-card {
  background: linear-gradient(135deg, rgba(10, 19, 32, 0.9) 0%, rgba(14, 26, 44, 0.9) 100%);
  border: 1px solid rgba(0, 229, 153, 0.3);
  border-radius: 24px;
  padding: clamp(32px, 4vw, 48px);
  text-align: center;
  max-width: 900px;
  margin: 0 auto;
}

.quote-card blockquote {
  font-family: var(--font-display);
  font-size: clamp(20px, 2.5vw, 28px);
  color: #fff;
  font-weight: 600;
  margin: 0 0 20px;
  line-height: 1.4;
}

.before-after-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  margin-top: 16px;
}

.metric-before {
  background: rgba(239, 68, 68, 0.08);
  border: 1px solid rgba(239, 68, 68, 0.25);
  border-radius: 12px;
  padding: 12px 16px;
  color: #fca5a5;
  font-size: 13.5px;
}

.metric-after {
  background: rgba(0, 229, 153, 0.08);
  border: 1px solid rgba(0, 229, 153, 0.25);
  border-radius: 12px;
  padding: 12px 16px;
  color: var(--emerald-aurora);
  font-size: 13.5px;
  font-weight: 600;
}

/* 7. Pricing Packages & Calculators */
.pricing-packages-section,
.saas-tax-calculator-section,
.tco-comparison-section,
.booking-scheduler-section,
.booking-calendar-embed-section {
  max-width: var(--content-max);
  margin: 0 auto var(--section-space);
  padding: 0 var(--gutter);
}

.packages-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}

.package-tag {
  display: inline-block;
  font-family: var(--font-display);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.12em;
  color: var(--emerald-aurora);
  background: rgba(0, 229, 153, 0.12);
  border: 1px solid rgba(0, 229, 153, 0.3);
  border-radius: 9999px;
  padding: 4px 12px;
  margin-bottom: 16px;
}

.package-price {
  margin: 16px 0 20px;
}

.price-val {
  font-family: var(--font-display);
  font-size: 42px;
  font-weight: 800;
  color: #fff;
  line-height: 1;
}

.price-period {
  font-size: 13.5px;
  color: var(--text-muted);
  margin-left: 6px;
}

.package-desc {
  font-size: 14.5px;
  color: var(--text-sub);
  line-height: 1.6;
  margin-bottom: 24px;
}

.package-features {
  list-style: none;
  padding: 0;
  margin: 0 0 28px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.package-features li {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: 14px;
  color: var(--text-sub);
}

/* 8. Master Proposals & Blueprints */
.master-hero-stack {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 32px;
  background: var(--card-bg);
  border: 1px solid var(--card-border);
  border-radius: 28px;
  padding: clamp(32px, 4vw, 48px);
  margin-bottom: 48px;
}

.master-proposal-col-left,
.master-proposal-col-right {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.master-scope-summary-box {
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 20px;
  padding: 24px;
}

.scope-box-tag {
  font-family: var(--font-display);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.1em;
  color: var(--emerald-aurora);
  margin-bottom: 16px;
  display: block;
}

.scope-tier-item {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 13.5px;
  color: var(--text-sub);
  margin-bottom: 10px;
}

.tier-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--emerald-aurora);
}

.scope-doc-note {
  font-size: 12px;
  color: var(--text-dim);
  margin-top: 16px;
  display: block;
}

.proposal-library-section {
  max-width: var(--content-max);
  margin: 0 auto var(--section-space);
  padding: 0 var(--gutter);
}

.prop-num {
  font-family: var(--font-display);
  font-size: 12px;
  font-weight: 800;
  color: var(--emerald-aurora);
  margin-bottom: 8px;
  display: block;
}

.prop-actions {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 20px;
}

/* 9. Diagnostic Audit, CRM Hub, Status & Platforms */
.audit-wizard-section,
.crm-hub-section,
.platform-features-section,
.studio-demo-section,
.status-hero-section,
.system-nodes-section,
.regional-latency-section,
.insights-section,
.contact-page-section,
.about-section,
.use-cases-section,
.sitemap-section,
.legal-page-section {
  max-width: var(--content-max);
  margin: 0 auto var(--section-space);
  padding: 0 var(--gutter);
}

.insights-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}

.read-time {
  font-size: 12px;
  color: var(--text-dim);
}

.post-thumb {
  border-radius: 14px;
  overflow: hidden;
  margin-bottom: 16px;
}

.post-content {
  flex-grow: 1;
}

.post-date {
  font-size: 12px;
  color: var(--text-muted);
  margin-bottom: 8px;
  display: block;
}

.insight-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 18px;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  padding-top: 14px;
}

.contact-page-grid {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 40px;
}

.contact-form-pane,
.contact-info-pane {
  background: var(--card-bg);
  border: 1px solid var(--card-border);
  backdrop-filter: blur(20px);
  border-radius: 24px;
  padding: clamp(28px, 4vw, 44px);
}

.direct-methods-box {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin: 24px 0;
}

.direct-link-row {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 15px;
  color: var(--text-sub);
}

.offices-cards-list {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin-top: 24px;
}

.contact-office-card {
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 16px;
  padding: 20px;
}

.contact-office-card h4 {
  font-size: 16px;
  margin-bottom: 6px;
}

.office-tags {
  display: flex;
  gap: 8px;
  margin-top: 10px;
}

.values-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}

.value-card {
  background: var(--card-bg);
  border: 1px solid var(--card-border);
  border-radius: 20px;
  padding: 32px;
}

.use-case-card {
  background: var(--card-bg);
  border: 1px solid var(--card-border);
  border-radius: 20px;
  padding: 28px;
}

.use-case-outcomes {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: 16px;
}

.outcome-item {
  font-size: 13px;
  color: var(--text-muted);
}

.legal-content-prose {
  max-width: 860px;
  margin: 0 auto;
}

.legal-block {
  background: var(--card-bg);
  border: 1px solid var(--card-border);
  border-radius: 20px;
  padding: clamp(28px, 3.5vw, 40px);
  margin-bottom: 28px;
}

.legal-block h2 {
  font-size: 22px;
  margin-bottom: 14px;
}

.legal-block p {
  font-size: 15px;
  color: var(--text-sub);
  line-height: 1.65;
  margin-bottom: 14px;
}

.lead-text {
  font-size: 18px;
  color: var(--text-sub);
  line-height: 1.6;
}

.fimriq-breadcrumbs {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12.5px;
  color: var(--text-dim);
  margin-bottom: 24px;
}

.sep {
  opacity: 0.4;
}

.section-header {
  margin-bottom: 36px;
}

.section-intro {
  font-size: 16px;
  color: var(--text-sub);
  margin-top: 10px;
}

.card-head,
.info-card-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 14px;
}

.four-col {
  grid-template-columns: repeat(4, 1fr) !important;
}

.site-main {
  min-height: 80vh;
}

.amber {
  color: #f59e0b !important;
}

.green {
  color: var(--emerald-aurora) !important;
}

.purple {
  color: #a855f7 !important;
}

.dark-alt {
  background: rgba(15, 23, 42, 0.6) !important;
}

.address-text {
  font-size: 13.5px;
  color: var(--text-sub);
}

.tech-sub {
  font-size: 13px;
  color: var(--text-dim);
}

.metric-pill {
  background: rgba(0, 229, 153, 0.1);
  border: 1px solid rgba(0, 229, 153, 0.25);
  border-radius: 9999px;
  padding: 3px 10px;
  font-family: var(--font-display);
  font-size: 11px;
  font-weight: 700;
  color: var(--emerald-aurora);
}

.page-content-wrapper {
  max-width: var(--content-max);
  margin: 0 auto var(--section-space);
  padding: 0 var(--gutter);
}

/* Responsive adjustments */
@media (max-width: 1024px) {
  .pillar-grid,
  .lifecycle-grid,
  .packages-grid,
  .impact-metrics-grid,
  .values-grid,
  .insights-grid {
    grid-template-columns: repeat(2, 1fr) !important;
  }

  .master-hero-stack,
  .contact-page-grid {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 640px) {
  .pillar-grid,
  .lifecycle-grid,
  .packages-grid,
  .impact-metrics-grid,
  .values-grid,
  .insights-grid,
  .form-options-grid,
  .budget-grid,
  .form-inputs-grid,
  .case-studies-grid,
  .narrative-grid {
    grid-template-columns: 1fr !important;
  }
}



/* ==========================================================================
   FIMRIQ PRODUCTION UI/UX PERFECTION & SCREENSHOT DEFECT REMEDIATION
   Nordic Titanium & Emerald Aurora Design System 3.0
   ========================================================================== */

/* 1. Global Page Hero & Eyebrow Collision Fix (Screenshots 2, 3, 4, 5, 9, 10) */
.page-hero {
  position: relative !important;
  max-width: 1240px !important;
  margin: 0 auto !important;
  padding: 130px 24px 44px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 16px !important;
  z-index: 1 !important;
  box-sizing: border-box !important;
}

.page-hero .eyebrow,
.eyebrow,
.section-tag {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  font-family: var(--font-display, "Space Grotesk", sans-serif) !important;
  font-size: 11.5px !important;
  font-weight: 700 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  color: #00e599 !important;
  background: rgba(0, 229, 153, 0.08) !important;
  border: 1px solid rgba(0, 229, 153, 0.25) !important;
  padding: 6px 14px !important;
  border-radius: 9999px !important;
  margin-bottom: 6px !important;
  box-shadow: 0 2px 10px rgba(0, 229, 153, 0.08) !important;
  line-height: 1.4 !important;
  position: static !important;
  width: auto !important;
  box-sizing: border-box !important;
}

.eyebrow span,
.section-tag span {
  display: inline-block !important;
  width: 7px !important;
  height: 7px !important;
  border-radius: 50% !important;
  background: #00e599 !important;
  box-shadow: 0 0 10px #00e599 !important;
  flex-shrink: 0 !important;
}

.page-hero h1 {
  font-family: var(--font-display, "Space Grotesk", sans-serif) !important;
  font-size: clamp(2.4rem, 5.2vw, 4.4rem) !important;
  font-weight: 700 !important;
  line-height: 1.06 !important;
  letter-spacing: -0.035em !important;
  color: #f8fafc !important;
  margin: 0 !important;
  position: static !important;
}

.page-hero h1 em {
  font-style: normal !important;
  background: linear-gradient(135deg, #00e599 0%, #38bdf8 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}

.page-hero .lead,
.page-hero > p:not(.eyebrow) {
  font-size: clamp(1.05rem, 1.8vw, 1.25rem) !important;
  line-height: 1.6 !important;
  color: #94a3b8 !important;
  max-width: 760px !important;
  margin: 0 !important;
}

/* 2. Sticky Header Blur & Background Opacity */
.site-header {
  position: sticky !important;
  top: 0 !important;
  z-index: 1000 !important;
  background: rgba(4, 8, 15, 0.94) !important;
  backdrop-filter: blur(20px) !important;
  -webkit-backdrop-filter: blur(20px) !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
  padding: 12px 24px !important;
}

.header-inner {
  max-width: 1240px !important;
  margin: 0 auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 20px !important;
}

/* 3. SaaS Seat Tax Calculator Formatting (Screenshot 6) */
.calculator-card {
  background: rgba(10, 19, 32, 0.85) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  border-radius: 24px !important;
  padding: clamp(24px, 4vw, 48px) !important;
  max-width: 1240px !important;
  margin: 0 auto 60px !important;
  backdrop-filter: blur(16px) !important;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.6) !important;
}

.calc-header {
  margin-bottom: 24px !important;
}

.calc-header h2 {
  font-size: clamp(24px, 3.2vw, 36px) !important;
  margin: 12px 0 8px 0 !important;
}

.calc-body-grid {
  display: grid !important;
  grid-template-columns: 1.2fr 1fr !important;
  gap: 36px !important;
  margin-top: 28px !important;
}

.control-label-row {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  margin-bottom: 8px !important;
}

.control-label {
  display: block !important;
  font-family: var(--font-display, "Space Grotesk", sans-serif) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.1em !important;
  color: #94a3b8 !important;
  margin-bottom: 12px !important;
  text-transform: uppercase !important;
}

.calc-range-slider {
  width: 100% !important;
  height: 8px !important;
  border-radius: 4px !important;
  background: rgba(255, 255, 255, 0.1) !important;
  accent-color: #00e599 !important;
  cursor: pointer !important;
  margin-top: 8px !important;
}

.slider-marks {
  display: flex !important;
  justify-content: space-between !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  color: #94a3b8 !important;
  margin-top: 8px !important;
  padding: 0 4px !important;
}

.tools-checkbox-grid {
  display: grid !important;
  grid-template-columns: repeat(2, 1fr) !important;
  gap: 12px !important;
  margin-top: 12px !important;
}

.tool-checkbox-item {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 12px 14px !important;
  background: rgba(255, 255, 255, 0.03) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  border-radius: 12px !important;
  cursor: pointer !important;
  transition: all 0.2s ease !important;
}

.tool-checkbox-item:hover {
  background: rgba(255, 255, 255, 0.06) !important;
  border-color: rgba(255, 255, 255, 0.18) !important;
}

.tool-checkbox-item.checked {
  background: rgba(0, 229, 153, 0.08) !important;
  border-color: rgba(0, 229, 153, 0.35) !important;
}

.tool-icon {
  font-size: 20px !important;
  flex-shrink: 0 !important;
}

.tool-info {
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
}

.tool-info strong {
  font-size: 13px !important;
  color: #f1f5f9 !important;
}

.tool-info small {
  font-size: 11.5px !important;
  color: #94a3b8 !important;
}

.savings-highlight-box {
  background: linear-gradient(135deg, rgba(0, 229, 153, 0.12) 0%, rgba(56, 189, 248, 0.08) 100%) !important;
  border: 1px solid rgba(0, 229, 153, 0.3) !important;
  border-radius: 18px !important;
  padding: 24px !important;
  text-align: center !important;
  margin-bottom: 20px !important;
}

.crossover-badge {
  display: inline-block !important;
  font-family: var(--font-display, "Space Grotesk", sans-serif) !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  color: #00e599 !important;
  background: rgba(0, 229, 153, 0.15) !important;
  padding: 4px 12px !important;
  border-radius: 9999px !important;
  margin-bottom: 8px !important;
}

.savings-huge-val {
  font-family: var(--font-display, "Space Grotesk", sans-serif) !important;
  font-size: clamp(36px, 4vw, 48px) !important;
  font-weight: 700 !important;
  color: #00e599 !important;
  text-shadow: 0 0 24px rgba(0, 229, 153, 0.4) !important;
  margin: 6px 0 !important;
}

.savings-sub {
  font-size: 12px !important;
  color: #94a3b8 !important;
}

.comparison-summary-table {
  background: rgba(0, 0, 0, 0.3) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  border-radius: 14px !important;
  overflow: hidden !important;
  margin: 20px 0 !important;
}

.comp-row {
  display: grid !important;
  grid-template-columns: 1.4fr 1fr 1fr !important;
  gap: 12px !important;
  padding: 12px 16px !important;
  font-size: 13.5px !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06) !important;
  align-items: center !important;
}

.comp-row.head {
  background: rgba(255, 255, 255, 0.04) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
  color: #94a3b8 !important;
}

.comp-row.highlight {
  background: rgba(0, 229, 153, 0.06) !important;
  font-weight: 700 !important;
}

/* 4. 5-Year TCO Comparison Table (Screenshot 7) */
.tco-table-wrapper {
  max-width: 1240px !important;
  margin: 0 auto 60px !important;
  padding: 0 24px !important;
}

.tco-matrix-table {
  background: rgba(10, 19, 32, 0.85) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  border-radius: 20px !important;
  overflow: hidden !important;
  margin-top: 28px !important;
  backdrop-filter: blur(16px) !important;
}

.tco-matrix-row {
  display: grid !important;
  grid-template-columns: 1.3fr 1.3fr 1.4fr !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06) !important;
}

.tco-matrix-head {
  background: rgba(255, 255, 255, 0.04) !important;
  font-family: var(--font-display, "Space Grotesk", sans-serif) !important;
  font-size: 11.5px !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
  color: #94a3b8 !important;
}

.tco-cell {
  padding: 16px 20px !important;
  font-size: 14px !important;
  color: #cbd5e1 !important;
  border-right: 1px solid rgba(255, 255, 255, 0.06) !important;
  display: flex !important;
  align-items: center !important;
}

.tco-cell:last-child {
  border-right: none !important;
}

.tco-cell.highlight {
  background: rgba(0, 229, 153, 0.06) !important;
  color: #f8fafc !important;
}

/* 5. 15-Minute Booking Scheduler (Screenshot 8) */
.booking-scheduler-card {
  background: rgba(10, 19, 32, 0.85) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  border-radius: 24px !important;
  padding: clamp(24px, 4vw, 44px) !important;
  max-width: 1240px !important;
  margin: 0 auto 60px !important;
  backdrop-filter: blur(16px) !important;
}

.scheduler-top-bar {
  margin-bottom: 28px !important;
  padding-bottom: 20px !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}

.tz-label {
  display: block !important;
  font-family: var(--font-display, "Space Grotesk", sans-serif) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.1em !important;
  color: #94a3b8 !important;
  margin-bottom: 10px !important;
}

.tz-buttons {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
}

.tz-btn {
  padding: 8px 16px !important;
  border-radius: 9999px !important;
  background: rgba(255, 255, 255, 0.04) !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  color: #94a3b8 !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  transition: all 0.2s ease !important;
}

.tz-btn:hover {
  background: rgba(255, 255, 255, 0.08) !important;
  color: #fff !important;
}

.tz-btn.active {
  background: rgba(0, 229, 153, 0.15) !important;
  border-color: #00e599 !important;
  color: #fff !important;
}

.scheduler-grid {
  display: grid !important;
  grid-template-columns: 1fr 1.2fr !important;
  gap: 36px !important;
}

.col-label {
  display: block !important;
  font-family: var(--font-display, "Space Grotesk", sans-serif) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.1em !important;
  color: #94a3b8 !important;
  margin-bottom: 12px !important;
}

.days-buttons-list {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(110px, 1fr)) !important;
  gap: 10px !important;
}

.day-select-btn {
  padding: 12px 10px !important;
  border-radius: 12px !important;
  background: rgba(255, 255, 255, 0.03) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  color: #cbd5e1 !important;
  text-align: center !important;
  cursor: pointer !important;
  transition: all 0.2s ease !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
}

.day-select-btn:hover {
  background: rgba(255, 255, 255, 0.06) !important;
  border-color: rgba(255, 255, 255, 0.16) !important;
}

.day-select-btn.active {
  background: rgba(0, 229, 153, 0.12) !important;
  border-color: #00e599 !important;
  color: #fff !important;
}

.slots-buttons-grid {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 10px !important;
}

.slot-select-btn {
  padding: 12px 16px !important;
  border-radius: 10px !important;
  background: rgba(255, 255, 255, 0.04) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  color: #e2e8f0 !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  text-align: center !important;
  cursor: pointer !important;
  transition: all 0.2s ease !important;
}

.slot-select-btn:hover {
  background: rgba(255, 255, 255, 0.08) !important;
  border-color: #00e599 !important;
}

.slot-select-btn.active {
  background: #00e599 !important;
  color: #04080f !important;
  font-weight: 700 !important;
  border-color: #00e599 !important;
  box-shadow: 0 0 16px rgba(0, 229, 153, 0.4) !important;
}

.slot-confirmation-box {
  margin-top: 24px !important;
  padding: 20px !important;
  background: rgba(0, 229, 153, 0.05) !important;
  border: 1px solid rgba(0, 229, 153, 0.2) !important;
  border-radius: 14px !important;
  text-align: center !important;
}

.slot-confirmation-box p {
  margin-bottom: 12px !important;
  font-size: 14px !important;
  color: #e2e8f0 !important;
}

/* 6. Footer Padding & WhatsApp Widget Non-Overlap (Screenshot 1) */
.site-footer {
  position: relative !important;
  background: #03070d !important;
  border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
  padding-bottom: 96px !important;
}

.footer-main {
  max-width: 1240px !important;
  margin: 0 auto !important;
  display: grid !important;
  grid-template-columns: 1.5fr 1fr 1fr 1.2fr !important;
  gap: 40px !important;
  padding: 60px 24px 40px !important;
}

.floating-whatsapp-widget {
  position: fixed !important;
  bottom: 28px !important;
  right: 28px !important;
  z-index: 990 !important;
}

/* 7. CRM Dashboard Simulator Formatting (/crm) */
.crm-data-table {
  width: 100% !important;
  border-collapse: collapse !important;
  text-align: left !important;
  font-size: 13.5px !important;
}

.crm-data-table thead tr {
  background: rgba(255, 255, 255, 0.03) !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
}

.crm-data-table th {
  padding: 14px 18px !important;
  font-family: var(--font-display, "Space Grotesk", sans-serif) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
  color: #94a3b8 !important;
  white-space: nowrap !important;
}

.crm-data-table td {
  padding: 16px 18px !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06) !important;
  color: #f1f5f9 !important;
  vertical-align: middle !important;
}

.channel-pill {
  display: inline-block !important;
  padding: 4px 10px !important;
  border-radius: 9999px !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  background: rgba(56, 189, 248, 0.12) !important;
  color: #38bdf8 !important;
  border: 1px solid rgba(56, 189, 248, 0.25) !important;
}

.status-tag {
  display: inline-block !important;
  padding: 4px 10px !important;
  border-radius: 6px !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
}

.status-tag.active {
  background: rgba(0, 229, 153, 0.12) !important;
  color: #00e599 !important;
}

.status-tag.urgent {
  background: rgba(244, 63, 94, 0.12) !important;
  color: #f43f5e !important;
}

.status-tag.won {
  background: rgba(34, 197, 94, 0.15) !important;
  color: #22c55e !important;
}

/* 8. Mobile Cleanliness (< 768px) */
@media (max-width: 768px) {
  .site-header {
    padding: 8px 16px !important;
  }
  
  .header-actions .button-header-cta,
  .header-actions .currency-dropdown-wrap {
    display: none !important;
  }
  
  .mobile-menu-toggle-btn {
    display: flex !important;
  }

  .page-hero {
    padding: 96px 16px 32px !important;
  }

  .calc-body-grid,
  .scheduler-grid,
  .footer-main,
  .tco-matrix-row {
    grid-template-columns: 1fr !important;
  }

  .floating-whatsapp-widget {
    bottom: 16px !important;
    right: 16px !important;
    transform: scale(0.9) !important;
    transform-origin: bottom right !important;
  }
}

