/*
AURAM PRIME INTELLIGENCE DESIGN SYSTEM v1.0
Single visual foundation for AuramPrime.ae and future APDI client-facing surfaces.
Do not paste this inside individual pages.
Install globally through WPCode / site-wide CSS after review.
*/

/* =========================================================
   1. DESIGN TOKENS
   ========================================================= */
:root{
  --ap-navy-950:#07111d;
  --ap-navy-900:#0b1726;
  --ap-navy-800:#112238;
  --ap-navy-700:#19324f;

  --ap-gold-600:#9f8246;
  --ap-gold-500:#b89a57;
  --ap-gold-400:#cdb274;
  --ap-gold-300:#dcc587;

  --ap-ivory-50:#fcfaf6;
  --ap-ivory-100:#f7f3ea;
  --ap-ivory-200:#eee7d8;
  --ap-white:#ffffff;

  --ap-ink-900:#172131;
  --ap-ink-700:#364354;
  --ap-ink-600:#4e5968;
  --ap-ink-500:#6f7a87;
  --ap-line:#ded5c4;

  --ap-success:#5e7b69;
  --ap-warning:#a67833;
  --ap-danger:#9a5a58;

  --ap-font-display:"Source Serif 4",Georgia,"Times New Roman",serif;
  --ap-font-body:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;

  --ap-space-1:4px;
  --ap-space-2:8px;
  --ap-space-3:12px;
  --ap-space-4:16px;
  --ap-space-5:20px;
  --ap-space-6:24px;
  --ap-space-7:32px;
  --ap-space-8:40px;
  --ap-space-9:48px;
  --ap-space-10:64px;
  --ap-space-11:80px;
  --ap-space-12:104px;

  --ap-radius-sm:2px;
  --ap-radius-md:10px;
  --ap-radius-lg:18px;

  --ap-shadow-sm:0 8px 24px rgba(11,23,38,.06);
  --ap-shadow-md:0 18px 48px rgba(11,23,38,.10);
  --ap-shadow-lg:0 28px 80px rgba(11,23,38,.16);

  --ap-content:1200px;
  --ap-copy:760px;
}

/* =========================================================
   2. BASE
   ========================================================= */
.ap-site,
.ap-client-surface{
  color:var(--ap-ink-900);
  background:var(--ap-ivory-100);
  font-family:var(--ap-font-body);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

.ap-site *,
.ap-site *::before,
.ap-site *::after,
.ap-client-surface *,
.ap-client-surface *::before,
.ap-client-surface *::after{
  box-sizing:border-box;
}

.ap-container{
  width:min(var(--ap-content),calc(100% - 48px));
  margin-inline:auto;
}

.ap-section{
  padding:clamp(72px,8vw,112px) 0;
}

.ap-section--white{background:var(--ap-white)}
.ap-section--ivory{background:var(--ap-ivory-100)}
.ap-section--dark{
  color:var(--ap-white);
  background:
    radial-gradient(circle at 12% 12%,rgba(184,154,87,.12),transparent 28%),
    linear-gradient(135deg,var(--ap-navy-950),var(--ap-navy-800));
}

.ap-display,
.ap-heading,
.ap-card-title{
  margin:0;
  color:var(--ap-ink-900);
  font-family:var(--ap-font-display);
  font-weight:500;
  letter-spacing:-.035em;
}

.ap-section--dark .ap-display,
.ap-section--dark .ap-heading,
.ap-section--dark .ap-card-title{
  color:var(--ap-white);
}

.ap-display{
  font-size:clamp(46px,7vw,84px);
  line-height:.98;
}

.ap-heading{
  font-size:clamp(36px,4.8vw,60px);
  line-height:1.06;
}

.ap-subheading{
  max-width:var(--ap-copy);
  margin:22px 0 0;
  color:var(--ap-ink-600);
  font-size:clamp(17px,1.7vw,20px);
  line-height:1.75;
}

.ap-section--dark .ap-subheading{
  color:#c7d1db;
}

.ap-kicker{
  display:inline-flex;
  align-items:center;
  gap:10px;
  margin:0 0 18px;
  color:var(--ap-gold-500);
  font-size:11px;
  font-weight:800;
  letter-spacing:2.6px;
  line-height:1.4;
  text-transform:uppercase;
}

.ap-kicker::before{
  content:"";
  width:28px;
  height:1px;
  background:currentColor;
}

/* =========================================================
   3. BUTTONS & LINKS
   ========================================================= */
.ap-actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:30px;
}

