/* OffGridBuddy Homepage 1.1.0 — self-contained, responsive, no external font requests. */
.ogb-home { --ogb-accent:#64e9be; --ogb-bg:#061725; --ogb-ink:#f4fbff; --ogb-muted:#b7ccd8; --ogb-line:#315265; font-family:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif; color:var(--ogb-ink); background:radial-gradient(ellipse 74% 450px at 70% 20px,#17435a99,transparent 68%),linear-gradient(180deg,#08283a 0%,#071b2b 38%,#061725 100%); font-size:17px; line-height:1.55; isolation:isolate; min-height:100vh; }
.ogb-home,.ogb-home * { box-sizing:border-box; }
.ogb-home a { color:inherit; text-decoration:none; }
.ogb-home a:hover { text-decoration:none; }
.ogb-home a:focus-visible,.ogb-home button:focus-visible,.ogb-home summary:focus-visible { outline:3px solid var(--ogb-accent); outline-offset:4px; }
.ogb-home p,.ogb-home h1,.ogb-home h2,.ogb-home h3 { margin-top:0; }
.ogb-home .ogb-container { width:min(1120px,calc(100% - 36px)); margin-inline:auto; }
.ogb-home .ogb-icon { width:24px; height:24px; flex-shrink:0; }
.ogb-skip { position:absolute; left:12px; top:-90px; padding:12px 15px; background:#fff; color:#152b3a!important; z-index:100; border-radius:8px; }
.ogb-skip:focus { top:12px; }
.ogb-home .ogb-header { border-bottom:1px solid #ffffff19; background:#061a2bcf; }
.ogb-home .ogb-headline { min-height:76px; display:flex; justify-content:space-between; align-items:center; gap:20px; }
.ogb-home .ogb-brand { display:inline-flex; align-items:center; gap:11px; font-size:clamp(22px,2.4vw,28px); font-weight:800; letter-spacing:-.9px; line-height:1.15; }
.ogb-home .ogb-brand-label {display:flex; flex-direction:column; gap:2px;}
.ogb-home .ogb-brand-label small {font-size:11px; letter-spacing:0; font-weight:500;color:#a6c7d1;}
.ogb-home .ogb-brand-icon { background:#153d4e; color:var(--ogb-accent); border-radius:13px; width:46px; height:46px; display:grid; place-items:center; }
.ogb-home .ogb-brand-icon .ogb-icon { height:31px;width:31px; }
.ogb-home .ogb-logo-media { display:grid; place-items:center; width:48px; height:48px; }
.ogb-home .ogb-logo-media img { width:100%;height:100%;object-fit:contain; }
.ogb-home .ogb-top-links { display:flex; align-items:center; gap:28px; font-size:14px; font-weight:650; }
.ogb-home .ogb-top-links a:hover { color:var(--ogb-accent); }
.ogb-home .ogb-top-links .ogb-small-demo { padding:10px 16px; border-radius:11px; background:#173a49; border:1px solid #478678; color:var(--ogb-accent); }
.ogb-home .ogb-hero { padding-block:clamp(42px,7vw,85px) 64px; display:grid; grid-template-columns:minmax(0,1fr) minmax(330px,.82fr); gap:clamp(32px,4vw,72px); align-items:center; }
.ogb-home .ogb-eyebrow { color:var(--ogb-accent); font-size:13px; font-weight:800; letter-spacing:1.4px; text-transform:uppercase; margin-bottom:16px; }
.ogb-home .ogb-hero h1 { font-size:clamp(40px,5.5vw,70px); line-height:1.07; letter-spacing:-2.7px; font-weight:850; margin:0 0 24px; max-width:690px; text-wrap:balance; }
.ogb-home .ogb-lead { font-size:clamp(19px,2.1vw,23px); line-height:1.5; color:#e3f0f5; margin-bottom:25px; max-width:570px; }
.ogb-home .ogb-compatline { display:flex; align-items:flex-start; gap:12px; color:#b6d6d9; font-size:15px; margin-bottom:25px; max-width:535px; }
.ogb-home .ogb-compatline .ogb-icon { color:var(--ogb-accent); margin-top:1px; width:21px; height:21px; }
.ogb-home .ogb-actions { display:flex; flex-wrap:wrap; gap:11px; margin-bottom:16px; }
.ogb-home .ogb-btn { display:inline-flex; align-items:center; justify-content:center; gap:12px; min-height:54px; border-radius:13px; padding:13px 21px; font-weight:800; font-size:16px; line-height:1.3; text-align:center; transition:background .2s,box-shadow .2s,transform .2s; }
.ogb-home .ogb-btn:not(.ogb-btn-disabled):hover { transform:translateY(-2px); }
.ogb-home .ogb-btn-primary { background:var(--ogb-accent); color:#082e30!important; box-shadow:0 10px 28px #031d1e56; }
.ogb-home .ogb-btn-primary:hover { background:#a4f9dd; box-shadow:0 12px 30px #0005; }
.ogb-home .ogb-btn-ghost { background:#142e40; border:1px solid #4d928b; color:var(--ogb-ink)!important; }
.ogb-home .ogb-btn-ghost:hover { background:#205063; }
.ogb-home .ogb-btn-disabled { border:1px solid #537280; background:#142b3b; color:#c8d7df; cursor:default; }
.ogb-home .ogb-android { display:flex; align-items:center; gap:10px; color:var(--ogb-accent); font-size:14px; font-weight:700; margin:10px 0 16px; }
.ogb-home .ogb-android .ogb-icon { width:18px;height:18px; }
.ogb-home .ogb-hero-note { color:#9fbac7; font-size:13px; max-width:470px; margin:13px 0 0; }
.ogb-home .ogb-hero-preview { position:relative; min-width:0; }
.ogb-home .ogb-screen { width:min(100%,425px); margin-inline:auto; background:linear-gradient(155deg,#102b3e,#071725); border:8px solid #223d4f; border-radius:29px; box-shadow:0 0 0 2px #6d8796,0 22px 55px #0007,0 0 60px #3fa78c25; padding:18px 15px 18px; }
.ogb-home .ogb-screen-top { display:flex;justify-content:space-between;align-items:center; gap:10px; padding:0 3px 16px; }
.ogb-home .ogb-screen-brand { display:inline-flex;align-items:center;gap:7px;font-size:17px; font-weight:800; }
.ogb-home .ogb-screen-brand .ogb-icon { color:var(--ogb-accent); width:23px; height:23px; }
.ogb-home .ogb-screen-dot { width:10px; height:10px; border-radius:50%; background:var(--ogb-accent); box-shadow:0 0 0 5px #64e9be21; }
.ogb-home .ogb-screen-inner { border-radius:18px; background:#153348; padding:18px 15px; border:1px solid #376178; }
.ogb-home .ogb-preview-heading { display:flex;align-items:center;gap:7px;font-size:14px;font-weight:750;margin-bottom:8px; }
.ogb-home .ogb-preview-heading .ogb-icon { color:var(--ogb-accent);width:18px;height:18px; }
.ogb-home .ogb-meter { display:block; width:100%; max-width:350px; margin:0 auto; }
.ogb-home .ogb-meter-value { width:max-content;margin:-7px auto 17px;position:relative;background:#071f2a;border:1px solid #76b7bd;color:#f4fbff;padding:5px 13px;border-radius:8px;font-size:25px;font-weight:850;line-height:1; }
.ogb-home .ogb-meter-value span { font-size:15px;font-weight:650;color:#b9e9d9; }
.ogb-home .ogb-preview-power { display:flex;align-items:center;justify-content:space-between;gap:9px;font-size:14px; }
.ogb-home .ogb-preview-power>span { display:flex;align-items:center;gap:8px; }
.ogb-home .ogb-preview-power .ogb-icon { color:var(--ogb-accent);width:19px;height:19px; }
.ogb-home .ogb-preview-power strong {font-size:32px;letter-spacing:-1.2px;white-space:nowrap; }
.ogb-home .ogb-preview-bars {display:flex;align-items:end;gap:7px;height:24px;margin-left:auto;justify-content:flex-end;}
.ogb-home .ogb-preview-bars i {width:10px;border-radius:3px 3px 1px 1px;background:var(--ogb-accent);}
.ogb-home .ogb-preview-caption {font-size:12px;text-align:center;color:#afc6ce;margin:13px 0 0;}
.ogb-home .ogb-uploaded-preview { border:1px solid #527587;border-radius:20px;padding:10px;background:#132b3a;box-shadow:0 20px 55px #0005;}
.ogb-home .ogb-uploaded-preview img { width:100%;height:auto;display:block;border-radius:12px; }
.ogb-home .ogb-section { padding-top:clamp(47px,7vw,83px); scroll-margin-top:18px; }
.ogb-home .ogb-section-head {max-width:760px;margin-bottom:26px;}
.ogb-home .ogb-section h2,.ogb-home .ogb-closing h2 {font-size:clamp(29px,3.5vw,43px);letter-spacing:-1.25px;line-height:1.15;font-weight:850;max-width:740px;margin-bottom:12px;}
.ogb-home .ogb-section-head p,.ogb-home .ogb-closing p {color:var(--ogb-muted);font-size:18px;margin-bottom:0;}
.ogb-home .ogb-feature-grid {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px;}
.ogb-home .ogb-feature {display:flex;align-items:flex-start;gap:18px;background:linear-gradient(140deg,#12384a 0%,#10293b 80%);border:1px solid #376071;border-radius:18px;padding:24px;min-width:0;}
.ogb-home .ogb-feature-icon {display:grid;place-items:center;flex:0 0 52px;width:52px;height:52px;border-radius:14px;background:#1d564e;color:var(--ogb-accent);}
.ogb-home .ogb-feature-icon .ogb-icon {width:28px;height:28px;}
.ogb-home .ogb-feature h3,.ogb-home .ogb-compat-item h3,.ogb-home .ogb-step h3 {font-size:19px;line-height:1.35;font-weight:800;margin:0 0 6px;letter-spacing:-.3px;}
.ogb-home .ogb-feature p,.ogb-home .ogb-compat-item p,.ogb-home .ogb-step p {color:#c3d3dd;font-size:15px;margin:0;line-height:1.5;}
.ogb-home .ogb-compat-grid {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px;}
.ogb-home .ogb-compat-item {border:1px solid #416576;border-radius:18px;background:linear-gradient(160deg,#143347,#102637);padding:23px;display:flex;align-items:center;gap:22px;min-width:0;}
.ogb-home .ogb-compat-icon {border-radius:17px;background:#154e55;color:var(--ogb-accent);width:86px;height:88px;flex:0 0 86px;display:grid;place-items:center;}
.ogb-home .ogb-compat-icon .ogb-icon {width:42px;height:42px;}
.ogb-home .ogb-device-image {flex:0 0 110px;width:110px;height:104px;display:grid;place-items:center;border-radius:13px;background:#e1eff22b;overflow:hidden;}
.ogb-home .ogb-device-image img {display:block;width:100%;height:100%;object-fit:contain;}
.ogb-home .ogb-steps {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;}
.ogb-home .ogb-step {display:flex;align-items:flex-start;gap:13px;padding:21px 18px;border:1px solid #416377;border-radius:16px;background:#122f41;min-width:0;}
.ogb-home .ogb-step-num {width:39px;height:39px;flex:0 0 39px;display:grid;place-items:center;border-radius:50%;background:var(--ogb-accent);color:#092b32;font-size:20px;font-weight:850;}
.ogb-home .ogb-faqs {display:grid;gap:11px;max-width:880px;}
.ogb-home .ogb-faq {border:1px solid #3d6573;border-radius:14px;background:#102e40;overflow:hidden;}
.ogb-home .ogb-faq summary {cursor:pointer;list-style:none;display:flex;align-items:center;justify-content:space-between;gap:18px;padding:18px 21px;font-size:17px;font-weight:720;}
.ogb-home .ogb-faq summary::-webkit-details-marker {display:none;}
.ogb-home .ogb-faq summary:after {content:'+';font-size:28px;font-weight:300;color:var(--ogb-accent);line-height:1;}
.ogb-home .ogb-faq[open] summary:after {content:'−';}
.ogb-home .ogb-faq p {margin:0;padding:0 21px 20px;color:#cfdee5;font-size:15px;line-height:1.6;max-width:770px;}
.ogb-home .ogb-closing {margin-top:80px;text-align:center;border:1px solid #37697a;background:linear-gradient(160deg,#17495b,#113144);padding:40px 26px;border-radius:22px;}
.ogb-home .ogb-closing h2 {margin-inline:auto;}
.ogb-home .ogb-closing p {margin-bottom:24px;}
.ogb-home .ogb-footer {border-top:1px solid #2f5365;margin-top:70px;padding:50px 0 36px;background:#041421;}
.ogb-home .ogb-footer .ogb-container {display:flex;flex-direction:column;align-items:center;text-align:center;gap:10px;}
.ogb-home .ogb-footer-brand {display:flex;align-items:center;gap:9px;font-size:25px;font-weight:850;letter-spacing:-.7px;}
.ogb-home .ogb-footer-brand .ogb-icon {color:var(--ogb-accent);width:30px;height:30px;}
.ogb-home .ogb-footer p {color:#b7cad5;font-size:13px;max-width:720px;margin:0;}
.ogb-home .ogb-footer p.ogb-footnote {color:#8faab8;font-size:12px;}
.ogb-home .ogb-footer-links {display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:22px;margin-top:12px;font-size:14px;}
.ogb-home .ogb-footer-links a {text-decoration:underline;text-underline-offset:3px;}
.ogb-home .ogb-footer-links a:hover {color:var(--ogb-accent);}
.ogb-home .ogb-footer .ogb-copyright {margin-top:10px;color:#7d98a8;}
@media(max-width:900px){.ogb-home .ogb-hero {grid-template-columns:minmax(0,1fr) minmax(255px,.7fr);gap:25px;}.ogb-home .ogb-hero h1{font-size:46px;}.ogb-home .ogb-steps {grid-template-columns:1fr;}.ogb-home .ogb-top-links{gap:12px;}}
@media(max-width:690px){
.ogb-home {font-size:16px;}
.ogb-home .ogb-container {width:min(100% - 34px,520px);}
.ogb-home .ogb-headline {min-height:66px;}
.ogb-home .ogb-brand {font-size:22px;}
.ogb-home .ogb-brand-label {display:flex; flex-direction:column; gap:2px;}
.ogb-home .ogb-brand-label small {font-size:11px; letter-spacing:0; font-weight:500;color:#a6c7d1;}
.ogb-home .ogb-brand-icon {width:39px;height:39px;border-radius:11px;}
.ogb-home .ogb-brand-icon .ogb-icon {width:26px;height:26px;}
.ogb-home .ogb-top-links>a:not(.ogb-small-demo) {display:none;}
.ogb-home .ogb-top-links .ogb-small-demo {font-size:13px;padding:9px 12px;}
.ogb-home .ogb-hero {display:flex;flex-direction:column;align-items:stretch;padding-block:39px 15px;gap:32px;}
.ogb-home .ogb-hero h1 {font-size:clamp(35px,9.2vw,47px);letter-spacing:-1.8px;margin-bottom:17px;}
.ogb-home .ogb-eyebrow {font-size:12px;line-height:1.6;letter-spacing:.9px;margin-bottom:12px;}
.ogb-home .ogb-lead {font-size:19px;line-height:1.45;margin-bottom:18px;}
.ogb-home .ogb-compatline {font-size:14px;margin-bottom:21px;gap:9px;}
.ogb-home .ogb-actions{flex-direction:column;align-items:stretch;gap:10px;}
.ogb-home .ogb-btn {width:100%;font-size:17px;min-height:55px;}
.ogb-home .ogb-hero-note {font-size:13px;}
.ogb-home .ogb-screen {max-width:400px;}
.ogb-home .ogb-section {padding-top:55px;}
.ogb-home .ogb-section-head {margin-bottom:22px;}
.ogb-home .ogb-section h2,.ogb-home .ogb-closing h2 {font-size:30px;letter-spacing:-.9px;}
.ogb-home .ogb-section-head p,.ogb-home .ogb-closing p {font-size:16px;}
.ogb-home .ogb-feature-grid,.ogb-home .ogb-compat-grid {grid-template-columns:1fr;gap:12px;}
.ogb-home .ogb-feature {padding:19px;gap:14px;}
.ogb-home .ogb-feature-icon {width:49px;height:49px;flex-basis:49px;}
.ogb-home .ogb-feature h3,.ogb-home .ogb-compat-item h3,.ogb-home .ogb-step h3 {font-size:18px;}
.ogb-home .ogb-feature p,.ogb-home .ogb-compat-item p,.ogb-home .ogb-step p {font-size:15px;}
.ogb-home .ogb-compat-item {padding:17px;gap:14px;}
.ogb-home .ogb-compat-icon {width:67px;height:70px;flex-basis:67px;}
.ogb-home .ogb-compat-icon .ogb-icon {width:36px;height:36px;}
.ogb-home .ogb-device-image {width:76px;height:78px;flex-basis:76px;}
.ogb-home .ogb-step {padding:17px;}
.ogb-home .ogb-faq summary {font-size:16px;padding:17px;}
.ogb-home .ogb-closing {margin-top:58px;padding:32px 20px;}
.ogb-home .ogb-footer {margin-top:55px;padding:39px 0 31px;}
}
@media(max-width:370px){.ogb-home .ogb-container {width:calc(100% - 26px);}.ogb-home .ogb-hero h1 {font-size:35px;}.ogb-home .ogb-brand {font-size:20px;}.ogb-home .ogb-screen {border-width:6px;padding:14px 11px;}.ogb-home .ogb-screen-inner {padding:12px 9px;}.ogb-home .ogb-preview-power strong {font-size:27px;}.ogb-home .ogb-compat-item{align-items:flex-start;}}
@media(prefers-reduced-motion:reduce){.ogb-home *, .ogb-home *:before, .ogb-home *:after {transition-duration:0.01ms!important;scroll-behavior:auto!important;}}
