/* Direction 03 — a product showroom, with room to breathe. */
:root{--canvas:#fffaf5;--ink:#181416;--line:#e1d6cd}body{background:#fffaf5}#nav{background:#fffaf5f2;border-bottom-color:#e9ded5}.hero{background:transparent}.art-hero{background:radial-gradient(ellipse at 72% 40%,#f2d5df44,transparent 64%)}.hero-baseline{border-top-color:#e0d2c9}.integration-band{background:transparent}.product-theater{background:radial-gradient(ellipse at 75% 0%,#57324770,transparent 68%),#20171d}.product-theater .showcase{background:#362832;border-color:#634a5a}.product-theater .product-tabs button{color:#d5c5cd}.product-theater .product-tabs button:hover{background:#624355}.product-theater .product-caption{color:#c5aebb}.product-theater .product-caption>span:last-child{color:#a58e9b}.section#why{padding-bottom:95px}.benefit-grid article,.benefit-grid article+article{border-top-color:#decdc5}.feature-icon{background:#f0dfe5}.ugc-showroom{position:relative;isolation:isolate;overflow:hidden;background:radial-gradient(ellipse at 8% 10%,#fae7ca90,transparent 45%),radial-gradient(ellipse at 85% 75%,#d990ad65,transparent 53%),linear-gradient(145deg,#fff8ef 10%,#f6e4e8 63%,#eccbd7);padding:90px 0 85px;scroll-margin-top:85px}.ugc-showroom-inner{position:relative;z-index:2;max-width:1510px;padding:0 55px;margin:auto}.ugc-heading{display:flex;justify-content:space-between;align-items:end;gap:70px;margin-bottom:44px}.ugc-heading .eyebrow{font-size:9px;letter-spacing:.12em;color:#96284e}.ugc-heading h2{font-size:82px;line-height:1.01;margin-bottom:0;letter-spacing:-.065em}.ugc-heading h2 em{color:#96284e}.ugc-intro{max-width:380px}.ugc-intro>p{color:#846475;font-size:16px;line-height:1.75;margin-bottom:24px}.gallery-controls{display:flex;align-items:center;gap:8px}.gallery-controls>span{font:8px Mono;letter-spacing:.08em;color:#a37d8d;margin-right:auto}.gallery-controls button{display:none;width:40px;height:40px;border:1px solid #c39bad;background:#fff8;border-radius:50%;font-size:19px;color:#96284e}.ugc-films{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:18px;padding:12px 0 38px;outline-offset:7px}.ugc-film{min-width:0}.ugc-film:nth-child(even){transform:translateY(26px)}.film-frame{aspect-ratio:9/16;position:relative;overflow:hidden;border-radius:130px 130px 12px 12px;border:1px solid #c9a2b260;background:#21191e;box-shadow:0 22px 30px -17px #733b5466;isolation:isolate}.ugc-film:nth-child(even) .film-frame{border-radius:12px}.film-frame video{height:100%;width:100%;object-fit:cover;display:block;background:#21191e}.film-tag{position:absolute;top:65px;left:0;right:0;color:#fff;font:7px Mono;text-align:center;letter-spacing:.14em;text-shadow:0 1px 6px #0009;pointer-events:none}.ugc-film:nth-child(even) .film-tag{top:18px;text-align:left;left:16px}.film-play{position:absolute;left:calc(50% - 28px);top:calc(50% - 28px);width:56px;height:56px;background:#fff2;backdrop-filter:blur(8px);border:1px solid #fff8;border-radius:50%;color:white;display:grid;place-items:center;font-size:17px;transition:background .2s,transform .2s}.film-play span{padding-left:3px}.film-play:hover{background:#96284e;transform:scale(1.08)}.film-play[hidden]{display:none}.film-number{position:absolute;bottom:54px;left:16px;font:italic 28px Serif;color:#fff9;pointer-events:none;text-shadow:0 1px 6px #0006}.film-caption{padding:19px 2px 0}.film-caption h3{font-size:18px;font-weight:550;margin:0 0 7px;letter-spacing:-.03em;color:#4b2738}.film-caption p{font-size:11px;line-height:1.6;color:#9c7586;margin:0;max-width:190px}.ugc-closing{display:flex;align-items:center;justify-content:space-between;gap:40px;border-top:1px solid #cba4b466;margin-top:25px;padding-top:28px}.ugc-closing p{font-size:13px;color:#987080;line-height:1.8;margin:0}.ugc-closing strong{font-size:16px;color:#613447;font-weight:500}.ugc-closing .button{min-width:240px;justify-content:space-between}.ugc-watermark{position:absolute;bottom:-38px;left:7%;font:italic 150px Serif;line-height:1;letter-spacing:-.05em;color:#9a536211;z-index:0;white-space:nowrap;pointer-events:none}.capabilities-section{background:radial-gradient(ellipse at 90% 15%,#64354955,transparent 55%),linear-gradient(155deg,#301c29,#1a151c 70%);padding:90px max(55px,calc((100vw - 1400px)/2)) 75px;color:#fff9f3}.capabilities-section .eyebrow{color:#d5a0b6}.capabilities-section .section-intro{max-width:1400px;margin-inline:auto;margin-bottom:33px}.capabilities-section .section-intro h2{font-size:74px;line-height:1.04}.capabilities-section .section-intro h2 em{color:#e1a7bf}.capabilities-section .section-intro .intro-copy{font-size:16px;color:#c3a9b6;max-width:390px;line-height:1.8}.capability-workbench{display:block;max-width:1400px;margin:auto;background:none;border:0;border-radius:0;overflow:visible}.capability-map{display:flex;flex-flow:row wrap;gap:10px;background:none;border:0;padding:0 0 28px}.capability-map>div{display:contents}.capability-map .mini-label{display:none}.capability-map button{display:inline-flex;align-items:center;justify-content:center;gap:20px;width:auto;min-height:46px;flex:0 1 auto;border:1px solid #785367;border-radius:5px;padding:13px 17px;margin:0;background:#fff0;color:#d1b7c4;font-size:13px;letter-spacing:0;transition:background .2s,border-color .2s}.capability-map button small{display:none}.capability-map button span{display:inline;color:#bb859e;font-size:13px;float:none}.capability-map button:hover{background:#653348;color:#fff}.capability-map button[aria-pressed=true],.capability-map button[aria-pressed=true]:hover{background:#f3d7e2;color:#75243f;border-color:#f3d7e2}.capability-map button[aria-pressed=true] span{color:#96284e}.feature-stage{min-height:0;display:flex;flex-direction:column;background:#fff9f2;color:#251a1f;border:1px solid #b0869944;border-radius:12px;overflow:hidden;scroll-margin-top:104px}.feature-stage:focus:not(:focus-visible){outline:none}.feature-detail{padding:45px 45px 30px;display:grid;grid-template-columns:.9fr 1.1fr;gap:0 70px}.feature-detail .eyebrow{color:#96284e;font-size:10px;grid-column:1;grid-row:1;margin-bottom:17px}.feature-detail h3{font-size:54px;line-height:1.05;grid-column:1;grid-row:2/4;margin:0;font-weight:500;letter-spacing:-.05em}.feature-detail>p:not(.eyebrow){font-size:16px;line-height:1.8;grid-column:2;grid-row:1/4;color:#8d737f;margin:0}.feature-detail ul{grid-column:1/-1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 45px;margin:26px 0 13px}.feature-detail li{font-size:13px;line-height:1.7;color:#7f6873;margin:0;padding-left:18px}.feature-detail li:before{font-size:24px;color:#96284e}.feature-detail .text-button{font-size:13px;color:#96284e;grid-column:1;padding:10px 0}.catalog-back{color:#a38694;font-size:11px;grid-column:2;justify-self:end;align-self:center;margin:0}.feature-media{padding:22px 30px 30px;background:#eadddf;border-top:1px solid #e3cdd5;display:flex;flex-direction:column;min-width:0}.feature-media-heading{font-size:13px;color:#765a68;padding:0 0 17px;order:-2}.feature-media-heading>span+span{font-size:8px;color:#a17f90}.media-picker{order:-1;margin:0 0 16px;gap:8px;display:flex;flex-wrap:wrap}.media-picker button{font-size:12px;min-height:40px;border:1px solid #c9a7b6;background:#fff5;color:#8e6479;padding:10px 16px;border-radius:4px}.media-picker button[aria-pressed=true]{background:#96284e;border-color:#96284e;color:#fff}.feature-media-content{background:#fff;min-height:0;max-height:none;display:block;border-radius:6px;border:1px solid #d6b8c5;overflow:hidden}.feature-media-content video{width:100%;height:auto;max-height:740px;aspect-ratio:16/9;object-fit:contain;display:block;background:#171317}.feature-media-content iframe{width:100%;height:650px;max-height:none;border:0;display:block}.feature-media-content video.portrait-video{width:100%;height:650px}.expand-shot{display:block;width:100%;padding:0;cursor:zoom-in}.expand-shot img{width:100%;height:auto;max-height:740px;min-height:0;object-fit:contain}.expand-shot>span{font-size:12px;background:#fff9f2eb;backdrop-filter:blur(12px);padding:12px 16px;bottom:18px;right:18px;border-color:#bd94a4;border-radius:4px;color:#96284e}.catalog-note{max-width:1400px;margin:20px auto 0;color:#9f7b8e;font-size:10px}.shopify-section{background:linear-gradient(145deg,#fffaf3,#f9ebda);padding:100px 0}.connection-visual{background:linear-gradient(160deg,#ecd2c1,#f1dccf 55%,#ead1d4)}.store-card{border-color:#d8bcad}.connection-top{color:#977061}.flow-bottom>div{background:#fff9f2;border-color:#dcc1b1}.visual-note{color:#a68174}.shopify-copy .vertical-note{border-color:#cf9eac}.ask-section{background:radial-gradient(ellipse at 10% 80%,#5b284552,transparent 62%),#21151f}.mascot-scene{background:radial-gradient(circle at 55% 35%,#fff9f2,#f0cada 75%);box-shadow:0 35px 90px #0002}.ask-section .eyebrow{color:#cb97b0}.ask-section p:not(.eyebrow){color:#c6a6b8}.light-link{border-color:#916b80}.pricing{background:#fffaf5}.price-card{background:linear-gradient(145deg,#fffdf9,#fff1f6);border-color:#dbb2c3;border-top-color:#96284e;box-shadow:0 22px 50px -30px #b5537840}.included-grid{border-bottom-color:#e3cfc7}.feature-icon{background:#f0dfe5}.faq-section{background:#fffaf5}.final-cta{background:radial-gradient(ellipse at 0% 100%,#c76085,transparent 65%),linear-gradient(110deg,#8c234b,#a3385f 62%,#7c2044)}footer{background:#fff8f1;border-color:#e6d6ca}.footer-bottom{color:#ab8d7b}.footer-bottom a,.footer-bottom button{color:#927668}.screenshot-dialog{background:#fff9f2}
@media(min-width:1600px){.ugc-heading h2{font-size:92px}.ugc-films{gap:23px}.film-caption h3{font-size:20px}.film-caption p{font-size:12px}.film-frame{border-radius:150px 150px 12px 12px}}
@media(max-width:1150px){.ugc-showroom{padding:75px 0 70px}.ugc-showroom-inner{padding-inline:35px}.ugc-heading{gap:40px}.ugc-heading h2{font-size:66px}.ugc-intro{max-width:330px}.ugc-intro>p{font-size:15px}.ugc-films{gap:12px}.film-caption h3{font-size:16px}.film-caption p{font-size:10px}.film-tag{font-size:6px;top:50px}.film-play{width:48px;height:48px;left:calc(50% - 24px);top:calc(50% - 24px)}.film-frame{border-radius:90px 90px 8px 8px}.ugc-film:nth-child(even) .film-frame{border-radius:8px}.capabilities-section{padding:75px 35px 65px}.capabilities-section .section-intro h2{font-size:61px}.capabilities-section .section-intro .intro-copy{font-size:15px;max-width:310px}.capability-map{gap:8px}.capability-map button{font-size:12px;padding:12px 15px;gap:14px}.feature-detail{padding:34px;gap:0 45px}.feature-detail h3{font-size:46px}.feature-detail>p:not(.eyebrow){font-size:15px}.feature-detail li{font-size:12px}.feature-media-content iframe{height:570px}.ugc-closing p{font-size:12px}.ugc-closing strong{font-size:15px}}
@media(max-width:760px){.ugc-showroom{padding:55px 0 45px}.ugc-showroom-inner{padding-inline:24px}.ugc-heading{display:block;margin-bottom:24px}.ugc-heading h2{font-size:57px;line-height:1.02}.ugc-heading .eyebrow{font-size:8px;margin-bottom:20px}.ugc-intro{max-width:100%;margin-top:24px}.ugc-intro>p{font-size:15px;line-height:1.75;margin-bottom:20px}.gallery-controls>span{font-size:8px}.gallery-controls button{display:grid;place-items:center}.ugc-films{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:17px;padding:8px 4px 25px;margin-inline:-4px;scrollbar-width:thin;scrollbar-color:#bd7291 #f1d9e0}.ugc-film{flex:0 0 66%;scroll-snap-align:start;transform:none!important}.film-frame{border-radius:150px 150px 10px 10px;aspect-ratio:9/16}.ugc-film:nth-child(even) .film-frame{border-radius:10px}.film-tag{top:65px;font-size:8px}.film-play{width:56px;height:56px;left:calc(50% - 28px);top:calc(50% - 28px)}.film-caption h3{font-size:19px;margin-top:0}.film-caption p{font-size:12px;max-width:240px}.film-number{font-size:32px;bottom:54px}.ugc-closing{display:block;padding-top:24px;margin-top:14px}.ugc-closing p{font-size:12px;line-height:1.8}.ugc-closing strong{font-size:16px}.ugc-closing .button{margin-top:23px;width:100%}.ugc-watermark{font-size:100px;left:-15px;bottom:-25px}.capabilities-section{padding:55px 24px 45px}.capabilities-section .section-intro h2{font-size:51px;line-height:1.05}.capabilities-section .section-intro .intro-copy{font-size:15px;max-width:100%}.capabilities-section .section-intro{margin-bottom:26px}.capability-map{display:flex;gap:7px;padding-bottom:23px}.capability-map>div{display:contents}.capability-map .mini-label{display:none}.capability-map button{font-size:11px;padding:11px 12px;min-height:42px;gap:8px;flex:1 1 auto;white-space:nowrap;width:auto}.capability-map button span{display:none}.feature-detail{display:block;padding:27px 23px}.feature-detail .eyebrow{font-size:8px;margin-bottom:17px}.feature-detail h3{font-size:37px;margin:0 0 20px;line-height:1.08}.feature-detail>p:not(.eyebrow){font-size:14px;line-height:1.8}.feature-detail ul{display:block;margin:22px 0 15px}.feature-detail li{font-size:12px;margin-bottom:13px;padding-left:17px}.feature-detail .text-button{font-size:12px;display:block}.catalog-back{font-size:11px;margin-top:13px;display:inline-block}.feature-media{padding:18px 13px}.feature-media-heading{font-size:11px;padding-bottom:12px;gap:16px}.feature-media-heading>span+span{font-size:6px}.media-picker{gap:6px;margin-bottom:12px}.media-picker button{font-size:10px;min-height:37px;padding:9px 10px;flex:1 1 auto}.feature-media-content iframe{height:400px}.feature-media-content video{aspect-ratio:16/9;min-height:190px;max-height:none}.expand-shot img{min-height:0;max-height:none}.expand-shot>span{position:static;display:block;border:0;border-top:1px solid #e4d1d9;padding:12px;font-size:11px;background:#fff5f8;text-align:right;backdrop-filter:none}.catalog-note{font-size:9px;line-height:1.8}.shopify-section{padding:65px 0}.section#why{padding-bottom:65px}.ugc-showroom{scroll-margin-top:75px}}
@media(max-width:420px){.ugc-heading h2{font-size:50px}.ugc-film{flex-basis:82%}.film-frame{border-radius:135px 135px 9px 9px}.film-tag{top:59px;font-size:7px}.capabilities-section .section-intro h2{font-size:44px}.feature-detail h3{font-size:34px}.capability-map button{font-size:10px;min-height:43px;padding:11px 10px}.feature-media-content iframe{height:365px}}
@media(prefers-reduced-motion:reduce){.film-play{transition:none}}
.gallery-controls .video-motion{display:inline-flex;align-items:center;justify-content:center;width:auto;height:36px;border-radius:4px;padding:8px 11px;font:10px Inter;color:#96284e;background:#fff6;white-space:nowrap}.film-number{bottom:18px}.film-frame video{pointer-events:none}
@media(max-width:420px){.gallery-controls{gap:6px;flex-wrap:wrap}.gallery-controls>span{font-size:7px}.gallery-controls .video-motion{font-size:9px;padding:7px 9px}.gallery-controls button[data-gallery-prev],.gallery-controls button[data-gallery-next]{width:33px;height:33px}}
/* Uniform SaaS-style video frames. */
.ugc-film:nth-child(even){transform:none}
.film-frame,.ugc-film:nth-child(even) .film-frame{border-radius:8px}
.film-tag,.ugc-film:nth-child(even) .film-tag{top:17px;left:15px;right:auto;text-align:left;background:#15121766;border:1px solid #ffffff30;border-radius:3px;padding:6px 8px;backdrop-filter:blur(6px)}