/*
Theme Name: JTL Security
Theme URI: https://jtlsecurity.com.my
Author: Nano
Author URI: https://jtlsecurity.com.my
Description: World-class WordPress + Elementor theme for JTL Security Services. Pairs with the "JTL Elementor Widgets" plugin, which provides a full set of custom section widgets (Topbar, Hero, Trust Badges, About, Services Grid, Industries, Featured Projects, Clients & Testimonial, Contact, Footer) matching the JTL brand system.
Version: 1.2.0
Requires PHP: 7.4
Text Domain: jtl-security
*/

/* ==========================================================================
   Design tokens — colour-matched to the JTL mockup via pixel sampling.
   Keep these in sync with jtl-elementor-widgets/assets/css/jtl-widgets.css
   ========================================================================== */
:root{
  --jtl-navy: #071c36;        /* official brand primary — Navy Blue */
  --jtl-navy-2: #0f2c50;      /* hover / lighter navy accents (derived) */
  --jtl-navy-soft: #163a68;
  --jtl-gold: #d49a1e;        /* official brand secondary — Gold */
  --jtl-gold-2: #e6b13f;      /* hover / lighter gold (derived) */
  --jtl-ink: #222222;         /* official brand text — Dark Gray */
  --jtl-muted: #667085;
  --jtl-line: #e8eaef;
  --jtl-bg-soft: #f8f9fb;     /* official brand background */
  --jtl-white: #ffffff;
  --jtl-radius: 10px;
  --jtl-shadow: 0 10px 30px rgba(7,28,54,0.09);
  --jtl-font-head: 'Poppins', sans-serif;
  --jtl-font-body: 'Inter', sans-serif;
}

html{ scroll-behavior:smooth; }
body{
  font-family: var(--jtl-font-body);
  color: var(--jtl-ink);
  background: var(--jtl-white);
  margin:0;
}
h1,h2,h3,h4,h5,h6{
  font-family: var(--jtl-font-head);
  color: var(--jtl-navy);
  margin:0 0 .5em;
  line-height:1.2;
}
a{ color: inherit; text-decoration:none; }
img{ max-width:100%; display:block; }
.jtl-container{ max-width:1320px; margin:0 auto; padding:0 24px; }
.jtl-eyebrow{
  color: var(--jtl-gold); font-weight:700; letter-spacing:.12em;
  text-transform:uppercase; font-size:13px; display:block; margin-bottom:10px;
}
.jtl-btn{
  display:inline-flex; align-items:center; gap:8px;
  font-family: var(--jtl-font-head); font-weight:600; font-size:14px;
  padding:15px 28px; border-radius:6px; border:2px solid transparent;
  cursor:pointer; transition:all .2s ease; text-transform:uppercase; letter-spacing:.03em;
}
.jtl-btn-gold{ background: var(--jtl-gold); color:#1a1400; }
.jtl-btn-gold:hover{ background: var(--jtl-gold-2); transform:translateY(-2px); }
.jtl-btn-outline{ background:transparent; border-color:rgba(255,255,255,.7); color:#fff; }
.jtl-btn-outline:hover{ background:rgba(255,255,255,.1); border-color:#fff; }
.jtl-btn-navy{ background: var(--jtl-navy); color:#fff; }
.jtl-btn-navy:hover{ background: var(--jtl-navy-2); }

/* Skip link / basic accessibility */
.skip-link{ position:absolute; left:-9999px; top:0; background:var(--jtl-navy); color:#fff; padding:10px 16px; z-index:9999; }
.skip-link:focus{ left:10px; top:10px; }

/* WP core alignments used inside Elementor content areas */
.alignwide{ max-width:1320px; margin-left:auto; margin-right:auto; }
.alignfull{ width:100vw; margin-left:calc(50% - 50vw); }

@media (max-width: 782px){
  .jtl-container{ padding:0 18px; }
}
