@media(max-width:560px){.closing h2{font-size:clamp(48px,12vw,66px)}}

.raw-bridge{padding:70px 0 76px;background:#101211;border-top:1px solid #292c29}
.raw-bridge-inner{display:grid;grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);gap:clamp(32px,5vw,86px);align-items:center}
.raw-bridge-heading h2{font-size:clamp(36px,4vw,58px);line-height:1.06;letter-spacing:-.045em;margin:14px 0 18px}
.raw-bridge-heading>p:last-child{color:#a8aca7;max-width:37ch;line-height:1.65}
.raw-bridge-formats{display:grid;gap:12px}
.raw-bridge-formats article{display:flex;gap:20px;align-items:flex-start;padding:24px;border:1px solid #3b3d38;border-radius:15px;background:linear-gradient(120deg,#1a1c1b,#141615)}
.raw-bridge-formats article h3{font-size:20px;letter-spacing:-.025em;margin:0 0 9px}
.raw-bridge-formats article p{color:#aeb2ac;font-size:14px;line-height:1.58;margin:0;max-width:60ch}
.raw-format-mark{display:grid;flex:0 0 42px;place-items:center;width:42px;height:42px;border-radius:11px;background:#322819;color:#e8ad54;font:700 20px Manrope,sans-serif;letter-spacing:-.07em}
.raw-format-mark.prores{background:#252a31;color:#9bb7d9}
@media(max-width:800px){.raw-bridge-inner{grid-template-columns:1fr}.raw-bridge{padding:54px 0}.raw-bridge-heading>p:last-child{max-width:54ch}}
@media(max-width:560px){.raw-bridge-formats article{padding:19px;gap:15px}.raw-bridge-formats article h3{font-size:18px}.raw-format-mark{flex-basis:36px;width:36px;height:36px;font-size:18px}}

/* A landscape-format scene in the portrait app capture leads the 3.0 presentation. */
.hero-product{max-width:460px;margin-left:auto;margin-right:auto}
.hero-product .screen-shell{border-radius:38px;padding:6px}
.hero-product .screen-shell img{border-radius:32px}
@media(max-width:560px){.hero-product{max-width: min(100%, 340px)}}
.color-demo{min-width:0}
.tool-tabs{display:flex;gap:5px;margin-bottom:14px;padding:5px;background:#161715;border:1px solid #33342f;border-radius:10px}
.tool-tabs button{flex:1;min-width:0;padding:12px 9px;border:0;border-radius:6px;background:transparent;color:#a5a7a1;font:600 11px Manrope,sans-serif;letter-spacing:.01em;cursor:pointer;transition:background .2s,color .2s}
.tool-tabs button[aria-selected="true"]{background:#39362e;color:#f3c47d}
.tool-tabs button:focus-visible{outline:2px solid #f3c47d;outline-offset:2px}
.tool-panel[hidden]{display:none}
.tool-panel .color-visual{height:690px;display:flex;align-items:center;justify-content:center}
.tool-panel .color-visual img{display:block;width:auto;max-width:100%;height:calc(100% - 89px);max-height:none;object-fit:contain;object-position:center;transform:none}
.tool-panel .color-visual .wheel-label{position:absolute;left:0;right:0;top:0;z-index:1;background:#0e0f0e}
.tool-panel .color-visual p{left:0;right:0;text-align:center}
@media(max-width:800px){.tool-panel .color-visual{height:620px}}
@media(max-width:560px){.tool-tabs button{font-size:10px;padding:11px 4px}.tool-panel .color-visual{height:550px}}
@media(min-width:1000px){
  .hero{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(330px,.7fr);align-items:center;gap:38px;padding:86px max(48px,calc((100vw - 1240px)/2)) 0}
  .hero>.wrap{width:auto;max-width:none;margin:0;padding:0}
  .hero-product{max-width:390px;justify-self:end}
  .hero h1{font-size:clamp(74px,7vw,110px)}
  .hero .format-strip{grid-column:1/-1;width:100%}
}
@media(min-width:1000px){.hero-product{max-width:315px}}
@media(min-width:1000px){.hero>.hero-product{max-width:315px;width:100%}}
/* The actual wheel capture leads the gallery; other tools follow. */
@media(min-width:900px){
  .gallery-item:first-child{grid-column:span 2;grid-row:span 2}
  .gallery-item:first-child .gallery-image{height:635px}
}
@media(max-width:899px){
  .gallery-item:first-child{grid-column:span 2}
  .gallery-item:first-child .gallery-image{height:min(72vw,540px)}
}
