/* Wingman Tech - styles. Fonts are self-hosted (Inter, Space Grotesk; SIL Open Font License). */
@font-face{font-family:Inter;font-style:normal;font-weight:400 600;font-display:swap;src:url(fonts/inter-var.woff2) format("woff2")}
@font-face{font-family:"Space Grotesk";font-style:normal;font-weight:500 700;font-display:swap;src:url(fonts/space-grotesk-var.woff2) format("woff2")}
:root{--navy:#0B1F3A;--navy-d:#071629;--panel:#142C4D;--panel-b:#2A4468;--line-d:#4A5D78;--amber:#E8A33D;--cream:#F5F3EE;--card-b:#E2DED5;--ink:#1C2533;--mut:#4A5568;--pale:#C9D3E0;--pale2:#9FB0C6}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--cream);color:var(--ink);font-family:Inter,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;line-height:1.5}
h1,h2,h3,.sg{font-family:"Space Grotesk",system-ui,sans-serif}
h1,h2,h3,p{margin:0}
a{color:var(--navy)}a:hover{color:#2A4365}
img,svg{max-width:100%}
.skip{position:absolute;left:-999px;top:8px;background:var(--amber);color:var(--navy);padding:10px 16px;border-radius:8px;font-weight:600;z-index:100}
.skip:focus{left:8px}
:focus-visible{outline:3px solid var(--amber);outline-offset:3px}
.inner{max-width:1200px;margin:0 auto;padding-left:24px;padding-right:24px}
h2{font-size:clamp(32px,4vw,44px);line-height:1.1}
.sec-head{display:flex;flex-direction:column;gap:12px;max-width:680px}
.sec-head p{font-size:18px;line-height:1.6;color:var(--mut)}
/* header */
.hdr{background:var(--navy);color:#fff}
.hdr .inner{padding-top:20px;padding-bottom:20px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:#fff}
.brand:hover{color:#fff}
.brand span{font-family:"Space Grotesk",sans-serif;font-weight:700;font-size:22px;letter-spacing:.5px}
.nav{display:flex;flex-wrap:wrap;align-items:center;gap:4px 24px;font-size:15px}
.nav a{color:#D6DEE9;text-decoration:none;padding:12px 0}
.nav a:hover{color:#fff}
.nav a.cta{background:var(--amber);color:var(--navy);font-weight:600;padding:12px 20px;border-radius:8px}
.nav a.cta:hover{color:var(--navy);background:#f0b455}
/* buttons */
.btn{display:inline-block;text-decoration:none;font-weight:600;font-size:17px;padding:16px 28px;border-radius:8px;border:1px solid transparent;font-family:inherit;cursor:pointer;text-align:center}
.btn-amber{background:var(--amber);color:var(--navy)}
.btn-amber:hover{background:#f0b455;color:var(--navy)}
.btn-line{color:#fff;border-color:var(--line-d)}
.btn-line:hover{color:#fff;background:rgba(255,255,255,.08)}
/* hero */
.hero{background:var(--navy);color:#fff}
.hero .inner{padding-top:72px;padding-bottom:96px;display:flex;flex-wrap:wrap;gap:48px;align-items:center}
.hero-l{flex:1 1 520px;min-width:0;display:flex;flex-direction:column;gap:24px}
.eyebrow{font-size:14px;font-weight:600;letter-spacing:2px;text-transform:uppercase;color:var(--amber)}
.hero h1{font-size:clamp(40px,6vw,68px);line-height:1.05;font-weight:700}
.hero h1 em{color:var(--amber);font-style:italic}
.hero .lead{font-size:20px;line-height:1.6;color:var(--pale);max-width:560px}
.cta-row{display:flex;flex-wrap:wrap;gap:16px;margin-top:8px}
.hero .small{font-size:15px;color:var(--pale2)}
.check{flex:1 1 380px;min-width:0;background:var(--panel);border:1px solid var(--panel-b);border-radius:16px;padding:32px;display:flex;flex-direction:column;gap:20px}
.check .t{font-family:"Space Grotesk",sans-serif;font-size:13px;letter-spacing:2px;text-transform:uppercase;color:var(--pale2)}
.check .row{display:flex;gap:14px;align-items:flex-start;font-size:17px;line-height:1.5}
.check svg{flex:none;margin-top:2px}
/* problem */
.problem{display:flex;flex-wrap:wrap;gap:32px 64px;align-items:flex-start;padding-top:96px;padding-bottom:24px}
.problem h2{flex:1 1 360px}
.problem p{flex:1 1 480px;font-size:18px;line-height:1.7;color:var(--mut)}
/* services */
.services{padding-top:72px;padding-bottom:72px;display:flex;flex-direction:column;gap:40px}
.grid3{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:24px}
.card{background:#fff;border:1px solid var(--card-b);border-radius:14px;padding:28px;display:flex;flex-direction:column;gap:12px}
.card h3{font-size:22px}
.card p{font-size:16px;line-height:1.6;color:var(--mut)}
.pilot-seat{background:var(--navy);color:#fff;border-radius:14px;padding:24px 28px;display:flex;gap:16px;align-items:center;font-size:17px;line-height:1.6}
.pilot-seat svg{flex:none}
/* flight plan */
.how{padding-top:48px;padding-bottom:96px;display:flex;flex-direction:column;gap:40px}
.how .grid3{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}
.step{background:var(--navy);color:#fff;border-radius:14px;padding:32px;display:flex;flex-direction:column;gap:14px}
.step .k{font-family:"Space Grotesk",sans-serif;font-size:15px;font-weight:600;letter-spacing:2px;color:var(--amber)}
.step h3{font-size:24px}
.step p{font-size:16px;line-height:1.6;color:var(--pale)}
/* pricing */
.pricing{background:#fff;border-top:1px solid var(--card-b);border-bottom:1px solid var(--card-b)}
.pricing .inner{padding-top:96px;padding-bottom:96px;display:flex;flex-direction:column;gap:40px}
.plan{background:var(--cream);border-radius:14px;padding:32px;display:flex;flex-direction:column;gap:14px}
.plan.dark{background:var(--navy);color:#fff}
.plan .k{font-family:"Space Grotesk",sans-serif;font-size:14px;font-weight:600;letter-spacing:2px;color:var(--mut)}
.plan.dark .k{color:var(--amber)}
.plan h3{font-size:24px}
.plan .price{font-family:"Space Grotesk",sans-serif;font-size:40px;font-weight:700;line-height:1.15}
.plan .price small{font-size:20px;font-weight:500}
.plan p.d{font-size:16px;line-height:1.6;color:var(--mut)}
.plan.dark p.d{color:var(--pale)}
.plan .tag{font-size:15px;line-height:1.5;font-weight:600;background:var(--navy);color:#fff;padding:12px 14px;border-radius:8px}
.extra{border:1px solid var(--card-b);border-radius:14px;padding:24px 28px;display:flex;flex-direction:column;gap:8px}
.extra h3{font-size:20px}
.extra p{font-size:16px;line-height:1.6;color:var(--mut)}
.fine{font-size:14px;color:var(--mut)}
/* about */
.about{padding-top:96px;padding-bottom:96px;display:flex;flex-direction:column;gap:40px}
.person{background:#fff;border:1px solid var(--card-b);border-radius:14px;padding:32px;display:flex;flex-direction:column;gap:10px}
.person h3{font-size:24px}
.person .role{font-size:15px;font-weight:600;color:var(--mut)}
.person p{font-size:16px;line-height:1.6;color:var(--mut)}
.pillars{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}
.pillar{background:var(--navy);color:#fff;border-radius:12px;padding:22px 24px;display:flex;flex-direction:column;gap:6px}
.pillar b{font-weight:600;font-size:17px;color:var(--amber)}
.pillar span{font-size:15px;line-height:1.5;color:var(--pale)}
.todo{background:#fff1cf;color:#5a3d00;border-radius:4px;padding:0 4px}
/* faq */
.faq{background:#fff;border-top:1px solid var(--card-b)}
.faq .inner{max-width:860px;padding-top:96px;padding-bottom:96px;display:flex;flex-direction:column;gap:24px}
.faq h2{margin-bottom:8px}
.q{border-bottom:1px solid var(--card-b);padding-bottom:20px;display:flex;flex-direction:column;gap:8px}
.q:last-child{border-bottom:0;padding-bottom:0}
.q h3{font-size:20px}
.q p{font-size:16px;line-height:1.6;color:var(--mut)}
/* contact */
.contact{background:var(--navy);color:#fff}
.contact .inner{padding-top:96px;padding-bottom:96px;display:flex;flex-wrap:wrap;gap:48px}
.c-l{flex:1 1 400px;min-width:0;display:flex;flex-direction:column;gap:16px}
.c-l .lead{font-size:18px;line-height:1.6;color:var(--pale)}
.c-info{display:flex;flex-direction:column;gap:6px;margin-top:8px;font-size:17px;line-height:1.6}
.c-info a{color:#fff}
.c-info a.mail{color:var(--amber);margin-bottom:12px}
.c-info .loc{color:var(--pale2)}
form{flex:1 1 440px;min-width:0;background:var(--panel);border:1px solid var(--panel-b);border-radius:16px;padding:32px;display:flex;flex-direction:column;gap:18px}
.f{display:flex;flex-direction:column;gap:6px}
.f label{font-size:15px;font-weight:600}
input,textarea{font:inherit;font-size:16px;padding:12px 14px;border-radius:8px;border:1px solid var(--line-d);background:var(--navy);color:#fff;min-height:44px;width:100%}
textarea{resize:vertical}
form button{font:inherit;font-size:17px;font-weight:600;background:var(--amber);color:var(--navy);border:0;border-radius:8px;padding:16px;min-height:48px;cursor:pointer}
form button:hover{background:#f0b455}
.note{font-size:14px;color:var(--pale2)}
.note a{color:#fff}
/* footer */
.ftr{background:var(--navy-d);color:var(--pale2)}
.ftr .inner{padding-top:32px;padding-bottom:32px;display:flex;flex-wrap:wrap;justify-content:space-between;gap:16px;font-size:14px}
@media(max-width:600px){.hero .inner{padding-top:48px;padding-bottom:64px}.btn{width:100%}.problem{padding-top:64px}.pricing .inner,.about,.faq .inner,.contact .inner{padding-top:64px;padding-bottom:64px}.hero .lead{font-size:18px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
