/* Readable interface concepts. These are not embedded customer accounts. */
.brand-site .product-devices { --device-ink:#302b25; --device-muted:#81786d; --device-line:#e8e3db; background:#f2efe8; padding:104px 0 88px; overflow:hidden; }
.product-devices .product-heading { max-width:760px; margin-inline:auto; text-align:center; }
.product-devices .product-heading h2 { font-size:clamp(36px,4.1vw,56px); font-weight:500; line-height:1.08; letter-spacing:-.045em; color:var(--device-ink); }
.product-devices .product-heading h2 em { color:inherit; font-family:Georgia,'Times New Roman',serif; font-style:italic; font-weight:400; }
.product-devices .product-heading > p:last-child { max-width:620px; margin:24px auto 0; font-size:16px; line-height:1.75; color:#72685b; }
.device-showcase-note { display:flex; align-items:center; justify-content:center; gap:9px; width:max-content; max-width:100%; margin:32px auto 28px; padding:8px 14px; color:#827665; border:1px solid #dfd7c9; border-radius:100px; font-size:11px; line-height:1.5; }
.device-showcase { position:relative; display:grid; grid-template-columns:minmax(0,1fr) 252px; align-items:center; gap:24px; width:min(1260px,100%); margin:0 auto; padding:26px 8px 8px; }
.device-desktop { position:relative; min-width:0; margin:0; padding-bottom:20px; }
.device-desktop-caption,.device-phone>figcaption { margin-bottom:12px; color:#887e70; text-align:center; font-size:10px; letter-spacing:.03em; }
.device-window { position:relative; background:#fffefa; border:5px solid #393831; border-radius:17px 17px 9px 9px; box-shadow:0 25px 50px -28px #5146384d,0 2px 2px #ffffffc9 inset; overflow:hidden; }
.device-window-bar { display:flex; justify-content:space-between; align-items:center; gap:8px; background:#eeeae3; border-bottom:1px solid #dfd9cf; color:#857a6d; padding:11px 15px; font-size:9px; min-height:36px; line-height:1; }
.device-window-dots { display:flex; gap:5px; }
.device-window-dots i { width:6px; height:6px; background:#c7b7a5; border-radius:50%; }
.device-window-dots i:first-child { background:#d5a292; }
.device-window-dots i:nth-child(2) { background:#d9c28c; }
.device-window-dots i:nth-child(3) { background:#b0bea4; }
.device-window-concept { font-size:8px; }
.device-desktop-layout { display:grid; grid-template-columns:145px minmax(0,1fr); min-height:500px; }
.device-sidebar { display:flex; flex-direction:column; min-width:0; padding:22px 12px 18px; border-inline-end:1px solid var(--device-line); background:#f6f3ee; }
.device-brand { display:flex; align-items:center; gap:7px; margin-bottom:34px; color:#36302a; }
.device-brand>span,.device-phone-brand>span { display:grid; place-items:center; background:#dcd0ae; border:1px solid #cfc19a; border-radius:8px; font-size:12px; font-weight:600; width:27px; height:27px; }
.device-brand>strong { font-size:11px; font-weight:600; letter-spacing:-.035em; }
.product-devices .device-mini-label { display:flex; gap:6px; align-items:center; margin:0 0 12px; color:#8a7d6b; font-size:9px; font-weight:500; line-height:1.5; }
.device-sidebar>.device-mini-label { padding-inline:9px; }
.device-sidebar-items { display:grid; gap:7px; }
.device-sidebar-items>span { display:flex; align-items:center; gap:9px; font-size:10px; color:#817667; padding:10px 9px; border-radius:7px; }
.device-sidebar-items>span.is-current { background:#e6dfcf; color:#493e2e; }
.device-sidebar-items svg { width:15px; height:15px; }
.device-sidebar-context { display:flex; align-items:center; gap:8px; color:#8a7c66; padding:16px 7px 0; margin-top:auto; font-size:9px; }
.device-sidebar-context svg { width:14px; height:14px; }
.device-desktop-main { padding:26px 22px 24px; min-width:0; }
.device-page-heading { display:flex; justify-content:space-between; gap:12px; align-items:center; margin-bottom:22px; }
.product-devices .device-page-heading h3 { font-size:23px; letter-spacing:-.04em; color:var(--device-ink); font-weight:550; line-height:1.2; margin:0 0 5px; }
.product-devices .device-page-heading p { font-size:10px; line-height:1.5; margin:0; color:var(--device-muted); }
.device-workspace-avatar,.device-phone-profile { display:grid; place-items:center; width:27px; height:27px; border:1px solid #c7d1c4; border-radius:50%; background:#e1e8dc; color:#6b7b61; font-size:11px; }
.device-customer { padding:17px; border:1px solid var(--device-line); background:#fffefa; border-radius:11px; margin-bottom:18px; box-shadow:0 4px 9px #3e301303; }
.device-command-preview { display:flex; gap:10px; align-items:center; padding:11px 13px; margin-bottom:17px; background:#f5f1e4; border:1px solid #e2d8bb; border-radius:11px; }
.device-command-preview>span:first-child { color:#a18b4f; }
.device-command-preview>span:first-child svg { width:20px; height:20px; }
.device-command-preview>div { min-width:0; }
.device-command-preview strong { display:block; color:#776139; font-size:9px; font-weight:550; }
.product-devices .device-command-preview p { color:#8b795b; font-size:9px; line-height:1.5; margin:3px 0 0; }
.device-command-send { display:grid; place-items:center; flex-shrink:0; width:22px; height:22px; border-radius:6px; margin-inline-start:auto; color:#fdfbf4; background:#9b8760; font-size:13px; }
.device-customer-heading { display:flex; align-items:center; gap:11px; }
.device-avatar { display:grid; place-items:center; flex-shrink:0; width:34px; height:34px; border:1px solid #d5c3b4; background:#ebdbcf; color:#8b6d54; font-size:11px; border-radius:10px; }
.device-customer-heading strong,.device-phone-customer strong { display:block; font-size:12px; font-weight:550; line-height:1.4; color:#41372b; }
.device-customer-heading small,.device-phone-customer small { display:block; font-size:9px; line-height:1.5; color:#978a79; margin-top:2px; }
.device-state { display:inline-flex; align-items:center; gap:4px; width:max-content; max-width:100%; font-size:8px; line-height:1.5; color:#7d744c; background:#f2ebd3; border:1px solid #e9dfbb; border-radius:5px; padding:3px 6px; }
.device-customer-heading>.device-state { margin-inline-start:auto; }
.device-customer dl { display:grid; grid-template-columns:1fr 1fr 1.3fr; gap:12px; padding-top:14px; margin:14px 0 0; border-top:1px solid #f0ece4; }
.device-customer dt { font-size:8px; line-height:1.4; color:#a09383; margin-bottom:5px; }
.device-customer dd { font-size:9px; line-height:1.5; color:#5b4f40; margin:0; }
.device-work-columns { display:grid; grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr); gap:15px; }
.device-conversation { min-width:0; }
.device-panel-heading { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:12px; }
.product-devices .device-panel-heading h4 { color:#625646; font-size:10px; font-weight:550; margin:0; line-height:1.5; }
.device-panel-heading>span { color:#9d907e; font-size:8px; }
.device-panel-heading svg { width:14px; height:14px; color:#a39073; }
.device-message { background:#f3f0e9; padding:12px; border-radius:8px; margin-bottom:10px; }
.device-message>span { color:#988a76; font-size:8px; line-height:1.5; }
.product-devices .device-message>p { font-size:10px; line-height:1.65; color:#6c6050; margin:5px 0 0; }
.device-draft { padding:12px; border:1px solid #dedacf; border-radius:8px; background:#f7f5ed; }
.device-draft .device-mini-label { margin-bottom:8px; color:#817145; }
.device-draft .device-mini-label svg { width:13px; height:13px; }
.product-devices .device-draft>p:not(.device-mini-label) { font-size:9px; line-height:1.65; color:#70624f; margin:0 0 12px; }
.device-draft-status { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:5px; padding-top:9px; border-top:1px solid #e8e1d2; }
.device-draft-status>span { display:flex; align-items:center; gap:4px; font-size:7px; line-height:1.5; color:#887544; }
.device-draft-status i { width:4px; height:4px; border-radius:50%; background:#b19a5f; flex-shrink:0; }
.device-draft-status small { color:#a49783; font-size:7px; }
.device-connected-work { min-width:0; }
.device-project { display:flex; flex-direction:column; align-items:flex-start; gap:9px; padding:13px; border-radius:9px; border:1px solid #e2e4d5; background:#f0f2e7; margin-bottom:11px; }
.device-project-icon { display:grid; place-items:center; width:25px; height:25px; color:#869076; background:#e1e8d5; border-radius:6px; }
.device-project-icon svg { width:14px; height:14px; }
.device-project>strong { font-size:10px; font-weight:500; color:#626b51; line-height:1.4; }
.device-project>.device-state { font-size:7px; background:#e7ebdc; border-color:#dce2cd; color:#899475; }
.device-task { display:flex; align-items:flex-start; gap:7px; padding:10px 0; border-bottom:1px solid #eee9df; }
.device-task>span { width:9px; height:9px; flex-shrink:0; border:1px solid #c5bba9; border-radius:3px; margin-top:3px; }
.product-devices .device-task>p { color:#796b57; font-size:9px; line-height:1.5; margin:0; }
.device-task small { display:block; color:#a39682; font-size:7px; margin-top:3px; }
.product-devices .device-context-hint { display:flex; align-items:flex-start; gap:6px; color:#aa9a83; font-size:8px; line-height:1.5; margin:14px 0 0; }
.device-context-hint svg { width:12px; height:12px; flex-shrink:0; }
.device-desktop-base { position:absolute; width:calc(100% + 20px); height:12px; background:linear-gradient(#a9a8a0,#c8c7bf 45%,#9e9b91); border:1px solid #a9a69c; border-radius:0 0 50% 50% / 0 0 100% 100%; inset-inline-start:-10px; bottom:8px; box-shadow:0 12px 22px -7px #78634b75; }
.device-desktop-base>i { display:block; width:15%; height:5px; border-radius:0 0 5px 5px; margin:0 auto; background:#9a9991; }
.device-phone { width:252px; min-width:0; margin:0; transform:translateY(20px) rotate(1.5deg); }
.device-phone-shell { border:7px solid #383630; border-radius:37px; padding:2px; background:#a39b8c; box-shadow:0 30px 45px -23px #4e3e276b,0 0 0 1px #6b675f; }
.device-phone-screen { border-radius:27px; background:#fcfaf5; min-height:544px; overflow:hidden; display:flex; flex-direction:column; }
.device-phone-status { display:flex; align-items:center; justify-content:space-between; gap:7px; padding:13px 17px 11px; position:relative; color:#554d42; font-size:9px; font-weight:600; direction:ltr; }
.device-phone-status>i { position:absolute; left:50%; top:8px; transform:translateX(-50%); width:68px; height:18px; background:#383630; border-radius:30px; }
.device-phone-signals { font-size:7px; display:flex; align-items:center; gap:6px; letter-spacing:-1px; }
.device-phone-signals b { display:block; width:13px; height:6px; border:1px solid #645d51; border-radius:2px; background:#645d51; box-shadow:inset -3px 0 0 #fcfaf5; }
.device-phone-header { display:flex; align-items:center; justify-content:space-between; padding:11px 16px; border-bottom:1px solid #e9e3d8; }
.device-phone-brand { display:flex; align-items:center; gap:6px; font-size:11px; font-weight:600; letter-spacing:-.025em; color:#5e5140; }
.device-phone-brand>span { width:22px; height:22px; font-size:10px; border-radius:7px; }
.device-phone-profile { width:20px; height:20px; font-size:8px; }
.device-phone-content { padding:18px 15px 14px; }
.device-phone-heading { display:flex; align-items:center; justify-content:space-between; gap:9px; margin-bottom:19px; }
.product-devices .device-phone-heading h3 { color:#493d2b; font-size:20px; letter-spacing:-.04em; font-weight:550; margin:0; line-height:1.2; }
.device-phone-heading>span { font-size:7px; color:#a29176; }
.device-phone-customer { display:flex; gap:9px; align-items:center; margin-bottom:15px; }
.device-phone-customer .device-avatar { width:30px; height:30px; font-size:10px; }
.device-phone-customer strong { font-size:10px; }
.device-phone-customer small { font-size:8px; }
.device-phone .device-message { padding:11px; border-radius:9px 9px 9px 2px; margin-inline-end:9px; }
.product-devices .device-phone .device-message>p { margin:0; font-size:9px; line-height:1.65; }
.device-phone .device-draft { margin-inline-start:8px; }
.device-phone .device-mini-label { font-size:8px; }
.product-devices .device-phone .device-draft>p:not(.device-mini-label) { font-size:8px; }
.device-phone .device-draft-status>span { font-size:7px; }
.device-phone-next { display:flex; align-items:center; gap:9px; padding:12px 0 0; margin-top:1px; }
.device-phone-next>span { display:grid; place-items:center; color:#9a9576; border-radius:7px; background:#eeecdf; width:28px; height:28px; flex-shrink:0; }
.device-phone-next svg { width:14px; height:14px; }
.device-phone-next strong { display:block; color:#847257; font-size:8px; font-weight:500; line-height:1.5; }
.device-phone-next small { color:#b0a28b; font-size:7px; }
.product-devices .device-phone-note { margin:11px 0 0; font-size:7px; color:#9f9078; text-align:center; }
.device-phone-nav { display:flex; justify-content:space-around; align-items:center; background:#f3f0e8; border-top:1px solid #e6dfd2; padding:12px 7px 8px; margin-top:auto; }
.device-phone-nav>span { display:flex; flex-direction:column; align-items:center; gap:4px; color:#b1a58f; }
.device-phone-nav>span.is-current { color:#776542; }
.device-phone-nav svg { width:16px; height:16px; }
.device-phone-nav small { font-size:7px; }
.device-home-indicator { width:65px; height:3px; border-radius:4px; margin:7px auto 8px; background:#766c5d; }
.device-principles { display:flex; justify-content:center; gap:24px; flex-wrap:wrap; margin:55px 0 0; padding:0; list-style:none; }
.device-principles li { display:flex; gap:8px; align-items:center; color:#776b57; font-size:12px; }
.device-principles svg { width:16px; height:16px; color:#8e8a68; }
.product-devices .device-scope { max-width:770px; margin:22px auto 0; text-align:center; color:#8c806e; font-size:11px; line-height:1.7; }
.device-actions { display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:26px; margin-top:30px; }
.product-devices .device-actions .button { display:inline-flex; align-items:center; gap:20px; padding:14px 20px; background:#36322b!important; border-radius:9px; color:white!important; border:1px solid #484035!important; font-size:13px; font-weight:500; text-decoration:none; }
.device-actions .text-link { display:inline-flex; gap:12px; align-items:center; font-size:13px; color:#75664e; }
.product-devices :is(.device-customer dt,.device-customer-heading small,.device-phone-customer small,.device-task small,.device-phone-next small,.device-context-hint,.device-draft-status small,.device-phone-note,.device-phone-heading>span,.device-phone-nav>span,.device-panel-heading>span,.device-message>span) { color:#81735d; }
.product-devices a:focus-visible { outline:2px solid #75603c; outline-offset:5px; }
.shared-hebrew .product-devices .product-heading h2 em { font-family:inherit; font-style:normal; }
.shared-hebrew .product-devices .product-heading h2 { letter-spacing:-.025em; }
.shared-hebrew .device-phone { transform:translateY(20px) rotate(-1.5deg); }
@media(max-width:1100px) {
 .device-showcase { grid-template-columns:minmax(0,1fr) 216px; gap:18px; }
 .device-phone { width:216px; }
 .device-desktop-layout { grid-template-columns:112px minmax(0,1fr); }
 .device-sidebar { padding-inline:8px; }
 .device-brand { gap:5px; }
 .device-brand>strong { font-size:9px; }
 .device-brand>span { width:22px; height:22px; }
 .device-sidebar-items>span { gap:6px; padding-inline:6px; font-size:9px; }
 .device-sidebar-items svg { width:13px; height:13px; }
 .device-desktop-main { padding:20px 15px; }
 .device-work-columns { grid-template-columns:1fr; }
 .device-connected-work { display:none; }
 .device-desktop-layout { min-height:470px; }
 .device-phone-content { padding-inline:11px; }
 .device-window-concept { display:none; }
}
@media(max-width:760px) {
 .brand-site .product-devices { padding:64px 0 58px; }
 .product-devices .product-heading>p:last-child { font-size:15px; margin-top:20px; }
 .device-showcase { grid-template-columns:1fr; padding:10px 0 0; gap:32px; }
 .device-desktop { padding-bottom:16px; }
 .device-window { border-width:4px; border-radius:13px 13px 6px 6px; }
 .device-desktop-layout { min-height:400px; grid-template-columns:95px minmax(0,1fr); }
 .device-window-bar { padding:9px 10px; }
 .device-sidebar { padding-top:17px; }
 .device-brand { gap:4px; margin-bottom:27px; }
 .device-brand>strong { font-size:8px; }
 .device-brand>span { width:18px; height:18px; font-size:8px; border-radius:5px; }
 .device-sidebar-items>span { font-size:8px; padding:8px 5px; gap:4px; }
 .device-sidebar-items svg { width:11px; height:11px; }
 .device-sidebar-context { font-size:7px; padding-inline:1px; gap:4px; }
 .device-sidebar-context svg { width:11px; height:11px; }
 .device-desktop-main { padding:19px 12px; }
 .product-devices .device-page-heading h3 { font-size:19px; }
 .product-devices .device-page-heading p { font-size:8px; }
 .device-customer { padding:12px; }
 .device-customer-heading { gap:7px; flex-wrap:wrap; }
 .device-customer-heading>.device-state { margin-inline-start:0; }
 .device-customer dl { grid-template-columns:1fr 1fr; gap:12px; }
 .device-customer dl>div:last-child { grid-column:1/-1; }
 .device-phone,.shared-hebrew .device-phone { width:274px; margin:0 auto; transform:none; }
 .device-phone-screen { min-height:590px; }
 .device-phone-content { padding:22px 17px 16px; }
 .device-phone .device-message { padding:13px; }
 .product-devices .device-phone .device-message>p { font-size:11px; }
 .device-phone .device-draft { padding:13px; }
 .device-phone .device-mini-label { font-size:10px; }
 .product-devices .device-phone .device-draft>p:not(.device-mini-label) { font-size:10px; }
 .device-phone .device-draft-status>span { font-size:8px; }
 .device-phone .device-draft-status small { font-size:8px; }
 .device-phone-next strong { font-size:10px; }
 .device-phone-next small { font-size:8px; }
 .device-phone-nav small { font-size:8px; }
 .device-principles { gap:14px; margin-top:32px; }
 .device-principles li { font-size:11px; }
 .device-actions { gap:20px; margin-top:26px; }
}
@media(max-width:380px) {
 .device-desktop-layout { grid-template-columns:1fr; }
 .device-sidebar { display:none; }
 .device-customer dl { grid-template-columns:1fr 1fr 1fr; }
 .device-customer dl>div:last-child { grid-column:auto; }
}
