/* One continuous colour field, measured against the content, across all sections. */
main{position:relative;isolation:isolate;overflow:clip;background:#090e15}
main::before{content:"";position:absolute;inset:0;z-index:-2;pointer-events:none;background:
  radial-gradient(ellipse 85% 620px at 94% var(--glow-blue,850px),#5367a43b,transparent 72%),
  radial-gradient(ellipse 100% 640px at -8% var(--glow-violet,1390px),#aca2e55c,transparent 76%),
  radial-gradient(ellipse 68% 520px at 96% var(--glow-pearl,2520px),#cabee844,transparent 75%),
  radial-gradient(ellipse 95% 500px at 17% var(--glow-dusk,4300px),#9c8bc23d,transparent 76%),
  linear-gradient(180deg,#090e15 0px,#0b101b var(--night-hold,500px),#252742 var(--blue-stop,940px),#7b739e var(--lilac-stop,1420px),#d1cfe4 var(--mist-stop,1910px),#edf0f6 var(--day-start,2200px),#edf0f6 var(--day-end,3970px),#d7d2e5 var(--dusk-start,4290px),#91829f var(--dusk-mid,4500px),#4b3e62 var(--dusk-low,4660px),#171829 var(--night-return,4880px),#0a101a var(--night-deep,5350px),#0a1018 100%)}
main::after{content:"";position:absolute;z-index:-1;pointer-events:none;inset:0;background:radial-gradient(ellipse 55% 340px at 83% 91%,#50599b16,transparent 75%)}
.opening,.light-world,.closing{background:none!important}
.opening{overflow:visible;position:relative}
.hero,.calendar,.light-world,.closing{position:relative;z-index:1}
.hero-foot,.availability,.footer,.footer-bottom,.control-points article,.panel-detail,.networks article,.step-node,.product-tabs{border:0}
.hero-foot{padding-top:25px}
.hero-foot>div{gap:16px;padding:13px 21px;border:1px solid #d4bff023;border-radius:30px;background:linear-gradient(115deg,#b5a4e90b,#9ea6d303);box-shadow:inset 0 1px 0 #ffffff05;backdrop-filter:blur(18px)}
.hero-foot b{color:#ad9dce}.hero-foot i{width:38px;background:linear-gradient(90deg,#b49bd066,#aab4e733)}
.hero-foot>span{color:#88839f;letter-spacing:2px;font-size:8px}
.hero h1{font-weight:300;letter-spacing:-5px}.gradient-text{background-image:linear-gradient(115deg,#d4c3fa 2%,#ad83f4 43%,#829eea 94%)}
.hero-art{z-index:0}.hero-art::after{display:none}
.hero-art img{mask-image:radial-gradient(ellipse 74% 76% at 56% 42%,#000 38%,#000c 61%,transparent 84%);-webkit-mask-image:radial-gradient(ellipse 74% 76% at 56% 42%,#000 38%,#000c 61%,transparent 84%)}
.hero-art::before{inset:10% -5% -15%;background:radial-gradient(ellipse 45% 60% at 55% 45%,#6e71ac21,transparent 80%);filter:blur(60px)}



.art-caption{bottom:1%;right:16%;font-size:7px;opacity:.65}

.calendar-stage{border-color:#d9caff4d;background:linear-gradient(130deg,#bac3eb16,#141b29a6 30%,#a89bdb10);padding:9px;border-radius:18px;box-shadow:0 30px 100px #18152e5c,0 0 70px #b9a4e317,inset 0 1px 0 #ffffff2b;backdrop-filter:blur(22px)}
.calendar-stage::after{content:"";position:absolute;inset:17% -8% -12%;z-index:-1;pointer-events:none;background:radial-gradient(ellipse,#a09ad45e,transparent 67%);filter:blur(50px)}
.stage-bar{padding:18px 22px 23px}.calendar-stage .screen-zoom{box-shadow:0 0 0 1px #c5c9ef17;border-radius:10px}
.under-stage{color:#49425f}.under-stage>span{color:#756a8c}
.context-line{margin-top:32px;gap:28px;color:#79698b}.context-line i{background:linear-gradient(90deg,transparent,#ad95c1,transparent);width:110px}
.screens{padding-top:56px}
.product-tabs{gap:8px;padding:7px;background:linear-gradient(110deg,#c9c2db4f,#e0e1ed55);border-radius:12px;box-shadow:inset 0 1px 0 #fff6;backdrop-filter:blur(16px)}
.product-tabs button{margin:0;border-radius:8px;padding:17px 20px;font-size:13px;transition:background .3s,box-shadow .3s,color .3s}
.product-tabs button[aria-selected="true"]{background:linear-gradient(115deg,#f9f7fcbd,#f0edf8af);box-shadow:0 4px 14px #49396710,inset 0 1px 0 #fff9;color:#685080}
.product-tabs button::after{display:none}.product-tabs button span{color:#a795bb;font-size:9px}.product-tabs button[aria-selected="true"] span{color:#9474b8}
.panel-image{border:1px solid #a995c251;padding:8px;border-radius:15px;background:linear-gradient(140deg,#eee5fa,#c6c6df99);box-shadow:0 20px 60px #5d527b20,inset 0 1px 0 #ffffff80}.panel-image img{border-radius:8px}
.panel-copy h3{font-size:34px;letter-spacing:-1.6px}.panel-detail{padding-top:0;color:#877297}.panel-copy .text-link{color:#806297}
.step-node{padding-top:0}.step-node::before{content:"";position:absolute;left:27px;right:-30px;top:5px;height:1px;background:linear-gradient(90deg,#ad97c950,#aa9bbb20)}.steps li:last-child .step-node::before{right:0}.step-node i{top:2px;width:6px;height:6px;border:0;background:#ac91c9;box-shadow:0 0 0 4px #b7a2cd13}
.step-symbol{color:#9c83ba}.steps h3{letter-spacing:-.6px}.networks article{padding:28px 24px;margin-bottom:16px;border-radius:13px;background:linear-gradient(120deg,#ffffff65,#d6cee32b);box-shadow:inset 0 1px 0 #ffffff7d,0 5px 20px #78638805;backdrop-filter:blur(16px)}
.network-note{margin:22px 15px 0 24px;color:#93839f}.control{padding-top:80px}.control-heading{max-width:1000px;margin:auto}.control-heading h2{font-size:clamp(40px,4.4vw,64px)}
.connected-art img{mask-image:radial-gradient(ellipse 73% 68% at 50% 49%,#000 36%,#000b 60%,transparent 82%);-webkit-mask-image:radial-gradient(ellipse 73% 68% at 50% 49%,#000 36%,#000b 60%,transparent 82%)}
.connected-art{margin-top:10px}.control-points article{position:relative;padding:28px 28px 0 0}.control-points article::before{content:"";position:absolute;left:0;top:0;width:34px;height:1px;background:linear-gradient(90deg,#b89bd6,transparent)}
.availability{padding-top:72px;padding-bottom:64px;overflow:visible}.availability-orbit{right:-24%;top:6%;width:94%;height:100%;background:radial-gradient(ellipse,#7b609127,transparent 66%)}.availability-orbit i{border-color:#a69ac42e}.availability-orbit span{box-shadow:0 0 22px 5px #b5a0e04d}.footer{padding-top:55px}.footer-bottom{padding-top:0}
.button{background:linear-gradient(115deg,#8a6be7,#6654cd 62%,#5f64c8);border-color:#cfbcff66;box-shadow:inset 0 1px 0 #e9dfff55,0 8px 35px #4e3c941c}
@media(max-width:1100px){.hero h1{letter-spacing:-4.5px}.panel-copy h3{font-size:29px}.product-tabs button{padding:16px 12px}.control{padding-top:80px}}
@media(max-width:900px){
 .hero{padding-bottom:50px}.hero h1{letter-spacing:-3.3px}.hero-art img{mask-image:radial-gradient(ellipse 80% 75% at 53% 43%,#000 34%,#000c 60%,transparent 84%);-webkit-mask-image:radial-gradient(ellipse 80% 75% at 53% 43%,#000 34%,#000c 60%,transparent 84%)}
 .hero-art{margin-top:8px;margin-bottom:13px}.art-caption{display:none}
 .hero-foot{padding:20px 0}.hero-foot>div{padding:12px 15px;gap:11px}.hero-foot i{width:25px}.hero-foot b{font-size:7px}
 .calendar{padding-top:18px}.calendar-stage{padding:5px;border-radius:10px}.calendar-stage .screen-zoom{border-radius:5px}.stage-bar{padding:12px 9px 16px}.calendar-stage::after{filter:blur(30px)}.context-line{margin-top:40px;gap:12px;font-size:9px}.context-line i{width:22px}
 .screens{padding-top:45px}.product-tabs{padding:5px;gap:4px;border-radius:9px;overflow-x:auto}.product-tabs button{font-size:11px;padding:13px 12px;border-radius:6px;flex:1}.product-tabs button span{display:none}.product-panel{padding-top:26px;gap:24px}.panel-image{padding:5px;border-radius:10px}.panel-image img{border-radius:5px}.panel-copy h3{font-size:29px;letter-spacing:-1.3px}
 .step-node{padding-top:0}.step-node::before{right:0}.steps{row-gap:40px}.networks article{padding:24px 20px;gap:19px;margin-bottom:13px}.network-note{margin-left:4px;margin-right:4px}.control{padding-top:60px}.control-heading h2{font-size:35px}.control-heading>p:last-child{color:#b7acc6}.control-points{gap:27px}.control-points article{padding:22px 0 0}.availability{padding-top:48px;padding-bottom:48px}.availability-orbit{right:-72%;width:165%;height:68%;top:18%;opacity:.65}.footer{padding-top:28px}.footer-bottom{padding-top:0}
}
@media(max-width:360px){.hero h1{font-size:46px;letter-spacing:-2.8px}.hero-foot>div{gap:8px;padding:11px 12px}.hero-foot i{width:17px}.context-line{font-size:8px;gap:8px}.context-line i{width:19px}.product-tabs button{padding:13px 10px;font-size:10px}.control-heading h2{font-size:31px}}
.hero-art img,.connected-art img{
 mask-image:linear-gradient(180deg,transparent 0%,#000 15%,#000 78%,transparent 100%),linear-gradient(90deg,transparent 0%,#000 15%,#000 86%,transparent 100%);
 -webkit-mask-image:linear-gradient(180deg,transparent 0%,#000 15%,#000 78%,transparent 100%),linear-gradient(90deg,transparent 0%,#000 15%,#000 86%,transparent 100%);
 -webkit-mask-composite:source-in;mask-composite:intersect;
}







/* The only drawn connectors are the two fine arrows between stage labels. */
.hero{min-height:0}
.hero-foot{gap:35px;padding-top:20px;padding-bottom:25px}
.hero-foot>.journey-flow{display:grid;grid-template-columns:1fr 48px 1fr 48px 1fr;gap:0;align-items:center;flex:1;padding:0;border:0;border-radius:0;background:none;box-shadow:none;backdrop-filter:none}
.journey-stop{min-height:67px;display:flex;align-items:center;gap:17px;padding:18px 24px;border:1px solid #a497c22b;border-radius:7px;background:linear-gradient(120deg,#bab9e408,#bab9e402);font-size:16px;color:#d9d5e5;letter-spacing:-.25px;box-shadow:inset 0 1px 0 #e3d9ff06}
.hero-foot .journey-stop b{font:9px monospace;color:#a595c3;letter-spacing:.5px;font-weight:400}
.hero-foot>a{padding-left:0;margin-left:0;flex-shrink:0}
.context-line i{width:24px;height:0;background:none}
.context-line i::after,.step-node::before{display:none}
.step-node{height:22px}
.step-node i{display:none}
@media(max-width:1100px){.hero-foot{gap:25px}.hero-foot>.journey-flow{grid-template-columns:1fr 36px 1fr 36px 1fr}.journey-stop{padding:18px 20px;font-size:15px}}
@media(max-width:900px){.hero-foot{padding:28px 0 12px;gap:18px}.hero-foot>.journey-flow{grid-template-columns:1fr 24px 1fr 24px 1fr}.journey-stop{min-height:64px;padding:13px 14px;gap:10px;font-size:14px}.hero-foot .journey-stop b{font-size:8px}.context-line i{width:10px}}
@media(max-width:480px){.hero-foot{gap:12px}.hero-foot>.journey-flow{grid-template-columns:1fr 18px 1fr 18px 1fr}.journey-stop{min-height:62px;padding:11px 10px;gap:7px;flex-direction:column;align-items:flex-start;font-size:12px}.hero-foot>a{font-size:17px}}

/* A shared vertical rhythm; gradients run behind content instead of reserving blank space. */
.hero{padding-top:180px;padding-bottom:0}
.hero-art{top:168px}
.hero .hero-foot{position:relative;left:auto;right:auto;bottom:auto;margin-top:36px;padding-top:12px;padding-bottom:20px}
.section-heading{margin-bottom:32px}
.calendar{padding-top:64px;padding-bottom:32px}
.context-line{margin-top:32px}
.screens{padding-top:56px;padding-bottom:24px}
.product-tabs{margin-top:32px}
.product-panel{min-height:0;padding-top:32px}
.workflow{padding:64px 0 40px}
.steps{margin-top:40px}
.publishing{padding-top:40px;padding-bottom:48px}
.control{padding-top:80px}
.connected-art{margin-top:-12px;margin-bottom:-56px}
.control-points{margin-top:0;padding-bottom:40px}
.availability{padding-top:72px;padding-bottom:64px}
.footer{padding-top:36px;padding-bottom:24px}
.footer-bottom{margin-top:40px}
@media(max-width:900px){
 .hero{padding-top:124px;padding-bottom:0}
 .hero-art{top:auto;margin-top:6px;margin-bottom:-10px}
 .hero .hero-foot{margin-top:0;padding-top:12px;padding-bottom:12px}
 .section-heading{margin-bottom:26px}
 .calendar{padding-top:32px;padding-bottom:28px}
 .context-line{margin-top:24px}
 .screens{padding-top:40px;padding-bottom:20px}
 .product-tabs{margin-top:26px}
 .product-panel{padding-top:24px}
 .workflow{padding:44px 0 24px}
 .steps{margin-top:32px}
 .publishing{padding-top:28px;padding-bottom:28px}
 .control{padding-top:60px}
 .connected-art{margin-top:16px;margin-bottom:-18px}
 .control-points{margin-top:0;padding-bottom:28px}
 .availability{padding-top:48px;padding-bottom:48px}
 .footer{padding-top:28px;padding-bottom:24px}
 .footer-bottom{margin-top:32px}
}

.network-note{color:#5c4d69}

/* Small, quiet finishing details on existing interactions. */
.journey-arrow{display:block;height:16px;background:url('../assets/stage-arrow.svg') center/100% 100% no-repeat;pointer-events:none}
.journey-arrow:nth-of-type(2){transform:scaleY(-1)}
.product-panel .panel-image{aspect-ratio:2048/1656;display:flex;align-items:center;justify-content:center}
.product-panel .panel-image img{width:100%;height:100%;object-fit:contain}
.product-tabs button:focus-visible{outline-offset:2px}
.product-tabs button:hover{color:#674d88;background:#ffffff36}
.button span,.text-link>span:last-child{transition:transform .2s ease}
.button:hover span,.button:focus-visible span{transform:translate(2px,-2px)}
.text-link:hover>span:last-child,.text-link:focus-visible>span:last-child{transform:translateX(2px)}
.screen-zoom{cursor:zoom-in}
.panel-image{transition:border-color .25s,box-shadow .25s}
.panel-image:hover,.panel-image:focus-visible{border-color:#ac8ccd99;box-shadow:0 20px 55px #5d527b2b,inset 0 1px 0 #ffffff99}
.networks article{border:1px solid #ffffff55}
.brand-keepsake{position:absolute;right:8%;top:50%;width:190px;height:210px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:25px;transform:translateY(-50%);border:1px solid #bcacf331;border-radius:24px;background:linear-gradient(145deg,#c2b4f21a,#6b69b608 65%);box-shadow:inset 0 1px 0 #ffffff14,0 22px 70px #05080f40;backdrop-filter:blur(14px);pointer-events:none}
.brand-keepsake img{width:94px;filter:drop-shadow(0 10px 22px #4942bd40)}
.brand-keepsake span{font:8px monospace;letter-spacing:3px;color:#aaa0c8}
.close{min-width:44px;min-height:44px;display:grid;place-items:center;border-radius:7px;transition:background .2s,color .2s}
.close:hover,.close:focus-visible{background:#c8b4f017;color:#fff}
html:has(dialog[open]){overflow:hidden}
@media(max-width:1100px){.brand-keepsake{right:3%;width:165px;height:185px}}
@media(max-width:900px){.brand-keepsake{display:none}.journey-arrow{height:13px}}
@media(prefers-reduced-motion:reduce){.button span,.text-link>span:last-child,.panel-image,.close{transition:none}}
/* Secondary copy stays readable against both ends of the gradient. */
.status{color:#a1a6b8}
.product-note{color:#6a6277}
.availability-copy>p.availability-note{color:#9ca4b7}
.planned{color:#7b608e}
.footer-bottom,.legal{color:#949daf}
.legal{font-size:9px;line-height:1.7}

/* Cinematic concept scenes with live, accessible typography. */
.workflow .steps{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin-top:32px;align-items:stretch}
.workflow .steps>.workflow-card{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.3fr);grid-template-rows:auto 1fr;column-gap:12px;row-gap:18px;align-content:center;position:relative;min-width:0;min-height:302px;padding:27px 24px;border:1px solid #b7a5e35c;border-radius:17px;background:radial-gradient(ellipse 90% 100% at 100% 100%,#454b8429,transparent 80%),linear-gradient(135deg,#11192b,#101726 65%,#141b31);box-shadow:inset 0 1px 0 #e5ddff21,0 14px 35px #25304717;overflow:hidden}
.workflow-card::before{content:"";position:absolute;top:0;left:15%;width:70%;height:1px;background:linear-gradient(90deg,transparent,#c4b4fa70,transparent);pointer-events:none}
.workflow-card-top{grid-column:1;grid-row:1;display:flex;align-items:center;justify-content:flex-start;gap:11px;z-index:1}
.workflow-index{font:10px/1.4 monospace;color:#c9b8ec;letter-spacing:1px}
.workflow-stage{font-size:8px;line-height:1.4;letter-spacing:1.5px;color:#b3a4d0}
.workflow-illustration{grid-column:2;grid-row:1/span 2;align-self:center;position:relative;width:calc(100% + 14px);aspect-ratio:var(--scene-ratio);margin:0 -14px 0 0;overflow:hidden;pointer-events:none;mask-image:linear-gradient(90deg,transparent,#000 4%,#000 97%,transparent),linear-gradient(180deg,transparent,#000 3%,#000 96%,transparent);mask-composite:intersect;-webkit-mask-composite:source-in}
.workflow-illustration img{position:absolute;max-width:none;width:var(--crop-width);height:auto;left:var(--crop-left);top:var(--crop-top);filter:saturate(.78) brightness(.94)}
.workflow-copy{grid-column:1;grid-row:2;position:relative;z-index:1;align-self:start}
.workflow .steps h3{font-size:24px;line-height:1.17;letter-spacing:-.8px;color:#f0f1f7;font-weight:400}
.workflow .steps p{max-width:none;margin-top:13px;font-size:12px;line-height:1.8;color:#b4bed1}
.workflow-caption{font-size:10px;line-height:1.6;color:#746985;margin-top:16px;text-align:right}
@media(max-width:1100px){
 .workflow .steps{gap:18px}
 .workflow .steps>.workflow-card{display:flex;flex-direction:column;gap:0;align-items:stretch;padding:24px;min-height:0}
 .workflow-card-top{margin-bottom:14px}
 .workflow-illustration{align-self:center;width:100%;max-width:420px;margin:0 -6px 15px}
 .workflow-copy{align-self:stretch}
 .workflow .steps h3{font-size:23px}
 .workflow .steps p{font-size:12px;line-height:1.8}
 }
@media(max-width:600px){
 .workflow .steps{grid-template-columns:minmax(0,1fr);gap:16px;margin-top:26px}
 .workflow .steps>.workflow-card{padding:22px 20px 25px;border-radius:16px}
 .workflow-card-top{margin-bottom:8px}
 .workflow-illustration{max-width:400px;margin-bottom:14px}
 .workflow .steps h3{font-size:24px;letter-spacing:-.8px}
 .workflow .steps p{font-size:13px;line-height:1.75;margin-top:12px}
 .workflow-caption{text-align:left;font-size:9px}
}
@media(max-width:360px){
 .workflow .steps>.workflow-card{padding:20px 17px 23px}
 .workflow .steps h3{font-size:22px}
 }

/* Art-directed viewport of the approved new Compose campaign. */
.product-panel .panel-image.campaign-compose{position:relative;overflow:hidden;aspect-ratio:912/734}
.product-panel .campaign-compose #product-screen,#enlarged-screen-frame.campaign-compose #enlarged-screen{position:absolute;max-width:none;width:169.84649%;height:auto;left:-57.45614%;top:-29.29155%;object-fit:fill;border-radius:0}
#enlarged-screen-frame{display:flex;justify-content:center;max-width:100%;margin-inline:auto}
#enlarged-screen-frame>img{display:block;max-width:100%;max-height:76vh;width:auto;height:auto;object-fit:contain}
#enlarged-screen-frame.campaign-compose{display:block;position:relative;overflow:hidden;width:min(100%,94.4vh);aspect-ratio:912/734;border-radius:8px}
#enlarged-screen-frame.campaign-compose #enlarged-screen{max-height:none}
