/* A shared visual layer for the marketing pages. Keep application controls in their own CSS. */
:root{--plum:#20111d;--paper:#fbf7f2;--orange:#ffb23d;--line:#e2d5cf}
body{background:var(--paper)}
section[id]{scroll-margin-top:82px}
.site-header{position:sticky;top:0;background:#20111df5;backdrop-filter:blur(14px);box-shadow:0 1px 0 #ffffff16}
.site-header nav a{font-size:12px;letter-spacing:.025em}
.site-header nav .nav-cta{border-radius:7px;padding:13px 21px;box-shadow:0 7px 22px #ffb23d26}
.button{border-radius:7px;letter-spacing:.045em}
.button.primary{box-shadow:0 8px 24px #ffb23d2b}
.button:focus-visible,.under-link:focus-visible,.jump-links a:focus-visible,.pathway-grid a:focus-visible,.comparison-range:focus-visible{outline:3px solid #9b4cf4;outline-offset:4px}
.breadcrumb{background:var(--paper);padding-top:17px;padding-bottom:17px}
.page-hero{overflow:hidden}
.page-hero-visual{position:relative}
.page-hero-visual:before{content:"";position:absolute;right:-110px;top:-130px;width:400px;height:400px;border:1px solid #ffffff36;border-radius:50%;pointer-events:none}
.page-hero .page-hero-image img{border-radius:20px;object-position:center 24%;box-shadow:0 24px 58px #24111e30}
.page-hero-image figcaption{padding-top:7px}
.jump-links{gap:9px;margin-top:30px}
.jump-links a{display:inline-flex;align-items:center;min-height:34px;padding:7px 13px;border:1px solid currentColor;border-radius:999px;letter-spacing:.035em;text-decoration:none;opacity:.8;transition:opacity .2s,background .2s,transform .2s}
.jump-links a:hover{opacity:1;background:#ffffff20;transform:translateY(-2px)}
.page-pricing .jump-links a,.page-download .jump-links a,.page-features .jump-links a{border-color:#b78e98}
.eyebrow{letter-spacing:.17em}

/* Show illustrations and useful controls beside copy, instead of text-only cards. */
.card{position:relative;min-height:235px;border:1px solid #e7d5cc;border-top:3px solid #c02d66;border-radius:16px;box-shadow:0 10px 28px #39212d0a;overflow:hidden}
.card:before{display:none}
.card-icon,.home-package-icon,.plan-card-icon{display:grid;place-items:center;width:52px;height:52px;border-radius:15px;background:#fae4ec;color:#ba2d65;margin-bottom:20px}
.line-icon{display:block;width:27px;height:27px}
.card:nth-child(3n+2) .card-icon{background:#fff0d0;color:#a95019}
.card:nth-child(3n) .card-icon{background:#eee3ff;color:#7547b5}
.card h3{font-size:23px;letter-spacing:-.045em}
.card p{line-height:1.6}
.check-list li{padding:14px 0 14px 36px;line-height:1.55}
.check-list li:before{content:'✓';display:grid;place-items:center;left:0;top:16px;width:22px;height:22px;background:#fbe0eb;color:#a6255a;border-radius:50%;font:900 12px Manrope,sans-serif}
.feature-row{gap:6vw}
.feature-row figure img{border-radius:16px;object-position:center 20%}
.feature-mosaic{gap:14px}
.feature-mosaic figure{overflow:hidden;border-radius:14px}
.feature-mosaic figcaption{padding:8px 12px;background:#f4e7dd}
.feature-mosaic .animated-photo img{width:100%;height:350px;object-fit:cover;object-position:center 20%}
.camera-drawing{display:block}
.camera-paths>div{border-radius:15px}
.flow-diagram span{display:block}

/* A compact, brand-first camera directory. Long vendor lists stay available without filling the first screen. */
.page-cameras .page-hero{padding:48px 0 54px;background:#eee6d8}
.page-cameras .page-hero-grid{gap:5vw}
.page-cameras .page-hero h1{font-size:clamp(38px,4.2vw,62px);line-height:1.08}
.page-cameras .page-hero .lead{max-width:560px;font-size:17px;line-height:1.58}
.page-cameras .page-hero-image img{height:285px;object-position:center 40%;box-shadow:12px 12px 0 #ffb22f}
.camera-directory{padding:58px 0 82px;background:#fcf8f3}
.camera-directory-head{max-width:790px;margin-bottom:28px}
.camera-directory-head h2{font-size:clamp(30px,3vw,43px);letter-spacing:-.055em;margin:8px 0 10px}
.camera-directory-head>p:last-child{font-size:15px;color:#6b5b60;line-height:1.65;margin:0}
.camera-directory-head strong{color:#281820}
.camera-brand-list{display:grid;gap:12px}
.camera-brand{display:grid;grid-template-columns:minmax(220px,.29fr) 1fr;gap:30px;padding:27px 30px;background:#fff;border:1px solid #eadbd3;border-radius:16px;box-shadow:0 7px 22px #3a17280a}
.camera-brand-title{display:flex;gap:17px;align-items:flex-start}
.camera-brand-icon{display:grid;place-items:center;flex:0 0 44px;width:44px;height:44px;border-radius:12px;background:#fbe1e9;color:#b02e62;font:900 20px Manrope,sans-serif}
.camera-brand:nth-child(2) .camera-brand-icon{background:#f6e9cc;color:#9e561e}
.camera-brand:nth-child(3) .camera-brand-icon{background:#eee3f7;color:#794bad}
.camera-brand:nth-child(4) .camera-brand-icon{background:#dff1f4;color:#287687}
.camera-brand:nth-child(5) .camera-brand-icon{background:#e7eedb;color:#57783a}
.camera-brand-title h2{font-size:25px;letter-spacing:-.045em;margin:0 0 3px}
.camera-brand-title p{font-size:12px;color:#74666b;line-height:1.5;margin:0}
.camera-brand-body{min-width:0}
.camera-model-group+.camera-model-group{margin-top:15px}
.camera-model-group h3{font:800 10px/1.4 Manrope,sans-serif;text-transform:uppercase;letter-spacing:.1em;color:#b32b63;margin:0 0 6px}
.camera-model-group p,.camera-brand-body>p{font-size:14px;color:#443840;line-height:1.7;margin:0}
.camera-more{border-top:1px solid #eee4df;margin-top:17px;padding-top:12px}
.camera-more summary{width:max-content;max-width:100%;font:800 12px Manrope,sans-serif;color:#9f2757;cursor:pointer}
.camera-more[open] .camera-model-group{margin-top:13px}
.camera-brand-note{font-size:12px!important;color:#74666b!important;line-height:1.6!important;margin-top:15px!important}
.camera-brand-note a,.camera-disclaimer a{color:#a8275c;font-weight:800;text-underline-offset:3px}
.camera-quick-check{display:flex;flex-wrap:wrap;gap:10px;margin:28px 0 17px;align-items:center}
.camera-quick-check strong{font:900 11px Manrope,sans-serif;text-transform:uppercase;letter-spacing:.11em;margin-right:6px}
.camera-quick-check span{background:#f8e9dc;border-radius:99px;padding:8px 12px;font:700 12px Manrope,sans-serif;color:#5b3f39}
.camera-quick-check span:before{content:'✓';color:#a32960;margin-right:7px}
.camera-disclaimer{max-width:980px;font-size:12px;color:#75666b;line-height:1.6}

/* A real looping GIF with a still fallback for reduced-motion visitors. */
.animated-photo{position:relative;margin:0}
.animated-photo picture{display:block;overflow:hidden;border-radius:16px;background:#20121e}
.animated-photo picture img{display:block;width:100%;height:500px;object-fit:cover;object-position:center 20%}
.animated-photo figcaption,.image-comparison figcaption{font:500 11px/1.5 Manrope,sans-serif;color:#8a777b;padding-top:10px}
.gif-live{position:absolute;top:17px;left:17px;display:inline-flex;align-items:center;gap:8px;padding:8px 11px;border-radius:99px;background:#20111de6;color:white;font:800 10px/1 Manrope,sans-serif;letter-spacing:.1em;box-shadow:0 3px 13px #0004}
.gif-live i{width:7px;height:7px;border-radius:50%;background:#ffb23d;box-shadow:0 0 0 4px #ffb23d35}

/* Range controls are keyboard accessible; the visible line follows the native range value. */
.image-comparison{margin:0;min-width:0}
.comparison-stage{position:relative;width:100%;height:500px;overflow:hidden;border-radius:16px;background:#20111d;isolation:isolate;box-shadow:0 15px 38px #29101c21;touch-action:pan-y}
.comparison-stage img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 20%;max-width:none}
.comparison-original{clip-path:inset(0 calc(100% - var(--split)) 0 0)}
.comparison-label{position:absolute;z-index:2;top:16px;padding:7px 10px;border-radius:5px;background:#20111dd9;color:#fff;font:800 10px/1.2 Manrope,sans-serif;text-transform:uppercase;letter-spacing:.09em;pointer-events:none}
.comparison-label-before{left:16px}.comparison-label-after{right:16px;background:#ffb23d;color:#26111d}
.comparison-divider{position:absolute;z-index:3;left:var(--split);top:0;bottom:0;width:2px;background:white;transform:translateX(-50%);box-shadow:0 0 14px #0005;pointer-events:none}
.comparison-divider span{position:absolute;top:50%;left:50%;width:48px;height:48px;display:grid;place-items:center;transform:translate(-50%,-50%);border:4px solid white;border-radius:50%;background:#c12d67;color:white;font:900 24px/1 Manrope,sans-serif;box-shadow:0 6px 24px #14081270}
.comparison-range{position:absolute;z-index:4;left:0;top:50%;width:100%;height:52px;margin:-26px 0 0;appearance:none;background:transparent;cursor:ew-resize}
.comparison-range::-webkit-slider-runnable-track{height:52px;background:transparent}
.comparison-range::-moz-range-track{height:52px;background:transparent}
.comparison-range::-webkit-slider-thumb{appearance:none;width:52px;height:52px;border:0;background:transparent;cursor:ew-resize}
.comparison-range::-moz-range-thumb{width:52px;height:52px;border:0;background:transparent;cursor:ew-resize}

/* Home: three visual demonstrations replace the previous large text/tab block. */
.creative-lab{padding:90px 0 94px;background:radial-gradient(circle at 92% 4%,#f8d3de 0,transparent 29%),linear-gradient(180deg,#fff9f2,#f9f0eb)}
.creative-lab-heading{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(250px,.7fr);align-items:end;gap:5vw;margin-bottom:32px}
.creative-lab-heading h2{max-width:780px;margin:0;font-size:clamp(32px,3.4vw,49px);letter-spacing:-.055em}
.creative-lab-heading h2 em{color:#b02a61}
.creative-lab-heading>p{margin:0 0 5px;max-width:330px;color:#6d5b63;font-size:16px;line-height:1.65}
.creative-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.creative-card{min-width:0;background:#fffdfa;border:1px solid #eadbd5;border-radius:20px;overflow:hidden;box-shadow:0 17px 45px #45172a12;transition:transform .28s,box-shadow .28s}
.creative-card:hover{transform:translateY(-6px);box-shadow:0 22px 55px #45172a24}
.creative-card-media{position:relative;background:#291724}
.creative-card-media figure{margin:0}
.creative-card-media .comparison-stage,.creative-card-media .animated-photo picture{height:440px;border-radius:0;box-shadow:none}
.creative-card-media .animated-photo picture img{height:100%;object-position:center 18%}
.creative-card-media .image-comparison figcaption,.creative-card-media .animated-photo figcaption{min-height:36px;padding:8px 15px;background:#291724;color:#e3cdd4}
.creative-card-copy{padding:24px 25px 27px}
.creative-kicker{display:block;margin-bottom:10px;color:#ad2c64;font:900 11px/1.3 Manrope,sans-serif;letter-spacing:.12em}
.creative-card h3{font-size:clamp(22px,2vw,28px);line-height:1.18;margin:0 0 10px}
.creative-card p{color:#695b61;font-size:14px;line-height:1.55;min-height:44px;margin-bottom:20px}
.creative-card-copy a{display:inline-flex;gap:13px;align-items:center;text-decoration:none;color:#8c2455;font:800 11px Manrope,sans-serif;text-transform:uppercase;letter-spacing:.07em}
.creative-card-copy a:hover{color:#ca3f70}
.creative-disclaimer{margin:20px 0 0;color:#85777a;font-size:12px}
.product-section{padding:90px 0}
.product-frame{border-radius:18px;box-shadow:16px 16px 0 #9c2c5b}
.product-frame .product-shot img{border-radius:9px}
.home-packages{background:#efe0d9;padding:82px 0}
.home-package-grid article{border:1px solid #e6cfc9;border-radius:16px;box-shadow:0 10px 24px #56283912}
.home-package-grid .home-package-icon{display:grid;margin:0 0 18px}
.home-package-grid article>span.home-package-icon{font-size:inherit;letter-spacing:normal}
.home-package-grid h3{margin-top:14px}
.pathways{padding:80px 0 90px}
.pathway-grid{gap:16px;border:0;background:none}
.pathway-grid a{min-height:315px;padding:0 0 20px;border:1px solid #eadbd3;border-radius:16px;overflow:hidden;background:#fffdfa;box-shadow:0 12px 28px #2b18200d}
.pathway-grid a:hover{background:#fffdfa;transform:translateY(-4px)}
.pathway-photo{width:100%;height:155px;object-fit:cover;object-position:center 35%;margin-bottom:17px}
.pathway-grid a[href="download.html"] .pathway-photo{object-fit:contain;background:#332431;padding:13px}
.pathway-grid span,.pathway-grid strong{padding:0 21px}
.pathway-grid span{margin-bottom:13px}
.pathway-grid strong{font-size:23px;max-width:none}
.pathway-grid b{padding:0 21px}

/* Product examples remain readable and usable across viewport sizes. */
.page-events .experience{gap:7vw}
.page-events .experience .animated-photo,.page-events .experience .image-comparison{max-width:600px;width:100%}
.page-events .experience .animated-photo picture img{height:540px}
.page-events .experience .image-comparison .comparison-stage{height:540px}
.page-events .experience .image-comparison .comparison-stage img,.page-features .feature-row .image-comparison .comparison-stage img{height:100%;box-shadow:none;border-radius:0}
.page-events #gif{background:radial-gradient(circle at 76% 28%,#6c3159,#24131f 57%);color:#fff9f2}
.page-events #gif .eyebrow{color:#ffbc65}
.page-events #gif .lead-small,.page-events #gif p:not(.eyebrow){color:#e3cdd8}
.page-events #gif .button{border-color:#ffbd67;color:#fff9f2}
.page-events #gif .animated-photo figcaption{color:#d9bfca}
.page-events #effects{background:#f0e6f4}
.page-events #swap{background:#fff8f1}
.page-events .experience figure img{object-position:center 20%;border-radius:16px}
.page-events .experience .image-comparison figcaption{font-size:11px}
.page-features .feature-row .image-comparison .comparison-stage{height:490px}
.page-features .feature-row .animated-photo picture img{height:490px}
.page-features .feature-row figure.animated-photo img{box-shadow:none}
.page-pricing .pricing-options .plan-card{border-radius:14px;box-shadow:0 12px 30px #351b2810}
.page-pricing .pricing-options .plan-price strong{color:#24151f}
.page-pricing .pricing-options .plan-free .plan-price strong{color:#fff9f1}
.page-pricing .plan-card-icon{width:41px;height:41px;margin:17px 0 0}
.page-pricing .plan-card-icon .line-icon{width:22px;height:22px}
.page-pricing .plan-free .plan-card-icon{background:#55334b;color:#ffbc64}

@media(max-width:1050px){
  .creative-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .creative-card-gif{grid-column:span 2;display:grid;grid-template-columns:1fr 1fr}
  .creative-card-gif .creative-card-media .animated-photo picture{height:390px}
  .creative-card-gif .creative-card-copy{display:flex;flex-direction:column;justify-content:center;padding:35px}
}
@media(max-width:760px){
  section[id]{scroll-margin-top:67px}
  .site-header{position:sticky}
  .creative-lab{padding:65px 0}
  .creative-lab-heading{grid-template-columns:1fr;gap:14px}
  .creative-lab-heading>p{max-width:620px}
  .creative-grid{grid-template-columns:1fr}
  .creative-card-gif{grid-column:auto;display:block}
  .creative-card-gif .creative-card-media .animated-photo picture{height:440px}
  .creative-card-gif .creative-card-copy{display:block;padding:24px 25px 27px}
  .pathway-grid{grid-template-columns:1fr;gap:13px}
  .pathway-grid a{min-height:0}
  .pathway-photo{height:190px}
  .page-events .experience .animated-photo picture img,.page-events .experience .image-comparison .comparison-stage{height:440px}
  .page-features .feature-row .image-comparison .comparison-stage,.page-features .feature-row .animated-photo picture img{height:440px}
  .camera-brand{grid-template-columns:1fr;gap:17px;padding:22px}
  .page-cameras .page-hero{padding:38px 0 45px}
  .page-cameras .page-hero-image img{height:230px}
  .camera-directory{padding:43px 0 62px}
}
@media(max-width:520px){
  .creative-card-media .comparison-stage,.creative-card-media .animated-photo picture{height:385px}
  .creative-card-gif .creative-card-media .animated-photo picture{height:385px}
  .comparison-label{font-size:9px;padding:6px 8px}
  .comparison-divider span{width:42px;height:42px}
  .page-events .experience .animated-photo picture img,.page-events .experience .image-comparison .comparison-stage{height:390px}
  .page-features .feature-row .image-comparison .comparison-stage,.page-features .feature-row .animated-photo picture img{height:390px}
}
@media(prefers-reduced-motion:reduce){.creative-card,.pathway-grid a,.jump-links a{transition:none}}

/* Show the complete camera lineup at every viewport width. */
.page-cameras .page-hero-image img{height:auto;aspect-ratio:6960/3904;object-fit:contain}

/* Use the business-package heading as the shared section pattern. */
.section-heading,.product-section .product-lead{grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:6vw;align-items:end;margin-bottom:32px}
.section-heading-copy{min-width:0}
.section-heading-copy .eyebrow{margin:0 0 22px}
.section-heading-copy h2{max-width:760px}
.section-heading .section-heading-intro,.product-lead .section-heading-intro{grid-column:2;max-width:390px;margin:0 0 5px;line-height:1.6}
@media(max-width:760px){
  .section-heading,.product-section .product-lead{grid-template-columns:1fr;gap:12px}
  .section-heading .section-heading-intro,.product-lead .section-heading-intro{grid-column:1;max-width:620px;margin:0}
  .section-heading-copy .eyebrow{margin-bottom:16px}
}

/* The product tour uses captured desktop screens, with a full-size view for details. */
.product-section .product-lead{margin-bottom:29px}
.product-section .section-heading-intro{color:#d4c7cf}
.interactive-demo{overflow:hidden;border:1px solid #795669;border-radius:22px;background:#301d2c;box-shadow:18px 18px 0 #9c2c5b}
.demo-tabs{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));border-bottom:1px solid #76536a}
.demo-tabs button{display:flex;gap:11px;align-items:center;justify-content:center;min-height:66px;border:0;border-right:1px solid #76536a;background:transparent;color:#d7c7d0;font:800 13px/1.3 Manrope,sans-serif;transition:background .2s,color .2s}
.demo-tabs button:last-child{border-right:0}
.demo-tabs button b{color:#edb06e;font-size:11px}
.demo-tabs button[aria-selected=true]{background:#ffb23d;color:#29151f}
.demo-tabs button[aria-selected=true] b{color:#a32360}
.demo-tabs button:hover:not([aria-selected=true]){background:#4b2c40}
.demo-tabs button:focus-visible,.app-proof button:focus-visible,.app-lightbox-close:focus-visible{outline:3px solid #ffb23d;outline-offset:-4px}
.demo-panel:not([hidden]){display:grid;grid-template-columns:minmax(0,1.8fr) minmax(260px,.72fr);gap:0;animation:demo-arrive .3s ease both}
@keyframes demo-arrive{from{opacity:.6;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
.demo-screen{min-width:0;padding:24px;background:#281823}
.demo-screen .app-proof{height:100%;margin:0}
.demo-screen .app-proof-image{aspect-ratio:1.61;background:#edf0f3}
.demo-screen .app-proof-image img{width:100%;height:100%;object-fit:contain}
.demo-artwork{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;height:100%;align-items:stretch}
.demo-artwork figure{display:flex;flex-direction:column;min-width:0;margin:0;padding:7px 7px 13px;border-radius:12px;background:#432b3d;color:#fff;overflow:hidden}
.demo-artwork img{display:block;width:100%;flex:1;min-height:0;max-height:360px;aspect-ratio:4/5;object-fit:cover;object-position:center top;border-radius:7px}
.demo-artwork figcaption{padding:10px 4px 0;font:800 12px Manrope,sans-serif}
.demo-explain{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;padding:40px 34px 44px;background:radial-gradient(circle at 100% 0,#744259 0,transparent 55%),#3b2433}
.demo-explain .eyebrow{color:#ffb23d;margin-bottom:18px}
.demo-explain h3{font-size:clamp(26px,2.6vw,38px);line-height:1.14;margin:0 0 16px;color:#fffaf4}
.demo-explain>p:not(.eyebrow){color:#e4d5dc;font-size:15px;line-height:1.65}
.demo-detail{border-top:1px solid #8d6a7d;padding-top:19px;margin-top:21px;color:#ffc982;font:800 12px/1.5 Manrope,sans-serif}
.product-after{display:flex;justify-content:space-between;align-items:center;gap:28px;margin-top:47px}
.product-after p{color:#cbbcc4;font-size:12px;line-height:1.65;max-width:610px;margin:0}
.product-after .under-link{flex:0 0 auto;color:#ffc17c}
.app-proof{min-width:0;margin:0}
.app-proof-image{overflow:hidden;border-radius:12px;background:#f0f2f6}
.app-proof-image img{display:block;width:100%;height:100%;object-fit:cover}
.app-proof figcaption{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:11px;color:#c4b6be;font:500 11px/1.45 Manrope,sans-serif}
.app-proof figcaption button{border:0;background:none;padding:7px 0;color:#ffc27e;text-decoration:underline;text-underline-offset:4px;font:800 11px/1.3 Manrope,sans-serif;white-space:nowrap}
.app-proof figcaption button:hover{color:#fff}
.feature-row .app-proof{width:100%;padding:16px;background:#241722;border-radius:18px;box-shadow:16px 16px 0 #dfaebe}
.feature-row .app-proof-image{aspect-ratio:1.18}
.feature-row .app-proof-image img{width:155%;max-width:none;height:auto;object-fit:initial;transform:translateX(-29%);box-shadow:none;border-radius:0}
.feature-row .app-proof figcaption{color:#dccdd4}
.page-features .page-hero-image{background:#402a3c}
.page-features .page-hero-image img{object-fit:cover;object-position:center top}
.style-library{padding:76px 0 84px;background:#251623;color:#fff9f2}
.style-library-heading{display:flex;justify-content:space-between;align-items:end;gap:34px;margin-bottom:25px}
.style-library-heading h2{margin:0;color:#fff9f2}
.style-library-heading .eyebrow{margin-bottom:15px;color:#ffbd71}
.style-library-heading>p{max-width:360px;color:#dccbd3;font-size:15px;line-height:1.6;margin:0 0 4px}
.style-library-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.style-library-grid figure{min-width:0;margin:0;padding:7px 7px 17px;border:1px solid #745166;border-radius:16px;background:#382336;overflow:hidden}
.style-library-grid img{width:100%;aspect-ratio:4/5;object-fit:cover;object-position:center top;border-radius:10px}
.style-library-grid figcaption{display:flex;flex-direction:column;gap:1px;padding:14px 10px 0}
.style-library-grid strong{font:800 17px Manrope,sans-serif}
.style-library-grid span{font:500 11px/1.4 Manrope,sans-serif;color:#d4c4cf}
.style-library-note{margin:17px 0 0;color:#c5b4bd;font-size:11px;line-height:1.5}
.page-events .event-story-grid .story-moment.portrait-media img{height:410px;object-fit:cover;object-position:center 4%;background:#d68e42}
.app-lightbox{position:fixed;inset:0;max-width:min(96vw,1800px);max-height:94vh;width:max-content;padding:42px 14px 14px;border:1px solid #7c6975;border-radius:14px;background:#251823;color:#fff;box-shadow:0 20px 80px #0008}
.app-lightbox::backdrop{background:#110a14d9;backdrop-filter:blur(7px)}
.app-lightbox img{display:block;width:auto;max-width:100%;max-height:calc(94vh - 65px);object-fit:contain}
.app-lightbox-close{position:absolute;top:8px;right:14px;border:0;background:transparent;color:#fff;font:800 13px Manrope,sans-serif}
@media(max-width:900px){
  .demo-panel:not([hidden]){grid-template-columns:1fr}
  .demo-explain{padding:26px 28px 30px}
  .demo-explain h3{font-size:28px}
  .demo-detail{margin-top:8px;padding-top:12px}
  .style-library-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:600px){
  .interactive-demo{box-shadow:8px 8px 0 #9c2c5b}
  .demo-tabs button{min-height:59px;flex-direction:column;gap:2px;font-size:10px;padding:5px 2px}
  .demo-tabs button b{font-size:9px}
  .demo-screen{padding:10px}
  .demo-screen .app-proof-image{aspect-ratio:1.45}
  .demo-artwork{grid-template-columns:repeat(2,minmax(0,1fr))}
  .demo-artwork img{max-height:240px}
  .app-proof figcaption{align-items:flex-start;flex-direction:column}
  .product-after{display:block;margin-top:35px}
  .product-after .under-link{display:inline-block;margin-top:20px}
  .feature-row .app-proof-image{aspect-ratio:1.2}
  .style-library{padding:59px 0 66px}
  .style-library-heading{display:block}
  .style-library-heading>p{margin-top:14px}
  .style-library-grid{gap:8px}
  .style-library-grid figure{padding:5px 5px 12px}
  .style-library-grid img{aspect-ratio:3/4;object-fit:contain;background:#2c1a29}
  .style-library-grid figcaption{padding:10px 5px 0}
  .style-library-grid strong{font-size:13px}
  .style-library-grid span{font-size:10px}
  .page-events .event-story-grid .story-moment.portrait-media img{height:300px}
  .app-lightbox{padding:41px 7px 8px;width:96vw}
}
@media(prefers-reduced-motion:reduce){.demo-panel:not([hidden]){animation:none}.demo-tabs button{transition:none}}