/* PREMIER SECURITY, LLC — premier-security.us
   Static replacement for the Weebly site. No build step, no dependencies.
   Colours and type matched to the live Weebly site, 11 Nov 2026. */

:root{
  --page:#080c10;          /* outside the content panel — near black */
  --nav:#0d1318;           /* nav bar */
  --nav-on:#1b2730;        /* active tab */
  --panel-top:#2f4150;     /* content panel, top of the fade */
  --panel-mid:#19242e;
  --panel-bot:#0a0f14;     /* content panel, bottom of the fade */
  --text:#c2cdd6;          /* body — light blue grey, never white */
  --head:#d6e0e7;          /* headings */
  --dim:#8d9aa5;
  --link:#5b8fc9;          /* the blue italic links */
  --link-on:#8fb6dd;
  --green:#098203;
  --green-bright:#1FB814;
  --rule:rgba(194,205,214,0.16);
  --foot:#0d1a1f;

  --serif:Georgia,"Times New Roman",Times,serif;
}

*{box-sizing:border-box;}
html,body{margin:0;padding:0;}

body{
  font-family:var(--serif);
  background:var(--page);
  color:var(--text);
  line-height:1.55;
  min-height:100vh;
  display:flex;
  flex-direction:column;
  -webkit-font-smoothing:antialiased;
}
main{flex:1 0 auto;}
.ps-footer{flex:none;}

.ps-shell{max-width:1180px;margin:0 auto;}

/* ---------- header ---------- */

.ps-top{background:var(--page);padding:0;flex:none;}
.ps-top-inner{max-width:1180px;margin:0 auto;padding:0 20px;}
.ps-top-inner > a{display:block;}
.ps-top-inner picture{display:block;}

.ps-banner{display:block;width:100%;height:auto;}

/* the old text wordmark, kept for pages that still use it */
.ps-name{
  font-size:1.5rem;font-weight:700;letter-spacing:0.02em;
  text-decoration:none;color:var(--head);line-height:1.2;
}
.ps-name span{color:var(--green-bright);}

/* ---------- nav ---------- */

.ps-nav{
  max-width:none;
  margin:0;
  background:var(--nav);
  display:flex;
  align-items:stretch;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
}
.ps-nav::-webkit-scrollbar{display:none;}
.ps-nav a{
  display:flex;align-items:center;
  white-space:nowrap;
  padding:15px 22px;
  color:var(--text);
  text-decoration:none;
  font-size:1rem;
}
.ps-nav a:hover{color:var(--head);}
.ps-nav a.is-here{color:var(--link);background:var(--nav-on);}

/* ---------- the content panel ---------- */

main{
  max-width:none;
  margin:0;
  display:flex;
  flex-direction:column;
  align-items:center;
  padding:42px 20px 90px;
  background:linear-gradient(180deg,
    var(--panel-top) 0%,
    var(--panel-mid) 42%,
    var(--panel-bot) 100%);
  min-height:0;
}
/* the panel runs edge to edge; the words stay readable */
main > *{
  width:100%;
  max-width:1140px;
}

/* the live site centres everything except Security Services */
main{text-align:center;}
main.ps-left{text-align:left;}

h1,h2,h3{color:var(--head);font-weight:400;}
h1{font-size:2.1rem;line-height:1.25;margin:0 0 10px;}
h2{font-size:1.5rem;line-height:1.3;margin:40px 0 12px;}
h3{font-size:1.12rem;margin:26px 0 6px;font-weight:700;}

.ps-sub{font-size:1.1rem;color:var(--dim);margin:0 0 26px;}

a{color:var(--link);}
a:hover{color:var(--link-on);}

p{margin:0 0 15px;}

.ps-lead{font-size:1.08rem;}

.ps-card{
  background:rgba(255,255,255,0.045);
  border:1px solid var(--rule);
  border-radius:10px;
  padding:26px 24px;
  margin:0 0 24px;
}

blockquote{
  margin:22px auto;
  max-width:760px;
  padding:16px 22px;
  font-style:italic;
  color:var(--text);
}
blockquote cite{
  display:block;margin-top:10px;
  font-style:normal;font-weight:700;font-size:0.9rem;
  color:var(--dim);
}

.ps-note{color:var(--dim);font-size:0.92rem;}

.ps-figure{margin:24px auto;max-width:760px;}
.ps-figure img{width:100%;height:auto;display:block;}
.ps-figure figcaption{margin-top:8px;font-size:0.9rem;color:var(--dim);}

/* ---------- lists ---------- */

ul{margin:0 0 15px;padding-left:22px;text-align:left;display:inline-block;}
li{margin:0 0 6px;}

.ps-cols{columns:2;column-gap:34px;}
.ps-cols li{break-inside:avoid;}

/* two column layout, Security Services */
.ps-split{
  display:flex;gap:34px;align-items:flex-start;
  text-align:left;
}
.ps-split .ps-figure{margin:0;flex:0 0 260px;max-width:260px;}

/* ---------- call block ---------- */

.ps-call{
  border:1px solid var(--rule);
  border-radius:10px;
  padding:26px;text-align:center;margin:0 0 24px;
}
.ps-call .ps-call-label{
  font-size:0.82rem;letter-spacing:0.14em;text-transform:uppercase;
  color:var(--dim);margin:0 0 8px;
}
.ps-call a.ps-number{
  display:inline-block;font-size:1.9rem;font-weight:700;
  color:var(--head);text-decoration:none;
}
.ps-call a.ps-number:hover{color:var(--link);}
.ps-call .ps-email{margin:14px 0 0;}

