:root{
    --navy-deep:#081428;
    --navy-base:#0B1F3A;
    --navy-mid:#142E52;
    --navy-line: rgba(179,60,48,0.18);
    --red:#B33C30;
    --red-soft:#E2836E;
    --ice:#7FA8D9;
    --paper:#F3F1EA;
    --paper-dim:#E7E4DA;
    --ink:#0E1420;
    --ink-soft:#3C4658;
    --slate:#7C8AA5;
    --radius:2px;
    --ease:cubic-bezier(.22,.61,.36,1);
  }
  *{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{
    margin:0;
    background:var(--paper);
    color:var(--ink);
    font-family:'Inter',sans-serif;
    -webkit-font-smoothing:antialiased;
    overflow-x:hidden;
  }
  h1,h2,h3{
    font-family:'Big Shoulders Inline',sans-serif;
    font-weight:500;
    margin:0;
    letter-spacing:-0.01em;
  }
  a{color:inherit; text-decoration:none;}
  img,svg{display:block; max-width:100%;}
  .wrap{max-width:1180px; margin:0 auto; padding:0 32px;}
  .eyebrow{
    font-family:'IBM Plex Mono',monospace;
    font-size:12px;
    letter-spacing:0.18em;
    text-transform:uppercase;
    color:var(--red);
  }
  ::selection{background:var(--red); color:var(--navy-deep);}

  /* ===== NAV ===== */
  header{
    position:fixed; top:0; left:0; right:0; z-index:100;
    background:rgba(8,20,40,0.0);
    border-bottom:1px solid transparent;
    transition:background .4s var(--ease), border-color .4s var(--ease);
  }
  header.scrolled{
    background:rgba(8,20,40,0.92);
    backdrop-filter:blur(10px);
    border-bottom:1px solid var(--navy-line);
  }
  nav.wrap{
    display:flex; align-items:center; justify-content:space-between;
    height:78px;
  }
  .brand{display:flex; align-items:center; gap:0;}
  .brand-word{
    font-family:'Big Shoulders Inline',sans-serif; font-weight:600; font-size:22px;
    letter-spacing:0.06em; color:var(--paper);
    transition:letter-spacing .35s var(--ease), color .3s var(--ease);
  }
  .brand-word .dot{color:var(--red); transition:color .3s var(--ease);}
  .brand:hover .brand-word{letter-spacing:0.09em;}
  .nav-links{display:flex; align-items:center; gap:36px;}
  .nav-links a{
    font-size:14px; color:var(--slate); font-weight:500;
    position:relative; padding:6px 0;
    transition:color .25s var(--ease);
  }
  .nav-links a:hover, .nav-links a.active{color:var(--paper);}
  .nav-links a:not(.btn)::after{
    content:''; position:absolute; left:0; bottom:0; height:1px; width:0;
    background:var(--red); transition:width .3s var(--ease);
  }
  .nav-links a:not(.btn):hover::after{width:100%;}
  .btn{
    display:inline-flex; align-items:center; gap:8px;
    font-size:13.5px; font-weight:600; letter-spacing:0.02em;
    padding:11px 22px; border-radius:var(--radius);
    border:1px solid var(--red);
    color:var(--navy-deep) !important;
    background:var(--red);
    box-shadow:0 0 0 0 rgba(179,60,48,0.0);
    transition:transform .25s var(--ease), background .25s var(--ease), color .25s var(--ease), box-shadow .35s var(--ease);
  }
  .btn:hover{
    background:transparent; color:var(--red) !important; transform:translateY(-2px);
    box-shadow:0 10px 28px -8px rgba(179,60,48,0.5);
  }
  .btn-ghost{
    background:transparent; color:var(--paper) !important;
    border:1px solid rgba(243,241,234,0.28);
  }
  .btn-ghost:hover{border-color:var(--red); color:var(--red) !important; background:transparent; box-shadow:0 10px 28px -10px rgba(179,60,48,0.35);}
  .menu-toggle{display:none; flex-direction:column; gap:5px; background:none; border:none; cursor:pointer; padding:8px;}
  .menu-toggle span{width:22px; height:2px; background:var(--paper);}

  /* ===== HERO ===== */
  .hero{
    position:relative;
    background:radial-gradient(120% 100% at 78% 0%, var(--navy-mid) 0%, var(--navy-base) 45%, var(--navy-deep) 100%);
    padding:168px 0 96px;
    overflow:hidden;
  }
  .hero-watermark{
    position:absolute; top:50%; right:-4%; transform:translateY(-50%);
    font-family:'Big Shoulders Inline',sans-serif; font-weight:600;
    font-size:clamp(90px, 15vw, 230px);
    letter-spacing:0.02em;
    color:transparent;
    -webkit-text-stroke:1.5px rgba(179,60,48,0.3);
    white-space:nowrap;
    pointer-events:none;
    user-select:none;
    line-height:1;
  }
  .hero-inner{position:relative; z-index:2; max-width:760px;}
  .hero h1{
    font-size:clamp(40px, 6vw, 68px);
    line-height:1.05; color:var(--paper); margin-top:18px;
  }
  .hero h1 em{
    font-style:italic;
    background:linear-gradient(100deg, var(--red-soft), var(--red) 60%);
    -webkit-background-clip:text; background-clip:text; color:transparent;
  }
  .hero p.lede{
    color:var(--slate); font-size:17px; line-height:1.7; max-width:560px;
    margin-top:26px;
  }
  .hero-ctas{display:flex; gap:16px; margin-top:38px; flex-wrap:wrap;}

  .stats-bar{
    position:relative; z-index:2;
    display:grid; grid-template-columns:repeat(4,1fr);
    margin-top:88px; border-top:1px solid var(--navy-line);
  }
  .stat{padding:28px 24px 0; border-left:1px solid var(--navy-line);}
  .stat:first-child{border-left:none; padding-left:0;}
  .stat .num{
    font-family:'Big Shoulders Inline',sans-serif; font-weight:500; font-size:clamp(28px,3.2vw,40px);
    color:var(--red-soft);
  }
  .stat .label{
    margin-top:8px; font-size:13px; color:var(--slate); line-height:1.4;
  }

  /* ===== SECTION shared ===== */
  section{padding:110px 0;}
  .section-head{max-width:640px; margin-bottom:56px;}
  .section-head h2{font-size:clamp(30px,3.4vw,42px); margin-top:14px; color:var(--ink);}
  .section-head p{color:var(--ink-soft); font-size:16px; line-height:1.7; margin-top:16px;}

  /* ===== SERVICES ===== */
  .services{background:var(--paper);}
  .service-grid{
    display:grid; grid-template-columns:repeat(2,1fr); gap:1px;
    background:var(--paper-dim); border:1px solid var(--paper-dim);
  }
  .service-card{
    background:var(--paper); padding:44px 40px;
    transition:background .35s var(--ease), transform .35s var(--ease), box-shadow .35s var(--ease);
    position:relative; z-index:1;
  }
  .service-card:hover{
    background:var(--navy-base);
    transform:translateY(-4px);
    box-shadow:0 24px 48px -20px rgba(8,20,40,0.35);
    z-index:2;
  }
  .service-card:hover .svc-num,
  .service-card:hover h3,
  .service-card:hover p{color:var(--paper);}
  .service-card:hover .svc-link{color:var(--red-soft);}
  .svc-num{
    font-family:'IBM Plex Mono',monospace; font-size:13px; color:var(--red);
    transition:color .35s var(--ease);
  }
  .service-card h3{
    font-size:23px; margin-top:22px; color:var(--ink);
    transition:color .35s var(--ease);
  }
  .service-card p{
    font-size:15px; line-height:1.65; color:var(--ink-soft); margin-top:14px;
    transition:color .35s var(--ease);
  }
  .svc-link{
    display:inline-flex; align-items:center; gap:6px;
    margin-top:24px; font-size:13.5px; font-weight:600; color:var(--navy-base);
    transition:color .35s var(--ease), gap .25s var(--ease);
  }
  .svc-link svg{width:14px; height:14px;}
  .svc-link:hover{gap:10px;}

  /* ===== WHY ===== */
  .why{
    background:var(--navy-deep);
    color:var(--paper);
    position:relative;
    overflow:hidden;
  }
  .why::before{
    content:''; position:absolute; inset:0;
    background-image:linear-gradient(var(--navy-line) 1px, transparent 1px),
                      linear-gradient(90deg, var(--navy-line) 1px, transparent 1px);
    background-size:64px 64px;
    opacity:0.35;
  }
  .why-grid{
    position:relative; z-index:2;
    display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:start;
  }
  .why-left .eyebrow{color:var(--red);}
  .why-left h2{color:var(--paper); font-size:clamp(28px,3.2vw,38px); margin-top:16px; line-height:1.15;}
  .why-left p{color:var(--slate); font-size:16px; line-height:1.75; margin-top:20px; max-width:460px;}
  .why-left .hero-ctas{margin-top:32px;}
  .feature-grid{display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--navy-line);}
  .feature{background:var(--navy-deep); padding:28px;}
  .feature h4{
    font-family:'Big Shoulders Inline',sans-serif; font-weight:500; font-size:17px; color:var(--red-soft);
  }
  .feature p{font-size:14px; color:var(--slate); line-height:1.6; margin-top:10px;}

  /* ===== CTA BAND ===== */
  .cta-band{
    background:linear-gradient(120deg, var(--navy-base), var(--navy-mid));
    padding:96px 0; text-align:center; position:relative;
  }
  .cta-band h2{color:var(--paper); font-size:clamp(28px,4vw,44px);}
  .cta-band p{color:var(--slate); font-size:16px; margin:18px auto 0; max-width:520px; line-height:1.7;}
  .cta-band .hero-ctas{justify-content:center; margin-top:34px;}

  /* ===== FOOTER ===== */
  footer{background:var(--navy-deep); color:var(--slate); padding:72px 0 28px;}
  .footer-grid{
    display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:48px;
    padding-bottom:48px; border-bottom:1px solid var(--navy-line);
  }
  .footer-brand .brand-word{color:var(--paper);}
  .footer-brand p{font-size:14px; line-height:1.7; margin-top:18px; max-width:320px; color:var(--slate);}
  footer h5{
    font-family:'IBM Plex Mono',monospace; font-size:12px; letter-spacing:0.14em;
    text-transform:uppercase; color:var(--red); margin-bottom:18px;
  }
  footer ul{list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:12px;}
  footer ul a{font-size:14px; color:var(--slate); transition:color .25s var(--ease);}
  footer ul a:hover{color:var(--paper);}
  .foot-bottom{
    display:flex; justify-content:space-between; align-items:center;
    padding-top:24px; font-size:12.5px; color:var(--slate); flex-wrap:wrap; gap:10px;
  }

  /* ===== REVEAL ===== */
  .reveal{opacity:0; transform:translateY(22px); transition:opacity .8s var(--ease), transform .8s var(--ease);}
  .reveal.in{opacity:1; transform:translateY(0);}
  @media (prefers-reduced-motion: reduce){
    .reveal{opacity:1; transform:none; transition:none;}
    html{scroll-behavior:auto;}
  }

  /* ===== MODAL ===== */
  .modal-overlay{
    position:fixed; inset:0; z-index:200;
    background:rgba(6,13,26,0.72);
    backdrop-filter:blur(4px);
    display:flex; align-items:center; justify-content:center;
    padding:24px;
    opacity:0; visibility:hidden;
    transition:opacity .3s var(--ease), visibility 0s linear .3s;
  }
  .modal-overlay.open{
    opacity:1; visibility:visible;
    transition:opacity .3s var(--ease), visibility 0s linear 0s;
  }
  .modal{
    position:relative;
    width:100%; max-width:480px;
    background:var(--navy-deep);
    border:1px solid var(--navy-line);
    border-radius:var(--radius);
    padding:44px 40px 36px;
    transform:translateY(18px) scale(0.98);
    transition:transform .35s var(--ease);
    max-height:88vh; overflow-y:auto;
  }
  .modal-overlay.open .modal{transform:translateY(0) scale(1);}
  .modal-close{
    position:absolute; top:18px; right:18px;
    width:34px; height:34px; border-radius:50%;
    background:transparent; border:1px solid rgba(243,241,234,0.2);
    color:var(--paper); cursor:pointer;
    display:flex; align-items:center; justify-content:center;
    transition:border-color .25s var(--ease), color .25s var(--ease), transform .25s var(--ease);
  }
  .modal-close:hover{border-color:var(--red); color:var(--red); transform:rotate(90deg);}
  .modal-close svg{width:15px; height:15px;}
  .modal .eyebrow{color:var(--red);}
  .modal h2{
    font-size:26px; color:var(--paper); margin-top:12px; line-height:1.15;
  }
  .modal p.modal-sub{
    color:var(--slate); font-size:14.5px; line-height:1.6; margin-top:10px;
  }
  .contact-form{margin-top:28px; display:flex; flex-direction:column; gap:18px;}
  .field{display:flex; flex-direction:column; gap:8px;}
  .field label{
    font-family:'IBM Plex Mono',monospace; font-size:11px; letter-spacing:0.1em;
    text-transform:uppercase; color:var(--slate);
  }
  .field input,
  .field select,
  .field textarea{
    width:100%;
    background:rgba(243,241,234,0.04);
    border:1px solid rgba(243,241,234,0.18);
    border-radius:var(--radius);
    padding:12px 14px;
    font-family:'Inter',sans-serif; font-size:14.5px;
    color:var(--paper);
    transition:border-color .25s var(--ease), background .25s var(--ease);
  }
  .field select{
    appearance:none;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23B33C30' stroke-width='1.6'%3E%3Cpath d='M4 6l4 4 4-4'/%3E%3C/svg%3E");
    background-repeat:no-repeat;
    background-position:right 14px center;
    padding-right:38px;
  }
  .field select option{background:var(--navy-deep); color:var(--paper);}
  .field input::placeholder,
  .field textarea::placeholder{color:var(--slate); opacity:0.7;}
  .field input:focus,
  .field select:focus,
  .field textarea:focus{
    outline:none; border-color:var(--red);
    background:rgba(243,241,234,0.07);
  }
  .field textarea{resize:vertical; min-height:96px; font-family:'Inter',sans-serif;}
  .contact-form .btn{
    justify-content:center; width:100%; margin-top:4px;
    border:none; cursor:pointer; font-size:14px;
  }
  .form-status{
    display:none; align-items:center; gap:10px;
    margin-top:22px; padding:14px 16px;
    border:1px solid var(--navy-line); border-radius:var(--radius);
    color:var(--red-soft); font-size:13.5px; line-height:1.5;
  }
  .form-status.show{display:flex;}
  .form-status svg{width:18px; height:18px; flex-shrink:0;}

  /* ===== RESPONSIVE ===== */
  @media (max-width:860px){
    .service-grid{grid-template-columns:1fr;}
    .why-grid{grid-template-columns:1fr; gap:40px;}
    .stats-bar{grid-template-columns:repeat(2,1fr); row-gap:28px;}
    .stat:nth-child(3){border-left:none;}
    .footer-grid{grid-template-columns:1fr; gap:36px;}
  }
  @media (max-width:720px){
    .nav-links{
      position:fixed; top:78px; left:0; right:0; bottom:0;
      background:var(--navy-deep); flex-direction:column; justify-content:flex-start;
      align-items:flex-start; gap:0; padding:20px 32px;
      transform:translateX(100%); transition:transform .35s var(--ease);
    }
    .nav-links.open{transform:translateX(0);}
    .nav-links a{width:100%; padding:16px 0; border-bottom:1px solid var(--navy-line);}
    .nav-links a.btn{margin-top:20px; justify-content:center;}
    .menu-toggle{display:flex;}
    .hero{padding-top:130px;}
  }

