/* ============================================================
   Safeguards — "Policy Register"
   A formal E&S document register: full-width rail rows (listing)
   + two-column article with a sticky Document details panel (single).
   Brand: navy #31485a | blue #3399d1 | teal #16999b | ink #22323f
   RTL-aware (logical properties), responsive, reduced-motion safe.
   Loaded on BOTH the listing (inside page.php) and the single template,
   so single-page hero overrides are scoped to .sg-hero (see below).
   ============================================================ */
:root{
  --sg-navy:#31485a;
  --sg-blue:#3399d1;
  --sg-teal:#16999b;
  --sg-ink:#22323f;
  --sg-muted:#5c6f7e;
  --sg-line:#e6edf2;
  --sg-bg:#fff;
  --sg-soft:#f5f8fb;
  --sg-ease:cubic-bezier(.22,1,.36,1);
  --sg-shadow:0 10px 26px rgba(34,50,63,.06);
  --sg-shadow-lg:0 22px 46px rgba(34,50,63,.15);
}

.sg-wrap,.sg-single .p_content{ font-family:'Segoe UI Variable Text','Segoe UI',system-ui,-apple-system,sans-serif; }
.sg-wrap *,.sg-single .sg-single-grid *{ box-sizing:border-box; }

/* classic Material Icons — the front-end loads Google's classic set only,
   so we force the family + ligatures on our own icons (never the bare
   'download' ligature, which is Material Symbols-only). */
.sg-ic{
  font-family:'Material Icons'; font-weight:normal; font-style:normal;
  font-size:18px; line-height:1; letter-spacing:normal; text-transform:none;
  white-space:nowrap; direction:ltr; vertical-align:middle; display:inline-block;
  -webkit-font-feature-settings:'liga'; font-feature-settings:'liga';
  -webkit-font-smoothing:antialiased;
}

/* ---------- shared eyebrow ---------- */
.sg-eyebrow{
  display:inline-block; font-family:'Montserrat',sans-serif; font-weight:700;
  font-size:12.5px; letter-spacing:3px; text-transform:uppercase; color:var(--sg-blue);
}

/* ============================================================
   LISTING — register intro
   ============================================================ */
.sg-wrap{ margin:4px 0 8px; }
.sg-intro{ max-width:820px; margin-bottom:30px; }
.sg-intro .sg-eyebrow{ margin-bottom:12px; }
.sg-lede{
  font-size:clamp(16px,1.7vw,19px); line-height:1.7; color:var(--sg-ink);
  font-weight:500; margin:0 0 16px;
}
.sg-count{
  display:inline-flex; align-items:center; gap:8px;
  font-family:'Montserrat',sans-serif; font-weight:600; font-size:13px;
  color:var(--sg-muted); letter-spacing:.3px;
}
.sg-count-num{
  display:inline-grid; place-items:center; min-width:28px; height:28px; padding:0 8px;
  background:var(--sg-navy); color:#fff; border-radius:8px; font-weight:800; font-size:14px;
}

/* ---------- register rows ---------- */
.sg-register{
  border:1px solid var(--sg-line); border-radius:18px; overflow:hidden;
  background:var(--sg-bg); box-shadow:var(--sg-shadow);
}
.sg-row{
  position:relative; display:flex; align-items:center; gap:20px;
  padding:20px clamp(18px,3vw,28px) 20px clamp(20px,3vw,30px);
  text-decoration:none; border-top:1px solid var(--sg-line);
  transition:background .35s var(--sg-ease), transform .35s var(--sg-ease);
}
.sg-row:first-child{ border-top:0; }
.sg-row:hover{ background:var(--sg-soft); }

/* left colour rail keyed to document type */
.sg-rail{
  position:absolute; inset-block:0; inset-inline-start:0; width:4px;
  background:var(--rail,var(--sg-navy)); transform:scaleY(.34); transform-origin:center;
  transition:transform .4s var(--sg-ease);
}
.sg-row:hover .sg-rail{ transform:scaleY(1); }

/* acronym chip */
.sg-chip{
  flex:none; display:grid; place-items:center; width:66px; height:66px; padding:4px;
  border-radius:14px; background:var(--rail,var(--sg-navy)); color:#fff;
  font-family:'Montserrat',sans-serif; font-weight:800; letter-spacing:.5px;
  font-size:16px; text-align:center; line-height:1.05;
  box-shadow:0 8px 18px color-mix(in srgb,var(--rail,var(--sg-navy)) 34%,transparent);
  transition:transform .4s var(--sg-ease);
}
.sg-row:hover .sg-chip{ transform:translateY(-2px); }

