/* Scoped exclusively to Demo Visual. */
.main-content[data-community-page="demo-visual"] #room-viewport{width:100%;max-width:1760px!important;margin:0 auto!important;padding:30px 48px 60px!important;box-sizing:border-box}
.main-content[data-community-page="demo-visual"] #feed-container{width:100%;max-width:none!important;margin:0!important;gap:0!important}
.main-content[data-community-page="demo-visual"] .room-header-banner{display:none!important}
.demo-visual-page{--dv-gold:#ddc18b;--dv-ink:#f5f4ef;--dv-muted:#a4a4a0;--dv-gutter:48px;--dv-gap:26px;--dv-card-width:min(390px,calc(100% - 42px));width:100%;min-width:0;padding-bottom:16px;color:var(--dv-ink);font-family:var(--font-sans,Inter,Arial,sans-serif);isolation:isolate}
.demo-visual-page *{box-sizing:border-box}
.demo-visual-page [hidden]{display:none!important}
.demo-visual-page button{appearance:none;font:inherit;line-height:1.3;cursor:pointer;text-transform:none;letter-spacing:normal}
.demo-visual-page button:focus-visible,.demo-visual-page .dv-rail:focus-visible,.demo-visual-page .dv-sample-reader:focus-visible{outline:2px solid var(--dv-gold);outline-offset:5px}
.demo-visual-page svg{display:block;flex:none}
.demo-visual-page .dv-page-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;padding-bottom:22px;border-bottom:1px solid #ffffff14}
.demo-visual-page .dv-page-heading h1{margin:0;font-size:14px;line-height:1.5;font-weight:600;letter-spacing:-.01em;color:#e6e5df}
.demo-visual-page .dv-page-heading h1>span{color:#858681;font-weight:400;margin-left:8px}
.demo-visual-page .dv-preview-tag{display:inline-flex;align-items:center;gap:8px;font-size:11px;line-height:1.5;color:#c9bfaa;background:linear-gradient(160deg,#272620,#181917);border:1px solid #ffffff18;border-radius:100px;padding:8px 13px;box-shadow:inset 0 1px 0 #ffffff08}
.demo-visual-page .dv-preview-tag>span{width:5px;height:5px;background:var(--dv-gold);border-radius:50%}
.demo-visual-page .dv-section-heading{display:grid;grid-template-columns:minmax(0,1fr) 360px;align-items:center;gap:40px;margin:0;padding:56px 0 52px}
.demo-visual-page .dv-kicker{color:var(--dv-gold);font-size:11px;letter-spacing:.13em;font-weight:600;line-height:1.6;margin:0 0 22px;text-transform:uppercase}
.demo-visual-page .dv-section-heading h2{font-size:clamp(44px,4.6vw,76px);font-weight:650;line-height:1.05;letter-spacing:-.055em;margin:0;color:var(--dv-ink)}
.demo-visual-page .dv-section-heading h2>span{color:#a6a6a1;background:linear-gradient(100deg,#e5d6b6,#9b9588 85%);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}
.demo-visual-page .dv-hero-description{font-size:15px;line-height:1.8;color:#adada7;margin:24px 0 22px;max-width:47ch}
.demo-visual-page .dv-course-badge{display:inline-flex;gap:9px;align-items:center;flex-wrap:wrap;color:#b9b7ae;font-size:11px;line-height:1.6}
.demo-visual-page .dv-course-badge svg{width:16px;height:16px;color:var(--dv-gold)}
.demo-visual-page .dv-course-badge>span{color:#65655e;margin:0 2px}
.demo-visual-page .dv-folio{height:250px;position:relative;perspective:1100px;transform:translateY(-4px);pointer-events:none}
.demo-visual-page .dv-folio-back,.demo-visual-page .dv-folio-middle,.demo-visual-page .dv-folio-front{position:absolute;width:245px;height:174px;right:38px;top:40px;border-radius:19px;overflow:hidden;transform-style:preserve-3d;border:1px solid #b59c6b4d;box-shadow:0 18px 30px #0009,inset 0 1px 0 #ffffff24}
.demo-visual-page .dv-folio-back{background:linear-gradient(135deg,#827355,#292823 60%,#171815);transform:translate(20px,-27px) rotateY(-18deg) rotateZ(11deg)}
.demo-visual-page .dv-folio-middle{background:#24221c;transform:translate(-8px,-9px) rotateY(-18deg) rotateZ(3deg)}
.demo-visual-page .dv-folio-middle img{width:100%;height:100%;object-fit:cover;opacity:.58}
.demo-visual-page .dv-folio-front{background:#25241f;transform:translate(-28px,18px) rotateY(-18deg) rotateZ(-7deg);box-shadow:0 28px 40px #000a,0 2px 0 #a1875666,inset 0 1px 0 #fff3}
.demo-visual-page .dv-folio-front>img{position:absolute;width:100%;height:100%;object-fit:cover;opacity:.3}
.demo-visual-page .dv-folio-front::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(125deg,#fff2,transparent 40%,#0003);border:1px solid #f4dab51c;border-radius:inherit}
.demo-visual-page .dv-folio-front>div{position:relative;z-index:1;display:grid;grid-template-columns:42px 1fr;gap:15px;align-content:center;height:100%;padding:28px}
.demo-visual-page .dv-folio-front>div>span{color:#ebd09b;font-size:43px;line-height:1.15;align-self:center;font-weight:500}
.demo-visual-page .dv-folio-front p{color:#f3ead5;font-size:15px;line-height:1.35;font-weight:600;letter-spacing:.1em;margin:0}
.demo-visual-page .dv-folio-front small{grid-column:1/-1;font-size:7px;line-height:1.5;letter-spacing:.15em;color:#d3c4a5;padding-top:11px;border-top:1px solid #d3c4a530}
.demo-visual-page .dv-gallery-heading{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin:0 0 6px}
.demo-visual-page .dv-gallery-heading h3{font-size:22px;line-height:1.3;font-weight:600;letter-spacing:-.035em;margin:0;color:#eeede7}
.demo-visual-page .dv-gallery-heading>p{font-size:12px;line-height:1.6;color:#898b85;margin:0}
.demo-visual-page .dv-gallery{margin:0 calc(-1 * var(--dv-gutter))}
.demo-visual-page .dv-rail{display:flex;gap:var(--dv-gap);position:relative;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:var(--dv-gutter);overscroll-behavior-x:contain;scrollbar-width:none;min-width:0;padding:22px var(--dv-gutter) 40px;touch-action:pan-x pan-y;perspective:1600px}
.demo-visual-page .dv-rail::-webkit-scrollbar{display:none}
.demo-visual-page .dv-rail::after{content:"";flex:0 0 max(0px,calc(100% - var(--dv-card-width) - var(--dv-gap)))}
.demo-visual-page .dv-rail.is-dragging{scroll-snap-type:none;cursor:grabbing;user-select:none}
.demo-visual-page .dv-course-card{flex:0 0 var(--dv-card-width);min-width:0;display:flex;scroll-snap-align:start;scroll-snap-stop:normal;position:relative;transform-origin:center center;transition:transform .55s cubic-bezier(.2,.7,.2,1);transform:translateZ(0)}
.demo-visual-page .dv-card-surface{width:100%;position:relative;isolation:isolate;display:flex;flex-direction:column;border-radius:30px;overflow:hidden;border:1px solid #ffffff1a;background:linear-gradient(155deg,#2e2d28 0%,#242522 45%,#171917 100%);box-shadow:0 18px 30px -20px #000,0 5px 12px #0005,inset 0 1px 0 #f7e8c41c;transition:border-color .4s,box-shadow .4s}
.demo-visual-page .dv-card-surface::after{content:"";position:absolute;inset:0;z-index:2;border-radius:inherit;pointer-events:none;background:linear-gradient(120deg,#fff1 0%,transparent 23%,transparent 75%,#e6d8b704 100%);border:1px solid #fff0}
.demo-visual-page .dv-course-card.is-current .dv-card-surface{border-color:#d6bb883d;box-shadow:0 22px 38px -22px #000,0 5px 12px #0006,inset 0 1px 0 #f7e8c430}
.demo-visual-page .dv-course-cover{position:relative;aspect-ratio:1.55;background:#25241f;overflow:hidden}
.demo-visual-page .dv-course-cover::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#0002,transparent 32%,transparent 70%,#232421);pointer-events:none}
.demo-visual-page .dv-course-cover>img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .8s cubic-bezier(.2,.7,.2,1);transform:scale(1.025)}
.demo-visual-page .dv-cover-label{position:absolute;z-index:1;top:20px;left:20px;display:flex;align-items:center;gap:10px;padding:9px 13px;background:linear-gradient(140deg,#292820f5,#151713ed);border:1px solid #eedab332;border-radius:100px;box-shadow:0 3px 8px #0003,inset 0 1px 0 #fff1;color:#d6c8a9;font-size:9px;letter-spacing:.085em;line-height:1.3}
.demo-visual-page .dv-cover-label>strong{font-size:11px;letter-spacing:.02em;color:#f1e4c7;font-weight:600}
.demo-visual-page .dv-cover-mark{position:absolute;z-index:1;right:19px;bottom:17px;font-size:22px;line-height:1;color:#f0dfb873;text-shadow:0 2px 3px #0007}
.demo-visual-page .dv-course-info{display:flex;flex-direction:column;flex:1;min-width:0;padding:18px 28px 25px}
.demo-visual-page .dv-course-info>.dv-kicker{font-size:10px;line-height:1.65;margin:0 0 15px;color:#c9ad73;letter-spacing:.12em}
.demo-visual-page .dv-course-info h4{font-size:32px;font-weight:550;line-height:1.14;letter-spacing:-.04em;margin:0 0 18px;max-width:17ch;min-height:2.28em;color:#f0efe9;text-wrap:balance}
.demo-visual-page .dv-card-description{font-size:13px;line-height:1.8;color:#b0b0a9;margin:0 0 24px;max-width:39ch;min-height:3.6em}
.demo-visual-page button.dv-lesson-button{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:54px;width:100%;height:auto;margin:auto 0 0;padding:12px 0 0;border:0;border-top:1px solid #ffffff12;border-radius:0;background:transparent;box-shadow:none;color:#ddd9ce;font-size:12px;font-weight:500;line-height:1.4;text-align:left;transition:color .25s}
.demo-visual-page .dv-button-orb{display:grid;place-items:center;width:34px;height:34px;flex:none;background:linear-gradient(145deg,#50514b,#30332d);border:1px solid #e4e5d721;border-radius:50%;box-shadow:inset 0 1px 0 #ffffff14,0 3px 5px #0003;transition:transform .3s,background .3s}
.demo-visual-page .dv-button-orb svg{width:16px;height:16px;color:#eeede5}
.demo-visual-page button.dv-lesson-button[aria-expanded="true"]{color:var(--dv-gold)}
.demo-visual-page .dv-carousel-controls{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:-12px;min-height:56px}
.demo-visual-page .dv-position{font-size:11px;line-height:1.5;color:#898b85;display:flex;align-items:center;gap:12px}
.demo-visual-page [data-dv-count]{font-size:13px;line-height:1.5;font-weight:500;color:#e9e8e0;letter-spacing:.07em;font-variant-numeric:tabular-nums}
.demo-visual-page [data-dv-count]>span{color:#6e716b;margin-left:5px;font-weight:400}
.demo-visual-page .dv-controls-capsule{display:flex;align-items:center;gap:14px;border-radius:100px;padding:5px 7px 5px 13px;background:linear-gradient(150deg,#2d2f29,#1e211c);border:1px solid #ffffff14;box-shadow:0 4px 10px #0003,inset 0 1px 0 #ffffff0a}
.demo-visual-page .dv-dots{display:flex;align-items:center;gap:0}
.demo-visual-page .dv-dots>button{display:grid;place-items:center;min-width:24px;min-height:44px;width:24px;padding:0;border:0;border-radius:100px;background:transparent;box-shadow:none;transition:width .35s}
.demo-visual-page .dv-dots>button>span{display:block;width:5px;height:5px;border-radius:100px;background:#6a6f62;transition:width .35s,background .35s}
.demo-visual-page .dv-dots>button[aria-current="true"]{width:34px}
.demo-visual-page .dv-dots>button[aria-current="true"]>span{width:24px;background:linear-gradient(90deg,#ecd5a4,#bea16b);box-shadow:0 1px 0 #fff2}
.demo-visual-page .dv-controls-divider{height:18px;width:1px;background:#ffffff16}
.demo-visual-page .dv-arrows{display:flex;gap:6px}
.demo-visual-page .dv-arrows>button{display:grid;place-items:center;width:44px;height:44px;min-width:44px;min-height:44px;padding:0;border:1px solid #ffffff14;border-radius:50%;background:linear-gradient(145deg,#4a4d43,#30352b);box-shadow:inset 0 1px 0 #ffffff14,0 2px 4px #0002;color:#f0f0e7;transition:opacity .2s,background .2s,transform .2s}
.demo-visual-page .dv-arrows>button:disabled{opacity:.28;cursor:default;box-shadow:none}
.demo-visual-page .dv-reader-host{scroll-margin-top:100px}
.demo-visual-page .dv-sample-reader{display:grid;grid-template-columns:.65fr 1fr;position:relative;overflow:hidden;margin-top:44px;border:1px solid #c2ad7840;border-radius:30px;background:linear-gradient(140deg,#2b2c26,#1a1d17);box-shadow:0 18px 40px -24px #000,inset 0 1px 0 #fff1;scroll-margin-top:100px}
.demo-visual-page .dv-reader-art{position:relative;min-height:320px;overflow:hidden;background:#26271f}
.demo-visual-page .dv-reader-art>img{width:100%;height:100%;position:absolute;object-fit:cover;opacity:.7}
.demo-visual-page .dv-reader-art::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 50%,#24261f)}
.demo-visual-page .dv-reader-art>span{position:absolute;z-index:1;bottom:20px;left:28px;font-size:76px;line-height:1;font-weight:500;letter-spacing:-.06em;color:#efdcac}
.demo-visual-page .dv-reader-content{padding:30px 36px 36px;min-width:0}
.demo-visual-page .dv-reader-header{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:24px}
.demo-visual-page .dv-reader-header>.dv-kicker{margin:0;font-size:9px}
.demo-visual-page .dv-reader-header>button{display:grid;place-items:center;flex:none;width:44px;height:44px;padding:0;border:1px solid #ffffff14;border-radius:50%;background:#34382d;color:#dddfd5;box-shadow:inset 0 1px 0 #ffffff0a}
.demo-visual-page .dv-sample-reader h3{font-size:clamp(25px,2.5vw,38px);font-weight:550;letter-spacing:-.035em;line-height:1.18;margin:0 0 22px;color:#f2f1e9;text-wrap:balance}
.demo-visual-page .dv-reader-content>p{font-size:14px;line-height:1.9;color:#b1b6a9;margin:0 0 26px}
.demo-visual-page .dv-sample-reader blockquote{padding:0 0 0 17px;border-left:2px solid #bda370;font-size:14px;line-height:1.75;margin:0;color:#dfd8c7}
.demo-visual-page .dv-disclaimer{font-size:10px;line-height:1.7;color:#666b61;margin:36px 0 0;padding-top:20px;border-top:1px solid #ffffff0d}
@media(hover:hover) and (pointer:fine){.demo-visual-page .dv-course-card:hover{transform:translateY(-6px) rotateX(1deg) rotateY(-1.2deg)}.demo-visual-page .dv-course-card:hover .dv-card-surface{border-color:#e6d1a259;box-shadow:0 26px 42px -22px #000,0 8px 16px #0007,inset 0 1px 0 #f7e8c43b}.demo-visual-page .dv-course-card:hover .dv-course-cover>img{transform:scale(1.06)}.demo-visual-page .dv-lesson-button:hover{color:#f2dfb5}.demo-visual-page .dv-lesson-button:hover .dv-button-orb{transform:scale(1.08);background:linear-gradient(145deg,#676753,#3f4436)}.demo-visual-page .dv-arrows>button:hover:not(:disabled){background:linear-gradient(145deg,#676b58,#414a37);transform:scale(1.04)}}
@media(max-width:1200px){.demo-visual-page .dv-section-heading{grid-template-columns:minmax(0,1fr) 290px;gap:12px}.demo-visual-page .dv-folio{transform:scale(.88);transform-origin:center right}.demo-visual-page .dv-section-heading h2{font-size:clamp(42px,4.8vw,62px)}.demo-visual-page .dv-gallery-heading{align-items:flex-start;flex-direction:column;gap:8px}}
@media(max-width:960px){.main-content[data-community-page="demo-visual"] #room-viewport{padding:24px 32px 48px!important}.demo-visual-page{--dv-gutter:32px;--dv-gap:22px;--dv-card-width:min(360px,calc(100% - 42px))}.demo-visual-page .dv-section-heading{grid-template-columns:1fr;padding:42px 0 36px;gap:0}.demo-visual-page .dv-folio{display:none}.demo-visual-page .dv-section-heading h2{font-size:54px}.demo-visual-page .dv-course-info{padding:18px 26px 24px}.demo-visual-page .dv-course-info h4{font-size:30px}.demo-visual-page .dv-sample-reader{grid-template-columns:1fr}.demo-visual-page .dv-reader-art{min-height:210px;max-height:240px}.demo-visual-page .dv-reader-art::after{background:linear-gradient(180deg,transparent 50%,#25271f)}.demo-visual-page .dv-reader-art>span{font-size:62px}}
@media(max-width:700px){.main-content[data-community-page="demo-visual"] #room-viewport{padding:20px 24px 36px!important}.demo-visual-page{--dv-gutter:24px;--dv-gap:18px;--dv-card-width:calc(100% - 32px)}.demo-visual-page .dv-page-heading{gap:10px;padding-bottom:18px}.demo-visual-page .dv-page-heading h1{font-size:12px}.demo-visual-page .dv-page-heading h1>span{display:none}.demo-visual-page .dv-preview-tag{font-size:9px;padding:7px 10px;gap:6px}.demo-visual-page .dv-section-heading{padding:34px 0 30px}.demo-visual-page .dv-kicker{font-size:9px;letter-spacing:.1em;margin-bottom:17px}.demo-visual-page .dv-section-heading h2{font-size:clamp(34px,8.5vw,54px);line-height:1.08}.demo-visual-page .dv-hero-description{font-size:13px;line-height:1.8;margin:20px 0 18px;max-width:36ch}.demo-visual-page .dv-course-badge{font-size:9px;gap:7px}.demo-visual-page .dv-course-badge svg{width:14px;height:14px}.demo-visual-page .dv-gallery-heading{gap:7px;margin-bottom:2px}.demo-visual-page .dv-gallery-heading h3{font-size:20px}.demo-visual-page .dv-gallery-heading>p{font-size:11px}.demo-visual-page .dv-rail{padding-top:19px;padding-bottom:30px}.demo-visual-page .dv-card-surface{border-radius:25px}.demo-visual-page .dv-course-cover{aspect-ratio:1.4}.demo-visual-page .dv-cover-label{left:17px;top:17px;font-size:8px;padding:8px 11px;gap:8px}.demo-visual-page .dv-cover-label>strong{font-size:10px}.demo-visual-page .dv-course-info{padding:16px 23px 22px}.demo-visual-page .dv-course-info>.dv-kicker{font-size:9px;letter-spacing:.1em;margin-bottom:13px}.demo-visual-page .dv-course-info h4{font-size:29px;line-height:1.15;margin-bottom:16px;min-height:2.3em}.demo-visual-page .dv-card-description{font-size:12px;line-height:1.8;margin-bottom:20px}.demo-visual-page button.dv-lesson-button{font-size:11px;min-height:52px;padding-top:12px}.demo-visual-page .dv-carousel-controls{gap:12px;flex-wrap:wrap;margin-top:-7px}.demo-visual-page .dv-position{font-size:10px;gap:8px}.demo-visual-page [data-dv-count]{font-size:11px}.demo-visual-page .dv-controls-capsule{gap:9px;padding:4px 5px 4px 9px}.demo-visual-page .dv-controls-divider{height:16px}.demo-visual-page .dv-dots>button{min-width:24px;width:24px}.demo-visual-page .dv-dots>button[aria-current="true"]{width:28px}.demo-visual-page .dv-dots>button[aria-current="true"]>span{width:20px}.demo-visual-page .dv-arrows{gap:4px}.demo-visual-page .dv-arrows>button{width:44px;height:44px}.demo-visual-page .dv-sample-reader{margin-top:30px;border-radius:25px}.demo-visual-page .dv-reader-content{padding:20px 24px 27px}.demo-visual-page .dv-reader-header{margin-bottom:20px}.demo-visual-page .dv-reader-header>.dv-kicker{font-size:8px}.demo-visual-page .dv-sample-reader h3{font-size:26px;margin-bottom:20px}.demo-visual-page .dv-reader-content>p{font-size:13px;line-height:1.85}.demo-visual-page .dv-sample-reader blockquote{font-size:13px}.demo-visual-page .dv-disclaimer{margin-top:28px;padding-top:18px;font-size:9px}}
@media(max-width:400px){.demo-visual-page .dv-course-info h4{font-size:27px}.demo-visual-page .dv-course-badge{font-size:8px}}
@media(max-width:360px){.demo-visual-page .dv-carousel-controls{flex-direction:column;align-items:stretch;gap:12px}.demo-visual-page .dv-controls-capsule{align-self:flex-end}}
@media(prefers-reduced-motion:reduce){.demo-visual-page *{transition:none!important;animation:none!important;scroll-behavior:auto!important}.demo-visual-page .dv-course-card:hover{transform:none}.demo-visual-page .dv-course-card:hover .dv-course-cover>img{transform:scale(1.025)}}
