:root{--ink:#14182b;--muted:#5b6275;--bg:#fffdf8;--card:#fff;--line:#ece7dc;--a:#ff5a36;--a-d:#e2401d;--b:#2f80ff;--y:#ffd23f;--g:#12a36b;--r:20px;--sh:0 10px 30px rgba(20,24,43,.08)}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:80px}
body{margin:0;background:var(--bg);color:var(--ink);font:17px/1.6 ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}a{color:var(--b)}h1,h2,h3{line-height:1.15;margin:0 0 .4em;letter-spacing:-.02em}
.wrap{max-width:1180px;margin:0 auto;padding:0 22px}
.skip{position:absolute;left:-9999px}.skip:focus{left:12px;top:12px;z-index:99;background:#fff;padding:8px 12px;border-radius:8px}
.ribbon{position:fixed;top:14px;left:-34px;transform:rotate(-45deg);background:var(--ink);color:#fff;font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;padding:4px 40px;z-index:60;pointer-events:none}
.btn{display:inline-flex;align-items:center;gap:.4em;background:var(--a);color:#fff;border:0;border-radius:999px;padding:.8em 1.4em;font:inherit;font-weight:700;text-decoration:none;cursor:pointer;box-shadow:0 6px 16px rgba(255,90,54,.28);transition:transform .15s,background .15s}
.btn:hover{background:var(--a-d);transform:translateY(-1px)}.btn:focus-visible,.chip:focus-visible,a:focus-visible{outline:3px solid var(--y);outline-offset:3px}
.btn-sm{padding:.5em 1.05em;font-size:.92rem;box-shadow:none}.btn-ghost{background:#fff;color:var(--ink);border:2px solid var(--ink);box-shadow:none}.btn-ghost:hover{background:var(--ink);color:#fff}
.top{position:sticky;top:0;z-index:50;background:rgba(255,253,248,.88);backdrop-filter:saturate(1.4) blur(10px);border-bottom:1px solid var(--line)}
.top-in{display:flex;align-items:center;justify-content:space-between;height:68px;gap:16px}
.brand{display:flex;align-items:center;gap:10px;color:#000;text-decoration:none;font-size:1.55rem;white-space:nowrap;line-height:1}.brand .logo{width:36px;height:36px;flex:none}
@font-face{font-family:'League Spartan';font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/league-spartan-700-latin.woff2) format('woff2')}
/* Brand name component (inc/lib.php brand_html, js/chat.js brandEl): lowercase, bold, black, 'ai' in #0cc0df */
.mn{font-family:'League Spartan',ui-sans-serif,system-ui,sans-serif;font-weight:700;color:#000;text-transform:none;letter-spacing:-.01em;white-space:nowrap}.mn-ai{color:#0cc0df}.mn-apps{color:#000}
.hero-brand{font-size:clamp(2rem,4.4vw,3rem);line-height:1;margin:0 0 14px}
.top nav{display:flex;align-items:center;gap:22px}.top nav a:not(.btn){color:var(--ink);text-decoration:none;font-weight:600}.top nav a:not(.btn):hover{color:var(--a)}
.hero{padding:70px 0 56px;background:radial-gradient(900px 400px at 85% 10%,#ffe9b0 0,transparent 60%),radial-gradient(700px 380px at 0% 100%,#dbe9ff 0,transparent 60%)}
.hero-in{display:grid;grid-template-columns:1.05fr 1fr;gap:48px;align-items:center}
.eyebrow{text-transform:uppercase;letter-spacing:.16em;font-size:.8rem;font-weight:700;color:var(--a);margin:0 0 12px}
h1{font-size:clamp(2.3rem,5.2vw,4rem);font-weight:850}.hl{background:linear-gradient(transparent 62%,var(--y) 62%)}
.lead{font-size:1.18rem;color:var(--muted);max-width:34em}.cta{display:flex;flex-wrap:wrap;gap:12px;margin:22px 0 10px}
.stat{color:var(--muted);font-size:.95rem;margin:14px 0 0}.stat b{color:var(--ink)}
.hero-art{position:relative;aspect-ratio:1.1}.ha{position:absolute;width:74%;aspect-ratio:16/10;object-fit:cover;object-position:top;border-radius:16px;box-shadow:0 18px 50px rgba(20,24,43,.18);border:6px solid #fff;background:#fff}
.ha1{top:0;right:0;transform:rotate(3deg)}.ha2{top:30%;left:0;transform:rotate(-4deg)}.ha3{bottom:0;right:6%;transform:rotate(1.5deg)}
.sec-head{display:flex;flex-wrap:wrap;align-items:end;justify-content:space-between;gap:16px;margin-bottom:26px}.sec-head h2{font-size:clamp(1.8rem,3.4vw,2.6rem);margin:0}.sub{color:var(--muted);max-width:40em;margin:0}
.apps{padding:64px 0}.filters{display:flex;flex-wrap:wrap;gap:8px}
.chip{border:2px solid var(--line);background:#fff;color:var(--ink);border-radius:999px;padding:.35em .95em;font:inherit;font-size:.9rem;font-weight:650;cursor:pointer}.chip.on{background:var(--ink);border-color:var(--ink);color:#fff}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;box-shadow:var(--sh);display:flex;flex-direction:column;transition:transform .2s,box-shadow .2s}
.card:hover{transform:translateY(-4px);box-shadow:0 18px 40px rgba(20,24,43,.12)}.card[hidden]{display:none}
.shot{background:#f1eee6;padding:26px 12px 0;position:relative}.shot img{border-radius:10px 10px 0 0;aspect-ratio:16/10;object-fit:cover;object-position:top}
.dots{position:absolute;top:9px;left:14px;display:flex;gap:5px}.dots i{width:9px;height:9px;border-radius:50%;background:#ff6b5b}.dots i:nth-child(2){background:#ffcf3f}.dots i:nth-child(3){background:#3ccf7a}
.is-dev .shot img{filter:saturate(.85)}
.body{padding:18px 20px 22px;display:flex;flex-direction:column;flex:1}.body h3{font-size:1.4rem;margin:.25em 0 .1em}.body p{margin:.35em 0;color:#333a4d}
.meta{display:flex;justify-content:space-between;align-items:center;gap:8px}.plat{font-size:.82rem;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}
.badge{font-size:.78rem;font-weight:800;border-radius:999px;padding:.2em .7em;white-space:nowrap}.b-live{background:#dcfbe9;color:#0b7a4f}.b-dev{background:#fff1c7;color:#8a5a00}
.pitch{font-weight:700;color:var(--ink)!important}.note{font-size:.9rem;color:var(--muted)!important}
.links{margin-top:auto!important;padding-top:10px;display:flex;flex-wrap:wrap;gap:10px 16px;align-items:center}.link{font-weight:650}
.soon{margin-top:auto!important;padding-top:10px;color:var(--muted)!important;font-size:.95rem}
.ai{padding:70px 0;background:linear-gradient(180deg,#eef5ff,#fff8ec)}
.svc{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.svc article{background:#fff;border-radius:var(--r);padding:26px;box-shadow:var(--sh);border:1px solid var(--line)}
.svc h3{font-size:1.3rem}.svc p{color:#333a4d;margin:0}
.ic{display:block;width:48px;height:48px;border-radius:14px;margin-bottom:14px;background:var(--a) center/26px no-repeat}
.ic1{background-color:var(--a);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round'%3E%3Crect x='3' y='3' width='7' height='7' rx='2'/%3E%3Crect x='14' y='3' width='7' height='7' rx='2'/%3E%3Crect x='3' y='14' width='7' height='7' rx='2'/%3E%3Cpath d='M17.5 14v7M14 17.5h7'/%3E%3C/svg%3E")}
.ic2{background-color:var(--b);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 16.9v3a2 2 0 0 1-2.2 2 19.8 19.8 0 0 1-8.6-3.1 19.5 19.5 0 0 1-6-6A19.8 19.8 0 0 1 2.1 4.2 2 2 0 0 1 4.1 2h3a2 2 0 0 1 2 1.7c.1.9.4 1.8.7 2.7a2 2 0 0 1-.5 2.1L8 9.8a16 16 0 0 0 6 6l1.3-1.3a2 2 0 0 1 2.1-.4c.9.3 1.8.6 2.7.7a2 2 0 0 1 1.7 2z'/%3E%3C/svg%3E")}
.ic3{background-color:var(--g);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 12a8 8 0 0 1-11.6 7.1L4 20l1-4.6A8 8 0 1 1 21 12z'/%3E%3Cpath d='M8.5 12h.01M12 12h.01M15.5 12h.01'/%3E%3C/svg%3E")}
.ai-cta{margin-top:28px;background:var(--ink);color:#fff;border-radius:var(--r);padding:26px 30px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px}.ai-cta p{margin:0;max-width:36em}.ai-cta .cta{margin:0}
.ai-cta .btn-ghost{background:transparent;color:#fff;border-color:#fff}.ai-cta .btn-ghost:hover{background:#fff;color:var(--ink)}
.contact-in{display:grid;grid-template-columns:.85fr 1.15fr;gap:48px;align-items:start}.contact h2{font-size:clamp(1.8rem,3.4vw,2.6rem)}
.ticks{list-style:none;padding:0;margin:18px 0 0}.ticks li{padding-left:30px;position:relative;margin:8px 0;font-weight:600}.ticks li:before{content:"";position:absolute;left:0;top:.2em;width:20px;height:20px;border-radius:50%;background:var(--g) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3'%3E%3Cpath d='M5 12l5 5 9-10'/%3E%3C/svg%3E") center/13px no-repeat}
.form{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:26px;box-shadow:var(--sh);display:grid;gap:14px}
.form label{display:grid;gap:6px;font-weight:650;font-size:.95rem}.form small{color:var(--muted);font-weight:500}
.form input,.form select,.form textarea{font:inherit;font-size:16px;border:2px solid var(--line);border-radius:12px;padding:.65em .8em;background:#fffdf9;color:var(--ink);width:100%}
.form input:focus,.form select:focus,.form textarea:focus{outline:0;border-color:var(--b);background:#fff}.form .bad{border-color:#e5484d}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:14px}.hp{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
.form .btn{justify-self:start}.status{margin:0;font-weight:650;min-height:1.4em}.status.ok{color:#0b7a4f}.status.err{color:#c4282d}
.foot{border-top:1px solid var(--line);padding:26px 0 90px;color:var(--muted);font-size:.92rem}.foot-in{display:flex;flex-wrap:wrap;gap:12px 24px;align-items:center;justify-content:space-between}.brand.sm{font-size:1.2rem}.brand.sm .logo{width:28px;height:28px}
@media (max-width:980px){.grid,.svc{grid-template-columns:1fr 1fr}.hero-in,.contact-in{grid-template-columns:1fr}.hero-art{max-width:560px;width:100%;margin:0 auto}}
@media (max-width:640px){body{font-size:16px}.wrap{padding:0 16px}.top nav a:not(.btn){display:none}.brand{font-size:1.35rem}.brand .logo{width:32px;height:32px}.hero{padding:40px 0 36px}
 .grid,.svc,.row2{grid-template-columns:1fr}.apps,.ai{padding:48px 0}.ai-cta{padding:22px}.form{padding:20px}.ribbon{display:none}.hero-art{aspect-ratio:1.15}}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.card,.btn{transition:none}}
/* contact modal: JS toggles .open; without JS, :target opens it */
.modal{position:fixed;inset:0;z-index:1000;display:none;align-items:center;justify-content:center;padding:24px}
.modal.open,html:not(.js) .modal:target{display:flex}
.modal-bg{position:absolute;inset:0;background:rgba(20,24,43,.55);backdrop-filter:blur(3px);cursor:default}
.modal-box{position:relative;background:var(--bg);border-radius:var(--r);box-shadow:0 30px 80px rgba(20,24,43,.35);width:min(1040px,100%);max-height:calc(100vh - 48px);max-height:calc(100dvh - 48px);overflow:auto;overscroll-behavior:contain;padding:44px 40px 36px}
.modal-box.contact h2{font-size:clamp(1.8rem,3.4vw,2.6rem)}
.modal-x{position:absolute;top:12px;right:12px;width:44px;height:44px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:28px;line-height:1;color:var(--ink);text-decoration:none;background:#fff;border:1px solid var(--line);z-index:2}
.modal-x:hover{background:#f4f1ea}.modal-x:focus-visible{outline:3px solid var(--b);outline-offset:2px}
.modal.open .modal-box{animation:mpop .18s ease-out}@keyframes mpop{from{opacity:0;transform:translateY(12px)}}
html.modal-lock,html.modal-lock body{overflow:hidden}
@media (max-width:640px){.modal{padding:0;align-items:stretch}.modal-box{border-radius:0;max-height:none;height:100%;width:100%;padding:56px 16px 24px}.modal-box .form{padding:16px}}
@media (prefers-reduced-motion:reduce){.modal.open .modal-box{animation:none}}
html.modal-lock #atc-b,html.modal-lock #atc-p{display:none!important}
.modal:focus{outline:none}
/* header title larger (J, Oct 18): 24.8px -> 40.8px at desktop, fluid on mobile; logo icon keeps its original 36px/32px rules */
.top .brand{font-size:clamp(1.75rem,1rem + 4.4vw,2.55rem);align-items:center}

.soon .pv{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;margin-left:8px;vertical-align:middle;border:2px solid var(--ink);border-radius:999px;color:var(--ink);background:#fff;text-decoration:none}.soon .pv:hover,.soon .pv:focus-visible{background:var(--ink);color:#fff}
/* header wordmark image (J, Oct 22) replaces icon + text */
.top .brand-img{display:flex;align-items:center}.top .brand-img .wordmark{display:block;height:44px;width:auto}
@media (max-width:640px){.top .brand-img .wordmark{height:34px}}
/* brand text (J, Oct 22): m + ILYANAIR caps; m sized so x-height = cap height (League Spartan 700: x 0.42em, cap 0.66em) */
.mn{text-transform:uppercase;letter-spacing:.01em}.mn-m{text-transform:none;font-size:1.571em;line-height:0;letter-spacing:0}
.foot .brand-img .wordmark{display:block;height:32px;width:auto}
/* brand text v2 (J, Oct 22 4:50 AM): caps heavier to match the scaled m. Measured League Spartan 700 @1000u: m height 438, cap 672, I stem 156.
   m 1.534em -> 672 = cap height exactly. Scaled m stem = 239, so caps get a 0.07em outline (stem 156 -> ~226) and +0.06em tracking for the wider strokes. */
.mn{letter-spacing:.06em;-webkit-text-stroke:.07em currentColor;paint-order:stroke fill}.mn-m{font-size:1.534em;-webkit-text-stroke:0;letter-spacing:.02em}
/* brand text v3 (J, Oct 22 4:54 AM): m read short next to the outlined caps (their .07em outline adds ~.035em top and bottom).
   Give the m the same outline (.07em of the parent = .044em of the m) at 1.60em: rendered m top 2px@3x above cap tops, same bottom edge. */
.mn-m{font-size:1.6em;-webkit-text-stroke:.044em currentColor}
/* brand text v4 (J, Oct 22 5:50 AM): ILYANAIR/APPS in Archivo Black (self-hosted, SIL OFL), m stays League Spartan 700. No faux outline. */
@font-face{font-family:'Archivo Black';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/archivo-black-400-latin.woff2) format('woff2')}
.mn{font-family:'Archivo Black','League Spartan',ui-sans-serif,system-ui,sans-serif;font-weight:400;letter-spacing:.02em;-webkit-text-stroke:0}
.mn-m{font-family:'League Spartan',ui-sans-serif,system-ui,sans-serif;font-weight:700;font-size:1.63em;-webkit-text-stroke:0;letter-spacing:.01em}
@media (max-width:420px){.hero-brand{font-size:min(2rem,8.6vw)}}
