/*
 * UnifyGov homepage template CSS.
 * Extracted from the saved homepage export and normalized into reusable classes.
 */
html { scroll-behavior: smooth; }
    body { margin: 0; font-family: 'Inter', sans-serif; color: #001B3D; background: #FEFFFF; -webkit-font-smoothing: antialiased; }
    * { box-sizing: border-box; }
    a { color: #00687A; }
    a:hover { color: #032069; }
    input, select, button, textarea { font-family: inherit; }
    ::placeholder { color: #5A6478; }
    /* Focus not obscured by sticky header (WCAG 2.2 — 2.4.11) */
    [id] { scroll-margin-top: 92px; }
    /* Skip link (Section 508 / WCAG 2.4.1) */
    .skip-link { position: absolute; left: 16px; top: -60px; z-index: 200; background: #032069; color: #FEFFFF; padding: 12px 18px; border-radius: 10px; font-size: 15px; font-weight: 600; text-decoration: none; transition: top 0.15s ease; }
    .skip-link:focus { top: 12px; color: #FEFFFF; outline: 3px solid #95BAD8; outline-offset: 2px; }
    /* Respect reduced motion (WCAG 2.3.3 / 2.2.2) */
    @media (prefers-reduced-motion: reduce) {
      html { scroll-behavior: auto; }
      * { animation-duration: 0.001ms !important; transition-duration: 0.001ms !important; }
    }
    @media (max-width: 720px) {
      [data-fromto] { grid-template-columns: 1fr !important; }
      [data-fromto] [data-arrow] { transform: rotate(90deg); background: #FEFFFF !important; padding: 8px 0 !important; }
    }
    @media (max-width: 640px) {
      [data-metrics] { grid-template-columns: repeat(2, 1fr) !important; }
      [data-charts] { grid-template-columns: 1fr !important; }
    }
    @media (max-width: 960px) {
      [data-footgrid] { grid-template-columns: repeat(2, 1fr) !important; }
    }
    @media (max-width: 560px) {
      [data-footgrid] { grid-template-columns: 1fr !important; }
    }
    @media (max-width: 480px) {
      [data-mocknav] { display: none !important; }
      [data-metrics] { grid-template-columns: 1fr !important; }
    }

.ug-c001 { min-width: 320px; background: #FEFFFF }
.ug-c002 { position: absolute; width: 0; height: 0; overflow: hidden }
.ug-c003 { position: sticky; top: 0; z-index: 100; background: rgba(254,255,255,0.96); backdrop-filter: blur(10px); border-bottom: 1px solid #E4E6EA }
.ug-c004 { max-width: 1240px; margin: 0 auto; padding: 0 clamp(20px, 3vw, 32px); height: 76px; display: flex; align-items: center; justify-content: space-between; gap: 24px }
.ug-c005 { display: flex; align-items: center; text-decoration: none; flex-shrink: 0 }
.ug-c006 { height: 40px; width: auto; display: block }
.ug-c007 { display: flex; align-items: center; gap: 6px }
.ug-c008 { position: relative }
.ug-c009 { display: flex; align-items: center; gap: 6px; background: none; border: none; cursor: pointer; font-size: 15px; font-weight: 600; color: #001B3D; padding: 9px 14px; border-radius: 10px; transition: background-color 0.18s ease }
.ug-c009:hover { background: #EDECED }
.ug-c009:focus { outline: 2px solid #00687A; outline-offset: 2px }
.ug-c010 { position: absolute; top: 100%; left: 0; padding-top: 10px; width: 330px }
.ug-c011 { background: #FEFFFF; border: 1px solid #E4E6EA; border-radius: 16px; box-shadow: 0 16px 40px rgba(3,32,105,0.12); padding: 10px; display: flex; flex-direction: column; gap: 2px }
.ug-c012 { display: flex; gap: 12px; padding: 12px; border-radius: 10px; text-decoration: none; transition: background-color 0.18s ease }
.ug-c012:hover { background: #EDECED }
.ug-c013 { width: 8px; height: 38px; border-radius: 4px; background: #2A66C8; flex-shrink: 0 }
.ug-c014 { display: block; font-weight: 600; font-size: 15px; color: #001B3D }
.ug-c015 { display: block; font-size: 13px; color: #5A6478; margin-top: 2px }
.ug-c016 { width: 8px; height: 38px; border-radius: 4px; background: #0E8571; flex-shrink: 0 }
.ug-c017 { font-size: 15px; font-weight: 600; color: #001B3D; text-decoration: none; white-space: nowrap; padding: 9px 14px; border-radius: 10px; transition: background-color 0.18s ease }
.ug-c017:hover { background: #EDECED }
.ug-c017:focus { outline: 2px solid #00687A; outline-offset: 2px }
.ug-c018 { display: flex; align-items: center; gap: 18px }
.ug-c019 { font-size: 15px; font-weight: 600; color: #001B3D; text-decoration: none; white-space: nowrap; padding: 9px 4px; transition: color 0.18s ease }
.ug-c019:hover { color: #00687A }
.ug-c019:focus { outline: 2px solid #00687A; outline-offset: 2px }
.ug-c020 { font-size: 15px; font-weight: 600; color: #FEFFFF; background: #00687A; text-decoration: none; white-space: nowrap; padding: 12px 22px; border-radius: 10px; transition: background-color 0.18s ease, transform 0.18s ease, box-shadow 0.18s ease }
.ug-c020:hover { background: #00525F; transform: translateY(-1px); box-shadow: 0 8px 20px rgba(0,104,122,0.25) }
.ug-c020:focus { outline: 2px solid #032069; outline-offset: 2px }
.ug-c021 { background: none; border: 1px solid #E4E6EA; border-radius: 10px; padding: 10px; cursor: pointer; display: flex; align-items: center }
.ug-c021:focus { outline: 2px solid #00687A; outline-offset: 2px }
.ug-c022 { background: #FEFFFF; border-bottom: 1px solid #E4E6EA; padding: 8px 24px 20px; display: flex; flex-direction: column; gap: 2px }
.ug-c023 { font-size: 16px; font-weight: 500; color: #001B3D; text-decoration: none; padding: 12px 8px; border-radius: 10px }
.ug-c023:hover { background: #EDECED }
.ug-c024 { display: flex; gap: 12px; margin-top: 12px }
.ug-c025 { flex: 1; text-align: center; font-size: 15px; font-weight: 600; color: #FEFFFF; background: #00687A; text-decoration: none; padding: 13px 18px; border-radius: 10px }
.ug-c026 { flex: 0 0 auto; display: flex; align-items: center; font-size: 15px; font-weight: 600; color: #032069; text-decoration: none; padding: 13px 16px; border: 1.5px solid #032069; border-radius: 10px; background: #FEFFFF }
.ug-c027 { outline: none; display: block }
.ug-c028 { background: #EDECED; position: relative; overflow: hidden }
.ug-c029 { position: absolute; left: -60px; bottom: -6px; color: #95BAD8; opacity: 0.55; pointer-events: none }
.ug-c030 { position: relative; max-width: 1240px; margin: 0 auto; padding: clamp(64px, 9vw, 112px) clamp(20px, 3vw, 32px) clamp(72px, 9vw, 116px); display: flex; flex-wrap: wrap; align-items: center; gap: clamp(44px, 5vw, 72px) }
.ug-c031 { flex: 1 1 440px; min-width: 258px }
.ug-c032 { font-family: 'Playfair Display', serif; font-weight: 700; font-size: clamp(40px, 4.8vw, 62px); line-height: 1.14; letter-spacing: -0.005em; color: #032069; margin: 0 0 26px; text-wrap: balance }
.ug-c033 { color: #00687A }
.ug-c034 { font-size: clamp(16px, 1.5vw, 18px); line-height: 1.7; color: #3D4A63; margin: 0 0 36px; max-width: 46ch; text-wrap: pretty }
.ug-c035 { display: flex; flex-wrap: wrap; gap: 16px }
.ug-c036 { font-size: 16px; font-weight: 600; color: #FEFFFF; background: #00687A; text-decoration: none; padding: 15px 30px; border-radius: 10px; transition: background-color 0.18s ease, transform 0.18s ease, box-shadow 0.18s ease }
.ug-c036:hover { background: #00525F; transform: translateY(-1px); box-shadow: 0 10px 24px rgba(0,104,122,0.28) }
.ug-c036:focus { outline: 2px solid #032069; outline-offset: 2px }
.ug-c037 { font-size: 16px; font-weight: 600; color: #032069; background: #FEFFFF; border: 1.5px solid #032069; text-decoration: none; padding: 15px 30px; border-radius: 10px; transition: background-color 0.18s ease, transform 0.18s ease, box-shadow 0.18s ease }
.ug-c037:hover { background: #F4F5F7; transform: translateY(-1px); box-shadow: 0 8px 20px rgba(3,32,105,0.12) }
.ug-c037:focus { outline: 2px solid #00687A; outline-offset: 2px }
.ug-c038 { flex: 1 1 480px; min-width: 258px; position: relative; padding-bottom: 30px }
.ug-c039 { background: #FEFFFF; border: 1px solid #E0E2E8; border-radius: 16px; box-shadow: 0 28px 64px rgba(3,32,105,0.14); overflow: hidden }
.ug-c040 { display: flex; align-items: center; gap: 6px; padding: 11px 16px; border-bottom: 1px solid #E9EBEF; background: #F5F6F8 }
.ug-c041 { width: 9px; height: 9px; border-radius: 50%; background: #D8DBE2 }
.ug-c042 { margin-left: 10px; font-size: 11px; color: #5A6478; background: #FEFFFF; border: 1px solid #E9EBEF; border-radius: 100px; padding: 3px 12px }
.ug-c043 { display: flex; min-height: 300px }
.ug-c044 { width: 138px; flex-shrink: 0; background: #12336E; padding: 16px 10px; display: flex; flex-direction: column; gap: 4px }
.ug-c045 { display: flex; align-items: center; gap: 6px; padding: 4px 8px 14px }
.ug-c046 { font-weight: 700; font-size: 11.5px; letter-spacing: 0.02em; color: #FEFFFF }
.ug-c047 { font-size: 10.5px; font-weight: 600; color: #FEFFFF; background: rgba(254,255,255,0.16); border-radius: 8px; padding: 7px 9px }
.ug-c048 { font-size: 10.5px; color: #95BAD8; padding: 7px 9px }
.ug-c049 { flex: 1; padding: 18px; background: #FBFBFC }
.ug-c050 { margin: 0 0 14px; font-weight: 700; font-size: 14.5px; color: #001B3D }
.ug-c051 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-bottom: 14px }
.ug-c052 { background: #FEFFFF; border: 1px solid #E9EBEF; border-radius: 12px; padding: 12px }
.ug-c053 { margin: 0; font-size: 9px; color: #5A6478 }
.ug-c054 { margin: 3px 0 0; font-weight: 700; font-size: 17px; color: #001B3D }
.ug-c055 { margin: 3px 0 0; font-weight: 700; font-size: 17px; color: #2A66C8 }
.ug-c056 { background: #FEFFFF; border: 1px solid #E9EBEF; border-radius: 12px; padding: 13px }
.ug-c057 { margin: 0 0 9px; font-size: 10px; font-weight: 600; color: #001B3D }
.ug-c058 { display: flex; flex-direction: column; gap: 7px }
.ug-c059 { display: flex; justify-content: space-between; gap: 8px }
.ug-c060 { font-size: 9.5px; color: #3D4A63 }
.ug-c061 { font-size: 9px; color: #0E8571; font-weight: 600 }
.ug-c062 { font-size: 9px; color: #5A6478; font-weight: 600 }
.ug-c063 { position: absolute; right: -8px; bottom: -4px; width: min(260px, 64%); background: #FEFFFF; border: 1px solid #E0E2E8; border-radius: 16px; box-shadow: 0 18px 44px rgba(3,32,105,0.18); padding: 16px }
.ug-c064 { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 10px }
.ug-c065 { font-size: 10px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: #0E8571 }
.ug-c066 { font-size: 9px; font-weight: 600; color: #0A6A59; background: #E6F4F0; border-radius: 100px; padding: 3px 9px }
.ug-c067 { margin: 0; font-weight: 800; font-size: 25px; color: #032069 }
.ug-c068 { font-size: 12px; font-weight: 600; color: #5A6478 }
.ug-c069 { display: flex; gap: 4px; margin-top: 12px }
.ug-c070 { flex: 3; height: 6px; border-radius: 3px; background: #0E8571 }
.ug-c071 { flex: 2; height: 6px; border-radius: 3px; background: #7FBFB2 }
.ug-c072 { flex: 1; height: 6px; border-radius: 3px; background: #CDE5E1 }
.ug-c073 { margin: 9px 0 0; font-size: 9.5px; color: #5A6478 }
.ug-c074 { background: #FEFFFF }
.ug-c075 { max-width: 1240px; margin: 0 auto; padding: clamp(40px, 5vw, 56px) clamp(20px, 3vw, 32px); display: flex; flex-direction: column; gap: 28px; align-items: center }
.ug-c076 { margin: 0; font-size: 13px; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: #1800AD }
.ug-c077 { display: flex; flex-wrap: wrap; gap: 24px 44px; align-items: center; justify-content: center }
.ug-c078 { display: inline-flex; align-items: center; gap: 10px; color: #5A6478 }
.ug-c079 { font-weight: 600; font-size: 15px; line-height: 1.15 }
.ug-c080 { display: flex; gap: 12px }
.ug-c081 { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 600; color: #001B3D; border: 1px solid #E4E6EA; border-radius: 100px; padding: 7px 14px }
.ug-c082 { color: #032069 }
.ug-c083 { font-weight: 400; color: #5A6478 }
.ug-c084 { position: absolute; right: -80px; bottom: -10px; color: #95BAD8; opacity: 0.4; transform: scaleX(-1); pointer-events: none }
.ug-c085 { position: relative; max-width: 1240px; margin: 0 auto; padding: clamp(72px, 9vw, 120px) clamp(20px, 3vw, 32px) }
.ug-c086 { max-width: 1000px; margin: 0 auto clamp(44px, 5vw, 64px); text-align: center }
.ug-c087 { font-family: 'Playfair Display', serif; font-weight: 700; font-size: clamp(30px, 3.6vw, 46px); line-height: 1.18; color: #032069; margin: 0 0 18px; text-wrap: balance }
.ug-c088 { font-size: 17px; line-height: 1.65; color: #3D4A63; margin: 0; text-wrap: pretty }
.ug-c089 { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 400px), 1fr)); gap: clamp(24px, 3vw, 32px) }
.ug-c090 { background: #FEFFFF; border: 1px solid #E4E6EA; border-radius: 18px; box-shadow: 0 12px 32px rgba(3,32,105,0.07); overflow: hidden; display: flex; flex-direction: column }
.ug-c091 { display: block; height: 4px; background: #2A66C8 }
.ug-c092 { padding: clamp(28px, 3.2vw, 42px); display: flex; flex-direction: column; gap: 22px; flex: 1 }
.ug-c093 { margin: 0 0 12px; font-size: 12px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: #2A66C8 }
.ug-c094 { font-weight: 700; font-size: 25px; letter-spacing: -0.01em; color: #001B3D; margin: 0 0 10px }
.ug-c095 { font-size: 16px; line-height: 1.6; color: #3D4A63; margin: 0 }
.ug-c096 { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 12px }
.ug-c097 { display: flex; gap: 10px; font-size: 15px; color: #001B3D }
.ug-c098 { flex-shrink: 0; margin-top: 2px }
.ug-c099 { border: 1px solid #E9EBEF; border-radius: 12px; overflow: hidden; background: #FBFBFC; margin-top: auto }
.ug-c100 { display: flex; align-items: center; gap: 5px; padding: 9px 12px; border-bottom: 1px solid #E9EBEF; background: #F5F6F8 }
.ug-c101 { width: 7px; height: 7px; border-radius: 50%; background: #D8DBE2 }
.ug-c102 { margin-left: 8px; font-size: 10px; font-weight: 600; color: #5A6478 }
.ug-c103 { padding: 12px; display: flex; flex-direction: column; gap: 8px }
.ug-c104 { display: flex; align-items: center; gap: 10px; background: #FEFFFF; border: 1px solid #E9EBEF; border-radius: 10px; padding: 9px 12px }
.ug-c105 { width: 24px; height: 24px; border-radius: 50%; background: #DEE8F3; color: #032069; font-size: 9px; font-weight: 700; display: flex; align-items: center; justify-content: center }
.ug-c106 { font-size: 11px; font-weight: 600; color: #001B3D }
.ug-c107 { font-size: 10px; color: #5A6478; margin-left: auto }
.ug-c108 { display: block; height: 4px; background: #0E8571 }
.ug-c109 { margin: 0 0 12px; font-size: 12px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: #0E8571 }
.ug-c110 { font-size: 10px; color: #5A6478 }
.ug-c111 { font-size: 9px; font-weight: 600; color: #0A6A59; background: #E6F4F0; border-radius: 100px; padding: 3px 9px; margin-left: auto }
.ug-c112 { font-size: 9px; font-weight: 600; color: #5A6478; background: #EDECED; border-radius: 100px; padding: 3px 9px; margin-left: auto }
.ug-c113 { max-width: 1240px; margin: 0 auto; padding: clamp(72px, 9vw, 120px) clamp(20px, 3vw, 32px) }
.ug-c114 { max-width: 640px; margin: 0 auto clamp(32px, 4vw, 44px); text-align: center }
.ug-c115 { font-family: 'Playfair Display', serif; font-weight: 700; font-size: clamp(32px, 3.8vw, 48px); line-height: 1.18; color: #032069; margin: 0 0 18px; text-wrap: balance }
.ug-c116 { text-align: center; margin-bottom: 36px }
.ug-c117 { display: inline-flex; gap: 4px; background: #EDECED; border-radius: 12px; padding: 5px }
.ug-c118 { border: 1px solid #E0E2E8; border-radius: 18px; overflow: hidden; box-shadow: 0 28px 64px rgba(3,32,105,0.10); margin-bottom: clamp(24px, 3vw, 32px); background: #FEFFFF }
.ug-c119 { display: flex; align-items: center; gap: 6px; padding: 12px 18px; border-bottom: 1px solid #E9EBEF; background: #F5F6F8 }
.ug-c120 { padding: clamp(20px, 2.6vw, 32px); background: #FBFBFC }
.ug-c121 { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 22px }
.ug-c122 { margin: 0; font-weight: 700; font-size: clamp(17px, 1.9vw, 21px); color: #032069 }
.ug-c123 { margin: 4px 0 0; font-size: 12.5px; color: #5A6478 }
.ug-c124 { display: flex; gap: 6px }
.ug-c125 { font-size: 11px; font-weight: 600; color: #FEFFFF; background: #00687A; border-radius: 100px; padding: 6px 14px }
.ug-c126 { font-size: 11px; font-weight: 600; color: #5A6478; background: #EDECED; border-radius: 100px; padding: 6px 14px }
.ug-c127 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 18px }
.ug-c128 { background: #FEFFFF; border: 1px solid #E9EBEF; border-radius: 12px; padding: 16px }
.ug-c129 { margin: 0; font-size: 11px; color: #5A6478 }
.ug-c130 { margin: 5px 0 0; font-weight: 700; font-size: clamp(18px, 2vw, 24px); color: #001B3D }
.ug-c131 { margin: 3px 0 0; font-size: 10.5px; color: #2A66C8; font-weight: 600 }
.ug-c132 { margin: 3px 0 0; font-size: 10.5px; color: #5A6478; font-weight: 600 }
.ug-c133 { display: grid; grid-template-columns: 1.6fr 1fr; gap: 14px }
.ug-c134 { background: #FEFFFF; border: 1px solid #E9EBEF; border-radius: 12px; padding: 18px }
.ug-c135 { margin: 0 0 14px; font-size: 12px; font-weight: 600; color: #001B3D }
.ug-c136 { display: flex; align-items: stretch; gap: 12px; height: 132px }
.ug-c137 { flex: 1; display: flex; flex-direction: column; gap: 6px }
.ug-c138 { flex: 1; display: flex; align-items: flex-end }
.ug-c139 { width: 100%; height: 58%; background: #2B626E; border-radius: 8px 8px 0 0 }
.ug-c140 { font-size: 10px; color: #5A6478; text-align: center }
.ug-c141 { width: 100%; height: 70%; background: #2B626E; border-radius: 8px 8px 0 0 }
.ug-c142 { width: 100%; height: 84%; background: #2B626E; border-radius: 8px 8px 0 0 }
.ug-c143 { width: 100%; height: 100%; background: #2B626E; border-radius: 8px 8px 0 0 }
.ug-c144 { display: flex; flex-direction: column; gap: 12px }
.ug-c145 { display: flex; justify-content: space-between; font-size: 10.5px; color: #5A6478; margin-bottom: 4px }
.ug-c146 { height: 7px; background: #EDECED; border-radius: 4px }
.ug-c147 { width: 28%; height: 100%; background: #2E63B0; border-radius: 4px }
.ug-c148 { width: 22%; height: 100%; background: #2E63B0; border-radius: 4px }
.ug-c149 { width: 17%; height: 100%; background: #2E63B0; border-radius: 4px }
.ug-c150 { width: 19%; height: 100%; background: #2E63B0; border-radius: 4px }
.ug-c151 { width: 15%; height: 100%; background: #2E63B0; border-radius: 4px }
.ug-c152 { font-size: 11px; font-weight: 600; color: #FEFFFF; background: #0E8571; border-radius: 100px; padding: 6px 14px }
.ug-c153 { margin: 3px 0 0; font-size: 10.5px; color: #0E8571; font-weight: 600 }
.ug-c154 { display: flex; flex-direction: column; gap: 13px }
.ug-c155 { height: 9px; background: #EDECED; border-radius: 5px }
.ug-c156 { width: 100%; height: 100%; background: #0E8571; border-radius: 5px }
.ug-c157 { width: 57%; height: 100%; background: #0E8571; border-radius: 5px }
.ug-c158 { width: 27%; height: 100%; background: #7FBFB2; border-radius: 5px }
.ug-c159 { width: 15%; height: 100%; background: #7FBFB2; border-radius: 5px }
.ug-c160 { display: flex; align-items: center; gap: 10px }
.ug-c161 { width: 18px; height: 18px; border-radius: 50%; background: #0E8571; color: #FEFFFF; font-size: 10px; display: flex; align-items: center; justify-content: center }
.ug-c162 { font-size: 11px; color: #3D4A63 }
.ug-c163 { width: 18px; height: 18px; border-radius: 50%; border: 2px solid #C7D0DE }
.ug-c164 { font-size: 11px; color: #5A6478 }
.ug-c165 { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); gap: clamp(20px, 2.5vw, 28px) }
.ug-c166 { border: 1px solid #EEF0F4; border-radius: 16px; padding: clamp(26px, 2.8vw, 34px); background: #FBFBFC; box-shadow: 0 6px 20px rgba(3,32,105,0.05); display: flex; flex-direction: column; gap: 14px; transition: transform 0.2s ease, box-shadow 0.2s ease }
.ug-c166:hover { transform: translateY(-3px); box-shadow: 0 14px 32px rgba(3,32,105,0.10) }
.ug-c167 { width: 46px; height: 46px; border-radius: 12px; display: flex; align-items: center; justify-content: center; background: #DDE6F5 }
.ug-c168 { font-weight: 700; font-size: 17px; color: #001B3D; margin: 0 }
.ug-c169 { font-size: 14.5px; line-height: 1.6; color: #3D4A63; margin: 0; text-wrap: pretty }
.ug-c170 { width: 46px; height: 46px; border-radius: 12px; display: flex; align-items: center; justify-content: center; background: #DCEFEA }
.ug-c171 { background: #001B3D; position: relative; overflow: hidden }
.ug-c172 { position: absolute; left: -70px; bottom: -8px; color: #95BAD8; opacity: 0.14; pointer-events: none }
.ug-c173 { position: absolute; right: -90px; bottom: -8px; color: #95BAD8; opacity: 0.14; transform: scaleX(-1); pointer-events: none }
.ug-c174 { display: flex; flex-wrap: wrap; gap: clamp(40px, 6vw, 88px); align-items: flex-start }
.ug-c175 { flex: 1 1 420px; min-width: 258px }
.ug-c176 { display: block; width: 34px; height: 4px; border-radius: 2px; background: #00687A; margin-bottom: 26px }
.ug-c177 { font-family: 'Playfair Display', serif; font-weight: 700; font-size: clamp(30px, 3.6vw, 46px); line-height: 1.2; color: #FEFFFF; margin: 0 0 22px; text-wrap: balance }
.ug-c178 { font-size: 17px; line-height: 1.7; color: #AFBBD0; margin: 0 0 18px; max-width: 54ch; text-wrap: pretty }
.ug-c179 { font-size: 17px; line-height: 1.7; color: #AFBBD0; margin: 0; max-width: 54ch; text-wrap: pretty }
.ug-c180 { flex: 1 1 340px; min-width: 280px; display: flex; flex-direction: column; gap: 16px }
.ug-c181 { background: #294B68; border: 1px solid rgba(149,186,216,0.18); border-radius: 18px; padding: clamp(24px, 2.6vw, 32px); display: flex; gap: 22px; align-items: center }
.ug-c182 { flex-shrink: 0 }
.ug-c183 { margin: 0; font-weight: 800; font-size: clamp(28px, 3vw, 38px); letter-spacing: -0.01em; line-height: 1.1; color: #FEFFFF }
.ug-c184 { margin: 6px 0 0; font-size: 15px; line-height: 1.5; color: #AFBBD0 }
.ug-c185 { max-width: 1160px; margin: 0 auto; padding: clamp(72px, 9vw, 124px) clamp(20px, 3vw, 32px) }
.ug-c186 { max-width: 680px; margin: 0 auto clamp(44px, 5vw, 64px); text-align: center }
.ug-c187 { margin: 0 0 18px; font-size: 13px; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: #00687A }
.ug-c188 { display: flex; flex-direction: column; gap: 20px }
.ug-c189 { display: grid; grid-template-columns: 1fr auto 1fr; align-items: stretch; gap: 0; border-radius: 18px; overflow: hidden; box-shadow: 0 10px 30px rgba(3,32,105,0.06); background: #FEFFFF }
.ug-c190 { background: #FFFAF6; padding: clamp(24px, 2.8vw, 34px); display: flex; gap: 16px; align-items: flex-start }
.ug-c191 { flex-shrink: 0; width: 42px; height: 42px; border-radius: 12px; background: #FAE3D3; display: flex; align-items: center; justify-content: center }
.ug-c192 { margin: 0 0 6px; font-size: 11px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: #5A6478 }
.ug-c193 { margin: 0; font-weight: 700; font-size: 18px; color: #001B3D }
.ug-c194 { margin: 7px 0 0; font-size: 14.5px; line-height: 1.55; color: #5A6478; text-wrap: pretty }
.ug-c195 { display: flex; align-items: center; justify-content: center; position: relative; background: linear-gradient(90deg, #FFFAF6, #F3F7FE); padding: 0 8px }
.ug-c196 { position: absolute; top: 0; bottom: 0; left: 50%; width: 2px; background: #2A66C8; opacity: 0.5 }
.ug-c197 { position: relative; width: 42px; height: 42px; border-radius: 50%; background: #FEFFFF; border: 1px solid #E4E6EA; display: flex; align-items: center; justify-content: center; box-shadow: 0 4px 14px rgba(3,32,105,0.10) }
.ug-c198 { background: #F3F7FE; padding: clamp(24px, 2.8vw, 34px); display: flex; gap: 16px; align-items: flex-start }
.ug-c199 { flex-shrink: 0; width: 42px; height: 42px; border-radius: 50%; background: #D1DAEE; display: flex; align-items: center; justify-content: center }
.ug-c200 { margin: 7px 0 0; font-size: 14.5px; line-height: 1.55; color: #3D4A63; text-wrap: pretty }
.ug-c201 { display: grid; grid-template-columns: 1fr auto 1fr; align-items: stretch; border-radius: 18px; overflow: hidden; box-shadow: 0 10px 30px rgba(3,32,105,0.06); background: #FEFFFF }
.ug-c202 { display: flex; align-items: center; justify-content: center; position: relative; background: linear-gradient(90deg, #FFFAF6, #EEF8FA); padding: 0 8px }
.ug-c203 { position: absolute; top: 0; bottom: 0; left: 50%; width: 2px; background: #0E8571; opacity: 0.55 }
.ug-c204 { background: #EEF8FA; padding: clamp(24px, 2.8vw, 34px); display: flex; gap: 16px; align-items: flex-start }
.ug-c205 { flex-shrink: 0; width: 42px; height: 42px; border-radius: 50%; background: #CDE4E9; display: flex; align-items: center; justify-content: center }
.ug-c206 { position: absolute; right: -60px; bottom: -10px; color: #95BAD8; opacity: 0.45; pointer-events: none }
.ug-c207 { position: relative; max-width: 1240px; margin: 0 auto; padding: clamp(64px, 8vw, 104px) clamp(20px, 3vw, 32px); display: flex; flex-wrap: wrap; align-items: center; gap: clamp(36px, 4vw, 64px) }
.ug-c208 { flex: 1 1 380px; min-width: 258px }
.ug-c209 { font-family: 'Playfair Display', serif; font-weight: 700; font-size: clamp(28px, 3.2vw, 42px); line-height: 1.2; color: #032069; margin: 0 0 18px; text-wrap: balance }
.ug-c210 { font-size: 16px; line-height: 1.7; color: #3D4A63; margin: 0 0 24px; max-width: 52ch; text-wrap: pretty }
.ug-c211 { font-size: 15px; font-weight: 600; color: #00687A; text-decoration: underline; text-underline-offset: 4px; display: inline-flex; align-items: center; gap: 6px; min-height: 24px; transition: color 0.18s ease }
.ug-c211:hover { color: #032069 }
.ug-c211:focus { outline: 2px solid #00687A; outline-offset: 2px }
.ug-c212 { flex: 1 1 440px; min-width: 258px; list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 16px }
.ug-c213 { background: #FEFFFF; border: 1px solid #E4E6EA; border-radius: 16px; box-shadow: 0 8px 24px rgba(3,32,105,0.06); padding: 24px; display: flex; flex-direction: column; gap: 9px }
.ug-c214 { font-weight: 700; font-size: 15.5px; color: #001B3D }
.ug-c215 { font-size: 13.5px; color: #5A6478 }
.ug-c216 { max-width: 1240px; margin: 0 auto; padding: clamp(64px, 8vw, 112px) clamp(20px, 3vw, 32px); display: flex; flex-wrap: wrap; gap: clamp(36px, 4vw, 72px); align-items: center }
.ug-c217 { font-size: 16px; line-height: 1.7; color: #3D4A63; margin: 0 0 22px; max-width: 52ch; text-wrap: pretty }
.ug-c218 { display: flex; flex-wrap: wrap; gap: 12px; margin-bottom: 28px }
.ug-c219 { font-size: 13.5px; font-weight: 600; color: #032069; border: 1.5px solid #032069; border-radius: 10px; padding: 9px 16px; background: #FEFFFF }
.ug-c220 { font-size: 15px; font-weight: 600; color: #FEFFFF; background: #00687A; text-decoration: none; padding: 14px 26px; border-radius: 10px; display: inline-block; transition: background-color 0.18s ease, transform 0.18s ease, box-shadow 0.18s ease }
.ug-c220:hover { background: #00525F; transform: translateY(-1px); box-shadow: 0 10px 24px rgba(0,104,122,0.28) }
.ug-c220:focus { outline: 2px solid #032069; outline-offset: 2px }
.ug-c221 { flex: 1 1 360px; min-width: 280px; list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; counter-reset: step }
.ug-c222 { display: flex; gap: 18px; padding: 22px 0; border-bottom: 1px solid #E4E6EA }
.ug-c223 { width: 38px; height: 38px; border-radius: 50%; background: #CBDDEC; color: #032069; font-weight: 700; font-size: 15px; display: flex; align-items: center; justify-content: center; flex-shrink: 0 }
.ug-c224 { margin: 0; font-weight: 700; font-size: 16px; color: #001B3D }
.ug-c225 { margin: 6px 0 0; font-size: 14.5px; line-height: 1.55; color: #5A6478 }
.ug-c226 { display: flex; gap: 18px; padding: 22px 0 }
.ug-c227 { background: #EDECED }
.ug-c228 { max-width: 1240px; margin: 0 auto; padding: clamp(64px, 8vw, 104px) clamp(20px, 3vw, 32px); display: flex; flex-wrap: wrap; gap: clamp(24px, 3vw, 32px) }
.ug-c229 { flex: 1 1 420px; min-width: 258px; background: #001B3D; border-radius: 20px; padding: clamp(30px, 3.6vw, 48px); display: flex; flex-direction: column; gap: 20px; box-shadow: 0 16px 40px rgba(0,27,61,0.18) }
.ug-c230 { font-size: 12px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: #43A18F }
.ug-c231 { font-family: 'Playfair Display', serif; font-weight: 700; font-size: clamp(24px, 2.6vw, 33px); line-height: 1.3; color: #FEFFFF; margin: 0; text-wrap: balance }
.ug-c232 { font-size: 15px; line-height: 1.7; color: #AFBBD0; margin: 0 }
.ug-c233 { font-size: 15px; font-weight: 600; color: #FEFFFF; text-decoration: underline; text-underline-offset: 4px; display: inline-flex; align-items: center; gap: 6px; min-height: 24px; margin-top: auto }
.ug-c233:hover { color: #95BAD8 }
.ug-c233:focus { outline: 2px solid #95BAD8; outline-offset: 2px }
.ug-c234 { flex: 1 1 420px; min-width: 258px; margin: 0; background: transparent; border: 1.5px solid #3D4A63; border-radius: 20px; padding: clamp(30px, 3.6vw, 48px); display: flex; flex-direction: column; gap: 22px }
.ug-c235 { margin: 0; font-family: 'Playfair Display', serif; font-weight: 700; font-size: clamp(19px, 2vw, 24px); line-height: 1.5; color: #032069; text-wrap: pretty }
.ug-c236 { display: flex; align-items: center; gap: 14px; margin-top: auto }
.ug-c237 { width: 48px; height: 48px; border-radius: 50%; background: #DEE8F3; color: #032069; font-weight: 700; font-size: 14px; display: flex; align-items: center; justify-content: center }
.ug-c238 { display: block; font-weight: 700; font-size: 15.5px; color: #001B3D }
.ug-c239 { display: block; font-size: 13.5px; color: #5A6478 }
.ug-c240 { max-width: 920px; margin: 0 auto; padding: clamp(72px, 9vw, 120px) clamp(20px, 3vw, 32px) }
.ug-c241 { margin: 0 auto clamp(36px, 4vw, 52px); text-align: center }
.ug-c242 { font-family: 'Playfair Display', serif; font-weight: 700; font-size: clamp(26px, 4.2vw, 44px); line-height: 1.18; color: #032069; margin: 0 0 18px; text-wrap: balance }
.ug-c243 { font-size: 17px; line-height: 1.65; color: #3D4A63; margin: 0 }
.ug-c244 { display: flex; flex-direction: column; border-top: 1px solid #E4E6EA }
.ug-c245 { border-bottom: 1px solid #E4E6EA }
.ug-c246 { margin: 0 }
.ug-c247 { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 16px; background: none; border: none; cursor: pointer; padding: 26px 4px; text-align: left; font-family: 'Inter', sans-serif; font-size: 17px; font-weight: 600; color: #001B3D; transition: color 0.18s ease }
.ug-c247:hover { color: #00687A }
.ug-c247:focus { outline: 2px solid #00687A; outline-offset: -2px }
.ug-c248 { flex-shrink: 0; width: 30px; height: 30px; border-radius: 50%; border: 1.5px solid #C7D0DE; display: flex; align-items: center; justify-content: center; font-size: 16px; font-weight: 500; color: #5A6478; transition: transform 0.25s ease, background-color 0.25s ease }
.ug-c249 { display: grid; overflow: hidden; transition: grid-template-rows 0.3s ease }
.ug-c250 { min-height: 0; overflow: hidden }
.ug-c251 { margin: 0; padding: 0 48px 28px 4px; font-size: 16px; line-height: 1.7; color: #3D4A63; text-wrap: pretty }
.ug-c252 { position: absolute; left: -50px; bottom: -8px; color: #95BAD8; opacity: 0.16; pointer-events: none }
.ug-c253 { position: relative; max-width: 1240px; margin: 0 auto; padding: clamp(72px, 9vw, 120px) clamp(20px, 3vw, 32px); display: flex; flex-wrap: wrap; gap: clamp(40px, 5vw, 80px); align-items: center }
.ug-c254 { font-family: 'Playfair Display', serif; font-weight: 700; font-size: clamp(32px, 3.8vw, 50px); line-height: 1.18; color: #FEFFFF; margin: 0 0 20px; text-wrap: balance }
.ug-c255 { font-size: 17px; line-height: 1.7; color: #C3D3E8; margin: 0 0 28px; max-width: 48ch; text-wrap: pretty }
.ug-c256 { display: flex; gap: 12px; font-size: 15px; color: #DCE6F2 }
.ug-c257 { flex-shrink: 0; margin-top: 1px }
.ug-c258 { flex: 1 1 420px; min-width: 258px; background: #FEFFFF; border-radius: 20px; box-shadow: 0 24px 60px rgba(0,27,61,0.3); padding: clamp(26px, 3.2vw, 40px); display: flex; flex-direction: column; gap: 18px }
.ug-c259 { display: flex; flex-direction: column; gap: 10px; padding: 28px 8px; text-align: center }
.ug-c260 { margin: 0 auto }
.ug-c261 { margin: 0; font-family: 'Playfair Display', serif; font-weight: 700; font-size: 22px; color: #032069 }
.ug-c262 { margin: 0; font-size: 15px; color: #5A6478 }
.ug-c263 { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 16px }
.ug-c264 { display: flex; flex-direction: column; gap: 7px; font-size: 13px; font-weight: 600; color: #032069 }
.ug-c265 { border: 1.5px solid #7C8AA3; border-radius: 10px; padding: 12px 15px; font-size: 15px; color: #001B3D; background: #FEFFFF; transition: border-color 0.18s ease }
.ug-c265:focus { outline: 2px solid #00687A; outline-offset: 1px; border-color: #00687A }
.ug-c266 { border: 1.5px solid #7C8AA3; border-radius: 10px; padding: 12px 15px; font-size: 15px; color: #001B3D; background: #FEFFFF; appearance: auto; transition: border-color 0.18s ease }
.ug-c266:focus { outline: 2px solid #00687A; outline-offset: 1px; border-color: #00687A }
.ug-c267 { margin-top: 6px; font-size: 16px; font-weight: 600; color: #FEFFFF; background: #001B3D; border: none; cursor: pointer; padding: 15px 26px; border-radius: 10px; transition: background-color 0.18s ease, transform 0.18s ease, box-shadow 0.18s ease }
.ug-c267:hover { background: #032069; transform: translateY(-1px); box-shadow: 0 10px 24px rgba(0,27,61,0.3) }
.ug-c267:focus { outline: 2px solid #00687A; outline-offset: 2px }
.ug-c268 { margin: 0; font-size: 12.5px; color: #5A6478; text-align: center }
.ug-c269 { background: #001C4B; color: #AFBBD0 }
.ug-c270 { max-width: 1240px; margin: 0 auto; padding: clamp(52px, 6vw, 80px) clamp(20px, 3vw, 32px) 0 }
.ug-c271 { display: grid; grid-template-columns: 1.7fr 1fr 1fr 1fr 1.25fr; gap: clamp(28px, 4vw, 60px); padding-bottom: clamp(44px, 5vw, 64px) }
.ug-c272 { margin-bottom: 18px }
.ug-c273 { height: 34px; width: auto; display: block }
.ug-c274 { margin: 0; font-size: 14px; line-height: 1.7; max-width: 32ch }
.ug-c275 { flex: 1 1 150px; min-width: 140px }
.ug-c276 { margin: 0 0 16px; font-size: 12.5px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: #8FA0BC }
.ug-c277 { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px }
.ug-c278 { display: inline-block; padding: 4px 0; font-size: 14.5px; color: #C2CBD9; text-decoration: none; transition: color 0.18s ease }
.ug-c278:hover { color: #FEFFFF }
.ug-c278:focus { outline: 2px solid #95BAD8; outline-offset: 2px }
.ug-c279 { flex: 1 1 170px; min-width: 150px }
.ug-c280 { background: #001B3D; padding: 25px clamp(20px, 3vw, 32px); text-align: center; font-size: 13.5px; color: #9AA6B8 }

.ug-desktop-only {
  display: contents;
}

.ug-mobile-only {
  display: none;
}

.ug-mobile-menu-wrap[hidden],
[data-product-panel][hidden],
[data-feature-grid][hidden],
[data-demo-success][hidden],
[data-demo-fields][hidden] {
  display: none !important;
}

[data-products-dropdown] {
  display: none;
}

[data-products-menu].is-open [data-products-dropdown],
[data-products-menu]:hover [data-products-dropdown],
[data-products-menu]:focus-within [data-products-dropdown] {
  display: block;
}

.ug-product-tab {
  background: transparent;
  border: none;
  border-radius: 9px;
  color: #5A6478;
  cursor: pointer;
  font-family: Inter, sans-serif;
  font-size: 15px;
  font-weight: 600;
  padding: 11px 24px;
  transition: all 0.18s ease;
}

.ug-product-tab.is-active {
  background: #FEFFFF;
  box-shadow: 0 2px 6px rgba(3,32,105,0.14);
  color: #032069;
}

.ug-product-tab:focus {
  outline: 2px solid #032069;
  outline-offset: 2px;
}

[data-faq-panel] {
  grid-template-rows: 0fr;
}

[data-faq-item].is-open [data-faq-panel] {
  grid-template-rows: 1fr;
}

[data-faq-item].is-open [data-faq-mark] {
  background-color: #FEFFFF;
  transform: rotate(45deg);
}

@media (max-width: 1119px) {
  .ug-desktop-only {
    display: none;
  }

  .ug-mobile-only {
    display: flex;
  }
}