
/* eegulf v3.6.1.1 — approved visual-system correction
   Scoped to the EEGULF preview/demo UI. It deliberately avoids Admin/Reader internals. */

:root{
  --eg-navy:#061827;
  --eg-navy2:#0a2b46;
  --eg-blue:#0b7cf4;
  --eg-cyan:#13d4d1;
  --eg-ink:#0b1b2b;
  --eg-muted:#607488;
  --eg-paper:#f6faff;
  --eg-line:#d9e5ef;
  --eg-gold:#f2c36c;
  --eg-red:#ff2d43;
}

body.eg-preview-mode{
  margin:0!important;
  background:var(--eg-paper)!important;
  color:var(--eg-ink)!important;
  font-family:Inter,Arial,Helvetica,sans-serif!important;
}
body.eg-preview-mode > *:not(script):not(style):not(.eg-global-header):not(.eg-preview-page):not(.eg-global-footer){
  display:none!important;
}

/* GLOBAL HEADER */
.eg-global-header{
  position:relative;
  z-index:9999;
  width:100%;
  box-sizing:border-box;
  border-bottom:1px solid rgba(111,151,181,.20);
}
.eg-global-header.eg-dark{background:#061827;}
.eg-global-header.eg-light{
  background:rgba(255,255,255,.98);
  box-shadow:0 8px 28px rgba(15,48,73,.07);
}
.eg-header-inner{
  width:min(1540px,calc(100% - 54px));
  min-height:94px;
  margin:0 auto;
  display:grid;
  grid-template-columns:220px 1fr 112px;
  align-items:center;
  gap:28px;
}
.eg-header-logo{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  width:218px;
  height:72px;
  overflow:hidden;
  text-decoration:none!important;
}
.eg-header-logo img{
  width:205px;
  height:66px;
  display:block;
  object-fit:contain;
  object-position:left center;
  filter:drop-shadow(0 4px 10px rgba(0,65,135,.12));
}
.eg-dark .eg-header-logo{
  background:rgba(255,255,255,.98);
  border:1px solid rgba(255,255,255,.65);
  padding:2px 8px;
  border-radius:14px;
  box-sizing:border-box;
}
.eg-nav{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-width:0;
}
.eg-nav a{
  display:inline-flex!important;
  align-items:center;
  justify-content:center;
  min-height:46px;
  padding:0 14px!important;
  border-radius:11px;
  font-size:15px!important;
  line-height:1!important;
  font-weight:800!important;
  white-space:nowrap;
  text-decoration:none!important;
  transition:.18s ease;
}
.eg-dark .eg-nav a{color:#f6fbff!important;}
.eg-light .eg-nav a{color:#17354c!important;}
.eg-nav a:hover,
.eg-nav a.active{
  background:rgba(20,133,236,.13)!important;
  color:#0b86f5!important;
}
.eg-dark .eg-nav a:hover,
.eg-dark .eg-nav a.active{
  background:rgba(255,255,255,.10)!important;
  color:#fff!important;
}
.eg-archive-btn{
  justify-self:end;
  min-width:98px;
  min-height:46px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:12px;
  font-size:14px;
  font-weight:900;
  text-decoration:none!important;
}
.eg-dark .eg-archive-btn{
  color:#fff!important;
  border:1px solid rgba(124,203,255,.38);
  background:rgba(8,44,70,.75);
}
.eg-light .eg-archive-btn{
  color:#fff!important;
  background:linear-gradient(135deg,var(--eg-blue),#16b4e3);
  box-shadow:0 8px 18px rgba(10,124,244,.18);
}
.eg-menu-toggle{display:none}

/* COMMON PAGE */
.eg-preview-page{min-height:calc(100vh - 94px);}
.eg-shell{width:min(1540px,calc(100% - 54px));margin:0 auto;box-sizing:border-box}
.eg-kicker{
  font-size:12px;
  font-weight:900;
  letter-spacing:.24em;
  text-transform:uppercase;
  color:#ff2940;
}
.eg-page-title{
  font-family:Georgia,"Times New Roman",serif;
  font-size:68px;
  line-height:.98;
  letter-spacing:-.045em;
  margin:12px 0 14px;
  color:var(--eg-ink)!important;
}
.eg-page-lead{
  margin:0;
  color:var(--eg-muted)!important;
  font-size:18px;
  line-height:1.55;
}
.eg-preview-note{
  margin:18px auto 0;
  width:min(1540px,calc(100% - 54px));
  box-sizing:border-box;
  padding:11px 15px;
  border:1px solid #b9dcff;
  background:#edf7ff;
  color:#205b84!important;
  border-radius:10px;
  font-size:13px;
}

/* HOME */
.eg-home{background:#f5f9fd}
.eg-home-hero{
  position:relative;
  overflow:hidden;
  width:min(1540px,calc(100% - 54px));
  min-height:545px;
  margin:24px auto 36px;
  border-radius:24px;
  background:#061827;
  color:#fff;
  box-shadow:0 26px 70px rgba(5,28,46,.20);
}
.eg-home-hero-bg{
  position:absolute;inset:0;
  background:url('/assets/demo/hero.svg') center/cover no-repeat;
}
.eg-home-hero-bg:after{
  content:"";
  position:absolute;inset:0;
  background:linear-gradient(90deg,rgba(4,20,34,.98) 0%,rgba(4,20,34,.90) 42%,rgba(4,20,34,.22) 74%,rgba(4,20,34,.06));
}
.eg-home-copy{
  position:relative;
  z-index:2;
  max-width:760px;
  padding:104px 62px 74px;
}
.eg-home-kicker{
  color:#fff!important;
  font-size:12px;
  font-weight:900;
  letter-spacing:.22em;
}
.eg-home-kicker b{color:var(--eg-gold)!important;padding:0 8px}
.eg-home-copy h1{
  margin:24px 0 20px!important;
  font-family:Georgia,"Times New Roman",serif!important;
  font-size:76px!important;
  line-height:.96!important;
  letter-spacing:-.05em!important;
  color:#fff!important;
}
.eg-home-copy h1 span{color:var(--eg-gold)!important}
.eg-home-copy p{
  margin:0!important;
  max-width:660px;
  color:#f2f7fb!important;
  font-size:20px!important;
  line-height:1.55!important;
}
.eg-actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:30px}
.eg-actions a{
  display:inline-flex!important;
  align-items:center;
  justify-content:center;
  min-height:50px;
  padding:0 21px!important;
  border-radius:12px;
  text-decoration:none!important;
  font-weight:900!important;
  font-size:14px!important;
}
.eg-actions .primary{
  color:#fff!important;
  background:linear-gradient(135deg,var(--eg-blue),var(--eg-cyan))!important;
  box-shadow:0 12px 24px rgba(10,124,244,.25);
}
.eg-actions .secondary{
  color:#fff!important;
  border:1px solid rgba(255,255,255,.38)!important;
  background:rgba(2,20,34,.45)!important;
}
.eg-home-panel{
  width:min(1460px,calc(100% - 110px));
  margin:0 auto 44px;
  padding:28px 30px 30px;
  border-radius:22px;
  background:linear-gradient(135deg,#08253c,#0d395a);
  color:#fff;
  box-shadow:0 18px 50px rgba(8,40,64,.14);
}
.eg-section-head{
  display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:22px
}
.eg-section-head h2{
  margin:4px 0 3px!important;
  font-family:Georgia,"Times New Roman",serif!important;
  font-size:42px!important;
  line-height:1!important;
  color:inherit!important;
}
.eg-section-head p{margin:0!important;color:inherit!important;opacity:.78;font-size:14px!important}

/* COVER GRIDS */
.eg-cover-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:18px}
.eg-cover-card{
  min-width:0;
  background:#fff;
  border:1px solid var(--eg-line);
  border-radius:16px;
  overflow:hidden;
  box-shadow:0 10px 28px rgba(12,45,70,.09);
}
.eg-cover-card img{display:block;width:100%;aspect-ratio:720/1000;object-fit:cover}
.eg-cover-meta{padding:13px 15px 16px}
.eg-cover-date{font-size:11px;color:#6c8293!important;font-weight:800}
.eg-cover-title{
  margin-top:6px!important;
  color:var(--eg-ink)!important;
  font-family:Georgia,"Times New Roman",serif!important;
  font-size:21px!important;
  line-height:1.04!important;
}
.eg-home-panel .eg-cover-card{border-color:rgba(255,255,255,.22)}
.eg-home-panel .eg-cover-meta{background:#fff}

/* ARCHIVE / LIBRARY */
.eg-light-page{background:#f7fbff;padding-bottom:70px}
.eg-page-intro{padding:54px 0 22px}
.eg-toolbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  margin:18px 0 24px;
}
.eg-pills{display:flex;gap:10px;flex-wrap:wrap}
.eg-pill{
  min-height:39px;
  display:inline-flex;
  align-items:center;
  padding:0 17px;
  border:1px solid #d5e2ec;
  border-radius:999px;
  background:#fff;
  color:#17354c!important;
  font-size:13px;
  font-weight:800;
}
.eg-pill.active{background:#092a44;color:#fff!important;border-color:#092a44}
.eg-search{
  width:min(370px,100%);
  min-height:43px;
  padding:0 16px;
  border:1px solid #d3e0eb;
  border-radius:999px;
  background:#fff;
  color:#213b50!important;
  font-size:13px;
  outline:none;
}
.eg-library-hero{
  position:relative;
  overflow:hidden;
  margin:26px 0 22px;
  padding:46px 46px;
  border:1px solid #dfebf3;
  border-radius:20px;
  background:linear-gradient(105deg,#fff 0%,#fff 62%,#ecf7ff 100%);
}
.eg-library-hero:after{
  content:"";
  position:absolute;
  right:18px;top:8px;
  width:310px;height:180px;
  opacity:.35;
  background:url('/assets/demo/cover-3.svg') center 25%/cover no-repeat;
  border-radius:18px;
  filter:saturate(.8);
}
.eg-library-hero > *{position:relative;z-index:1}
.eg-library-grid .eg-cover-card img{aspect-ratio:16/10}

/* RESPONSIVE */
@media(max-width:1280px){
  .eg-header-inner{grid-template-columns:190px 1fr 92px;width:min(100% - 34px,1540px);gap:14px}
  .eg-header-logo{width:184px}
  .eg-header-logo img{width:174px}
  .eg-nav{gap:2px}
  .eg-nav a{font-size:13px!important;padding:0 9px!important}
  .eg-cover-grid{grid-template-columns:repeat(4,1fr)}
}
@media(max-width:900px){
  .eg-header-inner{grid-template-columns:170px 1fr 50px;min-height:82px}
  .eg-header-logo{width:166px;height:64px}
  .eg-header-logo img{width:155px;height:58px}
  .eg-archive-btn{display:none}
  .eg-menu-toggle{
    display:inline-flex;
    justify-self:end;
    width:44px;height:44px;
    align-items:center;justify-content:center;
    border:1px solid #cfe0eb;
    border-radius:10px;
    background:#fff;
    color:#17354c;
    font-size:22px;
    cursor:pointer;
  }
  .eg-dark .eg-menu-toggle{background:rgba(255,255,255,.08);color:#fff;border-color:rgba(255,255,255,.25)}
  .eg-nav{
    display:none;
    position:absolute;
    left:16px;right:16px;top:78px;
    padding:12px;
    border-radius:14px;
    flex-direction:column;
    align-items:stretch;
    background:#fff;
    box-shadow:0 18px 50px rgba(5,28,45,.18);
  }
  .eg-global-header.menu-open .eg-nav{display:flex}
  .eg-nav a{justify-content:flex-start!important;color:#16344b!important;font-size:15px!important}
  .eg-home-copy{padding:90px 32px 60px}
  .eg-home-copy h1{font-size:60px!important}
  .eg-cover-grid{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:680px){
  .eg-shell,.eg-preview-note,.eg-home-hero{width:calc(100% - 24px)}
  .eg-header-inner{width:calc(100% - 24px)}
  .eg-home-hero{border-radius:18px;min-height:500px}
  .eg-home-copy{padding:78px 24px 50px}
  .eg-home-copy h1{font-size:48px!important}
  .eg-home-copy p{font-size:17px!important}
  .eg-home-panel{width:calc(100% - 24px);padding:22px 18px}
  .eg-cover-grid{display:flex;overflow-x:auto;gap:14px;scroll-snap-type:x mandatory;padding-bottom:8px}
  .eg-cover-card{min-width:69vw;scroll-snap-align:start}
  .eg-page-title{font-size:48px}
  .eg-toolbar{align-items:stretch;flex-direction:column}
  .eg-search{width:100%;box-sizing:border-box}
  .eg-library-hero{padding:34px 24px}
  .eg-library-hero:after{opacity:.12}
}
