/* Six-card proportions follow the supplied MagicBento reference. */
.sky-demo .magic-albums.six-bento { grid-template-rows:auto repeat(3,minmax(180px,auto)); gap:12px; }
.sky-demo .six-bento .album-grid>.album-card:nth-child(2) { grid-column:1; grid-row:2; }
.sky-demo .six-bento .album-grid>.album-card:nth-child(3) { grid-column:2; grid-row:2; }
.sky-demo .six-bento .album-grid>.album-card:first-child { grid-column:1/3; grid-row:3/5; }
.sky-demo .six-bento>.bento-community { grid-column:3/5; grid-row:2/4; padding:28px; background:linear-gradient(135deg,#dcebcf,#f3f8ed); }
.sky-demo .six-bento .feishu-link { grid-column:3; grid-row:4; padding:22px; justify-content:flex-start; gap:0; background:linear-gradient(135deg,#f8fbf4,#eaf2e1); }
.sky-demo .six-bento>.bento-open-library { grid-column:4; grid-row:4; }
.sky-demo .six-bento>.bento-community h4 { margin-top:auto; font-size:28px; }
.sky-demo .six-bento>.bento-community p { max-width:340px; font-size:13px; }
.sky-demo .six-bento>.bento-community .album-action { margin-top:6px; }
.sky-demo .six-bento .feishu-link .feishu-kicker { border:1px solid #bfd0b4; border-radius:20px; padding:4px 8px; letter-spacing:0; font-size:10px; }
.sky-demo .six-bento .feishu-link strong { font-size:19px; margin:20px 0 9px; }
.sky-demo .six-bento .feishu-link>span:last-child { font-size:12px; line-height:1.75; }
.sky-demo .community-preview { display:grid; width:100%; gap:8px; margin:22px 0 24px; }
.sky-demo .community-preview>span { display:grid; grid-template-columns:28px 1fr auto; align-items:center; gap:10px; padding:10px 12px; border:1px solid #ffffffbf; border-radius:12px; background:#f8fbf380; }
.sky-demo .community-preview i { display:grid; place-items:center; width:28px; height:28px; font-size:15px; font-style:normal; border-radius:9px; color:#477755; background:#e1edd7; }
.sky-demo .community-preview b { font-size:13px; font-weight:600; color:#2f583e; }
.sky-demo .community-preview small { font-size:11px; color:#5b7058; }
.sky-demo .bento-preview { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); width:100%; gap:8px; margin:24px 0; pointer-events:none; }
.sky-demo .bento-preview>span { position:relative; overflow:hidden; height:152px; border-radius:12px; border:2px solid #ffffffe0; box-shadow:0 6px 18px #234f3610; background:#dbe7d2; }
.sky-demo .bento-preview>span:nth-child(2) { transform:translateY(-7px); }
.sky-demo .bento-preview img { width:100%; height:100%; display:block; object-fit:cover; }
.sky-demo .bento-preview>span>span { position:absolute; inset:auto 0 0; padding:28px 8px 9px; background:linear-gradient(transparent,#143924d9); color:#fff; font-size:10px; line-height:1.5; }
.sky-demo .six-bento .feishu-link.bento-story>span:not(.feishu-kicker) { color:#536a50; font-size:12px; line-height:1.75; }
.sky-demo .six-bento .feishu-link.bento-story>.album-action { margin-top:auto; padding-top:12px; font-size:11px; color:#3e7047; }
.sky-demo .six-bento .album-card p { color:#536a50; }
.sky-demo .six-bento .album-count { color:#4b6748; border-color:#c1d1b8; background:#ffffff35; }
.sky-demo .hero-shortcut-icon { display:inline-grid; place-items:center; flex:0 0 24px; width:24px; height:24px; font-size:19px; line-height:1; color:#527447; background:#ffffff75; border-radius:50%; }
@media(min-width:801px) {
 .sky-demo.is-home .pro-intro::after { background:linear-gradient(90deg,#f5f8f0fc 0%,#f5f8f0f7 30%,#f5f8f0dc 43%,#f5f8f075 53%,#f5f8f00a 68%),linear-gradient(0deg,#edf3e9 0%,#edf3e9e6 7%,transparent 33%); }
 .sky-demo.is-home .pro-intro { padding-top:110px; padding-bottom:54px; min-height:680px; }
 .sky-demo.is-home .pro-intro>.portrait-word { left:3%; top:15px; }
 .sky-demo .hero-overline { margin-bottom:26px; }
 .sky-demo.is-home .pro-copy h1 { line-height:1.19; margin-bottom:30px; }
 .sky-demo .hero-story p { line-height:2.05; margin-bottom:17px; }
 .sky-demo.is-home .pro-copy .agency-actions { margin-top:26px; }
 .sky-demo.is-home .pro-copy .hero-proof { margin-top:28px; }
 .sky-demo .hero-shortcuts { inset:0; width:auto; display:block; pointer-events:none; }
 .sky-demo .hero-shortcut { position:absolute; inset:auto; width:auto; pointer-events:auto; }
 .sky-demo .hero-shortcut-inner { width:auto; min-width:130px; height:44px; padding:0 13px; }
 .sky-demo .hero-shortcut--knowledge { left:52%; top:31%; --shortcut-rotate:-7deg; }
 .sky-demo .hero-shortcut--reviews { right:2.2%; top:45%; --shortcut-rotate:6deg; }
 .sky-demo .hero-shortcut--community { left:56%; bottom:40px; --shortcut-rotate:-5deg; }
 .sky-demo .hero-shortcut--contact { right:5%; bottom:25px; --shortcut-rotate:5deg; }
}
@media(min-width:801px) and (max-width:1100px) {
 .sky-demo .community-preview>span { grid-template-columns:28px 1fr; gap:2px 8px; padding:8px 10px; }
 .sky-demo .community-preview i { grid-row:span 2; }
 .sky-demo .community-preview small { grid-column:2; }
 .sky-demo .hero-story p { line-height:1.95; }
 .sky-demo .hero-shortcut-inner { min-width:114px; font-size:11px; padding:0 10px; gap:6px; }
 .sky-demo .hero-shortcut--knowledge { left:51%; top:29%; }
 .sky-demo .hero-shortcut--reviews { right:1.5%; top:44%; }
 .sky-demo .hero-shortcut--community { left:56%; bottom:38px; }
 .sky-demo .hero-shortcut-icon { width:21px; height:21px; flex-basis:21px; font-size:17px; }
}
@media(max-width:800px) {
 .sky-demo .six-bento.magic-albums { grid-template-rows:auto auto auto auto auto; }
 .sky-demo .six-bento .album-grid>.album-card:nth-child(2) { grid-column:1; grid-row:2; }
 .sky-demo .six-bento .album-grid>.album-card:nth-child(3) { grid-column:2; grid-row:2; }
 .sky-demo .six-bento>.bento-community { grid-column:1/3; grid-row:3; min-height:236px; padding:22px; }
 .sky-demo .six-bento .album-grid>.album-card:first-child { grid-column:1/3; grid-row:4; }
 .sky-demo .six-bento .feishu-link { grid-column:1; grid-row:5; min-height:0; padding:17px; }
 .sky-demo .six-bento>.bento-open-library { grid-column:2; grid-row:5; }
 .sky-demo .six-bento .feishu-link strong { font-size:17px; margin-top:16px; }
 .sky-demo .six-bento .feishu-link strong b { display:none; }
 .sky-demo .six-bento .feishu-link>span:last-child { font-size:11px; }
 .sky-demo .six-bento>.bento-community h4 { font-size:24px; margin-top:0; }
 .sky-demo .six-bento>.bento-community p { font-size:12px; }
 .sky-demo .community-preview { margin:18px 0; gap:6px; }
 .sky-demo .community-preview>span { gap:8px; padding:8px; }
 .sky-demo .community-preview b { font-size:12px; }
 .sky-demo .community-preview small { font-size:10px; }
 .sky-demo .bento-preview { margin:20px 0 18px; gap:6px; }
 .sky-demo .bento-preview>span { height:118px; border-radius:9px; }
 .sky-demo .bento-preview>span>span { font-size:9px; padding:24px 5px 7px; }
 .sky-demo .six-bento .album-grid>.album-card:first-child h4 { margin-top:0; }
 .sky-demo .six-bento .feishu-link.bento-story>span:not(.feishu-kicker) { font-size:11px; }
 .sky-demo .six-bento .feishu-link.bento-story>.album-action { font-size:10px; }
 .sky-demo .hero-story p { line-height:1.9; margin-bottom:13px; }
 .sky-demo.is-home .pro-copy .agency-actions { margin-top:23px; }
 .sky-demo.is-home .pro-copy .hero-proof { margin-top:24px; }
 .sky-demo.is-home .pro-intro { padding-bottom:30px; }
 .sky-demo.is-home .pro-portrait { height:345px; margin-top:20px; }
 .sky-demo.is-home .pro-portrait>img { bottom:4px; height:320px; right:calc(50% - 160px); }
 .sky-demo .hero-shortcuts { position:absolute; inset:auto 12px 22px; width:auto; height:325px; display:block; margin:0; pointer-events:none; }
 .sky-demo .hero-shortcut { position:absolute; inset:auto; pointer-events:auto; transform:rotate(var(--shortcut-rotate))!important; }
 .sky-demo .hero-shortcut-inner { height:35px; width:auto; padding:0 9px; gap:5px; font-size:10px; }
 .sky-demo .hero-shortcut-icon { width:19px; height:19px; flex-basis:19px; font-size:15px; }
 .sky-demo .hero-shortcut--knowledge { left:0; top:49px; --shortcut-rotate:-7deg; }
 .sky-demo .hero-shortcut--reviews { right:0; top:103px; --shortcut-rotate:7deg; }
 .sky-demo .hero-shortcut--community { left:6px; bottom:2px; --shortcut-rotate:-5deg; }
 .sky-demo .hero-shortcut--contact { right:10px; bottom:10px; --shortcut-rotate:5deg; }
}