/* main text column */
.sg-main{ flex:1 1 auto; min-width:0; }
.sg-tags{
  display:flex; align-items:center; flex-wrap:wrap; gap:8px 10px; margin-bottom:7px;
}
.sg-type{
  font-family:'Montserrat',sans-serif; font-weight:700; font-size:11px;
  letter-spacing:1.4px; text-transform:uppercase; color:var(--rail,var(--sg-navy));
}
.sg-dot{ width:4px; height:4px; border-radius:50%; background:var(--sg-line); }
.sg-date{
  display:inline-flex; align-items:center; gap:5px;
  font-size:12.5px; font-weight:600; color:var(--sg-muted); font-family:'Montserrat',sans-serif;
}
.sg-date .sg-ic{ font-size:15px; color:var(--sg-muted); }
.sg-fmt{
  font-family:'Montserrat',sans-serif; font-weight:700; font-size:10px; letter-spacing:1px;
  color:var(--sg-muted); border:1px solid var(--sg-line); border-radius:5px; padding:2px 6px;
}
.sg-title{
  display:block; font-family:'Montserrat',sans-serif; font-weight:800;
  font-size:clamp(16px,1.9vw,19px); color:var(--sg-ink); line-height:1.32; letter-spacing:-.2px;
  transition:color .25s ease;
}
.sg-row:hover .sg-title{ color:var(--sg-navy); }

