/* HostiGuard — التطوير 263: أيقونة HostiGuard = ملف حزمة الأيقونات الرسمية كما هو | التطوير 262: صفحة مركز التحميل /download-center (كل الكلاسات dc-* داخل .dc) */
.dc{
  --ink:#0f172a; --ink2:#334155; --mut:#5b6b82; --mut2:#66758c; --line:#e3e9f2; --line2:#eef2f8;
  --bg:#f6f8fd; --brand:#3a6bc9; --brand2:#2d5cb8; --btn:#3d6bd4; --btn2:#2f5bbf; --soft:#eef4ff; --soft2:#dfe9fd;
  --ok:#08734f; --ok-soft:#e5f6ee; --warn:#a35a06; --warn-soft:#fff3df;
  color:var(--ink); font-size:15px; line-height:1.55; padding-bottom:8px;
}
.dc *,.dc *::before,.dc *::after{ box-sizing:border-box; }
:where(.dc) :where(h1,h2,h3,h4,p,ul,dl,dd,figure){ margin:0; }
:where(.dc) :where(ul){ padding:0; list-style:none; }
:where(.dc) :where(a){ color:var(--brand); text-decoration:none; }
:where(.dc) :where(a:hover){ color:var(--brand2); }
:where(.dc) :where(button){ font:inherit; color:inherit; background:none; border:0; padding:0; cursor:pointer; }
.dc img{ max-width:100%; display:block; }
.dc :focus-visible{ outline:2px solid var(--btn); outline-offset:2px; border-radius:10px; }
.dc .ms{ font-family:"Material Symbols Outlined"; font-weight:400; font-style:normal; font-size:20px; line-height:1; letter-spacing:normal; text-transform:none; display:inline-block; white-space:nowrap; direction:ltr; -webkit-font-feature-settings:"liga"; font-feature-settings:"liga"; font-variation-settings:"FILL" 0,"wght" 400,"GRAD" 0,"opsz" 24; flex:none; }
[dir=rtl] .dc .flip{ transform:scaleX(-1); }
.dc .ltr{ direction:ltr; unicode-bidi:isolate; }
.dc-wrap{ max-width:1280px; margin:0 auto; padding-inline:24px; }
.dc h1,.dc h2,.dc h3{ font-family:inherit; }

