.hero  {
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
    background-color: #f4f4f9;
    color: #333;
    display: flex;
    flex-direction: column;
  }

  .hero .header {
    background-color: #ffffff;
    padding: 1rem 2rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
  }

  .hero h1 {
    font-size: 1.5rem;
    color: #222;
  }

  .language-toggle {
    display: flex;
    gap: 0.5rem;
  }

  button.lang-btn {
    background: none;
    border: 1px solid #ccc;
    border-radius: 4px;
    padding: 0.3rem 0.6rem;
    cursor: pointer;
    font-size: 0.9rem;
    transition: background 0.3s, border-color 0.3s;
  }

  button.lang-btn:hover, button.lang-btn.active {
    background-color: #eee;
    border-color: #999;
  }

 button.lang-btn.active {    pointer-events:none;  opacity:0.7;   }

 .hero .main {
    flex: 1;
    padding: 1.5rem 2rem;
    margin: 0 auto;  width:100%; 
  }

  .search-container {
    margin-bottom: 2rem;
    display: flex;  
    align-items: center;
  }

  .search-box {
    flex: 1;
    display: flex;
    align-items: center;
    background-color: #fff;
    border-radius: 8px;
    box-shadow: 0 2px 6px rgba(0,0,0,0.1);
    padding: 0.5rem 1rem;
  }

  .search-box svg {
    width: 1.2rem;
    height: 1.2rem;
    fill: #888;
    margin-right: 0.5rem;
  }

  .search-box input {
    border: none;
    outline: none;
    font-size: 1rem;
    width: 100%;
  }

  .category {
    margin-bottom: 2rem;
  }

  .category h2 {
    font-size: 1.2rem;
    margin-bottom: 1rem;
    color: #444;       position: relative;
    border-bottom: 2px solid #ddd;
    padding-bottom: 0.5rem;
  }