/* ================= ADMIN ================= */
.admin-body{
  background:var(--navy-deep);
  min-height:100vh;
  font-family:'Inter',sans-serif;
  color:var(--paper);
}
.admin-shell{max-width:1180px; margin:0 auto; padding:40px 32px 80px;}
.admin-header{
  display:flex; align-items:center; justify-content:space-between;
  padding-bottom:28px; margin-bottom:32px;
  border-bottom:1px solid var(--navy-line);
  flex-wrap:wrap; gap:16px;
}
.admin-header .brand-word{color:var(--paper); font-size:19px;}
.admin-title{display:flex; flex-direction:column; gap:6px;}
.admin-title h1{font-size:24px; color:var(--paper);}
.admin-title p{margin:0; font-size:13.5px; color:var(--slate);}

.admin-toolbar{
  display:flex; align-items:center; justify-content:space-between;
  gap:16px; margin-bottom:24px; flex-wrap:wrap;
}
.search-form{display:flex; gap:10px; flex:1; max-width:420px;}
.search-form input{
  flex:1;
  background:rgba(243,241,234,0.05);
  border:1px solid rgba(243,241,234,0.18);
  color:var(--paper);
  border-radius:var(--radius);
  padding:11px 14px;
  font-size:14px;
  font-family:'Inter',sans-serif;
}
.search-form input:focus{outline:none; border-color:var(--red);}
.search-form button, .clear-search{
  padding:11px 18px; border-radius:var(--radius);
  border:1px solid var(--red); background:var(--red);
  color:var(--navy-deep); font-weight:600; font-size:13.5px; cursor:pointer;
  transition:background .25s var(--ease), color .25s var(--ease);
}
.search-form button:hover{background:transparent; color:var(--red);}
.clear-search{background:transparent; color:var(--slate); border-color:rgba(243,241,234,0.2); text-decoration:none; display:inline-flex; align-items:center;}
.clear-search:hover{border-color:var(--red); color:var(--red);}
.result-count{font-size:13px; color:var(--slate); font-family:'IBM Plex Mono',monospace;}

