/* One complete architectural display panel per original terminal. */
#access-devices{padding:88px 0 100px;background:#f6f4ef;color:#332e29}
#access-devices>.shell{width:88%;max-width:1320px}
#access-devices .device-heading{margin-bottom:42px;gap:40px}
#access-devices .device-heading h3{font-size:clamp(28px,2.65vw,40px);line-height:1.4;letter-spacing:-.025em}
#access-devices .device-heading>p{max-width:25em;color:#81796e;font-size:13px;line-height:1.9}
#access-devices .terminal-comparison{display:grid;grid-template-columns:1fr;gap:30px}
#access-devices .terminal{position:relative;isolation:isolate;display:grid;grid-template-columns:46% 54%;min-height:560px;overflow:hidden;border:0;border-radius:4px;background:linear-gradient(110deg,#d7cbbb,#e9e2d6 44%,#f1ece3);scroll-margin-top:82px}
#access-devices .terminal+.terminal{padding:0;border:0}
#access-devices .terminal-visual{position:relative;display:flex;align-items:center;justify-content:center;isolation:isolate;height:auto;min-height:560px;padding:20px 0;border:0;border-radius:0;margin:0;background:transparent;box-shadow:none;grid-column:1;grid-row:1}
#access-devices .terminal-visual::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(106deg,transparent 31%,#fff3 31.2%,transparent 31.6%),linear-gradient(26deg,transparent 70%,#ad9d8920 70.4%,transparent 70.7%);pointer-events:none}
#access-devices .terminal-visual::after{content:"";position:absolute;inset:0 12% 0 12%;z-index:-1;border:0;background:linear-gradient(90deg,#ffffff08,#ffffff35 70%,#ffffff14);box-shadow:16px 0 25px #8d78531a;pointer-events:none}
#access-devices .terminal-size{left:30px;top:28px;display:flex;align-items:baseline;gap:7px;font:400 25px/1.1 Arial,sans-serif;letter-spacing:-.03em;color:#7f6c53;z-index:1}
#access-devices .terminal-size small{font-size:10px;line-height:1.3;font-family:inherit;font-weight:400;letter-spacing:.03em;color:inherit;opacity:.8}
#access-devices .terminal-visual img{position:relative;z-index:1;display:block;width:auto;height:368px;max-width:64%;object-fit:contain;filter:drop-shadow(8px 10px 5px #130e0a55) drop-shadow(18px 20px 25px #21160f33);transform:none}
#access-devices .terminal--compact .terminal-visual img{height:252px;filter:drop-shadow(6px 9px 5px #40362b35) drop-shadow(14px 22px 22px #4d3a2533)}
#access-devices .terminal-copy{align-self:center;grid-column:2;grid-row:1;min-width:0;padding:60px clamp(28px,4.5vw,70px) 60px clamp(22px,3vw,48px)}
#access-devices .terminal-copy .terminal-label{font-size:12px;font-weight:400;letter-spacing:.04em;margin-bottom:20px;color:#8d775d}
#access-devices .terminal-copy h4{font-size:clamp(30px,3vw,43px);font-weight:500;line-height:1.35;letter-spacing:-.035em;margin:0 0 36px;color:#332e29}
#access-devices .terminal-copy dl{display:grid;grid-template-columns:1fr 1fr;gap:0 28px;margin:0}
#access-devices .terminal-copy dl>div{padding:17px 0 19px;border-top:1px solid #ac998037;min-width:0}
#access-devices .terminal-copy dt{font-size:13px;font-weight:500;color:#584b3d;line-height:1.6}
#access-devices .terminal-copy dd{font-size:12px;line-height:1.8;color:#897c6d;margin:7px 0 0}
#access-devices .terminal--large{grid-template-columns:54% 46%;background:radial-gradient(ellipse at 85% 20%,#a8865823,transparent 60%),linear-gradient(90deg,#2d251f,#45372c);color:#f4eee4}
#access-devices .terminal--large .terminal-copy{grid-column:1;padding-left:clamp(32px,5.3vw,82px);padding-right:clamp(22px,3vw,48px)}
#access-devices .terminal--large .terminal-visual{grid-column:2;min-height:600px;background:repeating-linear-gradient(90deg,#0f0b0820 0px,#ffffff04 1px,transparent 2px,transparent 12px)}
#access-devices .terminal--large .terminal-visual::before{background:linear-gradient(90deg,#130f0c10,#e8c88c0b 65%,#0d090729)}
#access-devices .terminal--large .terminal-visual::after{background:linear-gradient(90deg,#21181024,#e6bd790b 80%,#f5dcb51a);box-shadow:15px 0 28px #1c110b55}
#access-devices .terminal--large .terminal-size{color:#d8c0a2}
#access-devices .terminal--large .terminal-copy .terminal-label{color:#c4aa86}
#access-devices .terminal--large .terminal-copy h4{color:#f5eee5}
#access-devices .terminal--large .terminal-copy dl>div{border-color:#dfc7a52c}
#access-devices .terminal--large .terminal-copy dt{color:#e8d9c6}
#access-devices .terminal--large .terminal-copy dd{color:#bbaa96}
@media(min-width:1500px){
 #access-devices .terminal,#access-devices .terminal-visual{min-height:630px}
 #access-devices .terminal--large .terminal-visual{min-height:660px}
 #access-devices .terminal--compact .terminal-visual img{height:290px}
 #access-devices .terminal--large .terminal-visual img{height:420px}
}
@media(max-width:1050px) and (min-width:761px){
 #access-devices .terminal,#access-devices .terminal--large{grid-template-columns:43% 57%}
 #access-devices .terminal--large .terminal-copy{grid-column:2;padding:50px 30px}
 #access-devices .terminal--large .terminal-visual{grid-column:1}
 #access-devices .terminal-copy{padding:50px 30px}
 #access-devices .terminal-copy h4{font-size:32px}
 #access-devices .terminal-copy dl{gap:0 22px}
 #access-devices .terminal-visual img{height:340px;max-width:66%}
 #access-devices .terminal--compact .terminal-visual img{height:224px}
}
@media(max-width:760px){
 #access-devices{padding:58px 0 66px}
 #access-devices>.shell{width:90%}
 #access-devices .device-heading{display:block;margin-bottom:28px}
 #access-devices .device-heading h3{font-size:26px}
 #access-devices .device-heading>p{font-size:12px;margin-top:16px;max-width:25em}
 #access-devices .terminal-comparison{gap:24px}
 #access-devices .terminal,#access-devices .terminal--large{display:flex;flex-direction:column;min-height:0;scroll-margin-top:76px}
 #access-devices .terminal-visual,#access-devices .terminal--large .terminal-visual{min-height:0;height:330px;padding:25px 0 0;flex:none}
 #access-devices .terminal--compact .terminal-visual img{height:194px}
 #access-devices .terminal--large .terminal-visual img{height:270px}
 #access-devices .terminal-size{left:23px;top:23px;font-size:23px}
 #access-devices .terminal-copy,#access-devices .terminal--large .terminal-copy{padding:32px 28px 22px;align-self:stretch}
 #access-devices .terminal-copy .terminal-label{margin-bottom:14px;font-size:11px}
 #access-devices .terminal-copy h4{font-size:29px;margin-bottom:26px}
 #access-devices .terminal-copy dl{gap:0 22px}
 #access-devices .terminal-copy dt{font-size:12px}
 #access-devices .terminal-copy dd{font-size:11px}
}