.category h2.updates:before {
    background-image: url("data:image/svg+xml,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22utf-8%22%3F%3E%3C!--%20License%3A%20MIT.%20Made%20by%20radix-ui%3A%20https%3A%2F%2Fgithub.com%2Fradix-ui%2Ficons%20--%3E%3Csvg%20width%3D%2224px%22%20height%3D%2224px%22%20viewBox%3D%220%200%2015%2015%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M1.90321%207.29677C1.90321%2010.341%204.11041%2012.4147%206.58893%2012.8439C6.87255%2012.893%207.06266%2013.1627%207.01355%2013.4464C6.96444%2013.73%206.69471%2013.9201%206.41109%2013.871C3.49942%2013.3668%200.86084%2010.9127%200.86084%207.29677C0.860839%205.76009%201.55996%204.55245%202.37639%203.63377C2.96124%202.97568%203.63034%202.44135%204.16846%202.03202L2.53205%202.03202C2.25591%202.03202%202.03205%201.80816%202.03205%201.53202C2.03205%201.25588%202.25591%201.03202%202.53205%201.03202L5.53205%201.03202C5.80819%201.03202%206.03205%201.25588%206.03205%201.53202L6.03205%204.53202C6.03205%204.80816%205.80819%205.03202%205.53205%205.03202C5.25591%205.03202%205.03205%204.80816%205.03205%204.53202L5.03205%202.68645L5.03054%202.68759L5.03045%202.68766L5.03044%202.68767L5.03043%202.68767C4.45896%203.11868%203.76059%203.64538%203.15554%204.3262C2.44102%205.13021%201.90321%206.10154%201.90321%207.29677ZM13.0109%207.70321C13.0109%204.69115%2010.8505%202.6296%208.40384%202.17029C8.12093%202.11718%207.93465%201.84479%207.98776%201.56188C8.04087%201.27898%208.31326%201.0927%208.59616%201.14581C11.4704%201.68541%2014.0532%204.12605%2014.0532%207.70321C14.0532%209.23988%2013.3541%2010.4475%2012.5377%2011.3662C11.9528%2012.0243%2011.2837%2012.5586%2010.7456%2012.968L12.3821%2012.968C12.6582%2012.968%2012.8821%2013.1918%2012.8821%2013.468C12.8821%2013.7441%2012.6582%2013.968%2012.3821%2013.968L9.38205%2013.968C9.10591%2013.968%208.88205%2013.7441%208.88205%2013.468L8.88205%2010.468C8.88205%2010.1918%209.10591%209.96796%209.38205%209.96796C9.65819%209.96796%209.88205%2010.1918%209.88205%2010.468L9.88205%2012.3135L9.88362%2012.3123C10.4551%2011.8813%2011.1535%2011.3546%2011.7585%2010.6738C12.4731%209.86976%2013.0109%208.89844%2013.0109%207.70321Z%22%20fill%3D%22%23000000%22%20%20%2F%3E%3C%2Fsvg%3E");
}
.category h2.messages:before {
    background-image: url("data:image/svg+xml,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22utf-8%22%3F%3E%3C!--%20License%3A%20MIT.%20Made%20by%20michaelampr%3A%20https%3A%2F%2Fgithub.com%2Fmichaelampr%2Fjam%20--%3E%3Csvg%20fill%3D%22%23000000%22%20width%3D%2224px%22%20height%3D%2224px%22%20viewBox%3D%22-2%20-2.5%2024%2024%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20preserveAspectRatio%3D%22xMinYMin%22%20class%3D%22jam%20jam-message%22%3E%3Cpath%20d%3D'M9.378%2012H17a1%201%200%200%200%201-1V3a1%201%200%200%200-1-1H3a1%201%200%200%200-1%201v8a1%201%200%200%200%201%201%201%201%200%200%201%201%201v3.013L9.378%2012zM3%200h14a3%203%200%200%201%203%203v8a3%203%200%200%201-3%203h-6.958l-6.444%204.808A1%201%200%200%201%202%2018.006V14a2%202%200%200%201-2-2V3a3%203%200%200%201%203-3z'%2F%3E%3C%2Fsvg%3E");
}
.category h2.alerts:before {
    background-image: url("data:image/svg+xml,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22utf-8%22%3F%3E%3C!--%20License%3A%20MIT.%20Made%20by%20michaelampr%3A%20https%3A%2F%2Fgithub.com%2Fmichaelampr%2Fjam%20--%3E%3Csvg%20fill%3D%22%23000000%22%20width%3D%2224px%22%20height%3D%2224px%22%20viewBox%3D%22-2%20-2%2024%2024%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20preserveAspectRatio%3D%22xMinYMin%22%20class%3D%22jam%20jam-alert%22%3E%3Cpath%20d%3D'M10%2020C4.477%2020%200%2015.523%200%2010S4.477%200%2010%200s10%204.477%2010%2010-4.477%2010-10%2010zm0-2a8%208%200%201%200%200-16%208%208%200%200%200%200%2016zm0-13a1%201%200%200%201%201%201v5a1%201%200%200%201-2%200V6a1%201%200%200%201%201-1zm0%2010a1%201%200%201%201%200-2%201%201%200%200%201%200%202z'%2F%3E%3C%2Fsvg%3E");
}
.category h2.security:before {
    background-image: url("data:image/svg+xml,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22utf-8%22%3F%3E%3C!--%20License%3A%20MIT.%20Made%20by%20Esri%3A%20https%3A%2F%2Fgithub.com%2FEsri%2Fcalcite-ui-icons%20--%3E%3Csvg%20width%3D%2224px%22%20height%3D%2224px%22%20viewBox%3D%220%200%2024%2024%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M12%2022.943C3.533%2018.32%202.498%2012.026%203.16%204.723l.08-.869.871-.042c3.31-.166%205.668-.934%207.21-2.35L12%20.838l.68.624c1.54%201.416%203.9%202.184%207.21%202.35l.87.042.08.869c.666%207.34-.407%2013.61-8.84%2018.22zM4.16%204.811c-.543%205.988-.04%2012.694%207.838%2016.993%207.88-4.3%208.39-11.001%207.845-16.99-3.553-.178-6.12-1.036-7.84-2.616-1.72%201.58-4.29%202.435-7.842%202.613z%22%2F%3E%3Cpath%20fill%3D%22none%22%20d%3D%22M0%200h24v24H0z%22%2F%3E%3C%2Fsvg%3E");
}
.category h2.support:before {
    background-image: url("data:image/svg+xml,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%3C!--%20License%3A%20MIT.%20Made%20by%20Siemens%3A%20https%3A%2F%2Fgithub.com%2Fsiemens%2Fix-icons%20--%3E%3Csvg%20width%3D%2224px%22%20height%3D%2224px%22%20viewBox%3D%220%200%20512%20512%22%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%3E%3Cg%20id%3D%22Page-1%22%20stroke%3D%22none%22%20stroke-width%3D%221%22%20fill%3D%22none%22%20fill-rule%3D%22evenodd%22%3E%3Cg%20id%3D%22support%22%20fill%3D%22%23000000%22%20transform%3D%22translate(42.666667%2C%2042.666667)%22%3E%3Cpath%20d%3D%22M379.734355%2C174.506667%20C373.121022%2C106.666667%20333.014355%2C-2.13162821e-14%20209.067688%2C-2.13162821e-14%20C85.1210217%2C-2.13162821e-14%2045.014355%2C106.666667%2038.4010217%2C174.506667%20C15.2012632%2C183.311569%20-0.101643453%2C205.585799%200.000508304259%2C230.4%20L0.000508304259%2C260.266667%20C0.000508304259%2C293.256475%2026.7445463%2C320%2059.734355%2C320%20C92.7241638%2C320%20119.467688%2C293.256475%20119.467688%2C260.266667%20L119.467688%2C230.4%20C119.360431%2C206.121456%20104.619564%2C184.304973%2082.134355%2C175.146667%20C86.4010217%2C135.893333%20107.307688%2C42.6666667%20209.067688%2C42.6666667%20C310.827688%2C42.6666667%20331.521022%2C135.893333%20335.787688%2C175.146667%20C313.347976%2C184.324806%20298.68156%2C206.155851%20298.667688%2C230.4%20L298.667688%2C260.266667%20C298.760356%2C283.199651%20311.928618%2C304.070103%20332.587688%2C314.026667%20C323.627688%2C330.88%20300.801022%2C353.706667%20244.694355%2C360.533333%20C233.478863%2C343.50282%20211.780225%2C336.789048%20192.906491%2C344.509658%20C174.032757%2C352.230268%20163.260418%2C372.226826%20167.196286%2C392.235189%20C171.132153%2C412.243552%20188.675885%2C426.666667%20209.067688%2C426.666667%20C225.181549%2C426.577424%20239.870491%2C417.417465%20247.041022%2C402.986667%20C338.561022%2C392.533333%20367.787688%2C345.386667%20376.961022%2C317.653333%20C401.778455%2C309.61433%20418.468885%2C286.351502%20418.134355%2C260.266667%20L418.134355%2C230.4%20C418.23702%2C205.585799%20402.934114%2C183.311569%20379.734355%2C174.506667%20Z%20M76.8010217%2C260.266667%20C76.8010217%2C269.692326%2069.1600148%2C277.333333%2059.734355%2C277.333333%20C50.3086953%2C277.333333%2042.6676884%2C269.692326%2042.6676884%2C260.266667%20L42.6676884%2C230.4%20C42.6676884%2C224.302667%2045.9205765%2C218.668499%2051.2010216%2C215.619833%20C56.4814667%2C212.571166%2062.9872434%2C212.571166%2068.2676885%2C215.619833%20C73.5481336%2C218.668499%2076.8010217%2C224.302667%2076.8010217%2C230.4%20L76.8010217%2C260.266667%20Z%20M341.334355%2C230.4%20C341.334355%2C220.97434%20348.975362%2C213.333333%20358.401022%2C213.333333%20C367.826681%2C213.333333%20375.467688%2C220.97434%20375.467688%2C230.4%20L375.467688%2C260.266667%20C375.467688%2C269.692326%20367.826681%2C277.333333%20358.401022%2C277.333333%20C348.975362%2C277.333333%20341.334355%2C269.692326%20341.334355%2C260.266667%20L341.334355%2C230.4%20Z%22%3E%3C%2Fpath%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E");
}
.category h2.wnew:before {
    background-image: url("data:image/svg+xml,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22utf-8%22%3F%3E%3C!DOCTYPE%20svg%20PUBLIC%20%22-%2F%2FW3C%2F%2FDTD%20SVG%201.1%2F%2FEN%22%20%22http%3A%2F%2Fwww.w3.org%2FGraphics%2FSVG%2F1.1%2FDTD%2Fsvg11.dtd%22%3E%3C!--%20License%3A%20PD.%20Made%20by%20Templarian%3A%20https%3A%2F%2Fgithub.com%2FTemplarian%2FWindowsIcons%20--%3E%3Csvg%20width%3D%2224px%22%20height%3D%2224px%22%20viewBox%3D%220%200%2076%2076%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20version%3D%221.1%22%20baseProfile%3D%22full%22%20enable-background%3D%22new%200%200%2076.00%2076.00%22%20xml%3Aspace%3D%22preserve%22%3E%3Cpath%20fill%3D%22%23000000%22%20fill-opacity%3D%221%22%20stroke-width%3D%220.2%22%20stroke-linejoin%3D%22round%22%20d%3D%22M%2044.4832%2C15.8147L%2038.0245%2C32.9939L%2037.8017%2C32.9939L%2031.6771%2C15.8147L%2021.7662%2C21.578L%2033.4588%2C35.6539L%2033.4588%2C35.8755L%2016.087%2C32.3289L%2016.087%2C43.523L%2033.5702%2C40.4197L%2033.6815%2C40.6414L%2021.7662%2C54.4955L%2031.343%2C60.148L%2037.6904%2C43.0797L%2037.9131%2C43.0797L%2044.3718%2C60.148L%2054.1713%2C54.4955L%2042.1447%2C40.7522L%2042.1447%2C40.5305L%2060.0713%2C43.523L%2060.0713%2C32.3289L%2042.256%2C35.8755L%2042.256%2C35.6539L%2054.1713%2C21.4672L%2044.4832%2C15.8147%20Z%20%22%2F%3E%3C%2Fsvg%3E");
}
.category h2.recommendations:before {
    background-image: url("data:image/svg+xml,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22utf-8%22%3F%3E%3C!DOCTYPE%20svg%20PUBLIC%20%22-%2F%2FW3C%2F%2FDTD%20SVG%201.1%2F%2FEN%22%20%22http%3A%2F%2Fwww.w3.org%2FGraphics%2FSVG%2F1.1%2FDTD%2Fsvg11.dtd%22%3E%3C!--%20License%3A%20PD.%20Made%20by%20Icooon%20Mono%3A%20https%3A%2F%2Ficooon-mono.com%2F%20--%3E%3Csvg%20version%3D%221.1%22%20id%3D%22_x32_%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20width%3D%2224px%22%20height%3D%2224px%22%20viewBox%3D%220%200%20512%20512%22%20%20xml%3Aspace%3D%22preserve%22%3E%3Cg%3E%3Cpath%20class%3D%22st0%22%20d%3D%22M34.044%2C278.031c-0.641-0.516-1.531-0.594-2.266-0.234c-0.734%2C0.391-1.172%2C1.172-1.109%2C2l3.219%2C50.547c0.078%2C0.891-0.453%2C1.719-1.297%2C2.063L1.326%2C344.828c-0.719%2C0.297-1.219%2C0.953-1.313%2C1.703c-0.078%2C0.766%2C0.266%2C1.516%2C0.891%2C1.953l83.922%2C50.922c0.578%2C0.406%2C1.328%2C0.484%2C1.969%2C0.203c0.672-0.266%2C1.141-0.859%2C1.266-1.563l12.641-71.875c0.141-0.75-0.156-1.5-0.734-1.984L34.044%2C278.031z%22%2F%3E%3Cpath%20class%3D%22st0%22%20d%3D%22M479.419%2C332.406c-0.828-0.344-1.359-1.172-1.313-2.063l3.25-50.547c0.047-0.828-0.391-1.609-1.125-2c-0.734-0.359-1.625-0.281-2.266%2C0.234l-65.922%2C46.156c-0.578%2C0.484-0.875%2C1.234-0.734%2C1.984l12.656%2C71.875c0.109%2C0.703%2C0.578%2C1.297%2C1.234%2C1.563c0.672%2C0.281%2C1.406%2C0.203%2C2-0.203l83.906-50.922c0.641-0.438%2C0.969-1.188%2C0.875-1.953c-0.078-0.75-0.578-1.406-1.281-1.703L479.419%2C332.406z%22%2F%3E%3Cpath%20class%3D%22st0%22%20d%3D%22M255.998%2C392.469c-48.422%2C0-94.266-11.25-135.109-31.203l-13.156%2C74.75c45.609%2C19.281%2C95.719%2C29.953%2C148.266%2C29.953s102.672-10.672%2C148.281-29.953l-13.172-74.75C350.294%2C381.219%2C304.451%2C392.469%2C255.998%2C392.469z%22%2F%3E%3Cpolygon%20class%3D%22st0%22%20points%3D%2274.873%2C186.625%2081.388%2C199.797%2095.919%2C201.906%2085.404%2C212.156%2087.873%2C226.641%2074.873%2C219.797%2061.873%2C226.641%2064.357%2C212.156%2053.826%2C201.906%2068.373%2C199.797%20%22%2F%3E%3Cpolygon%20class%3D%22st0%22%20points%3D%22137.373%2C82.578%20143.873%2C95.75%20158.419%2C97.859%20147.888%2C108.109%20150.373%2C122.594%20137.373%2C115.766%20124.357%2C122.594%20126.857%2C108.109%20116.326%2C97.859%20130.873%2C95.75%20%22%2F%3E%3Cpolygon%20class%3D%22st0%22%20points%3D%22437.138%2C186.625%20430.638%2C199.797%20416.106%2C201.906%20426.622%2C212.156%20424.138%2C226.641%20437.138%2C219.797%20450.153%2C226.641%20447.669%2C212.156%20458.185%2C201.906%20443.638%2C199.797%20%22%2F%3E%3Cpolygon%20class%3D%22st0%22%20points%3D%22374.654%2C82.578%20368.154%2C95.75%20353.607%2C97.859%20364.123%2C108.109%20361.654%2C122.594%20374.654%2C115.766%20387.653%2C122.594%20385.169%2C108.109%20395.7%2C97.859%20381.154%2C95.75%20%22%2F%3E%3Cpolygon%20class%3D%22st0%22%20points%3D%22251.498%2C46.031%20257.998%2C59.203%20272.544%2C61.328%20262.013%2C71.578%20264.498%2C86.063%20251.498%2C79.219%20238.498%2C86.063%20240.982%2C71.578%20230.451%2C61.328%20244.998%2C59.203%20%22%2F%3E%3Cpath%20class%3D%22st0%22%20d%3D%22M236.091%2C129.266c3.344-6.766%2C10.219-11.047%2C17.75-11.047c7.547%2C0%2C14.438%2C4.281%2C17.766%2C11.047l19.703%2C39.922c2.891%2C5.844%2C8.469%2C9.906%2C14.906%2C10.844l44.063%2C6.391c7.469%2C1.094%2C13.672%2C6.313%2C16%2C13.484s0.391%2C15.031-5.016%2C20.297l-31.875%2C31.078c-4.672%2C4.547-6.797%2C11.109-5.703%2C17.531l7.531%2C43.891c1.266%2C7.422-1.781%2C14.922-7.875%2C19.359c-6.109%2C4.438-14.188%2C5.016-20.859%2C1.5l-39.422-20.719c-5.766-3.031-12.656-3.031-18.422%2C0l-39.406%2C20.719c-6.688%2C3.516-14.75%2C2.938-20.875-1.5c-6.094-4.438-9.141-11.938-7.875-19.359l7.531-43.891c1.109-6.422-1.031-12.984-5.688-17.531l-31.891-31.078c-5.391-5.266-7.328-13.125-5-20.297s8.531-12.391%2C15.984-13.484l44.063-6.391c6.438-0.938%2C12.031-5%2C14.906-10.844L236.091%2C129.266z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
}
.category h2.maintenance:before {
    background-image: url("data:image/svg+xml,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22utf-8%22%3F%3E%3C!--%20License%3A%20MIT.%20Made%20by%20etn-ccis%3A%20https%3A%2F%2Fgithub.com%2Fetn-ccis%2Fblui-icons%20--%3E%3Csvg%20fill%3D%22%23000000%22%20width%3D%2224px%22%20height%3D%2224px%22%20viewBox%3D%220%200%2024%2024%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M14.9392%204C13.3569%204%2011.8102%204.46919%2010.4946%205.34824C9.17899%206.22729%208.15361%207.47672%207.54811%208.93853C6.94261%2010.4003%206.78419%2012.0089%207.09287%2013.5607C7.40155%2015.1126%208.16348%2016.538%209.2823%2017.6569C10.4011%2018.7757%2011.8266%2019.5376%2013.3784%2019.8463C14.9303%2020.155%2016.5388%2019.9965%2018.0006%2019.391C19.4624%2018.7855%2020.7119%2017.7602%2021.5909%2016.4446C22.47%2015.129%2022.9391%2013.5823%2022.9391%2012C22.9391%209.87827%2022.0963%207.84344%2020.596%206.34315C19.0957%204.84285%2017.0609%204%2014.9392%204ZM18.8591%2014.8L17.7391%2015.92C17.7019%2015.9578%2017.6576%2015.9878%2017.6086%2016.0083C17.5597%2016.0288%2017.5072%2016.0393%2017.4541%2016.0393C17.4011%2016.0393%2017.3486%2016.0288%2017.2997%2016.0083C17.2507%2015.9878%2017.2064%2015.9578%2017.1691%2015.92L14.4391%2013.19C13.9127%2013.3789%2013.3413%2013.404%2012.8003%2013.2619C12.2593%2013.1199%2011.7739%2012.8174%2011.4081%2012.3942C11.0423%2011.9711%2010.8132%2011.4471%2010.7509%2010.8912C10.6886%2010.3353%2010.7961%209.77363%2011.0591%209.28L12.9391%2011.14L14.0691%2010.01L12.1891%208.14C12.6824%207.87185%2013.2454%207.75989%2013.8037%207.81897C14.362%207.87805%2014.8892%208.10538%2015.3154%208.47083C15.7415%208.83628%2016.0466%209.3226%2016.1902%209.86534C16.3337%2010.4081%2016.3089%2010.9816%2016.1192%2011.51L18.8491%2014.28C18.9111%2014.3525%2018.9452%2014.4447%2018.9452%2014.54C18.9452%2014.6353%2018.9111%2014.7275%2018.8491%2014.8H18.8591Z%22%20%2F%3E%3Cpath%20d%3D%22M2.93915%2012C2.94057%2010.7604%203.32589%209.55167%204.04215%208.53995C4.75841%207.52824%205.77045%206.7632%206.93915%206.35V4.28C5.23585%204.73411%203.73023%205.73808%202.65623%207.13593C1.58223%208.53377%201%2010.2472%201%2012.01C1%2013.7728%201.58223%2015.4862%202.65623%2016.8841C3.73023%2018.2819%205.23585%2019.2859%206.93915%2019.74V17.65C5.76934%2017.2373%204.75619%2016.4722%204.03915%2015.46C3.32396%2014.4479%202.9397%2013.2393%202.93915%2012Z%22%20%2F%3E%3C%2Fsvg%3E");
}
.category h2.inotices:before {
    background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/Pgo8IS0tIEdlbmVyYXRvcjogQWRvYmUgSWxsdXN0cmF0b3IgMTkuMC4wLCBTVkcgRXhwb3J0IFBsdWctSW4gLiBTVkcgVmVyc2lvbjogNi4wMCBCdWlsZCAwKSAgLS0+CjwhLS0gTGljZW5zZTogQ0MwLiBNYWRlIGJ5IFNWRyBSZXBvOiBodHRwczovL3d3dy5zdmdyZXBvLmNvbS9zdmcvMjk5MTI4L25vdGljZSAtLT4KPHN2ZyB2ZXJzaW9uPSIxLjEiIGlkPSJMYXllcl8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNHB4IiBoZWlnaHQ9IjI0cHgiIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIJdmlld0JveD0iMCAwIDUxMiA1MTIiIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDUxMiA1MTI7IiB4bWw6c3BhY2U9InByZXNlcnZlIj48Zz4JPGc+CQk8cG9seWdvbiBwb2ludHM9IjQ3OC42MDksMTg5LjIxNyA0NzguNjA5LDE1NS44MjYgNDQ1LjIxNywxNTUuODI2IDQ0NS4yMTcsMzMuMzkxIDQxMS44MjYsMzMuMzkxIDQxMS44MjYsNDIyLjk1NyA0NDUuMjE3LDQyMi45NTcgNDQ1LjIxNywzMDAuNTIyIDQ3OC42MDksMzAwLjUyMiA0NzguNjA5LDI2Ny4xMyA0NDUuMjE3LDI2Ny4xMyA0NDUuMjE3LDE4OS4yMTcgCQkiLz4JPC9nPjwvZz48Zz4JPGc+CQk8cmVjdCB4PSIzNDUuMDQzIiB3aWR0aD0iNjYuNzgzIiBoZWlnaHQ9IjMzLjM5MSIvPgk8L2c+PC9nPjxnPgk8Zz4JCTxyZWN0IHg9IjM0NS4wNDMiIHk9IjQyMi45NTciIHdpZHRoPSI2Ni43ODMiIGhlaWdodD0iMzMuMzkxIi8+CTwvZz48L2c+PGc+CTxnPgkJPHJlY3QgeD0iMjQ0Ljg3IiB5PSI2Ni43ODMiIHdpZHRoPSI2Ni43ODMiIGhlaWdodD0iMzMuMzkxIi8+CTwvZz48L2c+PGc+CTxnPgkJPHJlY3QgeD0iMjQ0Ljg3IiB5PSIzNTYuMTc0IiB3aWR0aD0iNjYuNzgzIiBoZWlnaHQ9IjMzLjM5MSIvPgk8L2c+PC9nPjxnPgk8Zz4JCTxwb2x5Z29uIHBvaW50cz0iMjQ0Ljg3LDEzMy41NjUgMjQ0Ljg3LDEwMC4xNzQgNjYuNzgzLDEwMC4xNzQgNjYuNzgzLDEzMy41NjUgMzMuMzkxLDEzMy41NjUgMzMuMzkxLDE2Ni45NTcgMCwxNjYuOTU3IDAsMjg5LjM5MSAzMy4zOTEsMjg5LjM5MSAzMy4zOTEsMzIyLjc4MyA2Ni43ODMsMzIyLjc4MyA2Ni43ODMsNDc4LjYwOSAxMDAuMTc0LDQ3OC42MDkgMTAwLjE3NCwzNTYuMTc0IDE2Ni45NTcsMzU2LjE3NCAJMTY2Ljk1Nyw0NzguNjA5IDIwMC4zNDgsNDc4LjYwOSAyMDAuMzQ4LDM1Ni4xNzQgMjQ0Ljg3LDM1Ni4xNzQgMjQ0Ljg3LDMyMi43ODMgMTU1LjgyNiwzMjIuNzgzIDE1NS44MjYsMTMzLjU2NSAJCSIvPgk8L2c+PC9nPjxnPgk8Zz4JCTxyZWN0IHg9IjMxMS42NTIiIHk9IjMzLjM5MSIgd2lkdGg9IjMzLjM5MSIgaGVpZ2h0PSIzMy4zOTEiLz4JPC9nPjwvZz48Zz4JPGc+CQk8cmVjdCB4PSIzMTEuNjUyIiB5PSIzODkuNTY1IiB3aWR0aD0iMzMuMzkxIiBoZWlnaHQ9IjMzLjM5MSIvPgk8L2c+PC9nPjxnPgk8Zz4JCTxyZWN0IHg9IjEwMC4xNzQiIHk9IjQ3OC42MDkiIHdpZHRoPSI2Ni43ODMiIGhlaWdodD0iMzMuMzkxIi8+CTwvZz48L2c+PGc+CTxnPgkJPHJlY3QgeD0iNDc4LjYwOSIgeT0iMTg5LjIxNyIgd2lkdGg9IjMzLjM5MSIgaGVpZ2h0PSI3Ny45MTMiLz4JPC9nPjwvZz48L3N2Zz4K");
}
.category h2.reminders:before {
    background-image: url("data:image/svg+xml,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22utf-8%22%3F%3E%3C!--%20License%3A%20CC%20Attribution.%20Made%20by%20salesforce%3A%20https%3A%2F%2Flightningdesignsystem.com%2F%20--%3E%3Csvg%20fill%3D%22%23000000%22%20width%3D%2224px%22%20height%3D%2224px%22%20viewBox%3D%220%200%2052%2052%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M50.3%2C7.5a7.45%2C7.45%2C0%2C0%2C0-6.2-5.9%2C7.81%2C7.81%2C0%2C0%2C0-5.8%2C1.6.81.81%2C0%2C0%2C0%2C.2%2C1.4%2C28.48%2C28.48%2C0%2C0%2C1%2C9.4%2C8.2.84.84%2C0%2C0%2C0%2C1.4%2C0A6.87%2C6.87%2C0%2C0%2C0%2C50.3%2C7.5ZM13.5%2C4.7a.9.9%2C0%2C0%2C0%2C.2-1.4A7%2C7%2C0%2C0%2C0%2C7.9%2C1.7%2C7.23%2C7.23%2C0%2C0%2C0%2C1.7%2C7.5a7.36%2C7.36%2C0%2C0%2C0%2C1.1%2C5.3.84.84%2C0%2C0%2C0%2C1.4%2C0A26%2C26%2C0%2C0%2C1%2C13.5%2C4.7ZM26%2C6.5a22.06%2C22.06%2C0%2C0%2C0-22%2C22%2C21.58%2C21.58%2C0%2C0%2C0%2C4.3%2C13L5%2C44.8a3.2%2C3.2%2C0%2C0%2C0%2C0%2C4.6%2C3.15%2C3.15%2C0%2C0%2C0%2C4.6%2C0l3.3-3.3A22.1%2C22.1%2C0%2C0%2C0%2C26%2C50.4a21.58%2C21.58%2C0%2C0%2C0%2C13-4.3l3.3%2C3.3a3.25%2C3.25%2C0%2C0%2C0%2C2.4%2C1A3.3%2C3.3%2C0%2C0%2C0%2C47%2C44.8l-3.3-3.3a21.58%2C21.58%2C0%2C0%2C0%2C4.3-13A21.94%2C21.94%2C0%2C0%2C0%2C26%2C6.5ZM10.5%2C28.4A15.5%2C15.5%2C0%2C1%2C1%2C26%2C43.9%2C15.49%2C15.49%2C0%2C0%2C1%2C10.5%2C28.4Zm18-.9V21.1a2.37%2C2.37%2C0%2C0%2C0-2.4-2.4%2C2.43%2C2.43%2C0%2C0%2C0-2.4%2C2.4v7.3a2.06%2C2.06%2C0%2C0%2C0%2C.7%2C1.7l5.7%2C5.7a2.41%2C2.41%2C0%2C0%2C0%2C3.4%2C0%2C2.3%2C2.3%2C0%2C0%2C0%2C0-3.4Z%22%2F%3E%3C%2Fsvg%3E");
}


 .category h2:before {
    display: inline-block;
    position: absolute;
    height: 20px;
    width: 20px;
    top: 5px;
    left: 8px;
    background-repeat: no-repeat;
    background-size: 20px 20px;
    content: "";
    vertical-align: bottom;
}
   
  .notifications {  width:100%; 
    display: flex;
    flex-direction: column;
    gap: 1rem;  
  }

  .notification { width:100%;   overflow:auto;
    background-color: #fff;
    padding: 1rem;
    border-radius: 8px;
    display: flex;
    align-items: flex-start;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    transition: transform 0.2s, box-shadow 0.2s;
  }

  .notification:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(0,0,0,0.15);
  }

  .icon {
    width: 2rem;
    height: 2rem;
    margin-right: 1rem;
    flex-shrink: 0;
  }

 .hero .content {
    flex: 1;
  }

  .title {
    font-weight: bold;
    margin-bottom: 0.5rem;
  }

  .message {
    font-size: 0.95rem;
    color: #555;
  }

  @media(max-width: 768px) {
     .hero .header {
      flex-direction: column;
      align-items: flex-start;
      gap: 1rem;
    }

     .hero .main {
      padding: 1rem;
    }
  }