/* "Votre IA. Vos règles." — the real iPhone photo with the Coceyo app inside, a Private Mode switch on its left. */
.private-scene{display:block;margin:64px auto 0;isolation:auto;direction:ltr}
.ctl-stage{display:grid;grid-template-columns:minmax(250px,330px) minmax(0,660px);gap:clamp(20px,3.5vw,64px);justify-content:center;align-items:center;max-width:1100px;margin:0 auto}

/* left: iOS-style switch */
.ctl-switchcol{position:relative;display:flex;align-items:center;justify-content:flex-end;min-height:420px}
.ctl-switchcard{position:relative;width:100%;padding:26px 26px 24px;border-radius:30px;background:#fff;box-shadow:0 1px 0 #ffffff inset,0 0 0 1px #1d1d1f0d,0 30px 60px -34px #2a1f3d4d;transition:box-shadow .6s ease,transform .6s cubic-bezier(.16,1,.3,1)}
.private-scene[data-phase=active] .ctl-switchcard{box-shadow:0 0 0 1px #34c75955,0 30px 70px -32px #34c75988}
.ctl-kicker{margin:0 0 20px;font-size:11px;letter-spacing:.16em;font-weight:600;color:#86868b}
.ctl-switchrow{display:flex;align-items:center;gap:14px}
.ctl-lockbadge{flex:none;width:46px;height:46px;border-radius:14px;background:#f2f0f7;display:grid;place-items:center;color:#4a3a6a;transition:background .5s,color .5s}
.ctl-lockbadge svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.private-scene[data-phase=active] .ctl-lockbadge{background:#e4f8ea;color:#1f9d4a}
.ctl-switchrow b{display:block;font-size:19px;letter-spacing:-.02em;color:#1d1d1f}
.ctl-switchrow small{display:block;margin-top:4px;font-size:13px;color:#86868b}
.ctl-ios{margin-left:auto;position:relative;flex:none;width:68px;height:40px;padding:0;border:0;border-radius:99px;background:#e5e5ea;cursor:pointer;transition:background .65s ease;box-shadow:inset 0 0 0 1px #0000000d;-webkit-tap-highlight-color:transparent}
.ctl-ios span{position:absolute;left:3px;top:3px;width:34px;height:34px;border-radius:50%;background:#fff;box-shadow:0 3px 8px #00000030,0 0 0 .5px #0000001a;transition:transform .7s cubic-bezier(.22,1,.36,1)}
.ctl-ios:active span{width:40px}
.ctl-ios[aria-checked=true]{background:#34c759}
.ctl-ios[aria-checked=true] span{transform:translateX(28px)}
.ctl-ios[aria-checked=true]:active span{transform:translateX(22px)}
.ctl-ios:focus-visible{outline:3px solid #5b8dff;outline-offset:3px}
.ctl-state{position:relative;height:20px;margin:22px 0 0;font-size:13px;font-weight:500}
.ctl-state span{position:absolute;left:0;top:0;transition:opacity .45s,transform .5s cubic-bezier(.16,1,.3,1)}
.ctl-state .s-off{color:#86868b}.ctl-state .s-on{color:#1f9d4a;opacity:0;transform:translateY(6px)}
.private-scene[data-phase=active] .s-off{opacity:0;transform:translateY(-6px)}
.private-scene[data-phase=active] .s-on{opacity:1;transform:none}
.ctl-tap{position:absolute;right:34px;top:calc(50% - 4px);width:44px;height:44px;margin:-22px;border-radius:50%;background:#1d1d1f14;opacity:0;transform:scale(.4);pointer-events:none}
.private-scene[data-phase=tap] .ctl-tap{animation:ctl-tap .9s ease-out both}
@keyframes ctl-tap{0%{opacity:0;transform:scale(.4)}35%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(1.5)}}
.ctl-link{position:absolute;right:calc(-1*clamp(20px,3.5vw,64px) - 10px);top:50%;width:calc(clamp(20px,3.5vw,64px) + 40px);height:2px;margin-top:-1px;z-index:3;pointer-events:none}
.ctl-link i{display:block;height:100%;border-radius:2px;background:linear-gradient(90deg,#34c759,#34c75900);transform:scaleX(0);transform-origin:0 50%;transition:transform .9s cubic-bezier(.16,1,.3,1)}
.private-scene[data-phase=active] .ctl-link i{transform:scaleX(1)}

/* right: the photo, untouched, with the app in its screen */
.ctl-phone{position:relative;width:100%;aspect-ratio:592/510;--s:.5}
.ctl-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;user-select:none;-webkit-mask-image:linear-gradient(#000 92%,transparent);mask-image:linear-gradient(#000 92%,transparent)}
.ctl-screen{position:absolute;left:27.196%;top:3.137%;width:34.97%;height:88.43%;overflow:hidden;background:#f5f4f9;-webkit-mask:url(assets/control/coceyo-iphone-screen-mask.png) center/100% 100% no-repeat;mask:url(assets/control/coceyo-iphone-screen-mask.png) center/100% 100% no-repeat}
.ctl-screen::after{content:"";position:absolute;inset:0;pointer-events:none;border-radius:inherit;box-shadow:inset 0 0 0 2px #34c75900;transition:box-shadow .8s ease;z-index:9}
.private-scene[data-phase=active] .ctl-screen::after{box-shadow:inset 0 0 22px 3px #34c75955,inset 0 0 0 1.5px #34c75999}
.ctl-ui{position:absolute;left:0;top:0;width:393px;height:852px;transform:scale(var(--s));transform-origin:0 0;font-family:-apple-system,"SF Pro Text",Inter,system-ui,sans-serif;color:#1d1d1f;background:linear-gradient(180deg,#f7f6fb,#efedf6)}
.ui-app{position:absolute;inset:0;padding:0 20px;transition:filter .5s ease,transform .6s cubic-bezier(.16,1,.3,1)}
.private-scene[data-phase=prompt] .ui-app{filter:blur(4px);transform:scale(.985)}
.ui-status{display:flex;align-items:center;justify-content:space-between;height:58px;padding:6px 18px 0 14px;margin:0 -20px;font-size:17px;font-weight:600}
.ui-sicons{display:flex;align-items:center;gap:6px}.ui-sicons svg{height:12px;fill:currentColor}.ui-sicons svg:nth-child(3){height:13px}
.ui-island{position:absolute;left:135px;top:13px;width:122px;height:37px;border-radius:20px;background:#000;z-index:8}
.ui-home{position:absolute;left:50%;bottom:9px;width:140px;height:5px;margin-left:-70px;border-radius:3px;background:#1d1d1f;z-index:8;opacity:.9}
.ui-head{display:flex;align-items:center;justify-content:space-between;margin-top:14px}
.ui-head img{width:104px;height:auto;display:block}
.ui-mode{position:relative;display:grid;height:36px;min-width:128px;border-radius:99px;background:#fff;box-shadow:0 0 0 1px #1d1d1f12,0 6px 14px -8px #2a1f3d55;transition:background .6s,box-shadow .6s}
.ui-mode>span{grid-area:1/1;display:flex;align-items:center;justify-content:center;gap:7px;font-size:14px;font-weight:600;transition:opacity .5s,transform .6s cubic-bezier(.16,1,.3,1)}
.ui-mode svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.ui-mode .m-cloud{color:#6e6e73}.ui-mode .m-local{color:#1f9d4a;opacity:0;transform:translateY(8px)}
.private-scene[data-phase=active] .ui-mode{background:#e4f8ea;box-shadow:0 0 0 1px #34c75966,0 8px 18px -8px #34c75988}
.private-scene[data-phase=active] .m-cloud{opacity:0;transform:translateY(-8px)}
.private-scene[data-phase=active] .m-local{opacity:1;transform:none}
.ui-hello{margin:30px 0 0;font-size:34px;line-height:1.08;letter-spacing:-.035em;font-weight:700}
.ui-bob{display:flex;align-items:flex-start;gap:12px;margin-top:20px}
.ui-bob img{flex:none;width:44px;height:44px;border-radius:50%;background:#fff;object-fit:cover;object-position:50% 12%;box-shadow:0 0 0 1px #1d1d1f12}
.ui-bob p{margin:0;padding:13px 16px;border-radius:6px 22px 22px 22px;background:#fff;font-size:16px;line-height:1.38;letter-spacing:-.01em;box-shadow:0 8px 18px -12px #2a1f3d55}
.ui-tasks{display:flex;flex-direction:column;gap:11px;margin-top:22px}
.ui-task{display:flex;align-items:center;gap:13px;padding:13px 14px;border-radius:20px;background:#fff;box-shadow:0 8px 20px -14px #2a1f3d66,0 0 0 1px #1d1d1f0a;transition:box-shadow .6s}
.ui-task img{flex:none;width:40px;height:40px;border-radius:50%;background:#f0edf8;object-fit:cover;object-position:50% 12%}
.ui-task b{display:block;font-size:16px;font-weight:600;letter-spacing:-.015em}.ui-task small{display:block;margin-top:3px;font-size:13px;color:#86868b}
.ui-task>div{min-width:0;flex:1}
.ui-tag{position:relative;flex:none;display:inline-flex;align-items:center;gap:5px;height:26px;padding:0 10px 0 8px;border-radius:99px;font-size:12px;font-weight:600;font-style:normal;transition:opacity .5s,transform .6s cubic-bezier(.16,1,.3,1)}
.ui-tag svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.ui-tag em{font-style:normal}
.ui-tag.t-cloud{background:#eef1fb;color:#4f63b8}
.ui-task.is-local .ui-tag.t-local{position:absolute;right:14px;background:#e4f8ea;color:#1f9d4a;opacity:0;transform:scale(.8)}
.private-scene[data-phase=active] .is-local .t-cloud{opacity:0;transform:scale(.8)}
.private-scene[data-phase=active] .is-local .t-local{opacity:1;transform:none}
.private-scene[data-phase=active] .is-local:nth-child(1) .t-local{transition-delay:.15s}.private-scene[data-phase=active] .is-local:nth-child(3) .t-local{transition-delay:.4s}
.ui-task.is-local{position:relative}
.private-scene[data-phase=active] .ui-task.is-local{box-shadow:0 8px 20px -14px #34c75988,0 0 0 1px #34c75933}
.ui-foot{margin:14px 6px 0;font-size:12.5px;line-height:1.4;color:#86868b;opacity:0;transform:translateY(6px);transition:opacity .6s .5s,transform .6s .5s}
.private-scene[data-phase=active] .ui-foot{opacity:1;transform:none}
.ui-input{position:absolute;left:20px;right:20px;bottom:34px;height:54px;border-radius:27px;background:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 8px 0 22px;font-size:16px;color:#8e8e93;box-shadow:0 12px 26px -16px #2a1f3d77,0 0 0 1px #1d1d1f0d}
.ui-input i{width:38px;height:38px;border-radius:50%;background:#1d1d1f;display:grid;place-items:center}
.ui-input svg{width:20px;height:20px;fill:none;stroke:#fff;stroke-width:1.9;stroke-linecap:round}

/* Apple-style confirmation sheet */
.ui-dim{position:absolute;inset:0;background:rgba(20,20,26,.34);opacity:0;pointer-events:none;transition:opacity .5s ease;z-index:5}
.private-scene[data-phase=prompt] .ui-dim{opacity:1}
.ui-sheet{position:absolute;left:50%;top:50%;width:326px;padding:20px 18px 18px;border-radius:44px;background:rgba(244,244,247,.86);-webkit-backdrop-filter:blur(34px) saturate(1.8);backdrop-filter:blur(34px) saturate(1.8);box-shadow:0 0 0 .5px #ffffff99 inset,0 36px 80px -20px #000000a0,0 6px 18px #0000001a;opacity:0;visibility:hidden;transform:translate(-50%,-48%) scale(.86);transition:opacity .35s ease,transform .55s cubic-bezier(.2,1.25,.4,1),visibility 0s .55s;z-index:6}
.private-scene[data-phase=prompt] .ui-sheet{opacity:1;visibility:visible;transform:translate(-50%,-50%) scale(1);transition-delay:0s}
.sheet-head{display:flex;align-items:center;gap:13px;padding:2px 6px 0}
.sheet-icon{flex:none;width:52px;height:52px;border-radius:13px;background:linear-gradient(145deg,#4a4a4f,#2a2a2e);display:grid;place-items:center;box-shadow:0 4px 10px #00000030}
.sheet-icon img{width:30px;height:30px;filter:invert(1) brightness(2)}
.sheet-head b{display:block;font-size:23px;font-weight:600;letter-spacing:-.02em;color:#000}
.sheet-head small{display:flex;align-items:center;gap:5px;margin-top:2px;font-size:15px;color:#6e6e73}
.sheet-head small i{display:inline-flex;width:15px;height:15px;color:#6e6e73}.sheet-head small svg{width:15px;height:15px}
.sheet-copy{margin:14px 6px 14px;font-size:14.5px;line-height:1.38;color:#3c3c43cc}
.sheet-btn{display:block;width:100%;height:56px;margin-top:9px;padding:0 14px;border:0;border-radius:28px;background:rgba(118,118,128,.16);color:#000;font:600 17px/1 -apple-system,"SF Pro Text",Inter,system-ui,sans-serif;letter-spacing:-.01em;text-align:center;cursor:pointer;transition:transform .2s ease,background .2s ease,filter .2s;-webkit-tap-highlight-color:transparent}
.sheet-btn.primary{background:#0a84ff;color:#fff}
.sheet-btn:hover{filter:brightness(.96)}
.sheet-btn:active,.sheet-btn.is-press{transform:scale(.97);filter:brightness(.88)}
.sheet-btn:focus-visible{outline:3px solid #0a84ff;outline-offset:2px}
.sheet-btn.is-hover{filter:brightness(.94)}
.ui-toast{position:absolute;left:20px;right:20px;top:68px;display:flex;align-items:center;gap:13px;padding:14px 16px;border-radius:24px;background:rgba(28,28,32,.9);color:#fff;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);box-shadow:0 20px 40px -14px #000a;opacity:0;transform:translateY(-14px) scale(.96);transition:opacity .45s ease,transform .6s cubic-bezier(.2,1.25,.4,1);z-index:7;pointer-events:none}
.private-scene[data-phase=active] .ui-toast{animation:ui-toast 5.6s .2s both}
@keyframes ui-toast{0%{opacity:0;transform:translateY(-14px) scale(.96)}8%,72%{opacity:1;transform:none}100%{opacity:0;transform:translateY(-10px) scale(.97)}}
.ui-toast>span{flex:none;width:36px;height:36px;border-radius:50%;background:#34c759;display:grid;place-items:center;font-weight:800;font-size:18px}
.ui-toast b{display:block;font-size:16px;font-weight:600}.ui-toast small{display:block;margin-top:3px;font-size:13px;color:#d1d1d6}

.private-demo-note{margin:20px auto 0;text-align:center;font-size:12px;color:#86868b}

/* three points */
.ctl-panel{max-width:1260px;margin:88px auto 0;padding:58px 68px 62px;border-radius:34px;background:#fff;box-shadow:0 0 0 1px #1d1d1f0a,0 40px 80px -50px #2a1f3d40;display:grid;grid-template-columns:repeat(3,1fr);gap:54px}
.ctl-panel article{padding:0;border:0}
.ctl-n{display:block;font-size:15px;font-weight:600;color:#6e6e73;letter-spacing:0}
.ctl-panel h3{margin:6px 0 12px;font-size:clamp(34px,3.5vw,48px);line-height:1.04;letter-spacing:-.035em;font-weight:600;background:linear-gradient(95deg,#6b3fa6 0%,#9a3fa0 55%,#b8388f 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;width:fit-content;max-width:100%;padding-bottom:.06em}
.ctl-panel p{margin:0;font-size:15px;line-height:1.5;font-weight:600;color:#6e6e73;max-width:340px}

@media(max-width:980px){
 .ctl-stage{grid-template-columns:minmax(0,1fr);gap:26px;justify-items:center}
 .control.section{overflow-x:clip}
 .ctl-switchcol{width:min(100%,420px);min-height:0}
 .ctl-link{display:none}
 .ctl-phone{width:min(112%,620px)}
 .ctl-panel{grid-template-columns:1fr;gap:38px;padding:40px 30px 44px;margin-top:60px;border-radius:28px}
}
@media(max-width:600px){
 .private-scene{margin-top:40px}
 .ctl-phone{width:min(128vw,560px);max-width:none;justify-self:center}
 .ctl-switchcol{width:100%}
 .ctl-stage{overflow:visible}
 .ctl-panel h3{font-size:38px}
}
@media(prefers-reduced-motion:reduce){.ctl-ios span,.ui-sheet,.ui-app,.ui-mode>span,.ui-tag,.ctl-link i{transition:none}.private-scene[data-phase=tap] .ctl-tap{animation:none}.private-scene[data-phase=active] .ui-toast{animation:none;opacity:1;transform:none}}