/* Rammar Holding — shared styles */

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:#0A0A0B;color:#FFFFFF;font-family:'Archivo',sans-serif;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
a:hover{color:#C9A24B}
img{max-width:100%}
p{text-wrap:pretty}

@keyframes ruleGrow{from{width:0}to{width:56px}}
@keyframes heroUp{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:none}}

.rule{width:56px;height:2px;background:#C9A24B;animation:ruleGrow 1.2s cubic-bezier(.2,.6,.2,1) both}
.mono{font-family:'IBM Plex Mono',monospace}
.display{font-family:'Barlow Condensed',sans-serif;text-transform:uppercase}

/* ---------- NAV ---------- */
.nav{position:sticky;top:0;z-index:50;display:flex;align-items:center;justify-content:space-between;
  padding:0 56px;height:80px;border-bottom:1px solid rgba(255,255,255,.14);
  background:rgba(10,10,11,.92);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.nav-logo{display:flex}
.nav-logo img{height:19px;display:block;filter:invert(1)}
.nav-links{display:flex;align-items:center;gap:38px;font-size:13px;letter-spacing:.1em;color:rgba(255,255,255,.85)}
.nav-links a[aria-current="page"]{color:#C9A24B;border-bottom:1px solid #C9A24B;padding-bottom:3px}
.nav-contact{padding:10px 24px;border:1px solid rgba(255,255,255,.4);transition:border-color .2s,color .2s}
.nav-contact:hover{border-color:#C9A24B;color:#C9A24B}

/* ---------- PAGE HERO ---------- */
.page-hero{padding:110px 56px 84px;border-bottom:1px solid rgba(255,255,255,.12)}
.page-hero h1,.page-title{font-family:'Barlow Condensed',sans-serif;font-weight:500;line-height:.98;
  text-transform:uppercase;margin:32px 0 0;animation:heroUp 1s cubic-bezier(.2,.6,.2,1) .1s both;
  /* fluid so long titles (e.g. "Governance & Compliance") never overflow narrow viewports */
  font-size:clamp(40px,8.4vw,96px)}
.page-title{margin:0;font-size:clamp(38px,7.8vw,88px)}
.page-hero .lead{max-width:620px;margin:36px 0 0;font-size:17px;line-height:1.75;color:rgba(255,255,255,.6);
  animation:heroUp 1s cubic-bezier(.2,.6,.2,1) .25s both}

/* ---------- SHARED BITS ---------- */
.eyebrow{font-size:12px;letter-spacing:.24em;color:rgba(255,255,255,.45)}
.eyebrow-dark{font-size:12px;letter-spacing:.24em;color:rgba(10,10,11,.45)}
.gold-tick{width:44px;height:2px;background:#C9A24B;margin-top:16px}
.section{padding:96px 56px;border-bottom:1px solid rgba(255,255,255,.12)}
.section-white{background:#FFFFFF;color:#0A0A0B;padding:96px 56px}
.cta-btn{padding:18px 44px;background:#C9A24B;color:#0A0A0B;font-size:13px;letter-spacing:.14em;
  font-weight:600;white-space:nowrap;transition:background .3s ease;display:inline-block}
.cta-btn:hover{background:#E0BC6A;color:#0A0A0B}
.cta-band{display:flex;align-items:center;justify-content:space-between;gap:32px;padding:72px 56px;
  border-bottom:1px solid rgba(255,255,255,.12)}
.cta-band .title{font-family:'Barlow Condensed',sans-serif;font-size:48px;text-transform:uppercase;
  letter-spacing:.02em;line-height:1.05}
.card-link{transition:transform .4s cubic-bezier(.2,.6,.2,1),border-color .2s}
.card-link:hover{transform:translateY(-6px)}
.bordered-link{border:1px solid rgba(255,255,255,.15);padding:32px;display:block;transition:border-color .2s}
.bordered-link:hover{border-color:#C9A24B}

/* ---------- FOOTER ---------- */
.footer{padding:56px 56px 0}
.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:48px;padding-bottom:56px;
  border-bottom:1px solid rgba(255,255,255,.1)}
.footer-grid img{height:17px;display:block;filter:invert(1);opacity:.9}
.footer-addr{font-size:13px;line-height:1.8;color:rgba(255,255,255,.45);margin-top:20px}
.footer-col{display:flex;flex-direction:column;gap:14px;font-size:13px;letter-spacing:.08em;color:rgba(255,255,255,.65)}
.footer-col .head{font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.2em;color:rgba(255,255,255,.35)}
.footer-legal{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;padding:24px 0;
  font-size:11.5px;letter-spacing:.1em;color:rgba(255,255,255,.35)}

/* ---------- RESPONSIVE ---------- */
@media (max-width:1000px){
  .nav{padding:0 28px}
  .nav-links{gap:20px}
  .pad,.section,.section-white,.cta-band,.footer,.page-hero{padding-left:28px !important;padding-right:28px !important}
  .grid-4{grid-template-columns:repeat(2,1fr) !important}
  .grid-3{grid-template-columns:1fr !important}
  .split{grid-template-columns:1fr !important;gap:32px !important}
  .cols-2{flex-direction:column !important;gap:24px !important}
  .cta-band{flex-direction:column;align-items:flex-start}
  .footer-grid{grid-template-columns:1fr 1fr}
  .row-split{flex-direction:column;gap:20px;align-items:flex-start !important}
}
@media (max-width:620px){
  .nav-links a:not(.nav-contact){display:none}
  .page-hero{padding-top:72px;padding-bottom:56px}
  .grid-4{grid-template-columns:1fr !important}
  .footer-grid{grid-template-columns:1fr}
  .cta-band .title{font-size:34px}
}