.admin-table-wrap{
  border:1px solid var(--navy-line); border-radius:var(--radius); overflow-x:auto;
}
table.admin-table{width:100%; border-collapse:collapse; min-width:760px;}
.admin-table thead th{
  text-align:left; font-family:'IBM Plex Mono',monospace; font-size:11px;
  letter-spacing:0.1em; text-transform:uppercase; color:var(--red);
  background:rgba(243,241,234,0.03);
  padding:14px 18px; border-bottom:1px solid var(--navy-line);
  white-space:nowrap;
}
.admin-table tbody td{
  padding:16px 18px; font-size:14px; color:var(--paper);
  border-bottom:1px solid var(--navy-line); vertical-align:top;
}
.admin-table tbody tr:last-child td{border-bottom:none;}
.admin-table tbody tr:hover{background:rgba(243,241,234,0.03);}
.cell-message{max-width:320px; color:var(--slate); line-height:1.5;}
.cell-service{
  display:inline-block; font-size:12px; padding:4px 10px;
  border:1px solid var(--navy-line); border-radius:20px; color:var(--red-soft);
  white-space:nowrap;
}
.cell-date{font-family:'IBM Plex Mono',monospace; font-size:12.5px; color:var(--slate); white-space:nowrap;}
.cell-date .time{display:block; color:var(--ice); margin-top:2px;}
.delete-btn{
  background:transparent; border:1px solid rgba(200,80,80,0.4); color:#E58A8A;
  padding:7px 14px; border-radius:var(--radius); font-size:12.5px; font-weight:600;
  cursor:pointer; transition:background .25s var(--ease), color .25s var(--ease);
}
.delete-btn:hover{background:#C0524F; color:#fff; border-color:#C0524F;}
.empty-state{padding:60px 20px; text-align:center; color:var(--slate);}
.empty-state h3{color:var(--paper); font-size:18px; margin-bottom:8px;}

.admin-flash{
  margin-bottom:20px; padding:12px 16px; border-radius:var(--radius);
  border:1px solid var(--navy-line); font-size:13.5px; color:var(--red-soft);
}
.admin-flash.error{border-color:rgba(200,80,80,0.5); color:#E58A8A;}

.logout-link{font-size:13px; color:var(--slate); border:1px solid rgba(243,241,234,0.2); padding:9px 16px; border-radius:var(--radius); transition:color .25s var(--ease), border-color .25s var(--ease);}
.logout-link:hover{color:var(--red); border-color:var(--red);}

/* Admin login */
.login-shell{
  min-height:100vh; display:flex; align-items:center; justify-content:center; padding:24px;
}
.login-box{
  width:100%; max-width:400px; background:var(--navy-base);
  border:1px solid var(--navy-line); border-radius:var(--radius); padding:44px 38px;
}
.login-box h1{font-size:24px; color:var(--paper); margin-top:12px;}
.login-box p.sub{color:var(--slate); font-size:14px; margin-top:8px;}
.login-box form{margin-top:28px; display:flex; flex-direction:column; gap:18px;}

/* ================= CAREERS PAGE ================= */
.careers-hero{
  background:radial-gradient(120% 100% at 78% 0%, var(--navy-mid) 0%, var(--navy-base) 45%, var(--navy-deep) 100%);
  padding:168px 0 80px;
}
.careers-hero .eyebrow{color:var(--red);}
.careers-hero h1{
  font-size:clamp(36px,5.5vw,58px); color:var(--paper); margin-top:16px; line-height:1.08;
}
.careers-hero p.lede{color:var(--slate); font-size:16.5px; line-height:1.7; max-width:560px; margin-top:22px;}

.jobs-section{background:var(--paper); padding:90px 0 110px;}
.jobs-list{display:flex; flex-direction:column; gap:1px; background:var(--paper-dim); border:1px solid var(--paper-dim);}
.job-card{
  background:var(--paper); padding:32px 36px;
  display:flex; align-items:center; justify-content:space-between; gap:24px; flex-wrap:wrap;
  transition:background .3s var(--ease);
}
.job-card:hover{background:#fff;}
.job-info h3{font-size:22px; color:var(--ink);}
.job-info p{font-size:14.5px; color:var(--ink-soft); line-height:1.6; margin-top:10px; max-width:640px;}
.job-info .job-date{
  font-family:'IBM Plex Mono',monospace; font-size:12px; color:var(--slate); margin-top:12px; display:block;
}
.job-card .btn{white-space:nowrap; border:none; cursor:pointer;}
.jobs-empty{padding:60px 20px; text-align:center; color:var(--ink-soft);}
.jobs-empty h3{color:var(--ink); font-size:20px; margin-bottom:8px;}

/* File input styling to match .field inputs */
.field input[type="file"]{
  padding:10px 14px; cursor:pointer;
}
.field .hint{font-size:12px; color:var(--slate); margin-top:2px;}

/* ================= ADMIN TABS ================= */
.admin-tabs{display:flex; gap:8px; margin-bottom:28px; flex-wrap:wrap;}
.admin-tabs a{
  font-size:13.5px; font-weight:600; padding:10px 18px; border-radius:var(--radius);
  border:1px solid rgba(243,241,234,0.16); color:var(--slate);
  transition:border-color .25s var(--ease), color .25s var(--ease);
}
.admin-tabs a:hover{color:var(--paper); border-color:rgba(243,241,234,0.32);}
.admin-tabs a.active{border-color:var(--red); color:var(--red);}

/* Admin: post a job form */
.admin-post-job{
  border:1px solid var(--navy-line); border-radius:var(--radius);
  padding:28px 30px; margin-bottom:32px; background:rgba(243,241,234,0.02);
}
.admin-post-job h2{font-size:19px; color:var(--paper); margin-bottom:18px;}
.admin-post-job form{display:flex; flex-direction:column; gap:16px;}
.admin-post-job .btn{align-self:flex-start; border:none; cursor:pointer;}

.job-role-cell{max-width:360px; color:var(--slate); line-height:1.55;}
.resume-link{
  display:inline-block; font-size:12.5px; font-weight:600; color:var(--red-soft);
  border:1px solid var(--navy-line); padding:6px 12px; border-radius:var(--radius);
  transition:border-color .25s var(--ease), color .25s var(--ease);
}
.resume-link:hover{border-color:var(--red); color:var(--red);}
.no-resume{font-size:12.5px; color:var(--slate); font-style:italic;}

@media (max-width:720px){
  .job-card{flex-direction:column; align-items:flex-start;}
  .job-card .btn{width:100%; justify-content:center; display:inline-flex;}
}

/* ================= FOOTER ADMIN LINK ================= */
.foot-admin{
  text-align:center; padding-top:18px; margin-top:18px;
  border-top:1px solid var(--navy-line);
}
.foot-admin a{
  font-size:11.5px; color:var(--slate); letter-spacing:0.08em; text-transform:uppercase;
  font-family:'IBM Plex Mono',monospace;
  transition:color .25s var(--ease);
}
.foot-admin a:hover{color:var(--red);}

/* ================= ADMIN: role badges, permission chips ================= */
.role-badge{
  display:inline-block; font-size:11px; font-weight:700; letter-spacing:0.06em;
  text-transform:uppercase; padding:3px 9px; border-radius:20px;
  border:1px solid var(--red); color:var(--red);
}
.role-badge.admin{border-color:var(--ice); color:var(--ice);}
.status-badge{
  display:inline-block; font-size:11px; font-weight:700; padding:3px 9px; border-radius:20px;
  border:1px solid rgba(120,200,150,0.5); color:#8FD6A8;
}
.status-badge.disabled{border-color:rgba(200,80,80,0.5); color:#E58A8A;}
.perm-chips{display:flex; gap:6px; flex-wrap:wrap;}
.perm-chip{
  font-size:11px; padding:3px 9px; border-radius:20px;
  border:1px solid var(--navy-line); color:var(--slate);
}
.perm-chip.on{border-color:var(--red-soft); color:var(--red-soft);}

.checkbox-row{display:flex; gap:20px; flex-wrap:wrap; margin-top:4px;}
.checkbox-field{
  display:flex; align-items:center; gap:8px; font-size:13.5px; color:var(--paper);
}
.checkbox-field input{width:16px; height:16px; accent-color:var(--red);}

.toggle-btn{
  background:transparent; border:1px solid rgba(243,241,234,0.24); color:var(--slate);
  padding:7px 14px; border-radius:var(--radius); font-size:12.5px; font-weight:600;
  cursor:pointer; transition:border-color .25s var(--ease), color .25s var(--ease);
}
.toggle-btn:hover{border-color:var(--red); color:var(--red);}
.row-actions{display:flex; gap:8px; flex-wrap:wrap;}

.you-tag{font-size:11px; color:var(--red-soft); margin-left:6px; font-style:italic;}

/* Profile page */
.profile-card{
  max-width:460px; border:1px solid var(--navy-line); border-radius:var(--radius);
  padding:32px 34px; background:rgba(243,241,234,0.02);
}
.profile-card h2{font-size:19px; color:var(--paper); margin-bottom:6px;}
.profile-card .current-user{font-size:13.5px; color:var(--slate); margin-bottom:24px;}
.profile-card form{display:flex; flex-direction:column; gap:16px;}
.profile-card .btn{align-self:flex-start; border:none; cursor:pointer;}

/* ================= SERVICES PAGE ================= */
.page-hero{
  background:radial-gradient(120% 100% at 78% 0%, var(--navy-mid) 0%, var(--navy-base) 45%, var(--navy-deep) 100%);
  padding:168px 0 80px;
}
.page-hero .eyebrow{color:var(--red);}
.page-hero h1{font-size:clamp(36px,5.5vw,58px); color:var(--paper); margin-top:16px; line-height:1.08;}
.page-hero p.lede{color:var(--slate); font-size:16.5px; line-height:1.7; max-width:640px; margin-top:22px;}

.service-detail-section{background:var(--paper); padding:20px 0 30px;}
.service-detail{
  padding:70px 0; border-bottom:1px solid var(--paper-dim);
  display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:start;
}
.service-detail:last-child{border-bottom:none;}
.service-detail .eyebrow{color:var(--navy-base);}
.service-detail h2{font-size:clamp(26px,3vw,34px); color:var(--ink); margin-top:12px; line-height:1.15;}
.service-detail .tagline{font-size:17px; color:var(--ink); font-weight:600; margin-top:14px;}
.service-detail .desc{font-size:15.5px; color:var(--ink-soft); line-height:1.75; margin-top:14px;}
.service-stat{
  margin-top:24px; padding:16px 20px; border:1px solid var(--paper-dim); border-radius:var(--radius);
  background:rgba(179,60,48,0.04); font-size:14.5px; color:var(--ink); line-height:1.6;
}
.included-box{
  border:1px solid var(--paper-dim); border-radius:var(--radius); padding:32px 34px;
  background:#fff;
}
.included-box h4{
  font-family:'IBM Plex Mono',monospace; font-size:12px; letter-spacing:0.1em; text-transform:uppercase;
  color:var(--red); margin-bottom:18px;
}
.included-list{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:14px;}
.included-list li{
  display:flex; align-items:flex-start; gap:10px; font-size:14.5px; color:var(--ink-soft); line-height:1.5;
}
.included-list li svg{flex-shrink:0; width:16px; height:16px; margin-top:2px; color:var(--red);}

.services-cta{
  background:linear-gradient(120deg, var(--navy-base), var(--navy-mid));
  padding:80px 0; text-align:center;
}
.services-cta p.eyebrow{color:var(--red-soft);}
.services-cta h2{color:var(--paper); font-size:clamp(24px,3.2vw,34px); margin-top:14px;}
.services-cta p.sub{color:var(--slate); font-size:15.5px; margin:16px auto 0; max-width:500px; line-height:1.7;}
.services-cta .hero-ctas{justify-content:center; margin-top:30px;}

/* ================= ABOUT PAGE ================= */
.about-section{background:var(--paper); padding:100px 0;}
.about-section.alt{background:#fff;}
.about-section .section-head{max-width:680px; margin:0 auto 56px; text-align:center;}
.about-section .section-head .eyebrow{color:var(--navy-base);}

.founder-card{
  display:grid; grid-template-columns:220px 1fr; gap:40px; align-items:start;
  padding:44px 0; border-bottom:1px solid var(--paper-dim);
}
.founder-card:last-of-type{border-bottom:none;}
.founder-avatar{
  width:220px; height:220px; border-radius:50%;
  background:linear-gradient(140deg, var(--navy-base), var(--navy-deep));
  display:flex; align-items:center; justify-content:center;
  font-family:'Big Shoulders Inline',sans-serif; font-size:64px; color:var(--red-soft);
  border:2px solid var(--red);
}
.founder-name{font-size:24px; color:var(--ink);}
.founder-role{
  font-family:'IBM Plex Mono',monospace; font-size:12px; letter-spacing:0.08em; text-transform:uppercase;
  color:var(--red); margin-top:6px;
}
.founder-tag{font-size:13px; color:var(--ink-soft); margin-top:2px; font-style:italic;}
.founder-bio{font-size:15px; color:var(--ink-soft); line-height:1.75; margin-top:18px;}
.founder-quote{
  margin-top:22px; padding:20px 24px; border-left:3px solid var(--red);
  background:rgba(179,60,48,0.04); font-size:15px; color:var(--ink); font-style:italic; line-height:1.7;
}
.founder-quote cite{display:block; margin-top:10px; font-style:normal; font-size:13px; color:var(--ink-soft);}
.founder-linkedin{
  display:inline-flex; align-items:center; gap:6px; margin-top:18px;
  font-size:13.5px; font-weight:600; color:var(--navy-base);
}
.founder-linkedin:hover{color:var(--red);}
.founder-stats{display:flex; gap:32px; margin-top:22px; flex-wrap:wrap;}
.founder-stats .stat-mini .num{
  font-family:'Big Shoulders Inline',sans-serif; font-size:32px; color:var(--red);
}
.founder-stats .stat-mini .label{font-size:12.5px; color:var(--ink-soft); margin-top:2px;}

.co-message{
  max-width:720px; margin:70px auto 0; padding:40px 44px;
  background:var(--navy-deep); border-radius:var(--radius); color:var(--paper);
}
.co-message .eyebrow{color:var(--red-soft);}
.co-message p{font-size:15px; color:var(--slate); line-height:1.75; margin-top:16px;}
.co-message blockquote{
  margin:20px 0 0; padding-left:18px; border-left:3px solid var(--red);
  font-size:16px; font-style:italic; color:var(--paper); line-height:1.7;
}
.co-message blockquote cite{display:block; margin-top:8px; font-style:normal; font-size:13px; color:var(--slate);}

.expertise-title{
  text-align:center; margin-top:70px; font-family:'IBM Plex Mono',monospace;
  font-size:12px; letter-spacing:0.1em; text-transform:uppercase; color:var(--red);
}
.expertise-chips{
  display:flex; flex-wrap:wrap; justify-content:center; gap:10px; margin-top:20px; max-width:820px;
  margin-left:auto; margin-right:auto;
}
.expertise-chip{
  font-size:13.5px; padding:9px 18px; border-radius:24px; border:1px solid var(--paper-dim);
  color:var(--ink); background:#fff;
}

.story-text{max-width:760px; margin:0 auto; text-align:left;}
.story-text p{font-size:15.5px; color:var(--ink-soft); line-height:1.8; margin-top:18px;}
.story-text p:first-child{margin-top:0;}

.about-cta{
  background:linear-gradient(120deg, var(--navy-base), var(--navy-mid));
  padding:90px 0; text-align:center;
}
.about-cta .eyebrow{color:var(--red-soft);}
.about-cta h2{color:var(--paper); font-size:clamp(26px,3.4vw,38px); margin-top:14px;}
.about-cta p.sub{color:var(--slate); font-size:15.5px; margin:16px auto 0; max-width:480px; line-height:1.7;}
.about-cta .hero-ctas{justify-content:center; margin-top:30px;}

@media (max-width:860px){
  .service-detail{grid-template-columns:1fr;}
  .founder-card{grid-template-columns:1fr; text-align:center;}
  .founder-avatar{margin:0 auto;}
  .founder-stats{justify-content:center;}
  .founder-linkedin{justify-content:center; display:inline-flex;}
}
