/* Onim Site Builder - public website. Uses the --o-* variables of the Onim Console theme (light/dark aware). */
.onim-public{--os-radius:18px;--os-shadow:0 1px 2px rgba(16,24,40,.05),0 14px 40px rgba(16,24,40,.08);--os-soft:color-mix(in srgb,var(--o-accent,#6c63ff) 12%,transparent)}
.onim-public,.onim-public body{background:var(--o-bg,#f3f5fa)}
.os-wrap{max-width:1200px;margin:0 auto;padding:0 1.25rem}.os-narrow{max-width:860px}
.os-main,.os-main .primary-content{display:block;padding:0;margin:0;max-width:none}
.onim-public a{text-decoration:none}
.onim-public h1,.onim-public h2,.onim-public h3,.onim-public h4{font-family:'Space Grotesk',system-ui,sans-serif;letter-spacing:-.02em}

/* ---------- buttons ---------- */
.os-btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.8rem 1.5rem;border:1px solid transparent;border-radius:12px;font:inherit;font-weight:700;font-size:.97rem;cursor:pointer;transition:.18s;white-space:nowrap}
.os-btn-primary{background:var(--o-accent,#6c63ff);color:#fff!important;box-shadow:0 10px 24px color-mix(in srgb,var(--o-accent,#6c63ff) 35%,transparent)}
.os-btn-primary:hover{filter:brightness(1.08);transform:translateY(-1px)}
.os-btn-ghost{background:transparent;border-color:var(--o-border,#dde3f0);color:var(--o-text,#18203a)!important}
.os-btn-ghost:hover{border-color:var(--o-accent,#6c63ff);color:var(--o-accent,#6c63ff)!important}
.os-btn-outline{background:transparent;border-color:var(--o-accent,#6c63ff);color:var(--o-accent,#6c63ff)!important}
.os-btn-outline:hover{background:var(--o-accent,#6c63ff);color:#fff!important}
.os-btn-light{background:#fff;color:#18203a!important}.os-btn-light:hover{transform:translateY(-1px)}
.os-btn-ghostlight{background:transparent;border-color:rgba(255,255,255,.55);color:#fff!important}.os-btn-ghostlight:hover{background:rgba(255,255,255,.14)}
.os-btn.os-sm{padding:.55rem 1.1rem;font-size:.9rem}.os-block{display:flex;width:100%}

/* ---------- navigation ---------- */
.os-nav{position:sticky;top:0;z-index:1000;background:color-mix(in srgb,var(--o-surface,#fff) 88%,transparent);backdrop-filter:saturate(1.6) blur(14px);border-bottom:1px solid var(--o-border,#dde3f0)}
.os-nav-in{display:flex;align-items:center;gap:1.5rem;min-height:72px}
.os-logo{display:flex;align-items:center;gap:.6rem;color:var(--o-text,#18203a)!important;font-size:1.3rem;font-weight:700}
.os-logo img{max-height:44px;max-width:190px}
.os-mark{display:grid;place-items:center;width:38px;height:38px;border-radius:11px;background:linear-gradient(135deg,var(--o-accent,#6c63ff),var(--o-accent-2,#12a37a));color:#fff;font-weight:700}
.os-menu{display:flex;align-items:center;flex:1;gap:1rem}
.os-menu>ul{display:flex;gap:.2rem;list-style:none;margin:0 auto 0 1rem;padding:0}
.os-menu li{position:relative;list-style:none}
.os-menu>ul>li>a,.os-drop{display:flex;align-items:center;gap:.4rem;padding:.55rem .9rem;border:0;border-radius:10px;background:none;color:var(--o-text,#18203a)!important;font:inherit;font-weight:600;font-size:.95rem;cursor:pointer}
.os-menu>ul>li>a:hover,.os-drop:hover,.has-sub.open>.os-drop{background:var(--o-surface-2,#eef1f8);color:var(--o-accent,#6c63ff)!important}
.os-drop i{font-size:.65rem;transition:transform .2s}.has-sub.open .os-drop i{transform:rotate(180deg)}
.os-sub{position:absolute;top:calc(100% + 6px);left:0;min-width:290px;margin:0;padding:.5rem;list-style:none;background:var(--o-surface,#fff);border:1px solid var(--o-border,#dde3f0);border-radius:16px;box-shadow:0 24px 60px rgba(16,24,40,.18);opacity:0;visibility:hidden;transform:translateY(8px);transition:.18s}
.has-sub:hover>.os-sub,.has-sub.open>.os-sub{opacity:1;visibility:visible;transform:none}
.os-sub a{display:block;padding:.65rem .85rem;border-radius:11px;color:var(--o-text,#18203a)!important}
.os-sub a:hover{background:var(--o-surface-2,#eef1f8)}.os-sub b{display:block;font-size:.95rem}.os-sub small{display:block;color:var(--o-muted,#66728f);font-size:.8rem}
.os-actions{display:flex;align-items:center;gap:.5rem}
.os-ico-btn{display:inline-grid;place-items:center;width:40px;height:40px;border:1px solid var(--o-border,#dde3f0);border-radius:11px;background:var(--o-surface,#fff);color:var(--o-muted,#66728f)!important;cursor:pointer}
.os-ico-btn:hover{color:var(--o-accent,#6c63ff)!important;border-color:var(--o-accent,#6c63ff)}
.os-burger{display:none;margin-left:auto;width:42px;height:42px;border:1px solid var(--o-border,#dde3f0);border-radius:11px;background:var(--o-surface,#fff);cursor:pointer;position:relative}
.os-burger span,.os-burger span:before,.os-burger span:after{position:absolute;left:11px;right:11px;height:2px;border-radius:2px;background:var(--o-text,#18203a);content:"";transition:.2s}
.os-burger span{top:20px}.os-burger span:before{left:0;right:0;top:-6px}.os-burger span:after{left:0;right:0;top:6px}
.os-burger[aria-expanded=true] span{background:transparent}.os-burger[aria-expanded=true] span:before{top:0;transform:rotate(45deg)}.os-burger[aria-expanded=true] span:after{top:0;transform:rotate(-45deg)}
@media(max-width:991px){
  .os-burger{display:block}
  .os-menu{position:fixed;top:72px;left:0;right:0;bottom:0;flex-direction:column;align-items:stretch;gap:1rem;padding:1rem 1.25rem 2rem;background:var(--o-surface,#fff);overflow-y:auto;transform:translateX(100%);visibility:hidden;transition:.25s}
  .os-menu.open{transform:none;visibility:visible}
  .os-menu>ul{flex-direction:column;margin:0}.os-menu>ul>li>a,.os-drop{width:100%;justify-content:space-between;padding:.9rem .8rem;font-size:1.05rem}
  .os-sub{position:static;min-width:0;opacity:1;visibility:visible;transform:none;box-shadow:none;border:0;padding:0 0 0 .8rem;display:none}.has-sub.open>.os-sub{display:block}
  .os-actions{flex-wrap:wrap}
}

/* ---------- sections ---------- */
.os-sec{padding:4.5rem 0}
.os-head{max-width:720px;margin:0 auto 2.6rem;text-align:center}
.os-head h2,.os-split h2,.os-domain h2{font-size:clamp(1.7rem,3.2vw,2.5rem);line-height:1.15;margin:.3rem 0 .7rem;color:var(--o-text,#18203a)}
.os-head p{margin:0;color:var(--o-muted,#66728f);font-size:1.05rem}
.os-eyebrow{display:inline-block;padding:.28rem .85rem;border-radius:999px;background:var(--os-soft);color:var(--o-accent,#6c63ff);font-size:.78rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase}
.os-empty{padding:2.5rem;text-align:center;color:var(--o-muted,#66728f)}.os-empty i{font-size:2.2rem;margin-bottom:.6rem}
.os-draft{padding:.6rem 1rem;text-align:center;background:#fff6e0;color:#8a5d05;font-weight:600}

/* hero */
.os-hero{position:relative;overflow:hidden;padding:4.5rem 0 5rem}
.os-hero-gradient{background:radial-gradient(900px 420px at 85% -5%,color-mix(in srgb,var(--o-accent,#6c63ff) 22%,transparent),transparent),radial-gradient(700px 380px at -5% 110%,color-mix(in srgb,var(--o-accent-2,#12a37a) 16%,transparent),transparent),var(--o-surface,#fff)}
.os-hero-light{background:var(--o-surface,#fff)}
.os-hero-dark{background:radial-gradient(900px 420px at 85% -5%,rgba(108,99,255,.38),transparent),#0b1020;color:#e8ecf8}
.os-slides{position:relative}
.os-slide{display:none;grid-template-columns:1.05fr .95fr;gap:3rem;align-items:center;animation:osIn .6s ease}
.os-slide.active{display:grid}.os-slide.os-noimg{grid-template-columns:1fr;text-align:center}.os-slide.os-noimg .os-hero-copy{max-width:760px;margin:0 auto}
@keyframes osIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.os-hero h1,.os-hero h2{font-size:clamp(2.1rem,4.6vw,3.6rem);line-height:1.08;margin:.8rem 0 1rem;color:var(--o-text,#18203a)}
.os-hero-dark h1,.os-hero-dark h2{color:#fff}
.os-lead{font-size:1.12rem;color:var(--o-muted,#66728f);max-width:560px;margin:0 0 1.2rem}.os-noimg .os-lead{margin-left:auto;margin-right:auto}
.os-hero-dark .os-lead,.os-hero-dark li,.os-hero-dark .os-note{color:#b9c2dc}
.os-ticks{list-style:none;margin:0 0 1.4rem;padding:0;display:grid;gap:.55rem}.os-noimg .os-ticks{justify-items:center}
.os-ticks li{display:flex;align-items:center;gap:.7rem;font-weight:500;color:var(--o-text,#18203a)}
.os-ticks i{display:grid;place-items:center;flex:none;width:22px;height:22px;border-radius:50%;background:color-mix(in srgb,var(--o-accent-2,#12a37a) 18%,transparent);color:var(--o-accent-2,#12a37a);font-size:.6rem}
.os-price{display:flex;align-items:baseline;flex-wrap:wrap;gap:.45rem;margin:0 0 1.4rem}.os-noimg .os-price{justify-content:center}
.os-price b{font-size:2.6rem;line-height:1;color:var(--o-accent,#6c63ff);font-family:'Space Grotesk',sans-serif}
.os-price span{color:var(--o-muted,#66728f);font-weight:600}.os-price em{font-style:normal;padding:.2rem .7rem;border-radius:999px;background:color-mix(in srgb,var(--o-accent-2,#12a37a) 16%,transparent);color:var(--o-accent-2,#12a37a);font-weight:700;font-size:.85rem}
.os-cta{display:flex;gap:.8rem;flex-wrap:wrap}.os-noimg .os-cta{justify-content:center}
.os-note{margin:1.1rem 0 0;color:var(--o-muted,#66728f);font-size:.9rem}.os-note i{color:var(--o-accent-2,#12a37a);margin-right:.3rem}
.os-hero-img img{display:block;width:100%;max-height:480px;object-fit:contain;filter:drop-shadow(0 30px 50px rgba(16,24,40,.22));animation:osFloat 6s ease-in-out infinite}
@keyframes osFloat{50%{transform:translateY(-10px)}}
.os-dots{display:flex;gap:.5rem;justify-content:center;margin-top:2.2rem}
.os-dots button{width:34px;height:6px;border:0;border-radius:6px;background:color-mix(in srgb,var(--o-text,#18203a) 18%,transparent);cursor:pointer;padding:0;transition:.2s}.os-dots button.on{background:var(--o-accent,#6c63ff);width:54px}
@media(max-width:860px){.os-slide,.os-slide.active{grid-template-columns:1fr;gap:1.5rem}.os-slide.active{display:grid}.os-hero{padding:3rem 0}.os-hero-img{order:-1;max-width:420px;margin:0 auto}}

/* domain */
.os-domain{padding:0;margin-top:-2.2rem;position:relative;z-index:2}
.os-domain-card{padding:2rem 2.2rem;background:var(--o-surface,#fff);border:1px solid var(--o-border,#dde3f0);border-radius:var(--os-radius);box-shadow:var(--os-shadow);text-align:center}
.os-domain-card h2{font-size:1.6rem;margin:0 0 .3rem}.os-domain-card p{margin:0 0 1.2rem;color:var(--o-muted,#66728f)}
.os-domain-form{position:relative;display:flex;gap:.6rem;max-width:720px;margin:0 auto}
.os-domain-form i{position:absolute;left:1.1rem;top:50%;transform:translateY(-50%);color:var(--o-muted,#66728f)}
.os-domain-form input{flex:1;padding:1rem 1rem 1rem 2.9rem;border:1px solid var(--o-border,#dde3f0)!important;border-radius:12px!important;background:var(--o-bg,#f3f5fa)!important;color:var(--o-text,#18203a)!important;font:inherit;font-size:1.05rem}
.os-domain-form input:focus{outline:none;border-color:var(--o-accent,#6c63ff)!important;box-shadow:0 0 0 4px var(--os-soft)}
.os-tlds{display:flex;gap:.5rem;flex-wrap:wrap;justify-content:center;margin-top:1.1rem}.os-tlds span{padding:.3rem .85rem;border-radius:999px;background:var(--o-surface-2,#eef1f8);color:var(--o-muted,#66728f);font-weight:600;font-size:.88rem}
@media(max-width:600px){.os-domain-form{flex-direction:column}.os-domain-card{padding:1.4rem}}

/* plans */
.os-plan-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(270px,1fr));gap:1.4rem;align-items:stretch;justify-content:center}
.os-plan{position:relative;display:flex;flex-direction:column;padding:2rem 1.7rem 1.7rem;background:var(--o-surface,#fff);border:1px solid var(--o-border,#dde3f0);border-radius:var(--os-radius);box-shadow:var(--os-shadow);transition:.2s}
.os-plan:hover{transform:translateY(-5px);border-color:var(--o-accent,#6c63ff)}
.os-plan.popular{border:2px solid var(--o-accent,#6c63ff);box-shadow:0 22px 56px color-mix(in srgb,var(--o-accent,#6c63ff) 24%,transparent)}
.os-ribbon{position:absolute;top:-13px;left:50%;transform:translateX(-50%);padding:.25rem 1rem;border-radius:999px;background:linear-gradient(135deg,var(--o-accent,#6c63ff),color-mix(in srgb,var(--o-accent,#6c63ff) 60%,#fff));color:#fff;font-size:.74rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;white-space:nowrap}
.os-plan h3{margin:0;font-size:1.3rem;color:var(--o-text,#18203a)}
.os-plan-tag{margin:.3rem 0 0;color:var(--o-muted,#66728f);font-size:.92rem}
.os-plan-price{display:flex;align-items:baseline;gap:.4rem;margin:1.2rem 0 .3rem}.os-plan-price b{font-size:2.5rem;line-height:1.1;color:var(--o-text,#18203a);font-family:'Space Grotesk',sans-serif}.os-plan-price span{color:var(--o-muted,#66728f)}
.os-plan-note{margin:0 0 .6rem;color:var(--o-muted,#66728f);font-size:.82rem}
.os-plan ul{list-style:none;margin:1.1rem 0 1.6rem;padding:1.1rem 0 0;border-top:1px dashed var(--o-border,#dde3f0);flex:1}
.os-plan li{display:flex;gap:.7rem;align-items:flex-start;padding:.38rem 0;color:var(--o-text,#18203a);font-size:.95rem}
.os-plan li i{display:grid;place-items:center;flex:none;width:19px;height:19px;margin-top:.15rem;border-radius:50%;background:color-mix(in srgb,var(--o-accent-2,#12a37a) 18%,transparent);color:var(--o-accent-2,#12a37a);font-size:.55rem}

/* feature boxes & link cards */
.os-grid{display:grid;gap:1.3rem}
.os-cols-2{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}.os-cols-3{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}.os-cols-4{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.os-card{display:block;padding:1.8rem;background:var(--o-surface,#fff);border:1px solid var(--o-border,#dde3f0);border-radius:var(--os-radius);transition:.2s;color:inherit}
.os-card h3{margin:1rem 0 .4rem;font-size:1.15rem;color:var(--o-text,#18203a)}.os-card p{margin:0;color:var(--o-muted,#66728f);font-size:.95rem}
.os-ico{display:grid;place-items:center;width:52px;height:52px;border-radius:15px;background:var(--os-soft);color:var(--o-accent,#6c63ff);font-size:1.35rem}.os-ico b{font-size:1.2rem}.os-emoji{font-size:1.4rem}
.os-link-card:hover{transform:translateY(-4px);border-color:var(--o-accent,#6c63ff);box-shadow:var(--os-shadow)}
.os-more{display:inline-flex;align-items:center;gap:.4rem;margin-top:1rem;color:var(--o-accent,#6c63ff);font-weight:700;font-size:.92rem}.os-link-card:hover .os-more i{transform:translateX(4px)}.os-more i{transition:.2s}
.os-cards,.os-features{background:transparent}.os-features:nth-of-type(even),.os-cards:nth-of-type(even){background:var(--o-surface,#fff)}

/* image + text */
.os-split .os-wrap{display:grid;grid-template-columns:1fr 1fr;gap:3.5rem;align-items:center}
.os-split.rev .os-split-copy{order:2}.os-split.os-noimg .os-wrap{grid-template-columns:1fr}
.os-split p{color:var(--o-muted,#66728f);font-size:1.05rem;margin:0 0 1.2rem}
.os-split-img img{display:block;width:100%;border-radius:var(--os-radius)}
.os-bullets{list-style:none;margin:0 0 1.6rem;padding:0;display:grid;gap:1rem}
.os-bullets li{display:flex;gap:.9rem;align-items:flex-start}.os-bullets i{color:var(--o-accent-2,#12a37a);font-size:1.25rem;margin-top:.15rem}
.os-bullets b{display:block;color:var(--o-text,#18203a)}.os-bullets span{display:block;color:var(--o-muted,#66728f);font-size:.93rem}
@media(max-width:860px){.os-split .os-wrap{grid-template-columns:1fr;gap:2rem}.os-split.rev .os-split-copy{order:0}}

/* stats */
.os-stats{padding:3rem 0;background:linear-gradient(135deg,var(--o-accent,#6c63ff),color-mix(in srgb,var(--o-accent,#6c63ff) 55%,var(--o-accent-2,#12a37a)));color:#fff}
.os-stat-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:1.5rem;text-align:center}
.os-stat-row b{display:block;font-size:2.4rem;line-height:1.1;font-family:'Space Grotesk',sans-serif;color:#fff}.os-stat-row span{color:rgba(255,255,255,.85);font-weight:500}

/* testimonials */
.os-quote{margin:0;padding:1.8rem;background:var(--o-surface,#fff);border:1px solid var(--o-border,#dde3f0);border-radius:var(--os-radius)}
.os-stars{color:#f5b84b;letter-spacing:.15em;margin-bottom:.8rem}
.os-quote blockquote{margin:0 0 1.3rem;color:var(--o-text,#18203a);font-size:1rem;line-height:1.65;border:0;padding:0}
.os-quote figcaption{display:flex;align-items:center;gap:.8rem}.os-quote figcaption img,.os-av{width:46px;height:46px;border-radius:50%;object-fit:cover}
.os-av{display:grid;place-items:center;background:var(--os-soft);color:var(--o-accent,#6c63ff);font-weight:700}
.os-quote b{display:block;color:var(--o-text,#18203a)}.os-quote small{color:var(--o-muted,#66728f)}

/* faq */
.os-faq details{margin-bottom:.8rem;background:var(--o-surface,#fff);border:1px solid var(--o-border,#dde3f0);border-radius:14px;overflow:hidden}
.os-faq summary{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:1.15rem 1.4rem;cursor:pointer;font-weight:700;color:var(--o-text,#18203a);list-style:none}
.os-faq summary::-webkit-details-marker{display:none}
.os-faq summary:after{content:"+";display:grid;place-items:center;flex:none;width:28px;height:28px;border-radius:50%;background:var(--os-soft);color:var(--o-accent,#6c63ff);font-size:1.2rem;transition:.2s}
.os-faq details[open] summary:after{content:"\2212";background:var(--o-accent,#6c63ff);color:#fff}
.os-faq details[open]{border-color:var(--o-accent,#6c63ff)}
.os-faq details>div{padding:0 1.4rem 1.3rem;color:var(--o-muted,#66728f);line-height:1.7}

/* call to action */
.os-cta-sec{padding:3rem 0 5rem}
.os-cta-box{display:flex;justify-content:space-between;align-items:center;gap:2rem;flex-wrap:wrap;padding:3rem;border-radius:26px;background:radial-gradient(600px 260px at 90% 0,rgba(255,255,255,.2),transparent),linear-gradient(135deg,var(--o-accent,#6c63ff),color-mix(in srgb,var(--o-accent,#6c63ff) 50%,#0b1020));color:#fff;box-shadow:0 30px 70px color-mix(in srgb,var(--o-accent,#6c63ff) 35%,transparent)}
.os-cta-box h2{margin:0 0 .4rem;font-size:clamp(1.5rem,3vw,2.2rem);color:#fff}.os-cta-box p{margin:0;color:rgba(255,255,255,.88);font-size:1.05rem}
.os-prose{color:var(--o-text,#18203a);line-height:1.8}.os-prose h2,.os-prose h3{margin-top:1.6rem}

/* footer */
.os-footer{position:relative;padding:4.2rem 0 1.6rem;background:#0b1020;color:#aab3cf;border-top:4px solid transparent;border-image:linear-gradient(90deg,var(--o-accent,#6c63ff),var(--o-accent-2,#12a37a)) 1}
.os-foot-grid{display:flex;flex-wrap:wrap;gap:2.6rem 3rem;align-items:flex-start}
.os-foot-brand{flex:1.5 1 300px;max-width:380px}
.os-foot-col{flex:1 1 150px;min-width:140px}
.os-foot-logo{display:inline-flex;align-items:center;gap:.6rem;margin-bottom:1.1rem;color:#fff!important;font-size:1.35rem;font-weight:700}
.os-foot-logo img{display:block;max-height:46px;max-width:210px;width:auto}
.os-foot-logo.badge{padding:.6rem 1rem;border-radius:14px;background:#fff}
.os-foot-brand p{margin:0 0 1.2rem;color:#aab3cf;line-height:1.7}
.os-footer h4{margin:0 0 1.1rem;color:#fff!important;font-size:.82rem;letter-spacing:.1em;text-transform:uppercase}
.os-footer ul{list-style:none;margin:0;padding:0;display:grid;gap:.7rem}.os-footer li{color:#aab3cf;list-style:none}
.os-footer a{color:#aab3cf!important}.os-footer a:hover{color:#fff!important}
.os-footer .os-foot-logo{color:#fff!important}
.os-contact li{display:flex;gap:.7rem;align-items:flex-start}.os-contact i{width:18px;margin-top:.25rem;color:var(--o-accent,#6c63ff)}
.os-social{display:flex;gap:.5rem;flex-wrap:wrap}.os-social a{display:grid;place-items:center;width:40px;height:40px;border-radius:12px;background:rgba(255,255,255,.08);transition:.2s}.os-social a:hover{background:var(--o-accent,#6c63ff);transform:translateY(-2px)}
.os-foot-bar{display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap;margin-top:3rem;padding-top:1.4rem;border-top:1px solid rgba(255,255,255,.1);font-size:.88rem}
.os-top{display:grid;place-items:center;width:40px;height:40px;border-radius:12px;background:rgba(255,255,255,.08)}.os-top:hover{background:var(--o-accent,#6c63ff)}
@media(max-width:700px){.os-foot-brand{flex-basis:100%;max-width:none}.os-foot-col{flex-basis:calc(50% - 1.5rem)}}

/* reveal on scroll */
.os-reveal{opacity:0;transform:translateY(22px);transition:.7s cubic-bezier(.2,.7,.2,1)}.os-reveal.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.os-reveal{opacity:1;transform:none;transition:none}.os-hero-img img{animation:none}}

/* badge on non-highlighted plan, split caption, billing toggle, welcome popup */
.os-ribbon.alt{background:var(--o-surface-2,#eef1f8);color:var(--o-text,#18203a);border:1px solid var(--o-border,#dde3f0)}
.os-split-img{position:relative}
.os-caption{position:absolute;left:1rem;bottom:1rem;padding:.7rem 1.1rem;border-radius:14px;background:var(--o-surface,#fff);box-shadow:0 14px 34px rgba(16,24,40,.22)}
.os-caption b{display:block;color:var(--o-text,#18203a)}.os-caption span{color:var(--o-muted,#66728f);font-size:.85rem}
.os-toggle{display:flex;width:fit-content;margin:-1rem auto 2rem;padding:4px;border-radius:999px;background:var(--o-surface-2,#eef1f8);border:1px solid var(--o-border,#dde3f0)}
.os-toggle button{padding:.5rem 1.4rem;border:0;border-radius:999px;background:none;color:var(--o-muted,#66728f);font:inherit;font-weight:700;cursor:pointer}
.os-toggle button.on{background:var(--o-accent,#6c63ff);color:#fff;box-shadow:0 6px 16px color-mix(in srgb,var(--o-accent,#6c63ff) 35%,transparent)}
.os-modal{position:fixed;inset:0;z-index:2200;display:grid;place-items:center;padding:1rem}.os-modal[hidden]{display:none}
.os-modal-bg{position:absolute;inset:0;background:rgba(8,12,24,.6);backdrop-filter:blur(3px)}
.os-modal-box{position:relative;width:min(520px,100%);padding:2.4rem 2rem 2rem;border-radius:24px;background:var(--o-surface,#fff);text-align:center;box-shadow:0 40px 90px rgba(0,0,0,.45);animation:osPop .4s cubic-bezier(.2,1.2,.4,1)}
@keyframes osPop{from{opacity:0;transform:translateY(24px) scale(.94)}to{opacity:1;transform:none}}
.os-modal-x{position:absolute;top:.8rem;right:.9rem;width:34px;height:34px;border:0;border-radius:10px;background:var(--o-surface-2,#eef1f8);color:var(--o-text,#18203a);font-size:1.4rem;line-height:1;cursor:pointer}
.os-modal-ico{display:grid;place-items:center;width:76px;height:76px;margin:0 auto 1rem;border-radius:22px;background:var(--os-soft);font-size:2.2rem;color:var(--o-accent,#6c63ff)}
.os-modal-box h2{margin:0 0 .8rem;font-size:1.7rem;color:var(--o-text,#18203a)}.os-modal-box p{margin:0 0 .8rem;color:var(--o-muted,#66728f)}
.os-modal-box .os-modal-foot{margin:1rem 0 0;color:var(--o-text,#18203a);font-weight:700}

/* promotions page */
.os-pagehead{padding:3rem 0 2.6rem;background:linear-gradient(180deg,color-mix(in srgb,var(--o-accent,#6c63ff) 14%,var(--o-surface,#fff)),var(--o-bg,#f3f5fa));border-bottom:1px solid var(--o-border,#dde3f0)}
.os-pagehead h1{margin:0 0 .5rem;font-size:clamp(1.9rem,4vw,2.9rem);text-transform:uppercase;letter-spacing:-.01em;color:var(--o-text,#18203a)}
.os-pagehead p{margin:0;max-width:720px;color:var(--o-muted,#66728f);font-size:1.05rem}
.os-narrow-lg{max-width:1000px}
.os-promos{padding:3rem 0 4rem}
.os-pcard{margin-bottom:2rem;background:var(--o-surface,#fff);border:1px solid var(--o-border,#dde3f0);border-radius:16px;box-shadow:var(--os-shadow);overflow:hidden}
.os-pcard-h{padding:1.1rem 1.5rem;border-bottom:1px solid var(--o-border,#dde3f0);font-weight:700;font-size:1.02rem}
.os-pcard-h.green{color:var(--o-accent-2,#12a37a)}.os-pcard-h.red{color:#e5384b}
.os-pcard-b{padding:1.2rem 1.4rem}
.os-pempty{padding:2.2rem 1rem;text-align:center;color:var(--o-muted,#66728f)}.os-pempty i{font-size:2.2rem;margin-bottom:.6rem;color:var(--o-accent,#6c63ff)}
.os-promo{margin-bottom:.8rem;border:1px solid var(--o-border,#dde3f0);border-radius:12px;background:var(--o-surface,#fff);overflow:hidden}
.os-promo[open]{border-color:var(--o-accent,#6c63ff)}
.os-promo summary{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:1.05rem 1.3rem;cursor:pointer;font-weight:700;color:var(--o-text,#18203a);list-style:none}
.os-promo[open] summary{background:color-mix(in srgb,var(--o-accent,#6c63ff) 10%,transparent);color:var(--o-accent,#6c63ff)}
.os-promo summary::-webkit-details-marker{display:none}
.os-promo summary:after{content:"\f054";font-family:"Font Awesome 5 Free";font-weight:900;font-size:.75rem;transition:.2s}
.os-promo[open] summary:after{transform:rotate(90deg)}
.os-exp-tag{font-style:normal;color:#e5584a}
.os-promo.is-expired summary{color:var(--o-text,#18203a)}
.os-promo-b{padding:1.2rem 1.6rem 1.4rem}
.os-promo-b ul{list-style:none;margin:0;padding:0;display:grid;gap:.9rem}
.os-promo-b li{display:flex;align-items:center;flex-wrap:wrap;gap:.6rem;color:var(--o-text,#18203a);font-size:.92rem}
.os-promo-b li>i{width:20px;text-align:center;color:var(--o-text,#18203a)}
.os-promo-b li>span:first-of-type{font-weight:600}
.os-promo-b li b{font-weight:700}
.os-code{padding:.2rem .65rem;border-radius:7px;background:color-mix(in srgb,var(--o-accent-2,#12a37a) 14%,transparent);color:var(--o-accent-2,#12a37a);font-weight:700;font-family:Consolas,monospace;border:1px solid color-mix(in srgb,var(--o-accent-2,#12a37a) 35%,transparent)}
.os-copy{padding:.25rem .7rem;border:1px solid var(--o-border,#dde3f0);border-radius:8px;background:var(--o-surface,#fff);color:var(--o-muted,#66728f);font:inherit;font-size:.8rem;font-weight:600;cursor:pointer}.os-copy:hover{color:var(--o-accent,#6c63ff);border-color:var(--o-accent,#6c63ff)}.os-copy.done{color:var(--o-accent-2,#12a37a);border-color:var(--o-accent-2,#12a37a)}
.os-chip{padding:.25rem .7rem;border-radius:7px;background:color-mix(in srgb,var(--o-accent,#6c63ff) 12%,transparent);color:var(--o-accent,#6c63ff);font-size:.8rem;font-weight:600;border-left:3px solid var(--o-accent,#6c63ff)}
.os-chip.blue{background:color-mix(in srgb,#2f7bff 12%,transparent);color:#2f6fe0;border-color:#2f7bff}
.os-left{font-style:normal;padding:.15rem .65rem;border-radius:999px;background:color-mix(in srgb,var(--o-accent-2,#12a37a) 15%,transparent);color:var(--o-accent-2,#12a37a);font-size:.76rem;font-weight:700}.os-left.soon{background:rgba(229,56,75,.13);color:#e5384b}
.os-promo-act{margin-top:1.2rem}
.os-promo.is-expired .os-promo-b{opacity:.8}
/* highlighted menu item + promo band */
.os-menu>ul>li.os-hot-li>a.os-hot{background:linear-gradient(135deg,#e5384b,#c2185b);color:#fff!important;box-shadow:0 8px 18px rgba(229,56,75,.3)}
.os-menu>ul>li.os-hot-li>a.os-hot:hover{filter:brightness(1.08);background:linear-gradient(135deg,#e5384b,#c2185b);color:#fff!important}
.os-promoband{padding:2.2rem 0;background:linear-gradient(135deg,color-mix(in srgb,var(--o-accent,#6c63ff) 78%,#fff),var(--o-accent,#6c63ff));color:#fff}
.os-promoband .os-wrap{display:flex;justify-content:space-between;align-items:center;gap:1.5rem;flex-wrap:wrap}
.os-promoband h3{margin:0 0 .25rem;color:#fff;font-size:1.4rem}.os-promoband p{margin:0;color:rgba(255,255,255,.88)}
.os-btn-hot{background:linear-gradient(135deg,#e5384b,#c2185b);color:#fff!important;box-shadow:0 10px 24px rgba(229,56,75,.35)}.os-btn-hot:hover{filter:brightness(1.1)}

/* ================= blog ================= */
.osb-hero{padding:3.2rem 0 3rem}
.osb-hero-in{display:grid;grid-template-columns:1.2fr .8fr;gap:2.5rem;align-items:center}.osb-hero-in:not(:has(.osb-hero-img)){grid-template-columns:1fr}
.osb-hero h1{text-transform:none;font-size:clamp(2rem,4.2vw,3.1rem)}
.osb-hero .os-cta{margin-top:1.3rem}
.osb-hero-img img{display:block;width:100%;max-height:300px;object-fit:contain;filter:drop-shadow(0 20px 40px rgba(16,24,40,.2))}
@media(max-width:800px){.osb-hero-in{grid-template-columns:1fr}.osb-hero-img{display:none}}
.osb-list{padding:2.4rem 0 4.5rem}
.osb-toolbar{display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap;margin-bottom:1.6rem}
.osb-search{position:relative;display:flex;gap:.5rem;flex:1;max-width:480px;min-width:260px}
.osb-search i{position:absolute;left:1rem;top:50%;transform:translateY(-50%);color:var(--o-muted,#66728f)}
.osb-search input{flex:1;padding:.75rem 1rem .75rem 2.6rem;border:1px solid var(--o-border,#dde3f0)!important;border-radius:12px!important;background:var(--o-surface,#fff)!important;color:var(--o-text,#18203a)!important;font:inherit}
.osb-search input:focus{outline:none;border-color:var(--o-accent,#6c63ff)!important;box-shadow:0 0 0 4px var(--os-soft)}
.osb-chips{display:flex;gap:.4rem;flex-wrap:wrap}.osb-chips a{padding:.45rem .95rem;border:1px solid var(--o-border,#dde3f0);border-radius:999px;background:var(--o-surface,#fff);color:var(--o-text,#18203a)!important;font-weight:600;font-size:.86rem}
.osb-chips a em{font-style:normal;color:var(--o-muted,#66728f);font-size:.78rem}.osb-chips a:hover{border-color:var(--o-accent,#6c63ff);color:var(--o-accent,#6c63ff)!important}
.osb-chips a.on{background:var(--o-accent,#6c63ff);border-color:var(--o-accent,#6c63ff);color:#fff!important}.osb-chips a.on em{color:rgba(255,255,255,.8)}
.osb-found{margin:0 0 1.2rem;color:var(--o-muted,#66728f)}
.osb-feat{display:grid;grid-template-columns:1.1fr 1fr;gap:0;margin-bottom:2rem;background:var(--o-surface,#fff);border:1px solid var(--o-border,#dde3f0);border-radius:22px;box-shadow:var(--os-shadow);overflow:hidden}
.osb-feat-img{display:block;min-height:280px;background:var(--o-surface-2,#eef1f8)}.osb-feat-img img{display:block;width:100%;height:100%;object-fit:cover}
.osb-feat-b{display:flex;flex-direction:column;align-items:flex-start;gap:.8rem;padding:2rem 2.2rem;justify-content:center}
.osb-feat-b h2{margin:0;font-size:clamp(1.4rem,2.6vw,2rem);line-height:1.2}.osb-feat-b h2 a{color:var(--o-text,#18203a)!important}.osb-feat-b p{margin:0;color:var(--o-muted,#66728f)}
.osb-badge{padding:.25rem .8rem;border-radius:999px;background:color-mix(in srgb,#f5b84b 22%,transparent);color:#a8730a;font-size:.78rem;font-weight:700}
@media(max-width:800px){.osb-feat{grid-template-columns:1fr}.osb-feat-img{min-height:200px}}
.osb-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1.6rem}
.osb-card{display:flex;flex-direction:column;background:var(--o-surface,#fff);border:1px solid var(--o-border,#dde3f0);border-radius:18px;overflow:hidden;transition:.2s}
.osb-card:hover{transform:translateY(-5px);border-color:var(--o-accent,#6c63ff);box-shadow:var(--os-shadow)}
.osb-cover{display:block;aspect-ratio:16/9;background:var(--o-surface-2,#eef1f8);overflow:hidden}.osb-cover img{display:block;width:100%;height:100%;object-fit:cover;transition:.4s}.osb-card:hover .osb-cover img{transform:scale(1.04)}
.osb-ph{display:grid;place-items:center;width:100%;height:100%;min-height:150px;background:linear-gradient(135deg,color-mix(in srgb,var(--o-accent,#6c63ff) 20%,transparent),color-mix(in srgb,var(--o-accent-2,#12a37a) 18%,transparent));color:var(--o-accent,#6c63ff);font-size:2.2rem}
.osb-card-b{display:flex;flex-direction:column;flex:1;gap:.65rem;padding:1.3rem 1.4rem 1.4rem}
.osb-cat{align-self:flex-start;padding:.2rem .75rem;border-radius:999px;background:var(--os-soft);color:var(--o-accent,#6c63ff)!important;font-size:.76rem;font-weight:700}
.osb-card h3{margin:0;font-size:1.15rem;line-height:1.35}.osb-card h3 a{color:var(--o-text,#18203a)!important}.osb-card h3 a:hover{color:var(--o-accent,#6c63ff)!important}
.osb-card p{margin:0;color:var(--o-muted,#66728f);font-size:.93rem;line-height:1.6}
.osb-foot{display:flex;justify-content:space-between;align-items:center;gap:.6rem;margin-top:auto;padding-top:.6rem;color:var(--o-muted,#66728f);font-size:.8rem}.osb-foot i{margin-right:.2rem}
.osb-more{color:var(--o-accent,#6c63ff)!important;font-weight:700;font-size:.88rem}.osb-more i{transition:.2s}.osb-card:hover .osb-more i{transform:translateX(4px)}
.osb-pages{display:flex;justify-content:center;align-items:center;gap:.4rem;margin-top:2.6rem;flex-wrap:wrap}
.osb-pages a,.osb-pages span{display:grid;place-items:center;min-width:42px;height:42px;padding:0 .6rem;border:1px solid var(--o-border,#dde3f0);border-radius:12px;background:var(--o-surface,#fff);color:var(--o-text,#18203a)!important;font-weight:700}
.osb-pages a:hover{border-color:var(--o-accent,#6c63ff);color:var(--o-accent,#6c63ff)!important}.osb-pages .cur{background:var(--o-accent,#6c63ff);border-color:var(--o-accent,#6c63ff);color:#fff!important}.osb-pages .gap,.osb-pages .off{border:0;background:none;opacity:.5}
/* single post */
.osb-progress{position:fixed;top:0;left:0;right:0;height:4px;z-index:1100;background:transparent}.osb-progress i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--o-accent,#6c63ff),var(--o-accent-2,#12a37a));transition:width .1s}
.osb-narrow{max-width:820px}
.osb-phead{padding:2.6rem 0 1.6rem;background:linear-gradient(180deg,color-mix(in srgb,var(--o-accent,#6c63ff) 10%,var(--o-surface,#fff)),transparent)}
.osb-crumbs{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;margin-bottom:1rem;color:var(--o-muted,#66728f);font-size:.88rem}.osb-crumbs i{font-size:.6rem}.osb-crumbs a{color:var(--o-accent,#6c63ff)!important;font-weight:600}.osb-crumbs span{color:var(--o-text,#18203a)}
.osb-phead h1{margin:0 0 1rem;font-size:clamp(1.8rem,4vw,2.8rem);line-height:1.18;color:var(--o-text,#18203a)}
.osb-meta{display:flex;align-items:center;gap:1.1rem;flex-wrap:wrap;color:var(--o-muted,#66728f);font-size:.9rem}.osb-meta i{margin-right:.3rem}
.osb-pcover{display:block;width:100%;max-height:440px;object-fit:cover;margin:0 0 2rem;border-radius:20px;box-shadow:var(--os-shadow)}
.osb-prose{font-size:1.07rem;line-height:1.85;color:var(--o-text,#18203a)}
.osb-prose p,.osb-prose li{color:var(--o-text,#18203a)}
.osb-prose p{margin:0 0 1.2rem}
.osb-prose h2{margin:2.4rem 0 .9rem;padding-bottom:.5rem;font-size:1.65rem;line-height:1.3;border-bottom:1px solid var(--o-border,#dde3f0);color:var(--o-text,#18203a)}
.osb-prose h3{margin:1.8rem 0 .7rem;font-size:1.28rem;color:var(--o-text,#18203a)}.osb-prose h4{margin:1.4rem 0 .5rem;font-size:1.08rem}
.osb-prose ul,.osb-prose ol{margin:0 0 1.3rem;padding-left:1.4rem}.osb-prose li{margin:.35rem 0}
.osb-prose a{color:var(--o-accent,#6c63ff)!important;text-decoration:underline;text-underline-offset:3px}
.osb-prose img{display:block;max-width:100%;height:auto;margin:1.6rem auto;border-radius:14px}
.osb-prose blockquote{margin:1.6rem 0;padding:1.1rem 1.4rem;border-left:4px solid var(--o-accent,#6c63ff);border-radius:0 14px 14px 0;background:var(--os-soft)}.osb-prose blockquote p:last-child{margin:0}
.osb-prose pre{margin:1.4rem 0;padding:1.1rem 1.3rem;border-radius:14px;background:#0f172a;color:#d6deff;overflow:auto;font-size:.9rem;line-height:1.6}
.osb-prose code{padding:.12rem .45rem;border-radius:6px;background:var(--o-surface-2,#eef1f8);font-size:.9em}.osb-prose pre code{padding:0;background:none}
.osb-prose hr{margin:2.2rem 0;border:0;border-top:2px solid var(--o-border,#dde3f0)}
.osb-prose table{width:100%;margin:1.5rem 0;border-collapse:collapse;display:block;overflow-x:auto}.osb-prose th,.osb-prose td{padding:.7rem .9rem;border:1px solid var(--o-border,#dde3f0);text-align:left}.osb-prose th{background:var(--o-surface-2,#eef1f8)}
.osb-toc{margin:0 0 2rem;padding:1.2rem 1.4rem;border:1px solid var(--o-border,#dde3f0);border-radius:16px;background:var(--o-surface,#fff)}
.osb-toc b{display:block;margin-bottom:.6rem;font-size:.82rem;letter-spacing:.08em;text-transform:uppercase;color:var(--o-muted,#66728f)}
.osb-toc ol{margin:0;padding-left:1.2rem}.osb-toc li{margin:.3rem 0}.osb-toc a{color:var(--o-text,#18203a)!important;text-decoration:none;font-weight:500}.osb-toc a:hover{color:var(--o-accent,#6c63ff)!important}
.osb-tags{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;margin:2rem 0 1rem;color:var(--o-muted,#66728f)}.osb-tags a{padding:.28rem .8rem;border-radius:999px;background:var(--o-surface-2,#eef1f8);color:var(--o-text,#18203a)!important;font-size:.84rem;font-weight:600}.osb-tags a:hover{color:var(--o-accent,#6c63ff)!important}
.osb-links{display:flex;gap:.7rem;flex-wrap:wrap;margin:1.6rem 0;padding:1.4rem;border:1px solid var(--o-border,#dde3f0);border-radius:18px;background:var(--o-surface,#fff)}
.osb-share{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;margin:1.6rem 0 0;padding-top:1.4rem;border-top:1px solid var(--o-border,#dde3f0)}
.osb-share b{margin-right:.4rem}.osb-share a,.osb-share button{display:inline-grid;place-items:center;min-width:42px;height:42px;padding:0 .8rem;border:1px solid var(--o-border,#dde3f0);border-radius:12px;background:var(--o-surface,#fff);color:var(--o-text,#18203a)!important;font:inherit;font-weight:600;font-size:.88rem;cursor:pointer}
.osb-share a:hover,.osb-share button:hover{border-color:var(--o-accent,#6c63ff);color:var(--o-accent,#6c63ff)!important}.osb-share button.done{color:var(--o-accent-2,#12a37a)!important;border-color:var(--o-accent-2,#12a37a)}
.osb-related{background:var(--o-surface-2,#eef1f8);margin-top:3rem}.osb-related .os-head{margin-bottom:1.6rem}.osb-related .os-head h2{font-size:1.7rem}