*{box-sizing:border-box}form{max-width:540px}label{display:block;margin:18px 0}input:not([type=checkbox]),select{display:block;width:100%;padding:12px;border:1px solid #cbd5e1;border-radius:10px;font:inherit;margin-top:6px}input[type=checkbox]{width:20px;height:20px;vertical-align:middle;margin-right:8px}button{font:inherit;background:#4f46e5;color:white;padding:12px 20px;border:0;border-radius:10px;cursor:pointer}body{margin:0;background:#fbfcff;color:#18223b;font:17px/1.6 system-ui,sans-serif}a{color:#4338ca;text-underline-offset:4px}a:focus-visible,button:focus-visible{outline:3px solid #0891b2;outline-offset:4px}header,main,footer{max-width:1180px;margin:auto;padding:24px}nav{display:flex;align-items:center;gap:24px;flex-wrap:wrap}.brand{font-weight:800;margin-right:auto;color:#18223b;text-decoration:none}.cta{display:inline-block;background:#4f46e5;color:#fff;padding:13px 22px;border-radius:12px;text-decoration:none;font-weight:650}.secondary{display:inline-block;padding:12px 18px;border:1px solid #cbd5e1;border-radius:12px;text-decoration:none}h1{font-size:clamp(36px,5.5vw,66px);line-height:1.08;letter-spacing:-.04em;max-width:850px}h2{font-size:clamp(26px,4vw,38px);line-height:1.2}h3{font-size:21px}.hero{padding:54px 0 50px;background:radial-gradient(ellipse at top right,#e9e7ff,transparent 65%)}.lead{max-width:700px;color:#475569;font-size:21px}.eyebrow{color:#4f46e5;font-weight:700}.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.card,.demo{padding:24px;border:1px solid #dbe2ef;background:#fff;border-radius:20px}.demo{display:grid;grid-template-columns:1fr 2fr;gap:18px;box-shadow:0 20px 60px #28326512;margin:20px 0 70px}.demo aside{background:#f1f5fd;padding:18px;border-radius:12px}.bubble{padding:12px 16px;background:#eef2ff;border-radius:14px;margin:14px 0;max-width:85%}.bubble.out{background:#4f46e5;color:#fff;margin-left:auto}.muted{color:#64748b;font-size:14px}.badge{display:inline-block;border-radius:99px;background:#eef2ff;padding:3px 10px;font-size:13px;color:#4338ca}section{margin-bottom:72px}.notice{border-left:4px solid #818cf8;background:#eef2ff;padding:18px;border-radius:4px}details{padding:16px 0;border-bottom:1px solid #dbe2ef}summary{cursor:pointer;font-weight:650}table{width:100%;border-collapse:collapse}td,th{padding:14px;text-align:left;border-bottom:1px solid #dbe2ef}footer{border-top:1px solid #dbe2ef;color:#64748b;font-size:14px}footer a{display:inline-block;margin-right:18px}@media(max-width:720px){header,main,footer{padding:18px}nav{gap:12px;font-size:14px}.hero{padding:26px 0 30px}.grid{grid-template-columns:1fr}.demo{grid-template-columns:1fr;margin-bottom:42px;padding:16px}.demo aside{display:none}.lead{font-size:18px}section{margin-bottom:44px}}

.price{font-size:36px;font-weight:750;line-height:1.2}.legal{max-width:900px}.card p{overflow-wrap:anywhere}
h1,h2,h3{overflow-wrap:anywhere}
/* Komlio storefront: geometry and blue/cyan rhythm from the approved identity. */
body{font-family:Inter,system-ui,sans-serif}header{border-bottom:1px solid var(--k-border);background:var(--k-surface)}header nav{min-height:48px}.brand{font-size:27px;letter-spacing:-1px}main{max-width:1200px}h1{font-size:clamp(46px,6.5vw,88px);font-weight:780;line-height:1.04;letter-spacing:-.055em}.komlio-hero{position:relative;padding:76px 0 36px;background:radial-gradient(ellipse at 95% 20%,#06b6d41c,transparent 60%);overflow:hidden}.komlio-hero:after{content:"";position:absolute;width:360px;height:240px;right:-190px;bottom:-180px;border:48px solid #2563eb18;border-radius:50%;transform:rotate(-25deg);pointer-events:none}.cyan-dot{color:var(--k-cyan)}.eyebrow{font-size:12px;letter-spacing:.15em;font-weight:750;color:var(--k-accent)}.lead{max-width:720px;line-height:1.65}.cta{background:#2563eb!important;box-shadow:0 8px 24px #2563eb24;font-weight:650;color:#fff!important}.secondary{color:var(--k-text)!important;border-color:var(--k-border);background:var(--k-surface)}.channel-strip{display:flex;gap:10px;flex-wrap:wrap;margin:30px 0 18px}.channel-strip span{font-size:13px;font-weight:600;border:1px solid var(--k-border);background:var(--k-surface);padding:8px 14px;border-radius:99px}.demo{padding:16px;gap:24px;grid-template-columns:230px 1fr;box-shadow:0 24px 80px #0f172a12;overflow:hidden}.demo aside{background:var(--k-raised);padding:24px;color:var(--k-text)}.demo aside strong:before{content:"● ";color:#06b6d4}.demo aside p{padding:10px;border-radius:8px}.demo aside p:first-of-type{background:var(--k-surface);color:var(--k-accent)}.demo>div{padding:22px}.bubble{background:var(--k-raised);color:var(--k-text);border-radius:14px 14px 14px 4px;max-width:75%}.bubble.out{background:#2563eb;color:#fff;border-radius:14px 14px 4px 14px}.card{padding:28px;transition:transform .15s,border-color .15s}.card:hover{border-color:var(--k-accent);transform:translateY(-2px)}.card h3{margin-top:4px;letter-spacing:-.025em}.price{letter-spacing:-.04em}h2{letter-spacing:-.04em}section{scroll-margin-top:24px}.hero .muted{font-size:13px}footer{background:var(--k-surface);border-top:1px solid var(--k-border)}@media(max-width:720px){.komlio-hero{padding-top:38px}.demo{grid-template-columns:1fr}.demo>div{padding:8px}.bubble{max-width:94%}header nav .brand{width:100%;margin-bottom:4px}header nav{gap:14px}.komlio-theme-toggle{margin-left:auto!important}}

.hero-orbit{position:absolute;right:32px;top:120px;width:220px;height:220px;border:1px solid var(--k-border);border-radius:54px;background:var(--k-surface);box-shadow:0 32px 80px #2563eb18;transform:rotate(-6deg);display:flex;align-items:center;justify-content:center}.hero-orbit svg{width:150px;height:130px}.orbit-label{position:absolute;bottom:-42px;font-size:12px;color:var(--k-muted);white-space:nowrap;transform:rotate(6deg)}.feature-icon{display:block;width:28px;height:28px;color:var(--k-accent);margin-bottom:24px}@media(max-width:1100px){.hero-orbit{display:none}}
/* Reference poster: midnight field with overlapping cobalt/cyan waves. */
html[data-komlio] .komlio-hero{isolation:isolate;background:radial-gradient(ellipse at 100% 35%,#06416b 0,transparent 58%),linear-gradient(125deg,#0f172a,#09182f)!important;color:#fff;border:1px solid #244574;border-radius:26px;padding:64px 40px 116px;margin-top:24px;box-shadow:0 24px 60px #0f172a1c}
.komlio-hero>:not(.hero-orbit){position:relative;z-index:2}.komlio-hero h1{max-width:800px}.komlio-hero .eyebrow{color:#67e8f9!important}.komlio-hero .lead{color:#c3d9f6!important}.komlio-hero .muted{color:#aec8e8!important}
.komlio-hero:before{content:"";position:absolute;z-index:0;pointer-events:none;width:100%;height:230px;right:-35%;bottom:-185px;border-radius:50%;transform:rotate(-17deg);background:linear-gradient(180deg,#2875ff,#143c99 50%,#0c2147);box-shadow:0 -2px 0 #36a2ff8c,0 -12px 60px #2563eb35}
.komlio-hero:after{content:"";position:absolute;z-index:1;pointer-events:none;width:85%;height:200px;right:-40%;bottom:-95px;border:0;border-radius:50%;transform:rotate(-34deg);background:linear-gradient(180deg,#24e6ef,#06b6d4 22%,#075cb4 70%,#102650);box-shadow:0 -2px 0 #6cf4ff80,0 -8px 50px #06b6d435}
html[data-komlio] .komlio-hero .secondary{background:#ffffff0d;border-color:#627fa4;color:#fff!important}.komlio-hero .channel-strip span{background:#173250;border-color:#2b5077;color:#e1edfc}.komlio-hero .hero-orbit{right:40px;top:125px;background:linear-gradient(145deg,#14294d,#0b1b34);border-color:#3a668b;box-shadow:0 0 80px #06b6d422,0 24px 60px #0003;z-index:2}.komlio-hero .orbit-label{color:#aaceed}
html[data-komlio] .cta{background:var(--k-brand-gradient)!important;box-shadow:var(--k-glow)}.feature-icon{width:46px;height:46px;padding:10px;border-radius:12px;background:var(--k-tint);color:var(--k-cyan-ink);border:1px solid #06b6d42b}#pricing .card:first-child{border-color:#2563eb88;box-shadow:inset 0 3px #2563eb,var(--k-shadow)}.demo{border-top:3px solid #06b6d4!important}.bubble.out{background:linear-gradient(120deg,#2563eb,#0e7490)}
@media(max-width:720px){html[data-komlio] .komlio-hero{padding:36px 22px 100px;margin-top:12px;border-radius:20px}.komlio-hero h1{font-size:clamp(40px,10vw,62px)}.komlio-hero:before{width:160%;right:-90%}.komlio-hero:after{width:145%;right:-100%;bottom:-115px}.komlio-hero .channel-strip{gap:6px}.komlio-hero .channel-strip span{font-size:12px;padding:6px 10px}}
/* Light brand panel keeps the waves and glow, with an airy white/glacier field. */
html[data-komlio][data-theme=light] .komlio-hero{background:radial-gradient(ellipse at 100% 25%,#c8f3fc,transparent 60%),linear-gradient(120deg,#fff,#edf5ff)!important;color:#0f172a;border-color:#c7dff3;box-shadow:0 24px 64px #2563eb0c}
html[data-komlio][data-theme=light] .komlio-hero .eyebrow{color:#076b80!important}html[data-komlio][data-theme=light] .komlio-hero .lead{color:#405b7b!important}html[data-komlio][data-theme=light] .komlio-hero .muted{color:#526b88!important}
html[data-komlio][data-theme=light] .komlio-hero:before{background:linear-gradient(180deg,#3d86ff,#a2caff 55%,#e6f2ff);box-shadow:0 -2px 0 #69a7ff66,0 -10px 60px #2563eb12}
html[data-komlio][data-theme=light] .komlio-hero:after{background:linear-gradient(180deg,#28d9e9,#73e2f0 35%,#baeef7 75%,#e5f8fc);box-shadow:0 -2px 0 #a9f5ff80,0 -8px 45px #06b6d41a}
html[data-komlio][data-theme=light] .komlio-hero .secondary{background:#ffffffbd;border-color:#b6d3ed;color:#194b85!important}html[data-komlio][data-theme=light] .komlio-hero .channel-strip span{background:#ffffffbc;border-color:#c4deef;color:#245178}
html[data-komlio][data-theme=light] .komlio-hero .hero-orbit{background:linear-gradient(145deg,#fff,#e4f5ff);border-color:#b8dfef;box-shadow:0 0 80px #06b6d417,0 24px 60px #2563eb13}html[data-komlio][data-theme=light] .komlio-hero .orbit-label{color:#456b8e}
html[data-komlio][data-theme=light] .demo aside{background:linear-gradient(165deg,#edf4ff,#e4f7fb)}html[data-komlio][data-theme=light] .bubble:not(.out){background:#eaf3ff;color:#183f68}
