.widget-section{padding-top:110px;padding-bottom:42px;border-bottom:1px solid var(--line)}
.widget-intro{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}
.widget-picker{display:flex;flex-wrap:wrap;gap:8px;margin:28px 0 20px;max-width:420px}
.widget-picker button{min-height:42px;padding:10px 15px;border:1px solid var(--line);border-radius:24px;background:transparent;font-size:12px;transition:background .2s,border-color .2s}
.widget-picker button:hover{border-color:var(--accent)}
.widget-picker button[aria-pressed=true]{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.section-copy .widget-selection{font-size:14px;color:var(--ink);min-height:50px;max-width:400px;margin-bottom:8px}
.section-copy .widget-detail{max-width:390px;line-height:1.9}
.section-copy .widget-system-note{font-size:11px;line-height:1.8;max-width:350px;margin-top:16px}
.widget-scene{position:relative;margin:0;min-height:675px;display:grid;place-items:center;padding:20px 0 44px}
.widget-orbit{position:absolute;inset:70px -10px 80px;border-radius:48% 48% 42% 42%;background:#e9e6da;transform:rotate(-9deg)}
.widget-phone{position:relative;width:278px;border:6px solid #30312c;border-radius:43px;overflow:hidden;box-shadow:0 28px 34px -25px #272c2580,0 0 0 1px #9b9c8f;background:#d5dac9}
.home-canvas{position:relative;container-type:inline-size;aspect-ratio:402/874;background:radial-gradient(ellipse at 14% 85%,#ede5cd 0,transparent 65%),radial-gradient(ellipse at 95% 20%,#b9c3ac 0,transparent 70%),#dadbc9}
.home-status{position:absolute;top:3.3%;left:8%;right:8%;display:flex;justify-content:space-between;align-items:center;font-size:3.5cqw;font-weight:600;color:#30372c}
.home-status>i{position:absolute;top:-1.5cqw;left:50%;transform:translateX(-50%);width:28cqw;height:7.5cqw;background:#171a17;border-radius:6cqw}
.widget-display{position:absolute;top:14%;left:6%;width:88%}
.widget-photo{width:100%;height:auto;filter:drop-shadow(0 5px 6px #42463718);animation:widget-arrive .2s ease-out}
.widget-section [hidden]{display:none!important}
.home-widget-label{display:block;text-align:center;font-size:3cqw;color:#485340;margin-top:2cqw}
.home-upper-icons,.home-lower-icons{position:absolute;display:grid;grid-template-columns:repeat(4,1fr);gap:5cqw;left:8%;right:8%;transition:opacity .2s}
.home-upper-icons{top:39%}
.home-lower-icons{top:66%}
.home-icon{display:grid;place-items:center;aspect-ratio:1;border-radius:24%;background:#f2f0e7cc;color:#58624d;box-shadow:0 2px 5px #4b4b3910;overflow:hidden}
.home-icon svg{width:52%;height:52%}
.home-icon img{width:100%;height:100%;object-fit:cover}
.icon-chat{background:#93aa83;color:#f8f7f0}.icon-camera{background:#ece9dd;color:#696b5f}.icon-music{background:#cda692;color:#fff9ef}.icon-compass{background:#a9bbc0;color:#f5f8f4}.icon-heart{background:#d8b5ac;color:#795b54}.icon-sun{background:#e8d2a1;color:#947336}.icon-leaf{background:#e5e8d8;color:#768b62}.icon-clock{background:#f3efe0;color:#656959}
.home-dock{position:absolute;bottom:4%;left:5%;right:5%;padding:4cqw;display:grid;grid-template-columns:repeat(4,1fr);gap:4cqw;background:#f8f7ef63;border:1px solid #fff4;border-radius:9cqw}
.home-page-dots{position:absolute;bottom:18%;left:0;right:0;display:flex;justify-content:center;gap:1.5cqw}
.home-page-dots i{width:1.4cqw;height:1.4cqw;border-radius:50%;background:#62705645}.home-page-dots i:first-child{background:#627056}
.widget-phone[data-size=small] .widget-display{width:41%}
.widget-phone[data-size=small] .home-upper-icons{left:55%;right:8%;top:14%;grid-template-columns:repeat(2,1fr);gap:6cqw}
.widget-phone[data-size=small] .home-lower-icons{top:42%}
.widget-phone[data-size=medium] .home-upper-icons{top:41%}
.widget-phone[data-size=medium] .home-lower-icons{top:58%}
.widget-phone[data-size=large] .home-upper-icons,.widget-phone[data-size=portrait-layout] .home-upper-icons,.widget-phone[data-size=portrait-layout] .home-lower-icons{opacity:0;pointer-events:none}
.widget-phone[data-size=portrait-layout] .widget-display{top:9%;left:9%;width:82%}
.widget-phone[data-size=portrait-layout] .home-page-dots{bottom:19%}
.widget-count-note{position:absolute;right:-2px;bottom:126px;transform:rotate(7deg);padding:17px 20px 11px;background:#fbf7eb;box-shadow:0 7px 22px #6e66401a;border-radius:2px;pointer-events:none}
.widget-count-note>span:first-child{display:block;font:italic 12px var(--serif);color:var(--muted)}
.widget-count-note>strong{display:block;font:400 24px var(--serif);margin-top:7px;white-space:nowrap}
.widget-count-note>span:last-child{position:absolute;font:30px var(--serif);left:-26px;top:12px;color:var(--accent)}
.widget-scene figcaption,.duo-figure figcaption{position:relative;font-size:10px;color:var(--muted);text-align:center;line-height:1.8;margin-top:30px}
.widget-scene figcaption{position:absolute;bottom:0;left:0;right:0}
.duo-showcase{margin-top:90px;padding:42px 42px 30px;background:#e8eadd;border-radius:26px;overflow:hidden}
.duo-heading{display:grid;grid-template-columns:1.1fr 1fr;gap:60px;align-items:start;margin-bottom:34px}
.duo-heading .eyebrow{margin-bottom:14px;display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.preview-label{font-size:9px;letter-spacing:.04em;text-transform:none;padding:4px 8px;border:1px solid #bdc3ae;border-radius:20px;font-weight:400}
.duo-heading h3{font:400 clamp(27px,3vw,38px)/1.35 var(--serif);letter-spacing:-.025em;margin:0}
.duo-heading h3 span{display:inline-block}
.duo-heading>p{font-size:13px;line-height:1.9;color:#68715d;max-width:360px;padding-top:4px;margin:0}
.duo-figure{margin:0}
.duo-device{max-width:750px;margin:0 auto;padding:6px;border:2px solid #93968d;border-radius:38px;background:linear-gradient(125deg,#373b32,#777d6f 48%,#242820 51%,#62685c);box-shadow:0 26px 28px -23px #48503b90}
.duo-screen{position:relative;container-type:inline-size;aspect-ratio:2670/1878;border:3px solid #1e241c;border-radius:29px;overflow:hidden;background:radial-gradient(ellipse at 9% 85%,#e6dfc3 0,transparent 66%),radial-gradient(ellipse at 93% 15%,#9eae92 0,transparent 75%),#c8d0b9}
.duo-workspace{position:absolute;inset:12% 11% 8% 5%;display:grid;grid-template-columns:.86fr 1fr 1fr;gap:4.5%;align-items:start}
.duo-workspace img{width:100%;height:auto;filter:drop-shadow(0 3px 4px #44553418)}
.duo-date{height:7cqw;color:#344332;display:flex;flex-direction:column;gap:.5cqw}
.duo-date strong{font:500 3cqw var(--sans);letter-spacing:-.08cqw}
.duo-date span{font-size:1.1cqw;white-space:nowrap}
.duo-widget-label{display:block;font-size:1cqw;text-align:center;margin:1cqw 0 2cqw;color:#3c4c34}
.duo-page-title{display:block;color:#425239;font-size:1.2cqw;margin-bottom:2cqw;line-height:1.8}
.duo-icons{display:grid;grid-template-columns:repeat(4,1fr);gap:2.5cqw 1.5cqw;margin-top:2.5cqw}
.duo-day{display:grid;grid-template-columns:1fr 1fr;gap:2cqw;height:17cqw;margin-bottom:3cqw}
.duo-day>div{padding:1.8cqw 1.2cqw;background:#f6f3e47a;border:1px solid #fff3;border-radius:2.4cqw}
.duo-day>div>span{font-size:1.15cqw;color:#6f785d;display:block;text-align:center}
.duo-day strong{display:block;font:300 7cqw var(--sans);text-align:center;margin-top:1.5cqw;color:#344332}
.duo-day .duo-weather{display:flex;align-items:center;flex-direction:column;justify-content:center;gap:1cqw;background:#e4dba75e}
.duo-weather .home-icon{width:6cqw;background:none;box-shadow:none}
.duo-weather .home-icon svg{width:80%;height:80%}
.duo-day .duo-weather>span{font-size:3.6cqw;font-weight:300;color:#576448}
.duo-blush{margin-top:.7cqw}
.duo-small-row{display:grid;grid-template-columns:1fr 1fr;gap:2cqw;margin-top:2.6cqw}
.duo-clock{border-radius:2.5cqw;background:#f6f3e46b;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:.8cqw}
.duo-clock .home-icon{width:60%;background:none;box-shadow:none}.duo-clock .home-icon svg{width:100%;height:100%}.duo-clock>span{font-size:1cqw;color:#60714d}
.duo-status{position:absolute;right:2.6%;top:2.8%;border-radius:50%;width:5.4cqw;height:5.4cqw;background:#e6edd344;color:#30432b;font-size:1.15cqw;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:.2cqw}
.duo-island{position:absolute;right:2.6%;top:15.5%;width:3.2cqw;height:9cqw;border-radius:3cqw;background:#1c2519}
.duo-dock{position:absolute;right:1.8%;bottom:12%;width:7.5%;display:grid;gap:2cqw;padding:1.2cqw;background:#edf1df70;border:1px solid #fff3;border-radius:3cqw}
.duo-crease{position:absolute;top:0;bottom:0;left:49.6%;width:.8%;background:linear-gradient(90deg,transparent,#72836d0a,transparent);pointer-events:none}
.widget-footnote{max-width:770px;font-size:10px;line-height:1.8;color:var(--muted);text-align:center;margin:22px auto 0}
@keyframes widget-arrive{from{opacity:.4;transform:translateY(3px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:1000px){.widget-intro{gap:35px}.widget-phone{width:255px}.widget-scene{min-height:635px}.widget-count-note{right:-8px;bottom:100px;padding:12px 16px}.widget-count-note>strong{font-size:21px}.duo-showcase{padding:35px 25px 25px}.duo-heading{gap:30px}.duo-device{border-radius:32px}.duo-screen{border-radius:24px}}
@media(max-width:720px){.widget-section{padding-top:70px;padding-bottom:25px}.widget-intro{grid-template-columns:1fr;gap:22px}.widget-picker{justify-content:center;margin-inline:auto;max-width:335px}.widget-picker button{font-size:11px;min-height:42px;padding:10px 13px}.section-copy .widget-selection{min-height:0;font-size:13px;max-width:300px}.section-copy .widget-system-note{max-width:310px}.widget-scene{min-height:620px;max-width:400px;width:100%;margin:auto;padding-bottom:32px}.widget-phone{width:249px}.widget-orbit{inset:45px 0 63px}.widget-count-note{right:-3px;bottom:100px;padding:13px 16px}.widget-count-note>strong{font-size:22px}.duo-showcase{margin-top:65px;padding:28px 15px 22px;border-radius:20px}.duo-heading{grid-template-columns:1fr;gap:17px;margin-bottom:26px;padding:0 5px}.duo-heading h3{font-size:clamp(24px,6.8vw,30px);text-wrap:balance}.duo-heading>p{font-size:12px;max-width:100%}.duo-device{padding:3px;border-width:1px;border-radius:17px}.duo-screen{border-width:2px;border-radius:13px}.duo-figure figcaption{font-size:9px;margin:20px 5px 0}.widget-footnote{font-size:9px;margin-top:18px}.duo-heading .eyebrow{gap:8px}.preview-label{font-size:8px}.widget-count-note>span:last-child{left:-20px}}
@media(prefers-reduced-motion:reduce){.widget-photo{animation:none}.widget-picker button,.home-upper-icons,.home-lower-icons{transition:none}}