/* ---------- footer ---------- */

.ps-footer{
  background:var(--foot);
  color:var(--dim);
  padding:22px 26px;
  font-size:0.85rem;
}
.ps-footer-inner{
  max-width:1180px;margin:0 auto;
  display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;
}
.ps-footer a{color:var(--dim);}

/* ---------- small screens ---------- */

@media (max-width:760px){
  .ps-top{padding:0;}
  .ps-top-inner{padding:8px 12px;}
  .ps-nav a{padding:13px 16px;font-size:0.95rem;}
  main{padding:30px 16px 70px;}
  h1{font-size:1.7rem;}
  h2{font-size:1.3rem;}
  .ps-card{padding:20px 16px;}
  .ps-cols{columns:1;}
  .ps-split{flex-direction:column;}
  .ps-split .ps-figure{flex:none;max-width:100%;align-self:center;}
  .ps-call a.ps-number{font-size:1.55rem;}
  .ps-footer-inner{flex-direction:column;}
}

/* ---------- home page ---------- */

.ps-welcome{font-size:3.1rem;line-height:1.1;margin:18px 0 2px;font-weight:400;}
.ps-to{font-size:1.15rem;margin:0 0 22px;color:var(--text);}
.ps-url{
  font-size:1.45rem;margin:0 0 34px;color:var(--head);
  text-decoration:underline;text-underline-offset:5px;
}
.ps-creed{margin:0 0 20px;font-size:1.06rem;}
.ps-local{margin:26px 0 34px;font-size:1.06rem;color:var(--text);}

@media (max-width:760px){
  .ps-welcome{font-size:2.3rem;}
  .ps-url{font-size:1.1rem;}
  .ps-creed,.ps-local{font-size:0.98rem;}
}

/* ---------- hamburger + overlay menu (phone only) ---------- */

.ps-burger{display:none;}
.ps-scrim{display:none;}

@media (max-width:760px){
  .ps-top-inner{display:flex;align-items:center;gap:10px;}
  .ps-top-inner > a{flex:1;min-width:0;}

  .ps-burger{
    display:flex;flex-direction:column;justify-content:center;gap:5px;
    flex:0 0 auto;width:46px;height:46px;padding:0 11px;
    background:var(--nav);border:1px solid var(--rule);border-radius:6px;
    cursor:pointer;
  }
  .ps-burger span{display:block;height:2px;background:var(--text);border-radius:2px;}

  /* the menu sits ON TOP of the page — the body never moves */
  .ps-nav{
    position:fixed;top:0;left:0;z-index:60;
    width:78%;max-width:320px;height:100%;
    margin:0;
    flex-direction:column;align-items:stretch;
    background:#0b1116;
    border-right:1px solid var(--rule);
    overflow-y:auto;
    transform:translateX(-100%);
    transition:transform .22s ease;
  }
  .ps-nav a{
    padding:17px 22px;font-size:1.02rem;
    border-bottom:1px solid var(--rule);
  }
  .ps-scrim{
    display:block;position:fixed;inset:0;z-index:50;
    background:rgba(0,0,0,0.55);
    opacity:0;pointer-events:none;transition:opacity .22s ease;
  }

  body.ps-menu-open .ps-nav{transform:translateX(0);}
  body.ps-menu-open .ps-scrim{opacity:1;pointer-events:auto;}
  body.ps-menu-open{overflow:hidden;}
}

/* ---------- Security Services: photo + two columns ---------- */

.ps-split{align-items:flex-start;}
.ps-split .ps-col{flex:1;min-width:0;text-align:left;}
.ps-split .ps-col h2{margin-top:0;font-size:1.18rem;}
.ps-split .ps-col ul{display:block;padding-left:20px;}

.ps-portrait{flex:0 0 190px;max-width:190px;margin:0;}
.ps-portrait img{width:100%;height:auto;display:block;}
.ps-portrait figcaption{font-size:0.82rem;line-height:1.45;text-align:left;}

@media (max-width:900px) and (min-width:761px){
  .ps-portrait{flex:0 0 160px;max-width:160px;}
}
@media (max-width:760px){
  .ps-portrait{flex:none;max-width:200px;align-self:center;margin:0 auto 18px;}
  .ps-split .ps-col h2{font-size:1.12rem;}
}

/* ---------- Security Services: two centred columns ---------- */

.ps-two{
  display:flex;gap:50px;
  justify-content:center;align-items:flex-start;
  max-width:900px;margin:0 auto;
  text-align:center;
}
.ps-two .ps-col{flex:1;min-width:0;text-align:center;}
.ps-two .ps-col h2{margin:0 0 14px;font-size:1.2rem;}
.ps-two .ps-col ul{
  display:inline-block;text-align:left;
  padding-left:20px;margin:0 0 22px;
}
.ps-two .ps-portrait{
  flex:none;max-width:230px;margin:6px auto 0;
}
.ps-two .ps-portrait figcaption{text-align:center;font-size:0.84rem;line-height:1.5;}

@media (max-width:760px){
  .ps-two{flex-direction:column;gap:30px;}
  .ps-two .ps-portrait{max-width:220px;}
}

@media (max-width:760px){

}
