/* SkilledTradesAI v1 — brand: navy #042C53 / mid #185FA5 / light #E6F1FB / amber #EF9F27 */
:root{--navy:#042C53;--mid:#185FA5;--light:#E6F1FB;--amber:#EF9F27;--ink:#12202f;--white:#fff;--gray:#5b6b7b;--line:#d5e2ef;--radius:10px;}
*{margin:0;padding:0;box-sizing:border-box;}
body{font-family:'Segoe UI',system-ui,-apple-system,Arial,sans-serif;color:var(--ink);background:var(--white);line-height:1.55;}
a{color:var(--mid);text-decoration:none;}
.container{max-width:1080px;margin:0 auto;padding:0 20px;}

/* NAV — dark bg, use logo-white.svg per house rule */
.stai-nav{background:var(--navy);position:sticky;top:0;z-index:100;}
.stai-nav-inner{max-width:1080px;margin:0 auto;padding:12px 20px;display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;}
.stai-brand{display:flex;align-items:center;gap:10px;color:#fff;font-weight:800;font-size:1.15rem;letter-spacing:.2px;}
.stai-brand img{height:34px;display:block;}
.stai-links{display:flex;gap:18px;align-items:center;flex-wrap:wrap;}
.stai-links a{color:#dce9f7;font-weight:600;font-size:.95rem;}
.stai-links a.active,.stai-links a:hover{color:var(--amber);}
.stai-authbox{display:flex;gap:10px;align-items:center;}
.stai-btn{display:inline-block;padding:10px 18px;border-radius:var(--radius);font-weight:700;border:0;cursor:pointer;font-size:.95rem;}
.stai-btn-amber{background:var(--amber);color:var(--navy);}
.stai-btn-amber:hover{background:#f7b350;}
.stai-btn-outline-w{background:transparent;color:#fff;border:2px solid #ffffff88;}
.stai-btn-outline-w:hover{border-color:#fff;}
.stai-btn-navy{background:var(--navy);color:#fff;}
.stai-btn-ghost{background:var(--light);color:var(--navy);}
.stai-userchip{color:#fff;font-weight:600;font-size:.9rem;background:#ffffff22;padding:8px 14px;border-radius:var(--radius);}

/* HERO */
.stai-hero{background:linear-gradient(160deg,var(--navy) 0%,var(--mid) 100%);color:#fff;padding:64px 0 56px;}
.stai-hero h1{font-size:2.3rem;line-height:1.2;max-width:720px;}
.stai-hero p.lead{margin-top:14px;font-size:1.15rem;color:#dce9f7;max-width:640px;}
.stai-hero .cta-row{margin-top:26px;display:flex;gap:12px;flex-wrap:wrap;}

/* CARDS */
.stai-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:20px;margin:36px 0;}
.stai-card{border:1px solid var(--line);border-radius:var(--radius);padding:24px;background:#fff;}
.stai-card h3{color:var(--navy);margin-bottom:8px;font-size:1.1rem;}
.stai-card p{color:var(--gray);font-size:.95rem;}
.stai-card .go{display:inline-block;margin-top:14px;font-weight:700;}

/* TOOL PANELS */
.stai-tool{max-width:820px;margin:36px auto;padding:0 20px;}
.stai-panel{border:1px solid var(--line);border-radius:var(--radius);padding:26px;background:#fff;}
.stai-panel h2{color:var(--navy);margin-bottom:6px;}
.stai-panel .sub{color:var(--gray);margin-bottom:18px;font-size:.95rem;}
label.stai-label{display:block;font-weight:700;color:var(--navy);margin:14px 0 6px;font-size:.92rem;}
textarea.stai-input,input.stai-input,select.stai-input{width:100%;padding:12px;border:1px solid var(--line);border-radius:8px;font-size:1rem;font-family:inherit;background:#fbfdff;}
textarea.stai-input{min-height:110px;resize:vertical;}
.stai-drop{border:2px dashed var(--mid);border-radius:var(--radius);background:var(--light);padding:26px;text-align:center;color:var(--navy);cursor:pointer;font-weight:600;}
.stai-drop.hasfile{border-style:solid;background:#eef7ee;border-color:#2e7d32;}
.stai-result{margin-top:22px;border-left:4px solid var(--amber);background:#fffdf7;padding:18px;border-radius:0 8px 8px 0;white-space:pre-wrap;font-size:.97rem;display:none;}
.stai-spin{display:none;margin-top:16px;color:var(--mid);font-weight:700;}
.stai-disclaimer{margin-top:16px;background:var(--light);border:1px solid var(--line);border-radius:8px;padding:12px 14px;font-size:.85rem;color:var(--navy);}
.stai-disclaimer strong{color:#a34700;}

/* TOGGLES */
.stai-toggle-row{display:flex;gap:10px;flex-wrap:wrap;margin:10px 0 4px;}
.stai-toggle{padding:9px 16px;border-radius:20px;border:2px solid var(--mid);color:var(--mid);font-weight:700;background:#fff;cursor:pointer;font-size:.9rem;}
.stai-toggle.on{background:var(--mid);color:#fff;}

/* PRICING */
.stai-tiers{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:22px;margin:36px 0;}
.stai-tier{border:1px solid var(--line);border-radius:var(--radius);padding:28px;text-align:center;}
.stai-tier.featured{border:3px solid var(--amber);position:relative;}
.stai-tier .price{font-size:2.1rem;font-weight:800;color:var(--navy);margin:10px 0;}
.stai-tier ul{list-style:none;margin:16px 0;text-align:left;}
.stai-tier li{padding:6px 0;color:var(--gray);font-size:.93rem;border-bottom:1px solid var(--light);}

/* SECTIONS */
.stai-section{padding:48px 0;}
.stai-section.alt{background:var(--light);}
.stai-section h2{color:var(--navy);font-size:1.7rem;margin-bottom:8px;}
.stai-section .sub{color:var(--gray);max-width:640px;}

/* MODAL (auth nudge) */
.stai-modal-bg{display:none;position:fixed;inset:0;background:#04162acc;z-index:200;align-items:center;justify-content:center;padding:20px;}
.stai-modal{background:#fff;border-radius:var(--radius);max-width:420px;width:100%;padding:28px;}
.stai-modal h3{color:var(--navy);margin-bottom:8px;}
.stai-modal p{color:var(--gray);font-size:.95rem;margin-bottom:16px;}
.stai-modal .row{display:flex;gap:10px;margin-top:8px;flex-wrap:wrap;}

/* FOOTER */
.stai-footer{background:var(--navy);color:#b8cde2;padding:36px 0;margin-top:56px;font-size:.9rem;}
.stai-footer a{color:#dce9f7;}
.stai-footer .cols{display:flex;gap:40px;flex-wrap:wrap;justify-content:space-between;max-width:1080px;margin:0 auto;padding:0 20px;}

@media(max-width:600px){
  .stai-hero h1{font-size:1.7rem;}
  .stai-nav-inner{justify-content:center;}
}