.ap-button{
  position:relative;
  display:inline-flex;
  min-height:50px;
  align-items:center;
  justify-content:center;
  gap:10px;
  overflow:hidden;
  border:1px solid var(--ap-gold-500);
  border-radius:var(--ap-radius-sm);
  padding:14px 22px;
  background:var(--ap-gold-500);
  color:var(--ap-white)!important;
  box-shadow:0 12px 28px rgba(184,154,87,.20);
  font-size:14px;
  font-weight:800;
  line-height:1.25;
  text-align:center;
  text-decoration:none!important;
  transition:transform .2s ease,box-shadow .2s ease,background .2s ease,border-color .2s ease,color .2s ease;
}

.ap-button:hover{
  border-color:var(--ap-navy-900);
  background:var(--ap-navy-900);
  box-shadow:0 17px 38px rgba(11,23,38,.20);
  color:var(--ap-white)!important;
  transform:translateY(-2px);
}

.ap-button--secondary{
  border-color:var(--ap-line);
  background:var(--ap-white);
  box-shadow:none;
  color:var(--ap-ink-900)!important;
}

.ap-section--dark .ap-button--secondary{
  border-color:rgba(255,255,255,.34);
  background:transparent;
  color:var(--ap-white)!important;
}

.ap-text-link{
  display:inline-flex;
  align-items:center;
  gap:8px;
  color:var(--ap-ink-900)!important;
  font-size:14px;
  font-weight:800;
  text-decoration:none!important;
}

.ap-text-link::after{
  content:"→";
  color:var(--ap-gold-500);
  transition:transform .2s ease;
}

.ap-text-link:hover::after{
  transform:translateX(4px);
}

/* =========================================================
   4. CARDS, GRIDS & PANELS
   ========================================================= */
.ap-grid{
  display:grid;
  gap:22px;
}

.ap-grid--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.ap-grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.ap-grid--4{grid-template-columns:repeat(4,minmax(0,1fr))}

.ap-card{
  position:relative;
  display:flex;
  min-width:0;
  min-height:100%;
  flex-direction:column;
  border:1px solid var(--ap-line);
  border-radius:var(--ap-radius-sm);
  background:var(--ap-white);
  box-shadow:0 14px 34px rgba(11,23,38,.035);
  padding:30px;
  transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease;
}

.ap-card:hover{
  border-color:var(--ap-gold-500);
  box-shadow:var(--ap-shadow-md);
  transform:translateY(-4px);
}

.ap-card-title{
  font-size:clamp(25px,2.3vw,31px);
  line-height:1.15;
}

.ap-card-copy{
  margin:15px 0 0;
  color:var(--ap-ink-600);
  font-size:15px;
  line-height:1.72;
}

.ap-panel{
  border:1px solid var(--ap-line);
  background:var(--ap-white);
  box-shadow:var(--ap-shadow-sm);
  padding:clamp(28px,4vw,42px);
}

.ap-panel--dark{
  border-color:rgba(220,197,135,.34);
  background:var(--ap-navy-900);
  color:var(--ap-white);
}

/* =========================================================
   5. FORMS
   ========================================================= */
.ap-form{
  display:grid;
  gap:20px;
}

.ap-field{
  display:grid;
  gap:8px;
}

.ap-label{
  color:var(--ap-ink-700);
  font-size:12px;
  font-weight:800;
  letter-spacing:.8px;
  line-height:1.4;
  text-transform:uppercase;
}

.ap-input,
.ap-select,
.ap-textarea{
  width:100%;
  min-height:50px;
  border:1px solid var(--ap-line);
  border-radius:var(--ap-radius-sm);
  background:var(--ap-white);
  color:var(--ap-ink-900);
  font:inherit;
  padding:13px 14px;
  transition:border-color .2s ease,box-shadow .2s ease;
}

.ap-textarea{
  min-height:140px;
  resize:vertical;
}

.ap-input:focus,
.ap-select:focus,
.ap-textarea:focus{
  outline:none;
  border-color:var(--ap-gold-500);
  box-shadow:0 0 0 3px rgba(184,154,87,.16);
}

