/* SafetySync v2 — shared stylesheet */
:root{
  --paper:#fbfbfa;
  --ink:#182448;
  --ink-2:#3b4260;
  --ink-3:#6b7280;
  --rule:#e7e5e0;
  --accent:#182448;
  --accent-2:#c89b3c;
  --accent-3:#ef7a1a;
  --panel:#f3f1ec;
  --radius:14px;
  --maxw:1120px;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;background:var(--paper);color:var(--ink);line-height:1.55;font-size:17px;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 28px}
a{color:var(--ink);text-decoration:none}
a.inline{text-decoration:underline;text-decoration-color:var(--ink-3);text-underline-offset:3px}
a.inline:hover{text-decoration-color:var(--ink)}

/* Header */
.site-head{position:sticky;top:0;z-index:50;background:rgba(251,251,250,.85);backdrop-filter:saturate(140%) blur(8px);border-bottom:1px solid var(--rule)}
.site-head .wrap{display:flex;align-items:center;justify-content:space-between;padding-top:18px;padding-bottom:18px}
.brand{display:inline-flex;align-items:center}
.brand img{height:80px;width:auto;display:block}
.foot-grid .brand img{height:88px}
@media(max-width:600px){.brand img{height:60px}}
nav.primary{display:flex;align-items:center;gap:28px}
nav.primary a{font-size:15px;color:var(--ink-2);font-weight:500}
nav.primary a:hover{color:var(--ink)}
nav.primary a[aria-current="page"]{color:var(--ink);font-weight:600}

