/* Technical tab, level 1: no side rail, centered heading, cleaner metric tiles */
body[data-active-view="technical"] #page-root .level-layout{display:block}
body[data-active-view="technical"] #page-root .level-content{padding:56px 40px 52px}
body[data-active-view="technical"] #page-root .content-heading{text-align:center}
body[data-active-view="technical"] #page-root .content-heading h2{margin:0;font-size:34px;line-height:1.4;font-weight:850;letter-spacing:-.02em;color:#0b2a63}
body[data-active-view="technical"] #page-root .content-heading h2 span{color:inherit}
body[data-active-view="technical"] #page-root .content-heading p{margin:10px auto 0;font-size:17px;line-height:1.8;font-weight:600;color:#55688a}

.mt-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:16px;margin-top:40px}
#page-root .mt-card{display:flex;flex-direction:column;align-items:center;gap:6px;padding:26px 12px 22px;text-align:center;border:0;border-radius:14px;background:#e3e9f0;box-shadow:none;transition:background-color .2s ease,box-shadow .2s ease,transform .2s ease,opacity .6s ease}
#page-root .mt-card:hover{background:#eaf5ff;box-shadow:0 10px 26px rgba(8,58,119,.13);transform:translateY(-3px)}
.mt-ico{display:grid;place-items:center;width:56px;height:56px;margin-bottom:8px;border-radius:50%;background:#fff;color:#1174f6;transition:transform .25s ease,background-color .25s ease,color .25s ease}
.mt-card:hover .mt-ico{transform:scale(1.12);background:#1174f6;color:#fff}
.mt-ico svg{width:28px;height:28px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.mt-val{display:flex;align-items:center;justify-content:center;min-height:46px;font-size:34px;line-height:1.1;font-weight:850;color:#0b2a63;font-variant-numeric:normal}
.mt-range{display:inline-flex;align-items:center;gap:8px;direction:rtl}
.mt-arrow{width:20px;height:20px;fill:none;stroke:#1174f6;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;flex:none}
.mt-label{font-size:16px;font-weight:750;color:#123f70}
.mt-sub{font-size:13.5px;font-weight:600;color:#5b7088}
.mt-card .metric-icon{display:none}
@media(max-width:1180px){.mt-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:620px){
  body[data-active-view="technical"] #page-root .level-content{padding:40px 16px 36px}
  body[data-active-view="technical"] #page-root .content-heading h2{font-size:26px}
  .mt-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .mt-val{font-size:28px}
}
.mt-card,.mt-card *{font-family:var(--font-fa)}
.mt-val bdi[dir="ltr"]{font-family:var(--font-fa);letter-spacing:.02em}

/* Level 2: topology on the full width, real product photos in module tiles */
body[data-active-view="technical"] #page-root .architecture-composition{display:block;direction:rtl}
body[data-active-view="technical"] #page-root .architecture-topology{max-width:1100px;margin-inline:auto}
body[data-active-view="technical"] #page-root .arch-module-card{padding:16px 10px 14px;min-height:0;background:#e3e9f0;border:0;border-radius:14px;transition:background-color .2s ease,box-shadow .2s ease,transform .2s ease}
body[data-active-view="technical"] #page-root a.arch-module-card:hover{background:#eaf5ff;box-shadow:0 10px 26px rgba(8,58,119,.13);transform:translateY(-2px)}
body[data-active-view="technical"] #page-root .arch-module-card>img{height:96px;max-width:100%;width:auto;object-fit:contain;transition:transform .25s ease}
body[data-active-view="technical"] #page-root a.arch-module-card:hover>img{transform:scale(1.1)}
body[data-active-view="technical"] #page-root .arch-module-dual-media{display:flex;justify-content:center;align-items:center;gap:8px;height:96px}
body[data-active-view="technical"] #page-root .arch-module-dual-media img{height:96px;width:auto;max-width:48%;object-fit:contain}
body[data-active-view="technical"] #page-root .arch-module-card>span{font-size:13.5px}
body[data-active-view="technical"] #page-root .arch-module-card>strong{font-size:14.5px}

/* Full specs: larger, easier-to-read text */
body[data-active-view="technical"] #page-root .full-specs-head h3{font-size:26px}
body[data-active-view="technical"] #page-root .spec-group-toggle{padding:22px 6px;font-size:21px;color:#0b2a63}
body[data-active-view="technical"] #page-root .spec-row{padding:15px 6px;font-size:18px;line-height:1.7}
body[data-active-view="technical"] #page-root .spec-row dt{color:#4a6482;font-weight:650}
body[data-active-view="technical"] #page-root .spec-row dd{font-weight:800;color:#0b2a63}
body[data-active-view="technical"] #page-root .spec-row bdi{unicode-bidi:isolate}
@media(max-width:767px){body[data-active-view="technical"] #page-root .spec-row{font-size:16px;grid-template-columns:1fr;gap:4px}body[data-active-view="technical"] #page-root .spec-group-toggle{font-size:18px}}
body[data-active-view="technical"] #page-root .spec-group:last-child{border-bottom:0}

/* Group headings: full-width highlighted row so each group is clearly separated */
body[data-active-view="technical"] #page-root .spec-group{margin-top:0}
body[data-active-view="technical"] #page-root .spec-group-toggle{position:relative;padding:13px 20px 13px 16px;margin-top:18px;background:#f0f5fc;border-radius:10px;color:#0b2a63;border-right:3px solid #8db8f2}
body[data-active-view="technical"] #page-root .spec-group:first-child .spec-group-toggle{margin-top:6px}
body[data-active-view="technical"] #page-root .spec-group{border-bottom:0}
body[data-active-view="technical"] #page-root .spec-groups{border-top:0}
body[data-active-view="technical"] #page-root .spec-group-panel .spec-row:first-child{border-top:0}
@media(max-width:767px){body[data-active-view="technical"] #page-root .spec-group-toggle{padding:14px 16px}}

/* Level 2: one consistent type scale, colors and layout */
body[data-active-view="technical"] #page-root .architecture-topology{--arch-ink:#0b2a63;--arch-name:#123f70;--arch-mute:#4a6482}
body[data-active-view="technical"] #page-root .arch-top-row{align-items:stretch;gap:32px}
body[data-active-view="technical"] #page-root .arch-node{display:flex;flex-direction:column;justify-content:center;min-height:190px;padding:24px 26px;background:#fff;border:1px solid #d9e5f6;border-radius:14px;box-shadow:0 8px 22px rgba(30,80,170,.07)}
body[data-active-view="technical"] #page-root .arch-node h3{margin:0 0 12px;font-size:22px;font-weight:850;color:var(--arch-ink)}
body[data-active-view="technical"] #page-root .arch-node ul{margin:0;padding:0;list-style:none;display:grid;gap:8px;font-size:16px;line-height:1.7;font-weight:600;color:var(--arch-mute)}
body[data-active-view="technical"] #page-root .arch-node li:before{content:"";display:inline-block;width:6px;height:6px;margin-inline-end:10px;border-radius:50%;background:#1174f6;vertical-align:middle}
body[data-active-view="technical"] #page-root .arch-core{min-height:190px;border-radius:14px;background:#fff;border:1px solid #d9e5f6;box-shadow:0 8px 22px rgba(30,80,170,.07)}
body[data-active-view="technical"] #page-root .arch-core>strong{font-size:26px;font-weight:850;color:var(--arch-ink)}
body[data-active-view="technical"] #page-root .arch-core>span{font-size:16px;font-weight:650;color:var(--arch-mute)}
body[data-active-view="technical"] #page-root .arch-bus{padding:12px 26px;border-radius:12px;border:1.5px dashed #6fa4ff;background:#fff}
body[data-active-view="technical"] #page-root .arch-bus>bdi{font-size:20px;font-weight:850;color:#1174f6}
body[data-active-view="technical"] #page-root .arch-bus small{font-size:15px;font-weight:650;color:var(--arch-mute)}
body[data-active-view="technical"] #page-root .arch-module-grid{gap:16px;align-items:stretch}
body[data-active-view="technical"] #page-root .arch-module-card{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:6px;min-height:230px;padding:20px 12px 18px;text-align:center}
body[data-active-view="technical"] #page-root .arch-module-card>img,body[data-active-view="technical"] #page-root .arch-module-dual-media{height:110px;margin-bottom:6px}
body[data-active-view="technical"] #page-root .arch-module-card>img{max-height:110px}
body[data-active-view="technical"] #page-root .arch-module-dual-media img{height:110px;max-width:46%}
body[data-active-view="technical"] #page-root .arch-module-card>span{font-size:15px;font-weight:650;line-height:1.5;color:var(--arch-mute)}
body[data-active-view="technical"] #page-root .arch-module-card>strong,body[data-active-view="technical"] #page-root .arch-module-links{font-size:17px;line-height:1.5;font-weight:850;color:var(--arch-name);margin-top:0;display:block}
body[data-active-view="technical"] #page-root .arch-module-links a{color:var(--arch-name);text-decoration:none;transition:color .2s ease}
body[data-active-view="technical"] #page-root .arch-module-links a:hover{color:#1174f6}
body[data-active-view="technical"] #page-root .arch-module-links span{font-weight:600;color:var(--arch-mute)}
body[data-active-view="technical"] #page-root .arch-bus-note{font-size:15px;font-weight:600;color:var(--arch-mute)}
@media(max-width:1180px){body[data-active-view="technical"] #page-root .arch-node{padding:20px 18px}body[data-active-view="technical"] #page-root .arch-node ul{font-size:14.5px}body[data-active-view="technical"] #page-root .arch-module-card>strong,body[data-active-view="technical"] #page-root .arch-module-links{font-size:15px}}
body[data-active-view="technical"] #page-root .arch-module-links{display:block!important;white-space:nowrap;margin:0!important;padding:0;gap:0}
body[data-active-view="technical"] #page-root .arch-module-links a,body[data-active-view="technical"] #page-root .arch-module-links span{display:inline!important;margin:0;padding:0;font-size:inherit}
body[data-active-view="technical"] #page-root .arch-module-links span{margin-inline:2px}
body[data-active-view="technical"] #page-root .spec-group-toggle{font-size:19px;font-weight:800}
body[data-active-view="technical"] #page-root .arch-module-grid{grid-template-columns:repeat(6,minmax(0,1fr));gap:14px}
@media(max-width:1180px){body[data-active-view="technical"] #page-root .arch-module-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:620px){body[data-active-view="technical"] #page-root .arch-module-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}body[data-active-view="technical"] #page-root .arch-module-grid .arch-module-card:last-child{width:auto;grid-column:auto}}

/* Full-specs button: gentle attention pulse and bouncing arrow; stops once opened or hovered */
body[data-active-view="technical"] #page-root .detail-toggle{position:relative;padding:12px 24px;font-size:16px;background:#eef5ff;border:1.5px solid #9ec6ff;border-radius:10px;transition:background-color .2s ease,color .2s ease,transform .2s ease,box-shadow .2s ease}
body[data-active-view="technical"] #page-root .detail-toggle[aria-expanded="false"]{animation:specsPulse 2.2s ease-in-out infinite}
body[data-active-view="technical"] #page-root .detail-toggle[aria-expanded="false"] .toggle-arrow{display:inline-block;animation:specsBounce 1.2s ease-in-out infinite}
body[data-active-view="technical"] #page-root .detail-toggle:hover{animation:none;background:#1174f6;color:#fff;border-color:#1174f6;transform:translateY(-2px);box-shadow:0 10px 22px rgba(13,104,235,.28)}
body[data-active-view="technical"] #page-root .detail-toggle:hover .toggle-arrow{animation:none}
body[data-active-view="technical"] #page-root .detail-toggle:focus-visible{outline:3px solid rgba(17,116,246,.4);outline-offset:3px}
@keyframes specsPulse{0%,100%{box-shadow:0 0 0 0 rgba(17,116,246,.35)}60%{box-shadow:0 0 0 12px rgba(17,116,246,0)}}
@keyframes specsBounce{0%,100%{transform:translateY(-2px)}50%{transform:translateY(4px)}}
@media(prefers-reduced-motion:reduce){body[data-active-view="technical"] #page-root .detail-toggle,body[data-active-view="technical"] #page-root .detail-toggle .toggle-arrow{animation:none!important}}

/* Bottom close button (end of full specs list): same pulse/bounce/hover language as the open toggle */
body[data-active-view="technical"] #page-root .close-specs-bottom{position:relative;padding:12px 24px;font-size:16px;border:1.5px solid #9ec6ff;border-radius:10px;animation:specsPulse 2.2s ease-in-out infinite;transition:background-color .2s ease,color .2s ease,transform .2s ease,box-shadow .2s ease}
body[data-active-view="technical"] #page-root .close-specs-bottom svg{animation:specsBounce 1.2s ease-in-out infinite;transition:transform .2s ease}
body[data-active-view="technical"] #page-root .close-specs-bottom:hover{animation:none;background:#1174f6;color:#fff;border-color:#1174f6;transform:translateY(-2px);box-shadow:0 10px 22px rgba(13,104,235,.28)}
body[data-active-view="technical"] #page-root .close-specs-bottom:hover svg{animation:none}
body[data-active-view="technical"] #page-root .close-specs-bottom:focus-visible{outline:3px solid rgba(17,116,246,.4);outline-offset:3px}
@media(prefers-reduced-motion:reduce){body[data-active-view="technical"] #page-root .close-specs-bottom,body[data-active-view="technical"] #page-root .close-specs-bottom svg{animation:none!important}}

/* Installation and programming methods: standard tiles, real product photos, staged entrance */
body[data-active-view="technical"] #page-root .programming-section{padding:84px 40px}
body[data-active-view="technical"] #page-root .programming-section .content-heading h2{font-size:34px;font-weight:850;color:#0b2a63;line-height:1.4}
body[data-active-view="technical"] #page-root .programming-section .content-heading p{font-size:17px;font-weight:600;color:#55688a}
#page-root .pg-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:40px;direction:rtl}
#page-root .pg-card{display:flex;flex-direction:column;align-items:center;padding:24px 22px 22px;text-align:center;border:0;border-radius:14px;background:#e3e9f0;box-shadow:none;transition:background-color .2s ease,box-shadow .2s ease,opacity .6s ease,transform .6s ease}
#page-root .pg-card:hover{background:#eaf5ff;box-shadow:0 10px 26px rgba(8,58,119,.13)}
#page-root .pg-card__media{position:relative;width:100%;height:220px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;margin-bottom:14px}
#page-root .pg-card__media img{display:block;max-width:82%;max-height:170px;width:auto;height:auto;object-fit:contain;transition:transform .3s ease}
#page-root .pg-chip{position:static;padding:4px 12px;border-radius:999px;background:#0b2a63;color:#fff;font-size:12.5px;font-weight:800;letter-spacing:.06em;white-space:nowrap;box-shadow:0 6px 14px rgba(11,42,99,.25);transition:transform .25s ease}
#page-root .pg-card h3{margin:0 0 4px;font-size:21px;line-height:1.5;font-weight:850;color:#123f70}
#page-root .pg-sub{margin:0 0 16px;font-size:15px;font-weight:650;color:#5b7088}
#page-root .pg-card ul{list-style:none;margin:0 0 20px;padding:0;display:grid;gap:8px;font-size:16px;font-weight:600;color:#3d5878;text-align:start}
#page-root .pg-card li:before{content:"";display:inline-block;width:6px;height:6px;margin-inline-end:10px;border-radius:50%;background:#1174f6;vertical-align:middle}
#page-root .pg-card .fit-badge{margin-top:auto;width:100%;padding:11px 12px;border-radius:10px;background:#fff;color:#1174f6;font-size:14.5px;font-weight:800;text-align:center}
@media(max-width:1040px){#page-root .pg-grid{grid-template-columns:1fr;max-width:460px;margin-inline:auto}body[data-active-view="technical"] #page-root .programming-section{padding:52px 16px}body[data-active-view="technical"] #page-root .programming-section .content-heading h2{font-size:26px}}
body[data-active-view="technical"] #page-root .programming-section{box-sizing:border-box}

/* Programming cards: centered text, live keypad LCD */
#page-root .pg-card ul{justify-items:center;text-align:center}
#page-root .pg-card li:before{display:none}
#page-root .pg-card li{position:relative}
#page-root .pg-card .pg-sub,#page-root .pg-card h3{text-align:center}
@keyframes lcdTick{0%{opacity:.2}100%{opacity:1}}

#page-root .pg-card h3,#page-root .pg-card .pg-sub{width:100%;margin-inline:0;padding:0;text-align:center;align-self:stretch}

/* Keypad with live LCD: wide shot, zoom to the display, real sections and menus */
#page-root .pg-card__media{overflow:hidden;border-radius:10px}
#page-root .pg-kp{position:relative;display:inline-block;line-height:0;max-width:82%;transform-origin:var(--ox,50%) var(--oy,25%);transition:transform 1s cubic-bezier(.65,0,.25,1)}
#page-root .pg-kp img{display:block;max-width:100%!important;max-height:170px!important;width:auto;height:auto}
#page-root .pg-kp.is-zoom{transform:translate(var(--tx,0),var(--ty,0)) scale(var(--zs,2.4))}
#page-root .pg-lcd{position:absolute;left:24.9%;top:18.6%;width:50.6%;height:14.7%;container-type:inline-size;display:flex;flex-direction:column;justify-content:center;padding:0;text-align:center;overflow:hidden;font-family:"Courier New",Courier,ui-monospace,monospace;font-weight:700;line-height:1.15;letter-spacing:0;color:#eef6ff;background:linear-gradient(180deg,#1f60cc,#1852b4);border-radius:1.5px;text-shadow:0 0 1px rgba(255,255,255,.5)}
#page-root .pg-lcd:before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(0,20,80,.28) 1px,transparent 1px) 0 0/5% 100%,linear-gradient(180deg,rgba(0,20,80,.22) 1px,transparent 1px) 0 0/100% 50%}
#page-root .pg-lcd i{position:relative;font-style:normal;white-space:pre;overflow:hidden;min-height:1.15em;font-size:8.3cqw;text-align:center}

/* Configo Plus tour: app window with cross-fading screenshots */
#page-root .pg-shots{position:relative;display:block;width:100%;max-width:340px;border-radius:10px;overflow:hidden;background:#fff;box-shadow:0 10px 26px rgba(8,58,119,.2);line-height:0}
#page-root .pg-shots__bar{display:flex;gap:5px;align-items:center;height:16px;padding:0 8px;background:#e9edf3;direction:ltr}
#page-root .pg-shots__bar i{width:7px;height:7px;border-radius:50%;background:#c2cad6}
#page-root .pg-shots__bar i:first-child{background:#ff6b63}
#page-root .pg-shots__bar i:nth-child(2){background:#ffc54d}
#page-root .pg-shots__bar i:nth-child(3){background:#4cd07a}
#page-root .pg-shots__stage{position:relative;display:block;aspect-ratio:1000/600;background:#ebebeb;overflow:hidden}
#page-root .pg-shot{position:absolute;inset:0;width:100%;height:100%;max-width:none;max-height:none;object-fit:cover;object-position:top center;opacity:0;transform:scale(1.04);transition:opacity .6s ease,transform 2.8s ease}
#page-root .pg-shot.is-on{opacity:1;transform:scale(1)}
#page-root .pg-shot--dialog{object-fit:contain;padding:6px 0;box-sizing:border-box}
#page-root .pg-shots__chip{position:absolute;left:50%;bottom:30px;transform:translateX(-50%);padding:4px 12px;border-radius:999px;background:rgba(11,42,99,.92);color:#fff;font-size:12.5px;font-weight:800;line-height:1.5;white-space:nowrap;box-shadow:0 6px 14px rgba(11,42,99,.3)}
#page-root .pg-shots__chip.is-pop{animation:shotChip .45s ease}
@keyframes shotChip{0%{opacity:0;transform:translate(-50%,8px)}100%{opacity:1;transform:translate(-50%,0)}}
#page-root .pg-shots__dots{position:absolute;left:0;right:0;bottom:6px;display:flex;justify-content:center;gap:5px}
#page-root .pg-shots__dots i{width:6px;height:6px;border-radius:50%;background:rgba(11,42,99,.25);transition:width .3s ease,background-color .3s ease}
#page-root .pg-shots__dots i.is-on{width:16px;border-radius:4px;background:#1174f6}
@media(prefers-reduced-motion:reduce){#page-root .pg-shot,#page-root .pg-shots__chip.is-pop{transition:none;animation:none}}
#page-root .pg-card__media .pg-shots .pg-shot{max-width:none;max-height:none;width:100%;height:100%;object-fit:cover;object-position:top center}
#page-root .pg-card__media .pg-shots .pg-shot--dialog{object-fit:contain}
#page-root .pg-card__media .pg-shots{max-width:100%}
#page-root .pg-shots__dots{gap:4px}#page-root .pg-shots__dots i{width:5px;height:5px}#page-root .pg-shots__dots i.is-on{width:14px}