.ap-help{
  color:var(--ap-ink-500);
  font-size:12px;
  line-height:1.55;
}

/* =========================================================
   6. STATUS, BADGES & EVIDENCE
   ========================================================= */
.ap-badge{
  display:inline-flex;
  width:max-content;
  max-width:100%;
  align-items:center;
  gap:7px;
  border:1px solid var(--ap-line);
  border-radius:999px;
  padding:7px 10px;
  background:var(--ap-white);
  color:var(--ap-ink-700);
  font-size:10px;
  font-weight:900;
  letter-spacing:1px;
  line-height:1;
  text-transform:uppercase;
}

.ap-badge--gold{
  border-color:rgba(184,154,87,.45);
  background:rgba(184,154,87,.08);
  color:var(--ap-gold-600);
}

.ap-badge--success{
  border-color:rgba(94,123,105,.35);
  background:rgba(94,123,105,.08);
  color:var(--ap-success);
}

.ap-evidence{
  display:flex;
  flex-wrap:wrap;
  gap:10px 18px;
  color:var(--ap-ink-500);
  font-size:12px;
  line-height:1.55;
}

.ap-evidence span{
  display:inline-flex;
  align-items:center;
  gap:7px;
}

.ap-evidence span::before{
  content:"";
  width:6px;
  height:6px;
  border-radius:50%;
  background:var(--ap-gold-500);
}

/* =========================================================
   7. PUBLIC WEBSITE SHELL
   ========================================================= */
.ap-site-header{
  position:sticky;
  top:0;
  z-index:1000;
  border-bottom:1px solid rgba(222,213,196,.82);
  background:rgba(252,250,246,.92);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
}

.ap-site-header__inner{
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:28px;
  min-height:82px;
}

.ap-site-logo{
  display:flex;
  align-items:center;
  gap:12px;
  color:var(--ap-navy-900)!important;
  text-decoration:none!important;
}

.ap-site-logo__mark{
  display:grid;
  width:46px;
  height:46px;
  place-items:center;
  border:1px solid rgba(184,154,87,.44);
  background:var(--ap-white);
  color:var(--ap-gold-500);
  font-family:var(--ap-font-display);
  font-size:25px;
}

.ap-site-logo__name{
  display:block;
  color:var(--ap-navy-900);
  font-family:var(--ap-font-display);
  font-size:24px;
  line-height:1;
}

.ap-site-logo__line{
  display:block;
  margin-top:5px;
  color:var(--ap-gold-600);
  font-size:9px;
  font-weight:900;
  letter-spacing:1.6px;
  text-transform:uppercase;
}

.ap-site-nav{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:24px;
}

.ap-site-nav a{
  color:var(--ap-ink-700)!important;
  font-size:13px;
  font-weight:700;
  text-decoration:none!important;
}

.ap-site-nav a:hover{
  color:var(--ap-gold-600)!important;
}

.ap-site-footer{
  border-top:1px solid rgba(220,197,135,.25);
  background:var(--ap-navy-950);
  color:var(--ap-white);
}

.ap-site-footer__grid{
  display:grid;
  grid-template-columns:1.2fr repeat(3,minmax(0,.8fr));
  gap:42px;
  padding:72px 0 48px;
}

.ap-site-footer h3{
  margin:0 0 16px;
  color:var(--ap-white);
  font-family:var(--ap-font-display);
  font-size:22px;
  font-weight:500;
}

.ap-site-footer p,
.ap-site-footer a{
  color:#aeb9c5;
  font-size:13px;
  line-height:1.7;
}

.ap-site-footer a{
  text-decoration:none!important;
}

.ap-site-footer a:hover{
  color:var(--ap-gold-300);
}

.ap-site-footer__bottom{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  border-top:1px solid rgba(255,255,255,.10);
  padding:22px 0 28px;
  color:#8693a2;
  font-size:11px;
  line-height:1.5;
}

/* =========================================================
   8. APDI CLIENT-FACING BRIDGE
   Same DNA, more compact and operational.
   ========================================================= */
.ap-client-surface{
  --ap-content:1100px;
  background:var(--ap-ivory-50);
}

.ap-client-shell{
  min-height:100vh;
  background:
    radial-gradient(circle at 100% 0,rgba(220,197,135,.12),transparent 28%),
    var(--ap-ivory-50);
}