/* Buttons */
.btn{display:inline-flex;align-items:center;gap:8px;padding:11px 18px;border-radius:999px;font-weight:600;font-size:15px;border:1px solid var(--ink);background:var(--ink);color:var(--paper);transition:transform .15s ease, background .2s ease}
.btn:hover{transform:translateY(-1px)}
.btn.ghost{background:transparent;color:var(--ink);border-color:var(--ink)}
.btn.ghost:hover{background:var(--ink);color:var(--paper)}
.btn.gold{background:var(--accent-2);border-color:var(--accent-2);color:#1a1200}
.btn.gold:hover{background:#b8872a;border-color:#b8872a}
.btn.talk{color:var(--accent-3)}
.btn.talk:hover{color:var(--accent-3);background:#0f1a38}

/* Hero */
.hero{padding:96px 0 80px}
.hero .wrap{display:grid;grid-template-columns:1.1fr .9fr;gap:56px;align-items:center}
.hero-art{position:relative;aspect-ratio:1/1;max-width:520px;width:100%;margin-left:auto}
.hero-art svg{width:100%;height:100%;display:block}
@media(max-width:900px){.hero .wrap{grid-template-columns:1fr;gap:32px}.hero-art{max-width:420px;margin:0 auto}}
.eyebrow{text-transform:uppercase;letter-spacing:.14em;font-size:12px;font-weight:600;color:var(--ink-3);margin:0 0 20px}
h1.display{font-size:clamp(32px,4.4vw,56px);line-height:1.05;letter-spacing:-.025em;font-weight:700;margin:0 0 28px;max-width:720px;white-space:nowrap;color:var(--accent)}
h1.display em{font-style:normal;color:var(--accent-3)}
@media(max-width:520px){h1.display{white-space:normal;font-size:40px}}
.lede{font-size:20px;line-height:1.5;color:var(--ink-2);max-width:640px;margin:0 0 36px}
.hero-ctas{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:28px}
.hero-mini{display:flex;gap:28px;flex-wrap:wrap;color:var(--ink-3);font-size:14px}
.hero-mini span::before{content:"· ";color:var(--ink-3)}

/* Page-head (for inner pages that don't need big hero art) */
.page-head{padding:72px 0 56px}
.page-head h1{font-size:clamp(28px,3.6vw,46px);line-height:1.1;letter-spacing:-.02em;font-weight:700;margin:0 0 24px;color:var(--accent);max-width:820px}
.page-head h1 em{font-style:normal;color:var(--accent-3)}
.page-head p.lede{font-size:19px;color:var(--ink-2);max-width:720px;margin:0 0 32px}

/* Beat section (two-column emphasis) */
.beat{padding:80px 0;border-top:1px solid var(--rule)}
.beat h2{font-size:clamp(32px,4vw,52px);line-height:1.08;letter-spacing:-.02em;font-weight:700;margin:0 0 22px;max-width:820px}
.beat p{font-size:19px;color:var(--ink-2);max-width:720px;margin:0}
.pair{display:grid;grid-template-columns:1fr 1fr;gap:48px;margin-top:40px}
.pair .cell h3{font-size:22px;margin:0 0 10px;letter-spacing:-.01em}
.pair .cell p{font-size:17px;color:var(--ink-2);margin:0}
@media(max-width:760px){.pair{grid-template-columns:1fr;gap:28px}}

.section-head{max-width:780px;margin-bottom:52px}
.section-head h2{font-size:clamp(32px,4vw,52px);line-height:1.08;letter-spacing:-.02em;font-weight:700;margin:0 0 18px}
.section-head p{font-size:19px;color:var(--ink-2);margin:0}

/* Service cards */
.services{padding:88px 0;border-top:1px solid var(--rule)}
.svc-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}
.svc{background:var(--paper);border:1px solid var(--rule);border-radius:var(--radius);padding:32px 28px;display:flex;flex-direction:column;gap:14px;transition:transform .2s ease, border-color .2s ease}
.svc:hover{transform:translateY(-2px);border-color:#c9c6bf}
.svc.feature{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.svc.feature h3,.svc.feature p,.svc.feature .tag,.svc.feature li{color:var(--paper)}
.svc.feature a.inline{color:var(--accent-2);text-decoration-color:var(--accent-2)}
.svc .tag{font-size:12px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3)}
.svc h3{font-size:24px;margin:0;letter-spacing:-.01em;font-weight:700}
.svc p{color:var(--ink-2);margin:0;font-size:16px}
.svc ul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:8px;font-size:15px;color:var(--ink-2)}
.svc ul li::before{content:"· ";color:var(--ink-3)}
.svc a.inline{align-self:flex-start;margin-top:auto;font-weight:600;font-size:15px}
@media(max-width:800px){.svc-grid{grid-template-columns:1fr}}

/* GUARDIAN callout */
.guardian{padding:88px 0;border-top:1px solid var(--rule);background:var(--panel)}
.guardian-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:56px;align-items:center}
.guardian h2{font-size:clamp(32px,4vw,52px);line-height:1.08;letter-spacing:-.02em;font-weight:700;margin:0 0 18px}
.guardian p.lede{font-size:19px;color:var(--ink-2);margin:0 0 24px}
.guardian .mini{display:flex;flex-direction:column;gap:10px;margin-bottom:28px}
.guardian .mini span{font-size:15px;color:var(--ink-2)}
.guardian .mini span::before{content:"✓ ";color:var(--accent);font-weight:700}
.guardian-card{background:var(--ink);color:var(--paper);border-radius:var(--radius);padding:36px;border:1px solid var(--ink)}
.guardian-card .k{font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--accent-2);margin-bottom:14px}
.guardian-card h3{font-size:28px;margin:0 0 14px;letter-spacing:-.01em;line-height:1.1}
.guardian-card p{color:#dcdfe8;margin:0 0 24px;font-size:16px}
@media(max-width:900px){.guardian-grid{grid-template-columns:1fr;gap:28px}}

/* Numbers strip */
.numbers{background:var(--panel);padding:56px 0;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}
.numbers .grid{display:grid;grid-template-columns:repeat(3,1fr);gap:40px}
.num .k{font-size:clamp(30px,3.4vw,42px);font-weight:700;letter-spacing:-.02em;color:var(--accent);line-height:1.1}
.num .l{font-size:14px;color:var(--ink-2);margin-top:10px;line-height:1.4}
.num .src{font-size:12px;color:var(--ink-3);margin-top:4px}
@media(max-width:760px){.numbers .grid{grid-template-columns:1fr;gap:28px}}

/* Industry page — Deepvine-style deep sections */
.ind-hero{padding:96px 0 72px}
.ind-hero .eyebrow{color:var(--ink-3)}
.ind-hero h1{font-size:clamp(28px,3.6vw,46px);line-height:1.1;letter-spacing:-.02em;font-weight:700;margin:0 0 24px;color:var(--accent);max-width:780px}
.ind-hero .lede{font-size:19px;line-height:1.55;color:var(--ink-2);max-width:720px;margin:0 0 20px}
.ind-pills{display:flex;flex-wrap:wrap;gap:10px;margin:28px 0 32px}
.ind-pill{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border:1px solid var(--rule);border-radius:999px;background:var(--paper);font-size:14px;font-weight:500;color:var(--ink-2)}
.ind-pill::before{content:"✓";color:var(--accent);font-weight:700}
.deep-sec{padding:64px 0;border-top:1px solid var(--rule)}
.deep-sec .wrap{display:grid;grid-template-columns:1fr 1.5fr;gap:48px;align-items:start}
.deep-sec .deep-head{position:sticky;top:120px}
.deep-sec .deep-num{font-size:12px;font-weight:600;color:var(--ink-3);letter-spacing:.14em;margin-bottom:12px;display:block}
.deep-sec .deep-head h3{font-size:clamp(26px,3vw,38px);line-height:1.1;letter-spacing:-.02em;font-weight:700;color:var(--accent);margin:0}
.deep-body{display:flex;flex-direction:column;gap:16px}
.deep-body p{font-size:17px;line-height:1.6;color:var(--ink-2);margin:0}
.deep-body p strong{color:var(--ink);font-weight:600}
.deep-body a.inline{color:var(--accent-3);text-decoration-color:var(--accent-3);font-weight:500}
@media(max-width:900px){
  .deep-sec .wrap{grid-template-columns:1fr;gap:24px}
  .deep-sec .deep-head{position:static}
}

/* Industries */
.industries{padding:88px 0;border-top:1px solid var(--rule)}
.ind-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.ind{background:var(--paper);border:1px solid var(--rule);border-radius:var(--radius);padding:28px;display:flex;flex-direction:column;gap:10px}
.ind h4{font-size:19px;margin:0;letter-spacing:-.01em}
.ind p{font-size:15px;color:var(--ink-2);margin:0;line-height:1.5}
.ind a{font-size:14px;color:var(--ink);font-weight:600;margin-top:6px}
.ind a:hover{color:var(--accent)}
@media(max-width:900px){.ind-grid{grid-template-columns:1fr}}

/* Process steps */
.process{padding:88px 0;border-top:1px solid var(--rule);background:var(--panel)}
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;margin-top:40px}
.step{background:var(--paper);border:1px solid var(--rule);border-radius:var(--radius);padding:28px}
.step .n{font-size:13px;font-weight:700;color:var(--accent-3);letter-spacing:.1em;margin-bottom:14px;display:block}
.step h4{font-size:19px;margin:0 0 8px;letter-spacing:-.01em}
.step p{font-size:15px;color:var(--ink-2);margin:0;line-height:1.5}
@media(max-width:900px){.steps{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.steps{grid-template-columns:1fr}}

/* Credentials */
.creds-sec{padding:96px 0;border-top:1px solid var(--rule);background:var(--ink);color:var(--paper)}
.creds-sec .section-head h2{color:var(--paper)}
.creds-sec .section-head p{color:#a9adbb}
.cred-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:40px}
.cred{border:1px solid #2a3250;border-radius:var(--radius);padding:24px;background:#1a2240}
.cred .k{font-size:12px;font-weight:700;color:var(--accent-3);text-transform:uppercase;letter-spacing:.14em;margin-bottom:10px;display:block}
.cred p{margin:0;color:#dcdfe8;font-size:15px;line-height:1.5}
@media(max-width:900px){.cred-grid{grid-template-columns:1fr}}

/* Prose (article content) */
.prose-sec{padding:72px 0;border-top:1px solid var(--rule)}
.prose-layout{display:grid;grid-template-columns:1.5fr .8fr;gap:56px;align-items:start}
.prose{max-width:720px}
.prose h2{font-size:28px;letter-spacing:-.015em;margin:40px 0 16px;font-weight:700}
.prose h2:first-child{margin-top:0}
.prose p{font-size:17px;color:var(--ink-2);margin:0 0 16px}
.prose ul.check{list-style:none;padding:0;margin:0 0 20px;display:flex;flex-direction:column;gap:14px}
.prose ul.check li{position:relative;padding-left:28px;font-size:16px;color:var(--ink-2);line-height:1.55}
.prose ul.check li::before{content:"✓";position:absolute;left:0;top:0;color:var(--accent);font-weight:700}
.prose ol{padding-left:0;list-style:none;counter-reset:step;display:flex;flex-direction:column;gap:14px;margin:0 0 20px}
.prose ol li{counter-increment:step;position:relative;padding-left:36px;font-size:16px;color:var(--ink-2);line-height:1.55}
.prose ol li::before{content:counter(step,decimal-leading-zero);position:absolute;left:0;top:0;font-weight:700;color:var(--accent-3);font-size:14px;letter-spacing:.05em}
.callout{background:var(--panel);border-left:3px solid var(--accent-3);padding:20px 24px;border-radius:0 var(--radius) var(--radius) 0;margin:24px 0;color:var(--ink-2)}
.callout b{color:var(--ink)}
.tbl{overflow-x:auto;margin:0 0 20px}
.tbl table{width:100%;border-collapse:collapse;border:1px solid var(--rule);border-radius:var(--radius);overflow:hidden}
.tbl th,.tbl td{text-align:left;padding:14px 18px;border-bottom:1px solid var(--rule);font-size:15px}
.tbl th{background:var(--panel);font-weight:600;color:var(--ink)}
.tbl td.num{font-weight:600;color:var(--accent);white-space:nowrap}
.tbl tr:last-child td{border-bottom:0}

/* Aside box */
.aside{position:sticky;top:120px;display:flex;flex-direction:column;gap:16px}
.box{background:var(--panel);border:1px solid var(--rule);border-radius:var(--radius);padding:28px}
.box.navy{background:var(--ink);color:var(--paper)}
.box.navy p,.box.navy a{color:#dcdfe8}
.box.navy a:hover{color:var(--paper)}
.box h3{margin:0 0 10px;font-size:20px;letter-spacing:-.01em;font-weight:700}
.box.navy h3{color:var(--paper)}
.box p{margin:0 0 16px;font-size:15px;color:var(--ink-2);line-height:1.5}
.box .btn{align-self:flex-start}
@media(max-width:900px){.prose-layout{grid-template-columns:1fr}.aside{position:static}}

/* FAQ */
.faq-sec{padding:88px 0;border-top:1px solid var(--rule)}
details{border-top:1px solid var(--rule);padding:22px 0}
details:last-of-type{border-bottom:1px solid var(--rule)}
summary{font-weight:600;font-size:18px;cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;letter-spacing:-.01em}
summary::after{content:"+";font-size:24px;color:var(--ink-3);font-weight:400;transition:transform .2s}
details[open] summary::after{transform:rotate(45deg)}
details p{color:var(--ink-2);font-size:16px;margin:14px 0 0;max-width:800px}

/* Form */
.form{display:flex;flex-direction:column;gap:18px}
.form .grid2{display:grid;grid-template-columns:1fr 1fr;gap:18px}
@media(max-width:600px){.form .grid2{grid-template-columns:1fr}}
.fg{display:flex;flex-direction:column;gap:6px}
.fg label{font-size:14px;font-weight:600;color:var(--ink);letter-spacing:-.005em}
.fg input,.fg select,.fg textarea{
  font-family:inherit;font-size:16px;color:var(--ink);
  background:var(--paper);border:1px solid var(--rule);border-radius:10px;
  padding:12px 14px;transition:border-color .15s ease, box-shadow .15s ease;
  width:100%;
}
.fg textarea{min-height:120px;resize:vertical}
.fg input:focus,.fg select:focus,.fg textarea:focus{
  outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(24,36,72,.1)
}
.hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.form-msg{font-size:14px;color:var(--ink-2);display:inline-flex;align-items:center}
.form-msg.ok{color:#2d7a3e}
.form-msg.err{color:#b5352f}
.form button.btn{align-self:flex-start;cursor:pointer;font-family:inherit}
.form .note{font-size:13px;color:var(--ink-3);margin:0}

/* Final CTA */
.final{padding:96px 0;border-top:1px solid var(--rule)}
.final h2{font-size:clamp(36px,5vw,64px);line-height:1.05;letter-spacing:-.02em;font-weight:800;margin:0 0 20px;max-width:820px;color:var(--accent)}
.final h2 em{font-style:normal;color:var(--accent-3)}
.final p{font-size:19px;color:var(--ink-2);max-width:640px;margin:0 0 32px}

/* Footer */
footer{border-top:1px solid var(--rule);padding:56px 0 32px;background:var(--panel)}
.foot-grid{display:grid;grid-template-columns:1.4fr .8fr .8fr .8fr;gap:40px;margin-bottom:40px}
.foot-grid h5{font-size:13px;text-transform:uppercase;letter-spacing:.12em;color:var(--ink-3);margin:0 0 14px;font-weight:600}
.foot-grid a{display:block;padding:4px 0;font-size:15px;color:var(--ink-2)}
.foot-grid a:hover{color:var(--ink)}
.foot-grid p{font-size:14px;color:var(--ink-2);margin:0 0 8px}
.foot-base{border-top:1px solid var(--rule);padding-top:24px;font-size:13px;color:var(--ink-3);display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}
@media(max-width:800px){.foot-grid{grid-template-columns:1fr 1fr;gap:28px}}
@media(max-width:500px){.foot-grid{grid-template-columns:1fr}}

/* Mobile nav */
@media(max-width:760px){
  nav.primary a:not(.btn){display:none}
  .hero{padding:56px 0 48px}
}