/* Liney 2026 — editorial, Linux-first product design. */
:root {
  color-scheme: light;
  --bg: #f7f8f3;
  --paper: #fffefa;
  --ink: #17251f;
  --subtle: #6e8075;
  --muted: #53655c;
  --green: #38e59a;
  --green-deep: #157951;
  --green-soft: #def9e8;
  --border: #dce6dc;
  --shadow: 0 22px 65px rgba(23,37,31,.085);
  font-family: "Noto Sans Thai", Inter, "Segoe UI", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
  font-synthesis: none;
  font-optical-sizing: auto;
  -webkit-font-smoothing: antialiased;
  color: var(--ink);
  background: var(--bg);
}
* { box-sizing: border-box; }
html { min-width: 320px; scroll-behavior: smooth; scroll-padding-top: 90px; }
body { margin: 0; min-width: 320px; overflow-x: hidden; line-height: 1.65; background: var(--bg); }
a { color: inherit; text-decoration: none; }
a, button { -webkit-tap-highlight-color: transparent; }
a:focus-visible, button:focus-visible, select:focus-visible, summary:focus-visible { outline: 3px solid #008751; outline-offset: 4px; }
button, select, input { font: inherit; }
button { cursor: pointer; }
h1,h2,h3,h4,p { margin-top: 0; }
h1,h2,h3 { line-height: 1.16; letter-spacing: -.048em; }
h1 { font-size: clamp(3.6rem, 6vw, 6.4rem); }
h2 { font-size: clamp(2.75rem, 4.4vw, 5rem); }
h3 { font-size: clamp(1.45rem, 2.4vw, 2.15rem); }
p { color: var(--muted); }
img { max-width: 100%; }
.container { width: min(1216px, calc(100% - 64px)); margin: 0 auto; }
.skip-link { position: absolute; z-index: 100; background: var(--ink); color: #fff; padding: .7rem 1rem; transform: translateY(-160%); border-radius: .5rem; }
.skip-link:focus { transform: translateY(10px); }
.site-header { position: sticky; top: 0; z-index: 50; background: rgba(250,251,247,.91); border-bottom: 1px solid var(--border); backdrop-filter: blur(20px); }
.nav-shell { display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 80px; }
.brand { display: inline-flex; align-items: center; gap: .56rem; white-space: nowrap; font-weight: 900; letter-spacing: -.055em; }
.brand img { width: 43px; height: 43px; object-fit: contain; }
.brand-name { color: var(--ink); font-size: 2rem; line-height: 1; }
.brand-dot { color: #2edb89; }
.brand-note { border-left: 1px solid #becfc3; padding-left: .8rem; margin-left: .45rem; color: #6c8275; font-size: .68rem; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.site-nav { display: flex; align-items: center; gap: .25rem; }
.site-nav a { padding: .6rem .85rem; border-radius: .55rem; color: #4b6154; font-weight: 700; font-size: .88rem; transition: background .2s, color .2s; }
.site-nav a:hover, .site-nav a[aria-current="page"]:not(.nav-cta) { color: #087a4c; background: #e7f6eb; }
.site-nav .nav-cta { display: inline-flex; align-items: center; gap: .6rem; margin-left: .5rem; padding: .77rem 1.12rem; border-radius: .7rem; background: var(--ink); color: white; }
.site-nav .nav-cta:hover, .site-nav .nav-cta[aria-current="page"] { color: #fff; background: #126747; }
.nav-toggle { display: none; width: 43px; height: 43px; padding: 11px; align-items: center; justify-content: center; flex-direction: column; gap: 5px; border: 1px solid #d8e5d9; background: var(--paper); border-radius: .7rem; }
.nav-toggle span { width: 20px; height: 2px; display: block; background: var(--ink); border-radius: 2px; }
.button { display: inline-flex; align-items: center; justify-content: center; gap: 1rem; min-height: 52px; padding: .85rem 1.33rem; border: 1.5px solid var(--ink); border-radius: .8rem; font-size: .95rem; font-weight: 800; line-height: 1.2; transition: transform .2s, box-shadow .2s, background .2s; text-align: center; }
.button:hover { transform: translateY(-3px); box-shadow: 0 9px 24px rgba(26,56,39,.13); }
.button-dark { color: #fff; background: var(--ink); }
.button-dark:hover { color: #fff; background: #116d4b; }
.button-outline { color: var(--ink); background: transparent; border-color: #c5d8cb; }
.button-outline:hover { background: #edf8ef; }
.button-light { color: var(--ink); background: var(--paper); border-color: #fff; }
.section { padding: 115px 0; }
.section-index { display: block; margin-bottom: 1.4rem; color: #238257; font: 850 .78rem/1.4 ui-monospace, SFMono-Regular, Consolas, monospace; letter-spacing: .08em; }
.section-heading { display: flex; align-items: end; justify-content: space-between; gap: 3rem; margin-bottom: 3.3rem; }
.section-heading h2 { margin-bottom: 0; }
.section-heading h2 em, .architecture-copy h2 em, .download-promo h2 em, .download-intro h1 em, .faq-layout h2 em { font-weight: inherit; font-style: normal; color: #15834f; }
.section-heading > p { max-width: 375px; margin: 0 0 .2rem; font-size: 1rem; line-height: 1.8; }
.fine-print { font-size: .83rem; color: #617369; margin: 1.3rem 0 0; }
.fine-print a, .text-link { color: #0d8150; font-weight: 800; text-decoration: underline; text-underline-offset: .22em; }
.status { display: inline-flex; align-items: center; gap: .35rem; width: max-content; max-width: 100%; padding: .37rem .66rem; border-radius: 99px; font-size: .72rem; font-weight: 800; letter-spacing: 0; line-height: 1.3; white-space: nowrap; }
.status.ready { background: #d9f9e5; color: #116a43; }
.status.preview { background: #fff0d1; color: #875406; }
.status.verify { background: #e5edff; color: #405e93; }
.status.idea { background: #e9eee9; color: #627069; }

.hero { overflow: hidden; position: relative; background: #f7f8f3; }
.hero-content { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1.04fr); gap: 2rem; align-items: center; min-height: 710px; padding-top: 3.1rem; padding-bottom: 4rem; }
.hero-copy { position: relative; z-index: 2; }
.kicker { display: flex; gap: .62rem; align-items: center; margin-bottom: 1.7rem; color: #4e6d59; font: 850 .78rem ui-monospace, SFMono-Regular, monospace; letter-spacing: .07em; }
.kicker-dot { width: 9px; height: 9px; border-radius: 50%; background: #15c878; box-shadow: 0 0 0 5px #d4f6df; }
.hero h1 { margin-bottom: 1.6rem; max-width: 680px; font-size: clamp(3.6rem,5.9vw,6rem); line-height: 1.11; letter-spacing: -.072em; }
.hero h1 em { font-style: normal; color: #0e9959; }
.headline-period { color: #15bd77; }
.hero-subtitle { max-width: 530px; margin-bottom: 1.95rem; line-height: 1.85; font-size: clamp(1.01rem,1.3vw,1.17rem); }
.hero-actions { display: flex; align-items: center; flex-wrap: wrap; gap: .8rem; }
.hero-footnote { display: flex; align-items: center; gap: .8rem; margin-top: 2.8rem; }
.mini-avatar { display: grid; place-items: center; width: 40px; height: 40px; background: #d5f9e2; border: 1px solid #a4dabc; color: #187b51; border-radius: 50%; font-weight: 900; }
.hero-footnote strong,.hero-footnote small { display: block; }
.hero-footnote strong { font-size: .79rem; }
.hero-footnote small { color: #778b7e; font-size: .71rem; }
.showcase { display: grid; position: relative; min-height: 570px; place-items: center; isolation: isolate; }
.showcase-disc { position: absolute; z-index: -2; border-radius: 50%; }
.show-disc-one { width: 610px; height: 610px; right: -95px; top: -13px; background: #baf4d3; }
.show-disc-two { width: 490px; height: 490px; right: -85px; bottom: -130px; border: 1px solid rgba(18,123,79,.16); }
.mock-app { width: 100%; max-width: 600px; height: 426px; background: white; border-radius: 1rem; border: 1px solid rgba(25,59,39,.16); box-shadow: 12px 25px 0 -4px rgba(24,82,51,.17), 0 40px 80px rgba(22,68,44,.23); overflow: hidden; transform: rotate(-3.25deg); }
.mock-toolbar { height: 43px; display: flex; align-items: center; gap: .8rem; padding: 0 1rem; border-bottom: 1px solid #e4eae4; color: #718078; font-size: .7rem; font-weight: 700; }
.mock-dots { display: flex; gap: .33rem; }
.mock-dots i { width: 8px; height: 8px; display: block; border-radius: 50%; background: #ffada4; }
.mock-dots i:nth-child(2) { background: #f5d680; }
.mock-dots i:nth-child(3) { background: #95e2ad; }
.mock-search { margin-left: auto; font-size: 1.35rem; }
.mock-body { display: grid; grid-template-columns: 39% 61%; height: calc(100% - 43px); }
.mock-sidebar { position: relative; border-right: 1px solid #e0e8e1; background: #fbfdfb; padding: 1rem .55rem; overflow: hidden; }
.mock-sidebar-brand { display: flex; gap: .65rem; align-items: center; padding: .1rem .4rem .8rem; font-size: 1.04rem; font-weight: 850; }
.mock-sidebar-brand img { width: 28px; height: 28px; }
.mock-sidebar-brand b { margin-left: auto; font-size: 1.2rem; }
.mock-filter { background: #edf3ef; border-radius: .55rem; margin: .15rem .3rem .7rem; padding: .5rem .65rem; color: #92a299; font-size: .67rem; }
.mock-chat { display: flex; align-items: center; padding: .6rem .4rem; gap: .6rem; border-radius: .66rem; }
.mock-chat.active { background: #e0f9e8; }
.mock-avatar { flex: 0 0 auto; width: 31px; height: 31px; display: grid; place-items: center; border-radius: 50%; font-weight: 800; font-size: .8rem; color: #25533d; }
.mock-avatar.green { background: #92e6b1; }
.mock-avatar.peach { background: #ffcdb5; color: #7d5035; }
.mock-avatar.lilac { background: #ddd1fc; color: #67518d; }
.mock-chat > span:nth-child(2) { min-width: 0; }
.mock-chat b,.mock-chat small { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mock-chat b { font-size: .7rem; }
.mock-chat small { color: #91a299; font-size: .58rem; }
.mock-chat time { margin-left: auto; align-self: flex-start; font-size: .5rem; color: #6c9679; }
.mock-sidebar-bottom { position: absolute; bottom: 0; left: 0; right: 0; padding: .65rem; display: flex; justify-content: space-around; border-top: 1px solid #e0e8e1; color: #5b886d; font-size: .65rem; }
.mock-thread { position: relative; display: flex; flex-direction: column; min-width: 0; }
.mock-thread-head { height: 60px; padding: .7rem; display: flex; gap: .6rem; align-items: center; border-bottom: 1px solid #e4eae4; }
.mock-thread-head b,.mock-thread-head small { display: block; }
.mock-thread-head b { font-size: .75rem; }
.mock-thread-head small { color: #8a9e90; font-size: .58rem; }
.mock-thread-controls { margin-left: auto; font-size: 1.2rem; color: #5d8970; }
.mock-messages { flex: 1; display: flex; flex-direction: column; align-items: flex-start; padding: 1rem .8rem; gap: .75rem; background: #f6faf7; }
.mock-date { align-self: center; background: #e7eee8; color: #7d9585; padding: .1rem .55rem; border-radius: 2rem; font-size: .55rem; }
.mock-bubble { max-width: 82%; padding: .56rem .72rem; border-radius: 1rem; font-size: .7rem; }
.mock-bubble.incoming { background: #fff; border-bottom-left-radius: .2rem; box-shadow: 0 3px 8px rgba(10,70,40,.05); }
.mock-bubble.outgoing { align-self: flex-end; background: #b2f4c7; border-bottom-right-radius: .2rem; }
.mock-time { align-self: flex-end; font-size: .55rem; color: #8b9e91; }
.mock-compose { height: 49px; display: flex; align-items: center; gap: 1rem; padding: .4rem .8rem; color: #a1afa6; border-top: 1px solid #edf0ed; font-size: .7rem; }
.mock-compose span:first-child { font-size: 1.5rem; color: #78a88b; }
.mock-compose b { display: grid; place-items: center; margin-left: auto; width: 24px; height: 24px; border-radius: 50%; background: #46d687; color: #fff; font-size: 1rem; }
.floating-chip { position: absolute; z-index: 3; display: flex; align-items: center; gap: .57rem; padding: .66rem .93rem; background: white; border: 1px solid #cce5d4; box-shadow: 0 14px 35px rgba(9,93,50,.16); border-radius: .8rem; font-weight: 800; font-size: .72rem; }
.chip-icon { display: grid; place-items: center; width: 26px; height: 26px; border-radius: .55rem; background: #d8f9e3; color: #17864e; }
.chip-top { top: 45px; right: -28px; transform: rotate(4deg); }
.chip-bottom { bottom: 64px; left: -25px; transform: rotate(-4deg); }
.mock-caption { position: absolute; bottom: -18px; right: 0; color: #7a8e80; font-size: .69rem; }
.hero-edge { border-top: 1px solid #e0e8df; }
.edge-inner { display: flex; justify-content: space-between; align-items: center; min-height: 55px; gap: 1rem; font: 700 .69rem ui-monospace, SFMono-Regular, monospace; letter-spacing: .1em; color: #7c907f; }
.ticker { background: var(--ink); color: #d5f9e3; overflow: hidden; }
.ticker-track { display: flex; align-items: center; justify-content: space-around; gap: 2rem; width: max-content; min-width: 100%; height: 85px; padding: 0 2rem; white-space: nowrap; font: 900 clamp(.77rem,1.1vw,1rem) ui-monospace, monospace; letter-spacing: .11em; }
.ticker-track i { font-style: normal; font-size: 1.45rem; color: #3de394; }


/* Product sections */
.features { background: #fffefa; }
.bento { display: grid; grid-template-columns: repeat(12,minmax(0,1fr)); grid-auto-flow: dense; gap: 1.12rem; }
.bento-card { position: relative; display: flex; flex-direction: column; min-height: 325px; overflow: hidden; border-radius: 1.28rem; padding: 1.65rem; border: 1px solid #dce9dd; background: #f2f7f0; }
.bento-card h3 { max-width: 470px; margin: 0 0 .7rem; font-size: 1.7rem; letter-spacing: -.04em; }
.bento-card p { max-width: 450px; margin: 0; font-size: .92rem; line-height: 1.8; }
.bento-card .card-top { display: flex; align-items: center; justify-content: space-between; gap: .7rem; margin-bottom: 2rem; }
.feature-number { color: #648376; font: 800 .8rem ui-monospace, monospace; }
.bento-text { position: relative; z-index: 2; }
.bento-chat { grid-column: span 7; min-height: 435px; background: #d7f9e1; }
.bento-official { grid-column: span 5; min-height: 435px; background: #eaf3ff; border-color: #d7e6f5; }
.bento-calls { grid-column: span 4; background: #f4eee5; border-color: #e8dfd1; }
.bento-album { grid-column: span 4; background: #f5ecf8; border-color: #ebddf0; }
.bento-native { grid-column: span 4; background: #ebf0ed; }
.bento-local { grid-column: span 12; min-height: 235px; background: var(--ink); color: white; padding-right: 36%; }
.bento-local p { color: #afc6b9; }
.bento-local .feature-number { color: #add6bf; }
.bento-local .status.ready { background: #234834; color: #a4f7cc; }
.bento-local .card-top { margin-bottom: .5rem; }
.mini-conversation { position: relative; display: flex; flex-direction: column; gap: .55rem; align-self: flex-end; width: min(345px,87%); margin: 1rem .3rem -2rem 0; padding: 1.3rem; border-radius: 1.2rem; background: #fff; box-shadow: 0 12px 30px rgba(11,89,44,.12); transform: rotate(-3deg); }
.mini-conversation-row { display: flex; align-items: center; gap: .5rem; font-size: .75rem; font-weight: 700; }
.mini-face { display: grid; place-items: center; width: 29px; height: 29px; border-radius: 50%; background: #d9f8e1; color: #228253; }
.mini-conversation-reply { align-self: end; padding: .5rem .8rem; border-radius: 1rem 1rem .2rem 1rem; background: #bbf7d2; font-size: .77rem; }
.mini-conversation-reply b { color: #348966; font-size: .64rem; }
.oa-mock { display: flex; gap: .8rem; align-items: flex-start; margin: auto -1rem -2rem auto; width: min(320px,100%); padding: 1.05rem; border: 1px solid #d8e5f7; background: #fff; border-radius: 1.2rem; box-shadow: 0 13px 25px rgba(37,79,133,.1); transform: rotate(4deg); }
.oa-mark { display: grid; place-items: center; width: 40px; height: 40px; flex: 0 0 auto; border-radius: .8rem; background: #dae8ff; color: #3a6393; font-weight: 900; }
.oa-mock > div { flex: 1; }
.oa-mock b,.oa-mock span:not(.oa-mark) { display: block; }
.oa-mock b { font-size: .8rem; }
.oa-mock div span { font-size: .63rem; color: #7791aa; margin-top: .24rem; }
.oa-lines { display: flex; gap: .3rem; margin-top: .85rem; }
.oa-lines i { display: block; height: 19px; border-radius: .28rem; flex: 1; background: #d8e9fc; }
.oa-lines i:first-child { background: #b4d0f3; flex: 1.5; }
.call-orb { width: 145px; height: 145px; display: grid; place-items: center; position: absolute; right: 18px; bottom: -25px; border-radius: 50%; background: #e5d9c3; }
.call-orb > div { display: grid; place-items: center; width: 78px; height: 78px; border-radius: 50%; background: #16382a; color: #fff; font-size: 2.3rem; transform: rotate(-25deg); }
.orb-ring { position: absolute; inset: 16px; border: 1px solid #c7bca9; border-radius: 50%; }
.album-art { display: flex; align-items: end; gap: .5rem; height: 75px; position: absolute; bottom: -14px; right: 16px; transform: rotate(-7deg); }
.album-art span { width: 67px; height: 82px; border: 5px solid #fff; border-radius: .35rem; box-shadow: 0 8px 18px rgba(83,48,90,.13); background: linear-gradient(145deg,#ffbcbd,#d9a9e9); transform: rotate(5deg); }
.album-art span:nth-child(2) { transform: translateY(-17px) rotate(-7deg); background: linear-gradient(145deg,#b0d7ec,#8de0be); }
.album-art span:nth-child(3) { transform: translateY(7px) rotate(12deg); background: linear-gradient(145deg,#ffcfa3,#ef96b7); }
.platform-tags { display: flex; flex-wrap: wrap; gap: .3rem; margin-top: auto; padding-top: 1.3rem; }
.platform-tags span { font-size: .65rem; padding: .35rem .55rem; background: white; border: 1px solid #dae4db; border-radius: 99px; color: #45715b; font-weight: 800; }
.local-art { position: absolute; right: 7%; top: 16%; width: 200px; height: 200px; border-radius: 50%; display: flex; flex-direction: column; align-items: center; justify-content: center; background: #304c3c; border: 1px solid #537c65; box-shadow: 0 0 0 18px #284536,0 0 0 40px rgba(57,102,71,.45); transform: rotate(-11deg); }
.local-art span { font-size: 4rem; color: #91edb9; }
.local-art b { font: 850 .73rem ui-monospace,monospace; color: #c6f6db; }
.architecture-section { background: #17251f; color: white; }
.architecture-layout { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 7rem; align-items: center; }
.architecture-copy .section-index { color: #75e4a9; }
.architecture-copy h2 { margin-bottom: 1.5rem; }
.architecture-copy h2 em { color: #5fecab; }
.architecture-copy p { max-width: 540px; color: #aec3b6; font-size: 1.05rem; line-height: 1.85; margin-bottom: 1.8rem; }
.architecture-diagram { border: 1px solid #3c5949; padding: 1.8rem; border-radius: 1.4rem; background: #20372b; }
.diagram-node { background: #f5fff9; border-radius: .85rem; padding: 1.05rem 1.45rem; display: flex; flex-direction: column; }
.diagram-node span { color: #42865f; font: 800 .67rem ui-monospace,monospace; margin-bottom: .4rem; }
.diagram-node b { color: #193326; font-size: 1.2rem; }
.diagram-node small { color: #648276; font-size: .82rem; }
.diagram-destination { background: #b7f0cf; }
.diagram-link { height: 54px; display: flex; align-items: center; justify-content: center; gap: .7rem; color: #b0c7ba; font: 800 .66rem ui-monospace,monospace; letter-spacing: .12em; }
.diagram-link i { display: block; height: 1px; width: 45px; background: #6f8b7d; }
.download-promo { overflow: hidden; background: #bef5d1; }
.download-promo-layout { display: grid; grid-template-columns: 1.1fr .9fr; align-items: center; gap: 2rem; }
.download-promo .section-index { color: #2f7d55; }
.download-promo h2 { margin-bottom: 1.1rem; }
.download-promo p { max-width: 540px; color: #47715b; line-height: 1.8; margin-bottom: 1.7rem; }
.download-promo-art { position: relative; display: grid; min-height: 320px; place-items: center; }
.download-glyph { display: grid; place-items: center; width: 300px; height: 300px; border-radius: 50%; background: #1a3929; color: #9bebbb; font-size: 10rem; font-weight: 700; line-height: 1; transform: rotate(-11deg); box-shadow: 15px 18px 0 #86d9a5; }
.version-sticker { position: absolute; right: 0; bottom: 0; display: flex; flex-direction: column; gap: .35rem; padding: 1.1rem 1.3rem; min-width: 225px; background: white; border-radius: .95rem; border: 1px solid #d6e9d5; box-shadow: 0 14px 40px rgba(15,63,37,.15); transform: rotate(5deg); }
.version-sticker span { font: 800 .64rem ui-monospace,monospace; color: #6d8e77; }
.version-sticker b { font-size: 1.4rem; color: #223c2b; letter-spacing: -.03em; }
.version-sticker small { color: #839887; }
.roadmap-section { background: #fffefa; }
.roadmap-list { border-top: 1px solid #cddbcf; }
.roadmap-list article { display: grid; grid-template-columns: 60px 1fr auto; align-items: center; gap: 2rem; padding: 1.9rem .2rem; border-bottom: 1px solid #d6e1d9; }
.roadmap-count { font: 850 1.15rem ui-monospace,monospace; color: #88a295; }
.roadmap-list h3 { margin: 0 0 .4rem; font-size: 1.4rem; }
.roadmap-list p { margin: 0; font-size: .93rem; }
.final-cta { background: #f2f7ef; }
.final-cta-inner { display: flex; align-items: center; gap: 2rem; }
.final-cta-inner > img { width: 90px; height: 90px; object-fit: contain; flex: 0 0 auto; }
.final-cta .section-index { margin-bottom: .6rem; }
.final-cta h2 { margin: 0 0 .4rem; font-size: clamp(2.3rem,3.8vw,3.8rem); }
.final-cta h2 span { color: #17bb77; }
.final-cta p { margin: 0; }
.final-actions { margin-left: auto; display: flex; gap: .6rem; flex-direction: column; align-items: stretch; min-width: 210px; }
.disclaimer-band { background: #eaf0e8; padding: 1.4rem 0; border-top: 1px solid #d9e3d8; }
.disclaimer-band .container { display: flex; align-items: center; gap: 1.4rem; }
.disclaimer-band b { flex: 0 0 auto; font-size: .85rem; }
.disclaimer-band p { flex: 1; margin: 0; font-size: .77rem; line-height: 1.6; }
.disclaimer-band a { color: #116c43; font-weight: 850; font-size: .81rem; white-space: nowrap; }
.site-footer { background: #14221b; color: white; padding: 4.6rem 0 1.5rem; }
.footer-layout { display: grid; grid-template-columns: 2fr 1fr 1fr 1.5fr; gap: 2rem; padding-bottom: 4rem; }
.footer-identity .brand-name { color: white; }
.footer-identity p { max-width: 290px; margin: 1.3rem 0 0; color: #a6bbae; font-size: .9rem; line-height: 1.8; }
.footer-column { display: flex; flex-direction: column; gap: .62rem; }
.footer-column b { font-size: .86rem; margin-bottom: .5rem; color: #fff; }
.footer-column a { color: #a6bbae; font-size: .84rem; overflow-wrap: anywhere; }
.footer-column a:hover { color: #9cf4c6; }
.footer-bottom { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding-top: 1.25rem; border-top: 1px solid #31463a; color: #9cafa2; font-size: .74rem; }


/* Download page */
.download-landing { overflow: hidden; background: #eef8ef; border-bottom: 1px solid #dcebdc; padding: 105px 0 110px; }
.download-landing-grid { display: grid; grid-template-columns: 1.1fr .9fr; align-items: center; gap: 5rem; }
.download-intro h1 { margin-bottom: 1.5rem; font-size: clamp(3.6rem,6.5vw,6.5rem); line-height: 1.09; }
.download-intro p { max-width: 590px; margin-bottom: 2rem; font-size: 1.08rem; line-height: 1.85; }
.download-intro-actions { display: flex; gap: .8rem; flex-wrap: wrap; }
.latest-tile { position: relative; display: flex; flex-direction: column; min-height: 360px; padding: 2rem; border-radius: 1.6rem; background: #163327; color: #fff; transform: rotate(3deg); box-shadow: 12px 20px 0 #b5e5c2; }
.latest-tile-title { display: flex; justify-content: space-between; color: #98d9b1; font: 850 .78rem ui-monospace,monospace; letter-spacing: .09em; }
.latest-tile-title span { color: #72e49f; }
.latest-tile > strong { display: block; margin: auto 0 1.3rem; font-size: clamp(2rem,4vw,3.8rem); line-height: 1.1; letter-spacing: -.065em; overflow-wrap: anywhere; }
.latest-status { display: block; color: #a5e2ba; font-weight: 800; font-size: .85rem; }
.latest-tile > span:nth-last-child(2) { font-size: .79rem; color: #b4cbba; }
.latest-tile-footer { display: flex; justify-content: space-between; border-top: 1px solid #44634f; padding-top: 1rem; margin-top: 1.1rem; color: #b7d8c2; font: 850 .76rem ui-monospace,monospace; }
.latest-tile-footer span:last-child { font-size: 1.5rem; }
.packages-section { background: #fffefa; }
.packages-heading { align-items: center; }
.arch-picker { background: #edf7ed; padding: 1rem 1.2rem; border: 1px solid #d5e6d5; border-radius: 1rem; min-width: 285px; display: flex; flex-direction: column; gap: .4rem; }
.arch-picker label { font-size: .72rem; letter-spacing: .04em; font-weight: 850; color: #447958; }
.arch-picker select { width: 100%; border: 0; outline-offset: 1px; color: #213a2c; background: #fff; border-radius: .62rem; padding: .65rem .7rem; border: 1px solid #c7dac8; font-weight: 800; }
.arch-picker small { color: #7b9181; font-size: .7rem; }
.arch-picker code { font-weight: 900; }
.package-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 1rem; }
.package-card { display: flex; flex-direction: column; min-height: 350px; background: #f8faf6; border: 1px solid #dce7da; border-radius: 1.22rem; padding: 1.5rem; }
.package-card.package-featured { background: #ddf8e4; border-color: #a7dfbd; }
.package-card.package-aur { background: #f0f1ee; }
.package-card-top { display: flex; justify-content: space-between; align-items: start; min-height: 38px; gap: 1rem; }
.package-label { font: 800 .65rem/1.5 ui-monospace,monospace; color: #668477; letter-spacing: .06em; }
.package-symbol { color: #217749; font-size: 1.4rem; line-height: 1; }
.package-card-body { padding-top: 1rem; }
.package-icon { display: grid; place-items: center; width: 48px; height: 48px; background: #d3eedc; color: #1e784b; border-radius: .85rem; font: 900 1.4rem ui-monospace,monospace; }
.package-featured .package-icon { background: #1b8050; color: #fff; }
.package-card h3 { margin: 1rem 0 .65rem; font-size: 1.67rem; }
.package-card p { margin: 0; font-size: .87rem; line-height: 1.75; }
.package-card-foot { display: flex; align-items: center; flex-wrap: wrap; gap: .8rem; justify-content: space-between; margin-top: auto; padding-top: 1.3rem; }
.package-card-foot > span { max-width: 130px; font-size: .7rem; color: #788d7e; line-height: 1.5; }
.package-card-foot .button { min-height: 41px; padding: .65rem .85rem; font-size: .75rem; white-space: nowrap; }
.package-unavailable { opacity: .65; }
.checksum-banner { display: flex; gap: 1rem; align-items: center; margin-top: 2rem; padding: 1.3rem 1.5rem; background: #ecf6ec; border: 1px solid #d6e4d5; border-radius: 1.2rem; }
.checksum-symbol { display: grid; place-items: center; flex: 0 0 auto; width: 38px; height: 38px; border: 2px solid #409e67; border-radius: 50%; color: #12854a; font-weight: 900; }
.checksum-banner > div { flex: 1; }
.checksum-banner b { font-size: .9rem; }
.checksum-banner p { font-size: .8rem; margin: .1rem 0 0; }
.checksum-banner a { flex: 0 0 auto; color: #087b46; font-weight: 900; font-size: .83rem; }
.install-section { background: #eef4ef; }
.install-layout { display: grid; grid-template-columns: .36fr 1fr; gap: 1.1rem; align-items: stretch; }
.install-chooser { padding: 1.3rem; border-radius: 1.1rem; border: 1px solid #d9e7da; background: #fffefa; }
.install-hint { color: #608776; font: 850 .72rem ui-monospace,monospace; letter-spacing: .08em; }
.install-tabs { display: flex; flex-direction: column; gap: .6rem; }
.install-tab { display: flex; align-items: center; justify-content: space-between; gap: .5rem; width: 100%; text-align: left; border: 1px solid transparent; background: #f6f8f3; border-radius: .7rem; padding: .85rem; color: #254030; }
.install-tab strong { font-size: .85rem; }
.install-tab span { font-size: .72rem; color: #778b7d; }
.install-tab:hover,.install-tab.selected { background: #d6f6e1; border-color: #a3d9b9; }
.install-terminal { background: #17261f; color: #d0f6df; border-radius: 1.1rem; box-shadow: var(--shadow); overflow: hidden; }
.terminal-header { display: flex; align-items: center; gap: 1rem; padding: .85rem 1.2rem; border-bottom: 1px solid #344b3b; font-size: .79rem; }
.terminal-header strong { color: #fff; }
.terminal-header > span:nth-child(3) { margin-left: auto; color: #7ba88b; }
.terminal-header button { padding: .45rem .7rem; color: #c7f8db; border: 1px solid #537a60; background: #2e4938; border-radius: .55rem; font-size: .72rem; font-weight: 800; }
.terminal-dots { display: flex; gap: .32rem; }
.terminal-dots i { display: block; width: 8px; height: 8px; background: #db8880; border-radius: 50%; }
.terminal-dots i:nth-child(2) { background: #e8c36f; }
.terminal-dots i:nth-child(3) { background: #66d4a1; }
.install-terminal pre { padding: 2rem 1.7rem; min-height: 175px; margin: 0; white-space: pre-wrap; overflow-wrap: anywhere; font: 500 .89rem/1.9 ui-monospace,Consolas,monospace; color: #a5f7c8; }
.install-terminal > p { padding: 1.05rem 1.4rem; color: #a7c4b0; border-top: 1px solid #35483a; margin: 0; font-size: .83rem; }
.install-reminder { margin-top: 1.15rem; padding: 1.3rem; background: white; border: 1px solid #d9e7da; border-radius: .9rem; }
.install-reminder b { font-size: .9rem; }
.install-reminder p { margin: .4rem 0 0; font-size: .83rem; }
.compatibility-section { background: #fffefa; }
.compat-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 1rem; }
.compat-grid article { padding: 1.6rem 1rem 1.2rem; border-top: 2px solid #1aa763; }
.compat-grid span { font: 800 .7rem ui-monospace,monospace; color: #7b9b86; }
.compat-grid h3 { margin: 1.5rem 0 .8rem; font-size: 1.4rem; }
.compat-grid p { font-size: .87rem; line-height: 1.75; }
.faq-section { background: #f2f7f0; }
.faq-layout { display: grid; grid-template-columns: .8fr 1.2fr; gap: 5rem; }
.faq-layout h2 { margin-bottom: 1rem; }
.faq-layout > div:first-child p { max-width: 320px; }
.faq-layout .button { margin-top: 1rem; }
.faq-list { display: flex; flex-direction: column; gap: .7rem; }
.faq-list details { padding: 1.1rem 1.25rem; background: #fff; border: 1px solid #dae6da; border-radius: .8rem; }
.faq-list summary { cursor: pointer; color: #1c3726; font-weight: 800; list-style-position: inside; }
.faq-list details p { margin: .9rem 0 .25rem; font-size: .88rem; line-height: 1.8; }
.faq-list details a { color: #0b9250; font-weight: 800; text-decoration: underline; }

/* Legal and secondary content */
.page-hero { padding: 98px 0 84px; background: #e4f6e8; border-bottom: 1px solid #d1e7d5; }
.page-hero.compact { padding: 80px 0 76px; }
.page-hero h1 { margin: 0 0 1.2rem; }
.page-hero .lead { max-width: 800px; margin: 0; font-size: 1.1rem; line-height: 1.85; }
.eyebrow { display: inline-block; margin: 0 0 1rem; color: #16824f; font: 850 .76rem ui-monospace, monospace; letter-spacing: .07em; text-transform: uppercase; }
.legal-layout { display: grid; grid-template-columns: 235px minmax(0,1fr); gap: 3rem; align-items: start; padding: 72px 0 115px; }
.legal-nav { position: sticky; top: 110px; padding: 1.35rem; border-radius: 1rem; background: #eef5ee; border: 1px solid #deeadc; }
.legal-nav > strong { display: block; margin-bottom: 1rem; font-size: .95rem; }
.legal-nav > div { display: grid; gap: .6rem; }
.legal-nav a { color: #587460; font-size: .86rem; }
.legal-nav a:hover { color: #0e8a54; text-decoration: underline; }
.legal-card { padding: 2.4rem; background: #fff; border: 1px solid #e0e9df; border-radius: 1.2rem; min-width: 0; box-shadow: 0 8px 25px rgba(45,82,50,.035); }
.legal-card h2 { font-size: 1.63rem; margin: 2.8rem 0 1rem; line-height: 1.4; scroll-margin-top: 110px; }
.legal-card h2:first-child { margin-top: 0; }
.legal-card h3 { font-size: 1.1rem; margin: 1.8rem 0 .6rem; }
.legal-card p,.legal-card li { color: #4c6353; line-height: 1.9; font-size: .92rem; }
.legal-card ul,.legal-card ol { padding-left: 1.5rem; }
.legal-card li { margin-bottom: .4rem; }
.legal-card a { color: #0d8d52; font-weight: 750; text-decoration: underline; text-underline-offset: .22em; }
.legal-card code { color: #1c6141; background: #edf8ef; padding: .12rem .34rem; border-radius: .28rem; overflow-wrap: anywhere; }
.meta-line { color: #7c9582!important; font-size: .77rem!important; }
.callout { margin: 1.6rem 0; padding: 1.1rem 1.3rem; border-radius: .8rem; border: 1px solid #d6e7d9; background: #f0f8f0; }
.callout.warning { border-color: #e9d5a9; background: #fff8e9; }
.callout.info { background: #eff7f1; }
.callout p:last-child { margin-bottom: 0; }
.callout strong { color: #364537; }
.legal-card table,.table-scroll table { width: 100%; border-collapse: collapse; text-align: left; font-size: .81rem; }
.table-scroll { width: 100%; overflow-x: auto; }
table th,table td { padding: .9rem; border-bottom: 1px solid #dbe6da; vertical-align: top; }
table th { color: #234c32; background: #ebf6ed; }
table td { color: #4c6153; }
.site-footer .footer-brand { display: inline-flex; align-items: center; gap: .6rem; color: #fff; font-weight: 900; font-size: 1.8rem; }
.site-footer .footer-brand img { width: 40px; height: 40px; }
.empty-page { min-height: 75vh; display: grid; align-content: center; }
.empty-page h1 { font-size: clamp(3rem,7vw,6rem); }
.empty-page p { max-width: 600px; }
.is-disabled { opacity: .65; cursor: not-allowed; pointer-events: none; }


/* Breakpoints and accessibility */
@media (max-width: 1180px) {
  .hero h1 { font-size: clamp(3.2rem,5.6vw,5.3rem); }
  .show-disc-one { right: -95px; width: 530px; height: 530px; }
  .chip-top { right: -8px; }
  .chip-bottom { left: -7px; }
  .footer-layout { grid-template-columns: 1.6fr 1fr 1fr; }
  .footer-column:last-child { grid-column: 2 / span 2; }
  .download-landing-grid { gap: 3rem; }
}
@media (max-width: 990px) {
  .container { width: min(1216px,calc(100% - 40px)); }
  .nav-shell { min-height: 70px; }
  .brand-note { display: none; }
  .site-nav a { padding: .6rem; font-size: .78rem; }
  .hero-content { grid-template-columns: 1fr; gap: 0; min-height: auto; padding-top: 4.5rem; }
  .hero h1 { max-width: 800px; font-size: clamp(3.7rem,7.4vw,6.2rem); }
  .hero-subtitle { max-width: 720px; }
  .showcase { max-width: 680px; min-height: 550px; margin: 2rem auto 0; width: 100%; }
  .mock-app { transform: rotate(-2deg); }
  .show-disc-one { right: 0; }
  .bento-chat,.bento-official { grid-column: span 6; }
  .bento-calls,.bento-album,.bento-native { grid-column: span 4; }
  .architecture-layout { gap: 2.2rem; }
  .download-promo-layout { gap: 1rem; }
  .download-landing-grid { gap: 2rem; }
  .download-intro h1 { font-size: clamp(3.2rem,5.7vw,5.4rem); }
  .package-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .compat-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .faq-layout { gap: 2rem; }
  .legal-layout { grid-template-columns: 185px minmax(0,1fr); gap: 1.5rem; }
}
@media (max-width: 720px) {
  .container { width: calc(100% - 36px); }
  .nav-toggle { display: flex; }
  .js-nav .site-nav { display: none; }
  .js-nav .site-header.menu-open .site-nav { display: flex; }
  .site-header .nav-shell { flex-wrap: wrap; }
  .site-nav { order: 3; flex: 0 0 100%; display: flex; flex-direction: column; align-items: stretch; padding: 0 0 1rem; gap: .25rem; }
  .site-nav a { padding: .8rem 1rem; font-size: .91rem; }
  .site-nav .nav-cta { margin: .3rem 0 0; justify-content: center; }
  .brand-name { font-size: 1.75rem; }
  .brand img { width: 37px; height: 37px; }
  .section { padding: 75px 0; }
  .section-heading { display: block; margin-bottom: 2rem; }
  .section-heading > p { max-width: 550px; margin-top: 1.25rem; }
  h2 { font-size: clamp(2.5rem,8vw,4.1rem); }
  .hero-content { padding: 3.5rem 0 3rem; }
  .hero h1 { font-size: clamp(3rem,8.7vw,5rem); }
  .hero-footnote { margin-top: 2rem; }
  .showcase { min-height: 435px; }
  .mock-app { height: 370px; width: min(100%,540px); }
  .show-disc-one { width: 470px; height: 470px; right: -40px; }
  .floating-chip { font-size: .65rem; padding: .45rem .7rem; }
  .chip-top { top: 2rem; }
  .chip-bottom { bottom: 1.2rem; }
  .mock-caption { bottom: -1.8rem; }
  .ticker-track { height: 65px; gap: 1.15rem; }
  .bento-chat,.bento-official,.bento-calls,.bento-album,.bento-native { grid-column: span 6; }
  .bento-local { grid-column: span 12; padding-right: 2rem; padding-bottom: 180px; }
  .local-art { top: auto; bottom: -1rem; right: 3rem; transform: scale(.7) rotate(-11deg); transform-origin: bottom right; }
  .architecture-layout,.download-promo-layout,.download-landing-grid,.faq-layout { grid-template-columns: 1fr; }
  .architecture-layout { gap: 2.3rem; }
  .download-promo-art { min-height: 260px; }
  .download-glyph { width: 230px; height: 230px; font-size: 7rem; }
  .download-landing { padding: 75px 0 85px; }
  .latest-tile { min-height: 255px; transform: rotate(1deg); }
  .latest-tile > strong { margin: 2rem 0 1.2rem; }
  .roadmap-list article { grid-template-columns: 35px 1fr; gap: .7rem; align-items: start; }
  .roadmap-list article .status { grid-column: 2; }
  .final-cta-inner { flex-wrap: wrap; gap: 1.3rem; }
  .final-actions { margin: 0; width: 100%; flex-direction: row; }
  .disclaimer-band .container { align-items: flex-start; flex-wrap: wrap; gap: .6rem; }
  .disclaimer-band p { flex: 1 1 calc(100% - 120px); }
  .disclaimer-band a { margin-left: auto; }
  .footer-layout { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 2.3rem 1rem; }
  .footer-identity { grid-column: 1/-1; }
  .footer-column:last-child { grid-column: auto; }
  .footer-bottom { align-items: flex-start; flex-direction: column; }
  .install-layout { grid-template-columns: 1fr; }
  .install-tabs { flex-direction: row; flex-wrap: wrap; }
  .install-tab { flex: 1 0 140px; }
  .checksum-banner { align-items: flex-start; flex-wrap: wrap; }
  .checksum-banner a { margin-left: auto; }
  .legal-layout { grid-template-columns: 1fr; gap: 1rem; padding: 35px 0 80px; }
  .legal-nav { position: static; }
  .legal-nav > div { display: flex; flex-wrap: wrap; gap: .5rem 1rem; }
  .legal-card { padding: 1.4rem; }
}
@media (max-width: 490px) {
  .container { width: calc(100% - 28px); }
  .hero h1 { font-size: clamp(2.55rem,10.6vw,3.6rem); }
  .hero-subtitle { font-size: .94rem; }
  .hero-actions { display: grid; grid-template-columns: 1fr; }
  .button { width: 100%; }
  .hero-content { padding-top: 3rem; }
  .hero-footnote small { max-width: 265px; }
  .showcase { margin-top: 1.4rem; min-height: 335px; }
  .mock-app { height: 298px; }
  .mock-toolbar { height: 33px; padding: 0 .65rem; }
  .mock-body { height: calc(100% - 33px); grid-template-columns: 36% 64%; }
  .mock-sidebar { padding: .55rem .25rem; }
  .mock-sidebar-brand { gap: .25rem; font-size: .78rem; }
  .mock-sidebar-brand img { width: 22px; height: 22px; }
  .mock-filter { margin: .2rem .1rem; padding: .4rem .3rem; font-size: .53rem; }
  .mock-chat { gap: .3rem; padding: .35rem .2rem; }
  .mock-avatar { width: 23px; height: 23px; font-size: .57rem; }
  .mock-chat b { font-size: .56rem; }
  .mock-chat small,.mock-chat time { font-size: .47rem; }
  .mock-thread-head { height: 45px; gap: .35rem; }
  .mock-messages { padding: .65rem .45rem; gap: .5rem; }
  .mock-bubble { font-size: .57rem; padding: .45rem .5rem; }
  .mock-compose { height: 36px; gap: .5rem; }
  .show-disc-one { width: 315px; height: 315px; right: -32px; }
  .chip-top { top: .1rem; right: -.3rem; }
  .chip-bottom { bottom: .5rem; left: -.2rem; }
  .mock-caption { position: static; font-size: .64rem; text-align: center; margin: 1rem 0 0; }
  .floating-chip { padding: .25rem .42rem; font-size: .56rem; }
  .chip-icon { width: 19px; height: 19px; }
  .edge-inner { min-height: 49px; font-size: .54rem; }
  .bento { display: grid; grid-template-columns: 1fr; }
  .bento-chat,.bento-official,.bento-calls,.bento-album,.bento-native,.bento-local { grid-column: 1; }
  .bento-card { min-height: 280px; }
  .bento-chat,.bento-official { min-height: 335px; }
  .bento-local { min-height: 360px; padding-bottom: 160px; }
  .bento-card .card-top { margin-bottom: 1.2rem; }
  .bento-card h3 { font-size: 1.56rem; }
  .mini-conversation { margin-top: auto; width: min(285px,95%); }
  .oa-mock { margin-top: auto; }
  .local-art { right: 0; bottom: -1.2rem; }
  .final-cta-inner > img { width: 62px; height: 62px; }
  .final-actions { flex-direction: column; }
  .package-grid { grid-template-columns: 1fr; }
  .package-card { min-height: 280px; }
  .arch-picker { margin-top: 1.2rem; min-width: 0; width: 100%; }
  .latest-tile { min-height: 260px; padding: 1.5rem; }
  .install-tabs { display: grid; grid-template-columns: repeat(2,1fr); }
  .install-tab { min-width: 0; padding: .7rem; flex-direction: column; align-items: flex-start; }
  .install-terminal pre { padding: 1.3rem; font-size: .74rem; }
  .compat-grid { grid-template-columns: 1fr; }
  .faq-layout { gap: 1.5rem; }
  .page-hero { padding: 70px 0 55px; }
  .page-hero h1 { font-size: clamp(2.65rem,10vw,4.1rem); }
  .footer-layout { gap: 1.7rem 1rem; }
  .footer-column a { font-size: .78rem; }
}
@media (prefers-reduced-motion: reduce) {
  *,*::before,*::after { scroll-behavior: auto!important; transition-duration: .01ms!important; animation-duration: .01ms!important; }
}

/* Page-specific experiences: standalone Features, Technology, Roadmap and concise home */
.section-action {display:flex;flex-direction:column;align-items:flex-start;gap:.85rem;max-width:350px}
.section-action p {margin:0;line-height:1.7}
.section-action .button {min-height:45px}
.home-preview-section {background:#fffefa}
.home-teaser-grid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.05rem}
.home-teaser {position:relative;min-height:245px;display:flex;flex-direction:column;gap:.8rem;padding:1.65rem 1.5rem 1.2rem;border:1px solid #d8e8db;border-radius:1.25rem;transition:transform .2s,box-shadow .2s}
.home-teaser:hover {transform:translateY(-4px);box-shadow:0 18px 35px rgba(15,87,45,.09)}
.home-teaser.teal {background:#daf8e4}
.home-teaser.blue {background:#e7f1ff;border-color:#d4e3f4}
.home-teaser.sand {background:#f7eddd;border-color:#ebddc8}
.home-teaser > span {font:850 .7rem ui-monospace,monospace;letter-spacing:.09em;color:#4f8063}
.home-teaser strong {margin-top:auto;font-size:clamp(1.4rem,2vw,1.9rem);line-height:1.2;letter-spacing:-.04em}
.home-teaser p {font-size:.88rem;margin:0;color:#4a6a59}
.home-teaser > b {position:absolute;top:1.2rem;right:1.3rem;font-size:1.35rem}
.home-technology-preview {background:#17251f;color:#f5fff8}
.home-technology-layout {display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:center}
.home-technology-preview h2 {margin-bottom:1.2rem}
.home-technology-preview h2 em {font-style:normal;color:#87f2b3}
.home-technology-preview p {max-width:480px;color:#bed2c6;line-height:1.84}
.home-technology-preview .section-index {color:#96f6bf}
.technology-preview-visual {display:flex;flex-direction:column;gap:.55rem;padding:1.6rem;border:1px solid #45624e;border-radius:1.4rem;background:#22392b;box-shadow:0 20px 45px #050d0866}
.technology-preview-visual > span {display:flex;justify-content:space-between;gap:1rem;align-items:center;border-radius:.75rem;padding:1.05rem 1.15rem;background:#effbf1;color:#1d4029;font-size:1.02rem;font-weight:850}
.technology-preview-visual small {color:#578269;font-size:.73rem;line-height:1.2;font-weight:550}
.technology-preview-visual i {font:850 .64rem ui-monospace,monospace;font-style:normal;text-align:center;letter-spacing:.09em;color:#addac0}
.home-roadmap-preview {background:#f0f7ec}
.home-roadmap-strip {display:flex;align-items:center;gap:1.4rem;padding:1.5rem 1.8rem;border:1px solid #cadbcf;border-radius:1.1rem;background:#fffefa}
.home-roadmap-strip > span:first-child {color:#238657;font:850 .75rem ui-monospace,monospace}
.home-roadmap-strip strong {font-size:1.18rem;letter-spacing:-.02em}
.home-roadmap-strip > a {margin-left:auto;font-size:1.45rem}
.subpage-hero {position:relative;overflow:hidden;padding:115px 0 100px;isolation:isolate}
.subpage-hero-layout {display:grid;grid-template-columns:1.23fr .77fr;gap:3rem;align-items:center}
.subpage-hero h1 {font-size:clamp(3.65rem,5.8vw,6.3rem);margin-bottom:1.5rem}
.subpage-hero h1 em {font-style:normal;color:#188b55}
.subpage-hero p {max-width:690px;font-size:1.05rem;line-height:1.85}
.subpage-hero-actions {display:flex;gap:.7rem;flex-wrap:wrap;margin-top:2rem}
.subpage-feature-hero {background:linear-gradient(110deg,#edfaed 25%,#d9f4e1)}
.subpage-tech-hero {background:linear-gradient(110deg,#e5f4ec 30%,#d9f1ef)}
.subpage-roadmap-hero {background:linear-gradient(110deg,#f4f5e9 30%,#dcf4e1)}
.feature-hero-art {position:relative;display:grid;min-height:365px;place-items:center}
.feature-hero-circle {width:265px;height:265px;display:grid;place-items:center;border-radius:50%;font-size:12rem;line-height:1;color:#193e29;background:#91ebb4;box-shadow:0 0 0 26px #b9f3d0,0 0 0 58px #d0f5df}
.feature-hero-chip {position:absolute;top:11%;left:2%;padding:.7rem 1.15rem;border-radius:.7rem;border:1px solid #bedfcb;background:#fffefa;color:#28754c;transform:rotate(-10deg);font:850 .9rem ui-monospace,monospace;box-shadow:0 12px 24px #23623d26}
.feature-hero-chip.chip-two {top:auto;bottom:17%;left:0;transform:rotate(7deg)}
.feature-hero-chip.chip-three {left:auto;right:0;top:27%;transform:rotate(9deg)}
.technology-hero-art {display:flex;flex-direction:column;gap:.55rem;max-width:360px;margin-left:auto;padding:1.3rem;border:1px solid #a4d4ba;border-radius:1.5rem;background:#d6ecde;transform:rotate(3deg);box-shadow:14px 14px 0 #b7e3c9}
.technology-hero-art span {display:block;width:100%;background:#173e2b;color:#e8fff0;padding:1rem 1.35rem;border-radius:.8rem;font:850 1.05rem ui-monospace,monospace;letter-spacing:-.02em}
.technology-hero-art i {font:800 .7rem ui-monospace,monospace;font-style:normal;text-align:center;color:#377752}
.roadmap-hero-art {display:flex;gap:.4rem;align-items:center;justify-content:center;min-height:250px;transform:rotate(-5deg)}
.roadmap-phase {display:flex;flex-direction:column;gap:1rem;padding:1.45rem 1.1rem;border-radius:1.05rem;border:1px solid #80bb93;background:#a3ecc0;color:#23633c;font:800 .76rem ui-monospace,monospace;box-shadow:0 13px 23px #20553a23}
.roadmap-phase strong {font-size:2.2rem;letter-spacing:-.05em;color:#173b27}
.roadmap-phase.phase-future {background:#f7f5ea;border-color:#dcdccb}
.roadmap-hero-art > i {font-size:2.4rem;color:#60886c}
.feature-detail-section {background:#eff5ef}
.feature-status-grid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}
.feature-status-grid article {padding:1.6rem;border-radius:1.05rem;background:#fffefa;border:1px solid #d9e7db}
.feature-status-grid h3 {font-size:1.3rem;margin:1.2rem 0 .6rem}
.feature-status-grid p {font-size:.89rem;line-height:1.75;margin:0}
.technology-details {background:#fffefa}
.technology-detail-grid {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}
.technology-detail-grid article {padding:2rem;min-height:225px;background:#f1f8f0;border:1px solid #dce8db;border-radius:1.2rem}
.technology-detail-grid article:nth-child(2) {background:#eaf4fc}
.technology-detail-grid article:nth-child(3) {background:#f6f0e7}
.technology-detail-grid article:nth-child(4) {background:#f2edf7}
.technology-detail-grid article > span {font:800 .69rem ui-monospace,monospace;color:#347c51;letter-spacing:.07em}
.technology-detail-grid h3 {font-size:1.65rem;margin:1.5rem 0 .7rem}
.technology-detail-grid p {max-width:450px;margin:0;font-size:.92rem;line-height:1.8}
.roadmap-notes {background:#f1f7f0}
.roadmap-note-grid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}
.roadmap-note-grid article {border:1px solid #d4e4d5;border-radius:1.1rem;background:#fffefa;padding:1.6rem;min-height:250px}
.roadmap-note-grid h3 {margin:1.5rem 0 .7rem;font-size:1.4rem}
.roadmap-note-grid p {font-size:.87rem;line-height:1.75}
.roadmap-feedback {display:flex;align-items:center;justify-content:space-between;gap:1.5rem;margin-top:2rem;padding:2rem;border-radius:1.1rem;background:#d9f6e0;border:1px solid #b9dfc1}
.roadmap-feedback strong {font-size:1.23rem}
.roadmap-feedback p {max-width:650px;margin:.5rem 0 0;font-size:.86rem;line-height:1.7}
.subpage-next {background:#d5f6df}
.subpage-next-inner {display:flex;align-items:end;justify-content:space-between;gap:2rem}
.subpage-next h2 {margin:0}
.subpage-next h2 em {font-style:normal;color:#157a4c}
.features-page #feature-catalog {scroll-margin-top:95px}
.technology-page #how-it-works {scroll-margin-top:95px}
.roadmap-page #roadmap {scroll-margin-top:95px}
.bento-card[id] {scroll-margin-top:95px}
@media(max-width:990px) {
 .subpage-hero-layout {grid-template-columns:1fr .65fr}
 .subpage-hero h1 {font-size:clamp(3rem,5.5vw,5.3rem)}
 .feature-hero-art {min-height:305px}
 .feature-hero-circle {width:190px;height:190px;font-size:9rem;box-shadow:0 0 0 22px #b9f3d0,0 0 0 45px #d0f5df}
 .technology-hero-art span {font-size:.82rem}
 .roadmap-phase strong {font-size:1.5rem}
}
@media(max-width:720px) {
 .subpage-hero {padding:75px 0}
 .subpage-hero-layout,.home-technology-layout {grid-template-columns:1fr}
 .subpage-hero h1 {font-size:clamp(2.9rem,8vw,4.8rem)}
 .feature-hero-art {display:none}
 .technology-hero-art {width:100%;max-width:none;margin:2rem 0 0;transform:none}
 .roadmap-hero-art {min-height:210px}
 .home-teaser-grid,.feature-status-grid,.roadmap-note-grid {grid-template-columns:1fr}
 .home-teaser {min-height:190px}
 .home-roadmap-strip {flex-wrap:wrap}
 .home-roadmap-strip > .status {margin-left:auto}
 .home-technology-layout {gap:2rem}
 .technology-detail-grid {grid-template-columns:1fr}
 .roadmap-feedback,.subpage-next-inner {align-items:flex-start;flex-direction:column}
 .roadmap-feedback .button,.subpage-next-inner .button {width:auto}
 .section-action {max-width:500px;margin-top:1.2rem}
}
@media(max-width:490px) {
 .subpage-hero-actions {display:flex;flex-direction:column}
 .home-technology-preview .button,.subpage-hero-actions .button {width:100%}
 .home-roadmap-strip {padding:1rem;gap:.65rem}
 .home-roadmap-strip strong {flex:1 1 60%;font-size:1rem}
 .home-roadmap-strip > .status {margin-left:0}
 .home-roadmap-strip > a {margin-left:auto}
 .technology-preview-visual {padding:1rem}
 .technology-preview-visual span {font-size:.79rem}
 .technology-preview-visual small {font-size:.6rem}
 .subpage-hero h1 {font-size:clamp(2.5rem,10.2vw,3.9rem)}
 .subpage-hero-actions,.roadmap-feedback .button {width:100%}
 .roadmap-hero-art {justify-content:flex-start;transform:none}
 .roadmap-phase {padding:1rem .8rem}
 .roadmap-phase strong {font-size:1.25rem}
 .roadmap-hero-art > i {font-size:1.5rem}
}