/* right-aligned action */
.sg-action{
  flex:none; display:inline-flex; align-items:center; gap:8px;
  font-family:'Montserrat',sans-serif; font-weight:700; font-size:13px; letter-spacing:.3px;
  color:var(--sg-blue); white-space:nowrap;
}
.sg-action-label{ transition:opacity .25s ease; }
.sg-arrow{
  font-size:20px; display:inline-grid; place-items:center; width:34px; height:34px;
  border-radius:50%; background:var(--sg-soft); color:var(--sg-blue);
  transition:transform .35s var(--sg-ease), background .25s ease, color .25s ease;
}
.sg-row:hover .sg-arrow{ background:var(--sg-blue); color:#fff; transform:translateX(4px); }
[dir="rtl"] .sg-row:hover .sg-arrow{ transform:translateX(-4px); }

/* ============================================================
   SINGLE — hero (page_v2.css is NOT auto-loaded here, so we restate
   the hero. Scoped to .sg-hero so it never touches the LISTING hero,
   which keeps its page_v2.css styling.)
   ============================================================ */
.sg-hero{
  height:420px !important; border-radius:24px !important; position:relative;
  box-shadow:0 24px 60px rgba(22,36,47,.18);
}
.sg-hero::after{
  content:''; position:absolute; inset:0; border-radius:24px; z-index:1; pointer-events:none;
  background:linear-gradient(180deg,rgba(16,30,41,.04) 0%,rgba(16,30,41,.34) 52%,rgba(16,30,41,.84) 100%);
}
.sg-hero .sec_head.sec_normal{
  position:absolute; bottom:0; inset-inline:0; z-index:2; margin:0 !important;
  padding:0 clamp(26px,5%,64px) clamp(30px,5%,54px) !important;
  text-align:start !important; background:transparent !important;
}
.sg-hero .sec_head.sec_normal span{
  position:static !important; display:inline-block; background:transparent !important; color:#fff !important;
  font-family:'Montserrat',sans-serif; font-weight:800; font-size:clamp(28px,4vw,46px) !important;
  line-height:1.12; letter-spacing:-.5px; padding:0 !important; border-radius:0 !important;
  text-shadow:0 2px 18px rgba(0,0,0,.28);
}
.sg-hero .sec_head.sec_normal span::before{
  content:''; display:block; width:52px; height:5px; border-radius:3px;
  background:var(--sg-blue); margin-bottom:16px;
}

/* ---------- single layout ---------- */
.sg-single .p_content.w1200{ margin-top:48px !important; }
.sg-back{
  display:inline-flex; align-items:center; gap:8px; margin-bottom:26px;
  font-family:'Montserrat',sans-serif; font-weight:600; font-size:13.5px; letter-spacing:.3px;
  color:var(--sg-muted); text-decoration:none; transition:color .2s ease, gap .25s var(--sg-ease);
}
.sg-back .sg-ic{ font-size:20px; }
.sg-back:hover{ color:var(--sg-navy); gap:12px; }

.sg-single-grid{
  display:grid; grid-template-columns:minmax(0,1fr) 320px; gap:clamp(28px,4vw,52px); align-items:start;
}
.sg-article{ min-width:0; }

/* fallback document title (only when there is no hero image) */
.sg-doc-title{
  font-family:'Montserrat',sans-serif; font-weight:800; color:var(--sg-ink);
  font-size:clamp(24px,3vw,36px); line-height:1.18; letter-spacing:-.4px; margin:6px 0 14px;
}

.sg-eyebrow-rail{
  position:relative; padding-inline-start:16px; color:var(--rail,var(--sg-navy));
}
.sg-eyebrow-rail::before{
  content:''; position:absolute; inset-inline-start:0; top:50%; transform:translateY(-50%);
  width:6px; height:6px; border-radius:2px; background:var(--rail,var(--sg-navy));
}
.sg-meta-row{
  display:flex; flex-wrap:wrap; gap:10px 22px; margin:12px 0 26px;
  padding-bottom:22px; border-bottom:1px solid var(--sg-line);
}
.sg-meta-item{
  display:inline-flex; align-items:center; gap:7px;
  font-family:'Montserrat',sans-serif; font-weight:600; font-size:13px; color:var(--sg-muted);
}
.sg-meta-item .sg-ic{ color:var(--sg-blue); }

/* content body (restated from page_v2 since it isn't loaded here) */
.sg-mce{ color:#3c4d5b; font-size:16px; line-height:1.8; }
.sg-mce p,.sg-mce span,.sg-mce li,.sg-mce td,.sg-mce div{
  font-family:'Segoe UI Variable Text','Segoe UI',system-ui,-apple-system,sans-serif !important;
}
.sg-mce h1,.sg-mce h2,.sg-mce h3,.sg-mce h4,.sg-mce strong,.sg-mce b{
  font-family:'Montserrat',sans-serif !important; color:var(--sg-ink);
}
.sg-mce > p{ margin:0 0 16px; }
.sg-mce a{ color:var(--sg-blue); border-bottom:1px solid transparent; text-decoration:none; }
.sg-mce a:hover{ border-bottom-color:var(--sg-blue); }
.sg-mce img{ max-width:100%; height:auto; border-radius:12px; }

/* ---------- prominent download card (wraps legion_files.php output) ---------- */
.sg-download{
  margin:30px 0 8px; padding:22px clamp(18px,3vw,26px); border-radius:16px;
  background:linear-gradient(180deg,var(--sg-soft),#fff);
  border:1px solid var(--sg-line); border-inline-start:4px solid var(--rail,var(--sg-navy));
  box-shadow:var(--sg-shadow);
}
.sg-download-head{
  display:flex; align-items:center; gap:9px; margin-bottom:14px;
  font-family:'Montserrat',sans-serif; font-weight:800; font-size:16px; color:var(--sg-ink);
}
.sg-download-head .sg-ic{ font-size:22px; color:var(--rail,var(--sg-navy)); }
.sg-download #attach_head{ display:none; }        /* hide legion's own "Attachments" heading */
.sg-download .attach{ margin:0; }
.sg-download .attach a{
  display:flex; align-items:center; gap:14px; text-decoration:none;
  padding:14px 16px; border:1px solid var(--sg-line); border-radius:12px; background:#fff;
  transition:transform .3s var(--sg-ease), box-shadow .3s var(--sg-ease), border-color .25s ease;
}
.sg-download .attach a + a{ margin-top:10px; }
.sg-download .attach a:hover{
  transform:translateY(-3px); box-shadow:var(--sg-shadow-lg); border-color:var(--rail,var(--sg-navy));
}
.sg-download .attach_icon{
  flex:none; width:44px; height:44px; display:grid !important; place-items:center;
  background:var(--sg-soft); border-radius:10px;
}
.sg-download .attach_icon img{ width:24px; height:24px; object-fit:contain; }
.sg-download .attach a span.mid{
  flex:1 1 auto; min-width:0; font-family:'Montserrat',sans-serif; font-weight:700;
  font-size:14.5px; color:var(--sg-ink); word-break:break-word;
}
.sg-download .attach a::after{
  content:'\2193'; /* safe unicode down-arrow (no icon-font dependency) */
  font-family:'Montserrat',sans-serif; font-weight:800; font-size:20px; line-height:1;
  color:var(--sg-blue); flex:none; transition:transform .3s var(--sg-ease);
}
.sg-download .attach a:hover::after{ transform:translateY(3px); }

/* share */
.sg-article .page_share_head{
  margin-top:36px; font-family:'Montserrat',sans-serif; font-weight:800;
  font-size:15px; color:var(--sg-ink);
}

/* ---------- sticky details panel ---------- */
.sg-aside{ position:sticky; top:24px; }
.sg-panel{
  border:1px solid var(--sg-line); border-radius:18px; overflow:hidden;
  background:var(--sg-bg); box-shadow:var(--sg-shadow);
}
.sg-panel-top{
  display:flex; align-items:center; gap:14px; padding:20px;
  background:var(--rail,var(--sg-navy)); /* solid fallback if color-mix() unsupported */
  background:linear-gradient(135deg,var(--rail,var(--sg-navy)),color-mix(in srgb,var(--rail,var(--sg-navy)) 72%,#000));
}
.sg-chip-lg{
  flex:none; width:58px; height:58px; border-radius:12px; background:rgba(255,255,255,.16);
  box-shadow:none; color:#fff; display:grid; place-items:center; text-align:center;
  font-family:'Montserrat',sans-serif; font-weight:800; font-size:15px; line-height:1.05;
  border:1px solid rgba(255,255,255,.35);
}
.sg-panel-title{
  font-family:'Montserrat',sans-serif; font-weight:800; font-size:16px; color:#fff; letter-spacing:.2px;
}
.sg-details{ margin:0; padding:8px 20px 18px; }
.sg-detail{
  display:flex; align-items:baseline; justify-content:space-between; gap:14px;
  padding:13px 0; border-bottom:1px solid var(--sg-line);
}
.sg-detail:last-child{ border-bottom:0; }
.sg-detail dt{
  margin:0; font-family:'Montserrat',sans-serif; font-weight:700; font-size:11px;
  letter-spacing:1px; text-transform:uppercase; color:var(--sg-muted);
}
.sg-detail dd{
  margin:0; text-align:end; font-family:'Montserrat',sans-serif; font-weight:700;
  font-size:14px; color:var(--sg-ink);
}

/* ============================================================
   RTL — logical props cover most; reset latin tracking/casing on
   Arabic chrome and flip the couple of directional cues.
   ============================================================ */
[dir="rtl"] .sg-lede,[dir="rtl"] .sg-title,[dir="rtl"] .sg-panel-title,
[dir="rtl"] .sg-eyebrow,[dir="rtl"] .sg-count,[dir="rtl"] .sg-doc-title{ letter-spacing:0; }
[dir="rtl"] .sg-type,[dir="rtl"] .sg-detail dt{ letter-spacing:0; text-transform:none; }
[dir="rtl"] .sg-detail dd,[dir="rtl"] .sg-meta-item,[dir="rtl"] .sg-tags{ text-align:start; }

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width:900px){
  .sg-single-grid{ grid-template-columns:1fr; }
  .sg-aside{ position:static; order:-1; }
  .sg-panel-top{ padding:16px 18px; }
}
@media (max-width:640px){
  .sg-row{ flex-wrap:wrap; gap:14px; padding:18px; }
  .sg-chip{ width:52px; height:52px; font-size:14px; border-radius:12px; }
  .sg-main{ flex:1 1 60%; }
  .sg-action{
    flex:1 1 100%; justify-content:flex-start;
    border-top:1px dashed var(--sg-line); margin-top:2px; padding-top:12px;
  }
  .sg-hero{ height:260px !important; }
  .sg-meta-row{ gap:8px 16px; }
}

/* ============================================================
   REDUCED MOTION
   ============================================================ */
@media (prefers-reduced-motion:reduce){
  .sg-row,.sg-rail,.sg-chip,.sg-arrow,.sg-title,.sg-back,
  .sg-download .attach a,.sg-download .attach a::after{
    transition:none !important;
  }
  .sg-row:hover .sg-arrow,[dir="rtl"] .sg-row:hover .sg-arrow{ transform:none; }
  .sg-rail{ transform:scaleY(1); }
  [data-aos]{ transition-duration:.01ms !important; }
}