/* ───────── hero ───────── */
.dc-hero{ position:relative; padding:40px 0 70px; background:radial-gradient(900px 420px at 12% 0%,#e9f1ff 0%,rgba(233,241,255,0) 70%),radial-gradient(700px 380px at 92% 20%,#eef0ff 0%,rgba(238,240,255,0) 70%),#fff; }
.dc-hero::before{ content:""; position:absolute; inset:0; background-image:radial-gradient(rgba(58,107,201,.12) 1px,transparent 1px); background-size:22px 22px; -webkit-mask-image:linear-gradient(180deg,#000 0%,transparent 75%); mask-image:linear-gradient(180deg,#000 0%,transparent 75%); pointer-events:none; }
.dc-hero .dc-wrap{ position:relative; display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr); gap:48px; align-items:center; }
.dc-hero .dc-wrap.solo{ grid-template-columns:minmax(0,1fr); }
.dc-crumb{ display:flex; align-items:center; gap:6px; font-size:13.5px; color:var(--mut); margin-bottom:22px; }
.dc-crumb a{ color:var(--mut); }
.dc-crumb a:hover{ color:var(--brand2); }
.dc-crumb .ms{ font-size:16px; color:var(--mut2); }
.dc-crumb b{ color:var(--ink2); font-weight:600; }
.dc-eyebrow{ display:inline-flex; align-items:center; gap:8px; height:30px; padding-inline:12px; border-radius:999px; background:var(--soft); border:1px solid var(--soft2); color:var(--brand2); font-size:12.5px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; }
[dir=rtl] .dc-eyebrow{ letter-spacing:0; font-size:13px; }
.dc-eyebrow .ms{ font-size:16px; }
.dc-hero h1{ margin-top:18px; font-size:58px; line-height:1.04; font-weight:900; letter-spacing:-.035em; text-wrap:balance; color:var(--ink); }
[dir=rtl] .dc-hero h1{ letter-spacing:0; line-height:1.25; font-weight:800; font-size:54px; }
.dc-hero h1 em{ font-style:normal; color:var(--btn); }
.dc-lead{ margin-top:18px; max-width:560px; font-size:18.5px; line-height:1.6; color:#475569; }
.dc-jump{ margin-top:28px; display:flex; flex-wrap:wrap; gap:10px; }
.dc-jump a{ height:42px; display:inline-flex; align-items:center; gap:8px; padding-inline:14px 16px; border-radius:12px; background:#fff; border:1px solid var(--line); color:var(--ink2); font-size:14px; font-weight:600; box-shadow:0 1px 2px rgba(15,23,42,.04); transition:border-color .15s,color .15s; }
.dc-jump a:hover{ border-color:#c7d6f3; color:var(--brand2); }
.dc-jump .ms{ font-size:19px; color:var(--brand); }
.dc-trust{ margin-top:22px; display:flex; flex-wrap:wrap; gap:8px 22px; font-size:13.5px; color:var(--mut); }
.dc-trust > span{ display:inline-flex; align-items:center; gap:7px; }
.dc-trust .ms{ font-size:18px; color:var(--ok); }

.dc-latest{ background:#fff; border:1px solid #e1e8f4; border-radius:26px; box-shadow:0 40px 70px -40px rgba(30,64,140,.35),0 10px 24px -14px rgba(15,23,42,.12); overflow:hidden; }
.dc-latest-top{ padding:22px 24px 20px; background:linear-gradient(180deg,#f7faff,#fff); border-bottom:1px solid var(--line2); }
.dc-latest-k{ font-size:12px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--mut); display:flex; align-items:center; gap:8px; }
[dir=rtl] .dc-latest-k{ letter-spacing:0; font-size:13px; }
.dc-latest-k i{ width:8px; height:8px; border-radius:99px; background:#16b47a; box-shadow:0 0 0 4px #dff6ec; }
.dc-latest-app{ margin-top:16px; display:flex; align-items:center; gap:14px; }
.dc-latest-app h2{ font-size:19px; font-weight:800; letter-spacing:-.01em; line-height:1.3; }
[dir=rtl] .dc-latest-app h2{ letter-spacing:0; }
.dc-latest-app p{ font-size:13.5px; color:var(--mut); margin-top:2px; }
.dc-latest .dc-btn-dl{ margin-top:18px; width:100%; }
.dc-latest-list li{ display:flex; align-items:center; gap:12px; padding:13px 24px; border-top:1px solid var(--line2); font-size:14px; }
.dc-latest-list li:first-child{ border-top:0; }
.dc-latest-list .ms{ font-size:20px; color:var(--mut2); }
.dc-latest-list b{ font-weight:600; color:var(--ink2); }
.dc-latest-list .dc-pill{ margin-inline-start:auto; }

/* official HostiGuard icon (icon pack v244 file as it is: the shield on a white rounded square) */
.dc-tile{ position:relative; width:64px; height:64px; flex:none; display:block; }
.dc-tile > img{ width:100%; height:100%; filter:drop-shadow(0 6px 10px rgba(30,64,140,.16)) drop-shadow(0 1px 1px rgba(15,23,42,.08)); }
.dc-tile.lg{ width:76px; height:76px; }
.dc-tile .plat{ position:absolute; inset-block-end:-5px; inset-inline-end:-5px; width:26px; height:26px; border-radius:9px; background:var(--ink); color:#fff; display:grid; place-items:center; border:2px solid #fff; }
.dc-tile .plat .ms{ font-size:15px; }
.dc-tile.glyph{ border-radius:18px; background:linear-gradient(180deg,#f3f7ff,#e7efff); border:1px solid #dfe7f5; color:var(--brand2); display:grid; place-items:center; }
.dc-tile.glyph .ms{ font-size:30px; }

/* status pills */
.dc-pill{ display:inline-flex; align-items:center; gap:7px; height:28px; padding-inline:11px; border-radius:999px; font-size:12.5px; font-weight:700; white-space:nowrap; flex:none; }
.dc-pill i{ width:7px; height:7px; border-radius:99px; background:currentColor; }
.dc-pill.ok{ background:var(--ok-soft); color:var(--ok); }
.dc-pill.soon{ background:var(--warn-soft); color:var(--warn); }

/* buttons */
.dc-btn-dl{ display:inline-flex; align-items:center; justify-content:center; gap:12px; min-height:56px; padding:9px 22px 9px 18px; border-radius:16px; background:var(--btn); color:#fff !important; box-shadow:0 10px 22px -10px rgba(63,111,214,.75); font-weight:700; transition:background .15s,transform .15s; }
[dir=rtl] .dc-btn-dl{ padding:9px 18px 9px 22px; }
.dc-btn-dl:hover{ background:var(--btn2); transform:translateY(-1px); }
.dc-btn-dl .ms{ font-size:26px; }
.dc-btn-dl > span:not(.ms){ display:flex; flex-direction:column; text-align:start; line-height:1.2; }
.dc-btn-dl b{ font-size:15.5px; }
.dc-btn-dl small{ font-size:12.5px; font-weight:500; opacity:.88; }
.dc-btn-o{ height:46px; display:inline-flex; align-items:center; gap:8px; padding-inline:16px; border-radius:13px; border:1px solid var(--line); background:#fff; color:var(--ink2) !important; font-size:14px; font-weight:700; transition:border-color .15s,color .15s; }
.dc-btn-o:hover{ border-color:#c7d6f3; color:var(--brand2) !important; }
.dc-btn-o .ms{ font-size:19px; }
.dc-btn-p{ height:46px; display:inline-flex; align-items:center; gap:8px; padding-inline:18px; border-radius:13px; background:var(--btn); color:#fff !important; font-size:14px; font-weight:700; transition:background .15s; }
.dc-btn-p:hover{ background:var(--btn2); }
.dc-btn-p .ms{ font-size:19px; }

/* store badges row (badges themselves: hg-apps.css .dcb) */
.dc-stores{ display:flex; flex-wrap:wrap; align-items:flex-start; gap:12px 14px; }

/* sections + product cards */
.dc-sec{ padding:72px 0 0; scroll-margin-top:110px; }
.dc-sec-h{ margin-bottom:26px; }
.dc-sec-h .k{ display:flex; align-items:center; gap:8px; font-size:12.5px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; color:var(--brand); }
[dir=rtl] .dc-sec-h .k{ letter-spacing:0; font-size:13.5px; }
.dc-sec-h .k .ms{ font-size:18px; }
.dc-sec-h h2{ margin-top:8px; font-size:34px; line-height:1.15; font-weight:800; letter-spacing:-.025em; color:var(--ink); text-wrap:balance; }
[dir=rtl] .dc-sec-h h2{ letter-spacing:0; line-height:1.35; }
.dc-sec-h p{ margin-top:8px; max-width:640px; font-size:16px; color:var(--mut); }
.dc-grid2{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; }
.dc-grid2.one{ grid-template-columns:minmax(0,1fr); }
.dc-pc{ display:flex; flex-direction:column; background:#fff; border:1px solid #e3e9f2; border-radius:26px; padding:28px; box-shadow:0 1px 2px rgba(15,23,42,.04),0 18px 40px -32px rgba(30,64,140,.45); min-width:0; }
.dc-pc-top{ display:flex; align-items:flex-start; gap:16px; }
.dc-pc-name{ min-width:0; flex:1 1 auto; }
.dc-pc-name h3{ font-size:22px; line-height:1.25; font-weight:800; letter-spacing:-.015em; color:var(--ink); }
[dir=rtl] .dc-pc-name h3{ letter-spacing:0; line-height:1.4; }
.dc-pc-name p{ margin-top:3px; font-size:14px; color:var(--mut); }
.dc-pc-desc{ margin-top:18px; font-size:15.5px; line-height:1.65; color:#3d4b60; }
.dc-pc-dl{ margin-top:auto; padding-top:24px; }
.dc-lbl{ font-size:12.5px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--mut2); margin-bottom:12px; }
[dir=rtl] .dc-lbl{ letter-spacing:0; font-size:13px; }
.dc-note{ margin-top:14px; display:flex; gap:9px; font-size:13px; line-height:1.5; color:var(--mut); }
.dc-note .ms{ font-size:18px; color:var(--mut2); margin-top:1px; }
.dc-feat2{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px 18px; margin-top:22px; }
.dc-feat2 li{ display:flex; gap:10px; font-size:14.5px; color:#334155; line-height:1.45; }
.dc-feat2 .ms{ font-size:19px; color:var(--brand); }
.dc-specs{ margin-top:22px; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1px; background:var(--line2); border:1px solid var(--line2); border-radius:16px; overflow:hidden; }
.dc-specs > div{ background:#fff; padding:12px 14px; min-width:0; }
.dc-specs dt{ font-size:12px; color:var(--mut); }
.dc-specs dd{ margin-top:3px; font-size:14px; font-weight:700; color:var(--ink); overflow-wrap:anywhere; }
.dc-specs dd.pend{ color:var(--warn); }
.dc-specs.c4{ grid-template-columns:repeat(4,minmax(0,1fr)); }

/* desktop (Drive for Windows) */
.dc-xl{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.05fr); padding:0; overflow:hidden; }
.dc-xl-main{ padding:34px 34px 26px; display:flex; flex-direction:column; min-width:0; }
.dc-xl-foot{ grid-column:1 / -1; padding:26px 34px 30px; border-top:1px solid var(--line2); display:grid; grid-template-columns:minmax(0,1.35fr) minmax(0,1fr); gap:26px; align-items:start; background:#fcfdff; }
.dc-xl-foot .dc-specs{ margin-top:0; }
.dc-xl-shot{ position:relative; background:linear-gradient(160deg,#eaf1ff 0%,#dfe8fb 55%,#e9e6ff 100%); display:flex; align-items:center; justify-content:flex-start; padding:34px 0 52px 34px; overflow:hidden; min-width:0; }
[dir=rtl] .dc-xl-shot{ padding:34px 34px 52px 0; }
.dc-xl-shot img{ width:118%; max-width:none; height:auto; border-radius:14px; box-shadow:0 40px 80px -30px rgba(15,23,42,.45),0 0 0 1px rgba(15,23,42,.06); }
.dc-xl-shot figcaption{ position:absolute; inset-block-end:16px; inset-inline-start:34px; display:inline-flex; align-items:center; gap:6px; height:28px; padding-inline:10px; border-radius:99px; background:rgba(255,255,255,.9); font-size:12px; font-weight:600; color:#475569; }
.dc-xl-shot figcaption .ms{ font-size:16px; }
.dc-dl-row{ display:flex; flex-wrap:wrap; align-items:center; gap:12px; margin-top:4px; }
.dc-hash{ display:flex; align-items:center; gap:10px; padding:10px 12px; border-radius:12px; background:#f7f9fd; border:1px solid var(--line2); font-size:12.5px; color:var(--mut); min-width:0; }
.dc-hash b{ color:var(--ink2); font-weight:700; white-space:nowrap; }
.dc-hash code{ font:500 12.5px/1.2 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; color:var(--ink2); direction:ltr; unicode-bidi:isolate; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; min-width:0; flex:1 1 auto; }
.dc-hash button{ flex:none; height:30px; padding-inline:10px; border-radius:9px; border:1px solid var(--line); background:#fff; font:600 12px/1 inherit; font-family:inherit; color:var(--ink2); cursor:pointer; display:inline-flex; align-items:center; gap:5px; }
.dc-hash button:hover{ border-color:#c7d6f3; color:var(--brand2); }
.dc-hash button .ms{ font-size:15px; }
.dc-plats{ margin-top:14px; display:flex; flex-wrap:wrap; gap:10px; }
.dc-chip{ display:inline-flex; align-items:center; gap:9px; height:40px; padding-inline:12px 14px; border-radius:12px; border:1px solid var(--line); background:#fff; font-size:13.5px; font-weight:600; color:var(--ink2); }
.dc-chip .ms{ font-size:20px; color:var(--ink2); }
.dc-chip small{ font-size:12px; font-weight:600; }
.dc-chip.ok small{ color:var(--ok); }
.dc-chip.no{ background:#f8fafc; color:var(--mut); border-style:dashed; }
.dc-chip.no .ms,.dc-chip.no small{ color:var(--mut2); }

/* Microsoft Store */
.dc-ms-card{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:28px; align-items:start; }
.dc-ms-card > div{ min-width:0; display:flex; flex-direction:column; }
.dc-spec{ background:#f7f9fd; border:1px solid var(--line2); border-radius:16px; padding:6px 16px; }
.dc-spec > div{ display:flex; justify-content:space-between; gap:14px; padding:9px 0; border-top:1px solid #e9eef6; font-size:13.5px; }
.dc-spec > div:first-child{ border-top:0; }
.dc-spec dt{ color:var(--mut); }
.dc-spec dd{ color:var(--ink); font-weight:600; text-align:end; }
.dc-cmp{ margin-top:14px; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.dc-cmp > div{ border:1px solid var(--line2); background:#f9fbfe; border-radius:16px; padding:16px; }
.dc-cmp b{ display:flex; align-items:center; gap:8px; font-size:14.5px; color:var(--ink); }
.dc-cmp b .ms{ font-size:20px; color:var(--brand); }
.dc-cmp p{ margin-top:6px; font-size:13.5px; color:var(--mut); line-height:1.55; }

/* integrations */
.dc-ver{ height:28px; display:inline-flex; align-items:center; padding-inline:10px; border-radius:9px; background:#f1f5fb; color:#475569; font:700 12.5px/1 ui-monospace,SFMono-Regular,Menlo,monospace; flex:none; direction:ltr; }
.dc-req{ margin-top:16px; display:flex; flex-wrap:wrap; gap:8px; }
.dc-req > span{ min-height:30px; display:inline-flex; align-items:center; gap:6px; padding:4px 10px; border-radius:9px; background:#f5f8fd; border:1px solid var(--line2); font-size:12.5px; font-weight:600; color:#475569; }
.dc-req .ms{ font-size:16px; color:var(--mut2); }
.dc-btns{ display:flex; flex-wrap:wrap; gap:10px; }

/* help band */
.dc-help{ margin-top:72px; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
.dc-help > div{ border-radius:22px; padding:24px; background:var(--bg); border:1px solid #e6edf8; }
.dc-help h2{ display:flex; align-items:center; gap:10px; font-size:17px; font-weight:800; color:var(--ink); letter-spacing:-.01em; }
[dir=rtl] .dc-help h2{ letter-spacing:0; }
.dc-help h2 .ms{ font-size:22px; color:var(--brand); }
.dc-help p{ margin-top:8px; font-size:14px; color:var(--mut); }
.dc-help ul{ margin-top:12px; }
.dc-help li + li{ margin-top:8px; }
.dc-help li a{ display:inline-flex; align-items:center; gap:8px; font-size:14.5px; font-weight:700; }
.dc-help li a .ms{ font-size:18px; }
.dc-help .x{ color:var(--mut2); font-size:16px !important; }
.dc-empty{ margin-top:48px; padding:28px; border-radius:22px; border:1px dashed #cdd8e8; background:#fbfcfe; color:var(--mut); text-align:center; font-size:15px; }

/* ───────── responsive ───────── */
@media (max-width:1180px){
  .dc-hero .dc-wrap{ grid-template-columns:minmax(0,1fr); gap:36px; }
  .dc-latest{ max-width:560px; }
  .dc-xl{ grid-template-columns:minmax(0,1fr); }
  .dc-xl-foot{ grid-template-columns:minmax(0,1fr); }
  .dc-xl-shot{ padding:28px 0 0 28px; }
  [dir=rtl] .dc-xl-shot{ padding:28px 28px 0 0; }
  .dc-xl-shot img{ width:110%; border-radius:14px 0 0 0; }
  [dir=rtl] .dc-xl-shot img{ border-radius:0 14px 0 0; }
  .dc-xl-shot figcaption{ inset-block-end:auto; inset-block-start:12px; inset-inline-start:auto; inset-inline-end:14px; }
}
@media (max-width:900px){
  .dc-grid2,.dc-ms-card,.dc-help{ grid-template-columns:minmax(0,1fr); }
}
@media (max-width:640px){
  .dc-wrap{ padding-inline:16px; }
  .dc-hero{ padding:26px 0 40px; }
  .dc-hero h1{ font-size:40px; }
  [dir=rtl] .dc-hero h1{ font-size:38px; }
  .dc-lead{ font-size:16.5px; }
  .dc-crumb{ margin-bottom:16px; }
  .dc-jump{ display:grid; grid-template-columns:1fr 1fr; gap:8px; }
  .dc-jump a{ padding-inline:12px; font-size:13.5px; }
  .dc-latest-top{ padding:18px; }
  .dc-latest-list li{ padding:12px 18px; }
  .dc-sec{ padding-top:52px; }
  .dc-sec-h{ margin-bottom:20px; }
  .dc-sec-h h2{ font-size:27px; }
  .dc-sec-h p{ font-size:15px; }
  .dc-pc{ padding:20px; border-radius:22px; }
  .dc-pc-name h3{ font-size:19px; }
  .dc-pc-top{ display:grid; grid-template-columns:auto minmax(0,1fr); column-gap:14px; row-gap:10px; align-items:start; }
  .dc-pc-top .dc-pill,.dc-pc-top .dc-ver{ grid-column:2; justify-self:start; }
  .dc-xl{ padding:0; }
  .dc-xl-main{ padding:20px; }
  .dc-xl-shot{ padding:20px 0 0 20px; }
  [dir=rtl] .dc-xl-shot{ padding:20px 20px 0 0; }
  .dc-xl-shot img{ width:150%; }
  .dc-feat2{ grid-template-columns:minmax(0,1fr); }
  .dc-specs,.dc-specs.c4{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .dc-btn-dl{ width:100%; }
  .dc-cmp{ grid-template-columns:minmax(0,1fr); }
  .dc-help{ margin-top:52px; }
  .dc-xl-foot{ padding:20px; }
}