.ap-client-header{
  border-bottom:1px solid var(--ap-line);
  background:rgba(255,255,255,.92);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
}

.ap-client-header__inner{
  display:flex;
  min-height:78px;
  align-items:center;
  justify-content:space-between;
  gap:24px;
}

.ap-client-stage{
  padding:clamp(40px,6vw,72px) 0;
}

.ap-client-card{
  border:1px solid var(--ap-line);
  background:var(--ap-white);
  box-shadow:var(--ap-shadow-sm);
  padding:clamp(28px,5vw,56px);
}

.ap-client-progress{
  height:4px;
  overflow:hidden;
  background:var(--ap-ivory-200);
}

.ap-client-progress__bar{
  height:100%;
  background:var(--ap-gold-500);
}

/* =========================================================
   9. RESPONSIVE RULES
   ========================================================= */
@media (max-width:1080px){
  .ap-grid--4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ap-site-footer__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media (max-width:860px){
  .ap-container{
    width:min(var(--ap-content),calc(100% - 32px));
  }

  .ap-grid--2,
  .ap-grid--3,
  .ap-grid--4{
    grid-template-columns:1fr;
  }

  .ap-site-nav{
    display:none;
  }

  .ap-site-header__inner{
    grid-template-columns:1fr auto;
  }

  .ap-site-footer__grid{
    grid-template-columns:1fr;
  }

  .ap-site-footer__bottom{
    align-items:flex-start;
    flex-direction:column;
  }
}

@media (max-width:620px){
  .ap-container{
    width:min(var(--ap-content),calc(100% - 28px));
  }

  .ap-section{
    padding:64px 0;
  }

  .ap-actions{
    flex-direction:column;
  }

  .ap-button{
    width:100%;
  }

  .ap-card,
  .ap-panel,
  .ap-client-card{
    padding:24px 20px;
  }

  .ap-site-logo__name{
    font-size:21px;
  }
}

@media (prefers-reduced-motion:reduce){
  .ap-site *,
  .ap-site *::before,
  .ap-site *::after,
  .ap-client-surface *,
  .ap-client-surface *::before,
  .ap-client-surface *::after{
    scroll-behavior:auto!important;
    transition:none!important;
    animation:none!important;
  }
}


/* =========================================================
   10. INTERNATIONAL TYPOGRAPHY SYSTEM
   Language-aware fallbacks. Additional language packs can be
   loaded only on pages that require them to protect speed.
   ========================================================= */
.ap-site,
.ap-client-surface{
  font-kerning:normal;
  font-optical-sizing:auto;
  font-synthesis:none;
}

.ap-site p,
.ap-site li,
.ap-client-surface p,
.ap-client-surface li{
  max-width:75ch;
}

html[lang^="ar"] .ap-site,
html[lang^="ar"] .ap-client-surface{
  --ap-font-display:"Noto Naskh Arabic","Geeza Pro","Tahoma",serif;
  --ap-font-body:"Noto Sans Arabic","Tahoma","Arial",sans-serif;
  direction:rtl;
}

html[lang^="hi"] .ap-site,
html[lang^="hi"] .ap-client-surface,
html[lang^="mr"] .ap-site,
html[lang^="mr"] .ap-client-surface{
  --ap-font-display:"Noto Serif Devanagari","Kohinoor Devanagari",serif;
  --ap-font-body:"Noto Sans Devanagari","Kohinoor Devanagari",sans-serif;
}

html[lang^="zh"] .ap-site,
html[lang^="zh"] .ap-client-surface{
  --ap-font-display:"Noto Serif SC","Songti SC","SimSun",serif;
  --ap-font-body:"Noto Sans SC","PingFang SC","Microsoft YaHei",sans-serif;
}

html[lang^="ru"] .ap-site,
html[lang^="ru"] .ap-client-surface,
html[lang^="fr"] .ap-site,
html[lang^="fr"] .ap-client-surface{
  --ap-font-display:"Source Serif 4",Georgia,"Times New Roman",serif;
  --ap-font-body:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
}

@supports (text-wrap:balance){
  .ap-display,
  .ap-heading,
  .ap-card-title{
    text-wrap:balance;
  }
}

@supports (text-wrap:pretty){
  .ap-subheading,
  .ap-card-copy,
  .ap-site p,
  .ap-client-surface p{
    text-wrap:pretty;
  }
}