/*
Theme Name: Omnis Site
Theme URI: https://growmybusiness.co.nz/omnis
Author: Grow My Business
Description: Marketing site theme for Omnis — lightweight WordPress fleet management. Block theme, Omnis blue design system.
Version: 0.1.0
Requires at least: 6.1
Tested up to: 7.0
Requires PHP: 7.4
License: GPLv2 or later
Text Domain: omnis-site
*/

:root{
  --blue:#2563EB; --blue-d:#1E3A8A; --blue-l:#EFF6FF; --ink:#0f172a; --muted:#64748b;
  --line:#e5e7eb; --card:#ffffff; --bg:#f8fafc;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;color:var(--ink);background:var(--card);-webkit-font-smoothing:antialiased;line-height:1.5}
a{color:inherit;text-decoration:none}
img{max-width:100%}
.omx-wrap{max-width:1120px;margin:0 auto;padding:0 24px}
.btn{display:inline-flex;align-items:center;gap:8px;border-radius:10px;padding:12px 20px;font-size:15px;font-weight:600;cursor:pointer;border:1px solid transparent;transition:.15s}
.btn-primary{background:var(--blue);color:#fff;box-shadow:0 1px 2px rgba(37,99,235,.35)}
.btn-primary:hover{background:var(--blue-d);color:#fff}
.btn-ghost{background:#fff;color:#374151;border-color:#d1d5db}
.btn-ghost:hover{background:#f8fafc}
.eyebrow{font-size:13px;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:var(--blue)}
h1{font-size:54px;font-weight:800;letter-spacing:-1.5px;line-height:1.05}
h2{font-size:36px;font-weight:800;letter-spacing:-.8px}
.sub{font-size:19px;color:var(--muted);line-height:1.6}

/* Header */
.omx-header{position:sticky;top:0;z-index:20;background:rgba(255,255,255,.85);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.omx-nav{display:flex;align-items:center;gap:14px;padding:14px 0}
.omx-brand{display:flex;align-items:center;gap:10px;font-weight:800;font-size:20px;letter-spacing:-.3px}
.omx-logo{width:34px;height:34px;border-radius:50%;background:var(--blue);display:flex;align-items:center;justify-content:center;color:#fff;font-size:18px;box-shadow:inset 0 0 0 3px #fff,inset 0 0 0 5px var(--blue)}
.omx-links{display:flex;gap:26px;margin-left:30px;font-size:15px;font-weight:600;color:#475467}
.omx-links a:hover{color:var(--blue)}
.omx-navcta{margin-left:auto;display:flex;gap:10px;align-items:center}

/* Hero */
.omx-hero{background:linear-gradient(180deg,#fff 0%,var(--blue-l) 100%);padding:76px 0 60px;text-align:center}
.omx-hero .badge{display:inline-flex;align-items:center;gap:8px;background:#fff;border:1px solid #bfdbfe;color:#1d4ed8;font-size:13px;font-weight:600;padding:6px 14px;border-radius:20px;margin-bottom:22px}
.omx-hero h1{max-width:880px;margin:0 auto}
.omx-hero .sub{max-width:620px;margin:20px auto 0}
.omx-herocta{display:flex;gap:12px;justify-content:center;margin-top:30px;flex-wrap:wrap}
.omx-heronote{margin-top:14px;font-size:13px;color:#94a3b8}

/* Product shot */
.shot{max-width:980px;margin:48px auto 0;border-radius:16px;border:1px solid var(--line);background:#fff;box-shadow:0 24px 60px -20px rgba(30,58,138,.35);overflow:hidden}
.shot-bar{height:38px;background:#f1f5f9;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:7px;padding:0 14px}
.shot-bar i{width:11px;height:11px;border-radius:50%;background:#cbd5e1;display:inline-block}
.shot-body{padding:18px;background:#f8fafc}
.shot-stats{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-bottom:14px}
.st{background:#fff;border:1px solid var(--line);border-radius:10px;padding:12px 14px;text-align:left}
.st .l{font-size:11px;font-weight:600;color:var(--muted);display:flex;align-items:center;gap:6px}
.st .l::before{content:"";width:7px;height:7px;border-radius:50%;background:#94a3b8}
.st .n{font-size:24px;font-weight:800;margin-top:4px}
.st.up .l{color:#15803d} .st.up .l::before{background:#16a34a}
.st.down .l{color:#b42318} .st.down .l::before{background:#dc2626} .st.down .n{color:#b42318}
.st.info .l{color:#175cd3} .st.info .l::before{background:var(--blue)}
.st.warn .l{color:#b54708} .st.warn .l::before{background:#f59e0b}
.shot-list{background:#fff;border:1px solid var(--line);border-radius:10px;overflow:hidden}
.lrow{display:grid;grid-template-columns:1.6fr 90px 90px 110px;gap:10px;align-items:center;padding:11px 14px;border-bottom:1px solid #f1f5f9;border-left:4px solid #22c55e;font-size:13px}
.lrow:last-child{border-bottom:none}
.lrow.amber{border-left-color:#f59e0b} .lrow.red{border-left-color:#dc2626}
.lname{font-weight:700;color:var(--ink)} .lurl{font-size:11px;color:#94a3b8}
.pill{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:700;padding:2px 9px;border-radius:20px;border:1px solid #abefc6;background:#ecfdf3;color:#067647}
.pill::before{content:"";width:6px;height:6px;border-radius:50%;background:#16a34a}
.pill.down{border-color:#fecdca;background:#fef3f2;color:#b42318} .pill.down::before{background:#dc2626}
.tag{font-size:10px;font-weight:700;padding:1px 7px;border-radius:5px;border:1px solid #fedf89;background:#fffaeb;color:#b54708}
.tag.red{border-color:#fecdca;background:#fef3f2;color:#b42318}

/* Trust */
.omx-trust{padding:34px 0;border-bottom:1px solid var(--line)}
.omx-trust p{text-align:center;color:#94a3b8;font-size:13px;font-weight:600;letter-spacing:.5px;text-transform:uppercase;margin:0}

/* Sections */
.pad{padding:80px 0}
.center{text-align:center;max-width:680px;margin:0 auto 50px}
.center h2{margin-top:10px} .center .sub{margin-top:14px}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.feat{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:26px;transition:.15s}
.feat:hover{box-shadow:0 12px 30px -12px rgba(16,24,40,.18);transform:translateY(-2px)}
.feat .ico{width:46px;height:46px;border-radius:12px;background:var(--blue-l);color:var(--blue);display:flex;align-items:center;justify-content:center;font-size:22px;margin-bottom:16px}
.feat h3{font-size:18px;font-weight:700;margin:0 0 8px} .feat p{color:var(--muted);font-size:15px;margin:0}

.how{background:var(--bg)}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.step{padding:26px;background:#fff;border:1px solid var(--line);border-radius:14px}
.step .num{width:34px;height:34px;border-radius:50%;background:var(--blue);color:#fff;font-weight:800;display:flex;align-items:center;justify-content:center;margin-bottom:14px}
.step h3{font-size:18px;margin:0 0 6px} .step p{color:var(--muted);font-size:15px;margin:0}

.band{background:linear-gradient(120deg,var(--blue-d),var(--blue));color:#fff;border-radius:20px;padding:48px;display:flex;align-items:center;gap:40px;flex-wrap:wrap}
.band h2{color:#fff;margin:0} .band p{color:rgba(255,255,255,.85);font-size:17px;margin:12px 0 0;max-width:520px}
.band .metrics{display:flex;gap:40px;margin-left:auto}
.metric .big{font-size:42px;font-weight:800} .metric .lbl{color:rgba(255,255,255,.8);font-size:14px}

.prices{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;align-items:stretch}
.price{background:#fff;border:1px solid var(--line);border-radius:16px;padding:30px;display:flex;flex-direction:column}
.price.feature{border-color:var(--blue);box-shadow:0 18px 40px -18px rgba(37,99,235,.45);position:relative}
.price .ribbon{position:absolute;top:-12px;left:50%;transform:translateX(-50%);background:var(--blue);color:#fff;font-size:12px;font-weight:700;padding:4px 12px;border-radius:20px}
.price h3{font-size:18px;font-weight:700;margin:0} .price .amt{font-size:42px;font-weight:800;margin:12px 0 2px}
.price .amt small{font-size:15px;font-weight:600;color:var(--muted)}
.price .who{color:var(--muted);font-size:14px;margin-bottom:18px}
.price ul{list-style:none;margin:0 0 22px;padding:0;display:flex;flex-direction:column;gap:10px}
.price li{font-size:14px;color:#374151;display:flex;gap:9px;align-items:flex-start}
.price li::before{content:"✓";color:var(--blue);font-weight:800}
.price .btn{margin-top:auto;justify-content:center}
.price-note{text-align:center;color:#94a3b8;font-size:13px;margin-top:18px}

.faq{max-width:780px;margin:0 auto;display:flex;flex-direction:column;gap:12px}
.qa{border:1px solid var(--line);border-radius:12px;padding:20px 22px;background:#fff}
.qa h4{font-size:16px;font-weight:700;margin:0 0 6px} .qa p{color:var(--muted);font-size:15px;margin:0}

.cta-box{text-align:center;background:var(--blue-l);border-radius:20px;padding:56px 24px;margin:0 24px}
.cta-box h2{margin:0 0 12px} .cta-box .sub{max-width:520px;margin:0 auto 26px}
.omx-footer{padding:48px 0 40px;border-top:1px solid var(--line);color:var(--muted);font-size:14px}
.foot{display:flex;gap:30px;flex-wrap:wrap;align-items:center}
.foot .omx-brand{font-size:18px}
.foot-links{display:flex;gap:22px;margin-left:auto;flex-wrap:wrap}
.placeholder{outline:1px dashed #f59e0b;outline-offset:3px}

/* Generic page (sub-pages) */
.omx-page{max-width:820px;margin:0 auto;padding:60px 24px}
.omx-page h1{font-size:40px;margin:0 0 18px}
.omx-page h2{font-size:26px;margin:32px 0 12px}
.omx-page p{font-size:17px;color:#374151;line-height:1.7;margin:0 0 16px}

@media(max-width:860px){
  h1{font-size:38px} h2{font-size:28px}
  .omx-links{display:none}
  .grid3,.steps,.prices,.shot-stats{grid-template-columns:1fr}
  .band{flex-direction:column} .band .metrics{margin-left:0}
  .lrow{grid-template-columns:1fr}
}
