/* The Trucker's NP — site styles · Encoded Noire */
:root{
  --ink:#14161A; --ink2:#1c1f25; --orange:#FF6A13; --orange-d:#e85d0a;
  --bone:#F4F1EA; --cream:#FBFAF6; --steel:#2A2E35; --line:#e4dfd3;
  --mute:#7c7f86; --mute-l:#9AA0A8;
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth; -webkit-text-size-adjust:100%;}
body{font-family:'Inter',system-ui,sans-serif; color:var(--ink); background:#fff; line-height:1.5; -webkit-font-smoothing:antialiased; padding-bottom:0;}
a{color:inherit; text-decoration:none;}
img{max-width:100%; display:block;}
.wrap{max-width:1120px; margin:0 auto; padding:0 20px;}
.mono{font-family:'Space Mono',monospace;}
.center{text-align:center;}

/* ---- header / nav ---- */
header{position:sticky; top:0; z-index:60; background:rgba(20,22,26,.97); backdrop-filter:blur(8px); border-bottom:1px solid #24272e;}
.nav{display:flex; align-items:center; gap:14px; padding:11px 20px; max-width:1120px; margin:0 auto;}
.brand{display:flex; align-items:center; gap:11px;}
.brand .wm{font-family:'Archivo'; font-weight:900; font-size:16px; color:var(--bone); line-height:1; letter-spacing:-.2px;}
.brand .wm b{color:var(--orange);}
.navlinks{margin-left:auto; display:flex; gap:22px; align-items:center;}
.navlinks a{font-size:13.5px; font-weight:500; color:#c9cdd3; padding:4px 0; border-bottom:2px solid transparent;}
.navlinks a:hover{color:#fff;}
.navlinks a.active{color:#fff; border-bottom-color:var(--orange);}
.navlinks a.cta{background:var(--orange); color:var(--ink); font-family:'Archivo'; font-weight:800; padding:9px 16px; border-radius:8px; border:none;}
.navlinks a.cta:hover{background:var(--orange-d); color:var(--ink);}
.hamb{display:none; margin-left:auto; width:44px; height:44px; border:1px solid #333842; border-radius:9px; background:transparent; cursor:pointer; align-items:center; justify-content:center; flex-direction:column; gap:4px;}
.hamb span{display:block; width:20px; height:2px; background:var(--bone); border-radius:2px;}
@media(max-width:860px){
  .hamb{display:flex;}
  .navlinks{position:fixed; inset:56px 0 auto 0; margin:0; flex-direction:column; align-items:stretch; gap:0; background:var(--ink); border-bottom:1px solid #24272e; padding:8px 0 14px; transform:translateY(-140%); transition:transform .25s ease; box-shadow:0 20px 40px rgba(0,0,0,.4);}
  .navlinks.open{transform:translateY(0);}
  .navlinks a{padding:14px 22px; font-size:16px; border-bottom:1px solid #22252c;}
  .navlinks a.active{border-bottom-color:#22252c; color:var(--orange);}
  .navlinks a.cta{margin:12px 22px 0; text-align:center; border-radius:9px;}
}

/* ---- buttons ---- */
.btn{display:inline-flex; align-items:center; justify-content:center; gap:8px; font-family:'Archivo'; font-weight:800; font-size:16px; padding:15px 24px; border-radius:10px; min-height:54px; transition:transform .05s ease; cursor:pointer; border:none;}
.btn:active{transform:translateY(1px);}
.btn-p{background:var(--orange); color:var(--ink);}
.btn-p:hover{background:var(--orange-d);}
.btn-g{background:transparent; color:var(--bone); border:1.5px solid #3a3e46;}
.btn-g:hover{border-color:var(--bone);}
.btn-dark{background:var(--ink); color:var(--bone);}
.btnrow{display:flex; flex-wrap:wrap; gap:12px; margin-top:26px;}
@media(max-width:480px){ .btn{width:100%;} }

/* ---- generic sections ---- */
section{padding:56px 0;}
.sec-eye{font-family:'Space Mono'; font-size:11.5px; letter-spacing:2.5px; text-transform:uppercase; color:var(--orange); margin-bottom:12px;}
h1.page{font-family:'Archivo'; font-weight:900; font-size:clamp(30px,5.5vw,50px); line-height:1.02; letter-spacing:-1px;}
h2{font-family:'Archivo'; font-weight:900; font-size:clamp(25px,4.3vw,38px); line-height:1.06; letter-spacing:-.6px;}
h3{font-family:'Archivo'; font-weight:800;}
.sec-lede{font-size:16px; color:#44484f; margin-top:12px; max-width:660px; line-height:1.55;}

/* ---- hero (interior + home) ---- */
.hero{background:radial-gradient(120% 140% at 15% 0%, #23262e 0%, var(--ink) 55%); color:var(--bone); position:relative; overflow:hidden;}
.hero:after{content:""; position:absolute; left:0; right:0; bottom:0; height:6px; background:var(--orange);}
.hero .wrap{padding:56px 20px 60px; position:relative; z-index:1;}
.hero.small .wrap{padding:44px 20px 46px;}
.eyebrow{font-family:'Space Mono'; font-size:12px; letter-spacing:3px; text-transform:uppercase; color:var(--orange); margin-bottom:14px;}
.hero h1{font-family:'Archivo'; font-weight:900; font-size:clamp(34px,7vw,60px); line-height:1.0; letter-spacing:-1.2px;}
.hero h1 span{color:var(--orange);}
.hero p.lede{font-size:clamp(15px,2.4vw,19px); color:#c9cdd3; margin-top:18px; max-width:620px; line-height:1.5;}
.trust{display:flex; flex-wrap:wrap; gap:16px 26px; margin-top:30px; padding-top:24px; border-top:1px solid #2b2f37;}
.trust div{font-size:13px; color:#aeb3ba;}
.trust b{color:var(--bone); font-weight:700; display:block; font-family:'Archivo'; font-size:15px;}

/* ---- cards / grids ---- */
.cream{background:var(--cream); border-top:1px solid var(--line); border-bottom:1px solid var(--line);}
.grid2{display:grid; grid-template-columns:1.1fr .9fr; gap:36px; align-items:center; margin-top:28px;}
.grid3{display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:30px;}
.card{background:#fff; border:1px solid var(--line); border-radius:16px; padding:26px;}
.plist{list-style:none; display:flex; flex-direction:column; gap:12px; margin-top:4px;}
.plist li{position:relative; padding-left:26px; font-size:15px; color:#2b2e34; line-height:1.45;}
.plist li:before{content:""; position:absolute; left:0; top:7px; width:9px; height:9px; background:var(--orange); border-radius:2px;}
.price{font-family:'Archivo'; font-weight:900; font-size:52px; line-height:1; letter-spacing:-2px;}
.price small{font-size:17px; font-weight:600; color:var(--mute); letter-spacing:0;}
.rule{height:4px; width:46px; background:var(--orange); border-radius:2px; margin:14px 0 16px;}

/* nav-card (home routing) */
.navcards{display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:30px;}
.navcard{display:block; background:#fff; border:1px solid var(--line); border-radius:16px; padding:24px; transition:border-color .15s, transform .1s;}
.navcard:hover{border-color:var(--orange); transform:translateY(-2px);}
.navcard .k{font-family:'Space Mono'; font-size:10px; letter-spacing:2px; color:var(--orange);}
.navcard h3{font-size:21px; margin:8px 0 6px;}
.navcard p{font-size:14px; color:#5a5e66; line-height:1.5;}
.navcard .go{display:inline-block; margin-top:14px; font-family:'Archivo'; font-weight:800; font-size:14px; color:var(--orange);}

/* tiers */
.tiers-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:30px;}
.tier{border:1px solid var(--line); border-radius:16px; padding:22px 20px 24px; display:flex; flex-direction:column; background:#fff;}
.tier.feat{background:var(--ink); border-color:var(--ink); color:var(--bone); position:relative;}
.tier .pop{position:absolute; top:-11px; left:20px; background:var(--orange); color:var(--ink); font-family:'Space Mono'; font-size:9px; font-weight:700; letter-spacing:1.5px; padding:4px 10px; border-radius:20px;}
.tier .tn{font-family:'Archivo'; font-weight:900; font-size:20px;}
.tier .tsub{font-family:'Space Mono'; font-size:8.5px; letter-spacing:1.5px; text-transform:uppercase; color:var(--mute); margin-top:4px;}
.tier.feat .tsub{color:var(--mute-l);}
.tier .tp{font-family:'Archivo'; font-weight:900; font-size:38px; margin:12px 0 2px; letter-spacing:-1.5px;}
.tier .tp small{font-size:14px; font-weight:600; color:var(--mute); letter-spacing:0;}
.tier .tp span{color:var(--orange);}
.tier .rule{height:3px; width:38px; margin:10px 0 16px;}
.tier ul{list-style:none; display:flex; flex-direction:column; gap:9px; flex:1;}
.tier li{position:relative; padding-left:20px; font-size:13.5px; line-height:1.35; color:#2b2e34;}
.tier.feat li{color:#e3e0d8;}
.tier li:before{content:""; position:absolute; left:0; top:6px; width:7px; height:7px; background:var(--orange); border-radius:2px;}

/* forms */
.formcard{margin-top:22px; background:var(--cream); border:1px solid var(--line); border-radius:16px; padding:26px; max-width:640px;}
.formcard.center{margin-left:auto; margin-right:auto;}
.frow{display:flex; gap:10px; flex-wrap:wrap;}
.frow input,.frow textarea{flex:1; min-width:150px; font-family:'Inter'; font-size:16px; padding:13px 14px; border:1px solid var(--line); border-radius:10px; background:#fff; min-height:52px;}
.frow textarea{min-height:110px; resize:vertical;}
input:focus,textarea:focus{outline:none; border-color:var(--orange); box-shadow:0 0 0 3px rgba(255,106,19,.14);}
.formcard .btn{width:100%; margin-top:12px;}

/* how steps */
.how{background:var(--ink); color:var(--bone);}
.how h2{color:var(--bone);}
.steps{display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-top:32px;}
.step .n{font-family:'Archivo'; font-weight:900; font-size:16px; color:var(--ink); background:var(--orange); width:38px; height:38px; border-radius:10px; display:flex; align-items:center; justify-content:center; margin-bottom:14px;}
.step h4{font-family:'Archivo'; font-weight:800; font-size:18px; margin-bottom:6px;}
.step p{font-size:14.5px; color:#aeb3ba; line-height:1.5;}

/* app feats */
.feats{display:flex; flex-direction:column; gap:16px; margin-top:22px;}
.feat{display:flex; gap:14px;}
.feat .ic{flex:0 0 auto; width:40px; height:40px; border-radius:10px; background:var(--cream); border:1px solid var(--line); display:flex; align-items:center; justify-content:center; font-family:'Archivo'; font-weight:900; color:var(--orange);}
.feat h4{font-family:'Archivo'; font-weight:800; font-size:16px;}
.feat p{font-size:14px; color:#5a5e66; margin-top:2px; line-height:1.45;}
.darkcard{background:var(--ink); border-radius:20px; padding:30px; color:var(--bone);}
.darkcard .big{font-family:'Archivo'; font-weight:900; font-size:24px; line-height:1.1;}
.darkcard .big span{color:var(--orange);}
.darkcard p{color:#aeb3ba; font-size:14px; margin-top:12px; line-height:1.5;}
.darkcard .tag{display:inline-block; margin-top:16px; font-family:'Space Mono'; font-size:10px; letter-spacing:1.5px; color:var(--orange); border:1px solid #33373e; border-radius:20px; padding:6px 12px;}

/* about */
.bio{display:grid; grid-template-columns:.8fr 1.2fr; gap:36px; align-items:start; margin-top:8px;}
.bio .photo{border-radius:18px; overflow:hidden; border:1px solid var(--line); background:var(--cream);}
.bio .photo img{width:100%; height:100%; object-fit:cover;}
.bio p{font-size:15.5px; color:#33373d; line-height:1.65; margin-top:14px;}
.credlist{list-style:none; display:flex; flex-direction:column; gap:10px; margin-top:18px;}
.credlist li{position:relative; padding-left:24px; font-size:15px; color:#2b2e34;}
.credlist li:before{content:"✓"; position:absolute; left:0; color:var(--orange); font-weight:800;}
.award{background:var(--cream); border:1px solid var(--line); border-left:4px solid var(--orange); border-radius:12px; padding:20px 22px; margin-top:24px;}
.award .k{font-family:'Space Mono'; font-size:10px; letter-spacing:2px; color:var(--orange);}
.award h3{font-size:19px; margin:6px 0 8px;}
.award p{font-size:14.5px; color:#44484f; line-height:1.55;}
.quote{background:var(--ink); color:var(--bone); border-radius:16px; padding:28px; margin-top:24px;}
.quote p{font-size:17px; line-height:1.55; font-style:italic; color:var(--bone);}
.quote .who{font-family:'Space Mono'; font-size:11px; letter-spacing:1.5px; color:var(--orange); margin-top:14px; font-style:normal;}

/* CTA band */
.band{background:var(--orange); color:var(--ink); text-align:center;}
.band h2{color:var(--ink);}
.band p{font-size:16px; margin-top:10px; color:#3a2410;}
.band .btnrow{justify-content:center;}
.band .btn-p{background:var(--ink); color:var(--bone);}
.band .btn-g{border-color:rgba(20,22,26,.35); color:var(--ink);}

/* footer */
footer{background:var(--ink); color:#9AA0A8; padding:44px 0 30px;}
.fg{display:flex; flex-wrap:wrap; gap:26px; justify-content:space-between; align-items:flex-start;}
footer .wm{font-family:'Archivo'; font-weight:900; font-size:18px; color:var(--bone);}
footer .wm b{color:var(--orange);}
footer .fcol .k{font-family:'Space Mono'; font-size:10px; letter-spacing:2px; color:#6b7079;}
footer .fcol a{display:block; font-size:14px; color:#aeb3ba; margin-top:8px;}
footer .fcol a:hover{color:#fff;}
footer .disc{margin-top:26px; padding-top:20px; border-top:1px solid #262a31; font-family:'Space Mono'; font-size:10.5px; line-height:1.7; color:#6b7079;}
footer .disc b{color:#aeb3ba;}

/* sticky mobile call bar */
.callbar{position:fixed; bottom:0; left:0; right:0; z-index:55; display:none; background:var(--ink); border-top:1px solid #2b2f37;}
.callbar a{flex:1; text-align:center; padding:15px 8px; font-family:'Archivo'; font-weight:800; font-size:15px; color:var(--bone);}
.callbar a.book{background:var(--orange); color:var(--ink);}
@media(max-width:860px){ .callbar{display:flex;} body{padding-bottom:58px;} }

/* responsive */
@media(max-width:900px){
  .grid2,.navcards,.grid3,.tiers-grid,.steps,.bio,.agrid{grid-template-columns:1fr !important;}
}
@media(max-width:480px){
  section{padding:44px 0;}
  .card,.formcard,.darkcard{padding:20px;}
  .hero .wrap{padding:40px 18px 44px;}
}

/* testimonials */
.tgrid{display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:30px;}
.tcard{background:#fff; border:1px solid var(--line); border-radius:16px; padding:24px; display:flex; flex-direction:column;}
.tcard .stars{color:var(--orange); font-size:14px; letter-spacing:2px; margin-bottom:12px;}
.tcard p{font-size:15px; line-height:1.55; color:#2b2e34; flex:1;}
.tcard .who{margin-top:16px; padding-top:14px; border-top:1px solid var(--line);}
.tcard .who b{font-family:'Archivo'; font-weight:800; font-size:15px; display:block;}
.tcard .who span{font-family:'Space Mono'; font-size:10px; letter-spacing:1px; text-transform:uppercase; color:var(--mute);}

/* partner (DCI insurance — separate track) */
.partner{background:var(--steel); color:var(--bone);}
.partner h2{color:var(--bone);}
.partner .sec-lede{color:#c9cdd3;}
.partner .peye{font-family:'Space Mono'; font-size:11px; letter-spacing:2.5px; text-transform:uppercase; color:var(--orange); margin-bottom:12px;}
.partner .sep{display:inline-block; font-family:'Space Mono'; font-size:10px; letter-spacing:1.5px; color:var(--mute-l); border:1px solid #444a54; border-radius:20px; padding:5px 11px; margin-top:22px;}
