/* Home: the connected PerFitTech equipment, room, local, and remote system. */
@font-face{font-family:'PFT Connected Symbols';font-style:normal;font-weight:300;font-display:block;src:url('/assets/fonts/pft-connected-symbols.ttf') format('truetype')}
.philosophy-practice .material-symbols-outlined{font-family:'PFT Connected Symbols';font-weight:300}
.philosophy-practice{--cs-ink:#0b2026;--cs-teal:#007a76;--cs-lime:#c7f63b;--cs-muted:#b1c6c6;--cs-line:#375158;background:#f3f0e7;color:var(--cs-ink);padding:clamp(80px,8vw,124px) 0 100px;border-bottom:1px solid #cad2cf}
.philosophy-practice h2,.philosophy-practice h3,.philosophy-practice p,.philosophy-practice figure{margin:0}
.cs-intro{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(0,1fr);gap:clamp(40px,7vw,100px);align-items:end;margin-bottom:48px}
.philosophy-practice__kicker{margin-bottom:24px;color:#006f6b;font:600 .75rem/1.35 var(--mono);letter-spacing:.13em;text-transform:uppercase}
.philosophy-practice h2{font:700 clamp(3.1rem,5.4vw,5.2rem)/.96 var(--display);letter-spacing:-.035em;text-wrap:balance}
.philosophy-practice h2 span{color:#205e62}
.cs-intro__copy{padding-bottom:3px}
.cs-intro__copy p{color:#536469;font-size:1.0625rem;line-height:1.65;max-width:460px}
.philosophy-practice__link{display:inline-flex;align-items:center;gap:16px;margin-top:23px;padding-block:8px;border-bottom:1px solid currentColor;color:var(--cs-ink)}
.philosophy-practice__link:after{content:'→';font-size:1.2rem}
.philosophy-practice__link:hover{color:#007a76}
.cs-sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.cs-selector{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));padding:0;margin:0;border:1px solid #b6c5c0;border-bottom:0;min-width:0}
.cs-option{position:relative;min-width:0;cursor:pointer}
.cs-option+.cs-option{border-left:1px solid #b6c5c0}
.cs-option input{position:absolute;width:1px;height:1px;opacity:0}
.cs-choice{display:flex;align-items:center;gap:14px;min-height:100px;padding:20px 24px;border-top:3px solid transparent}
.cs-choice__number{align-self:flex-start;padding-top:7px;font:500 .75rem/1.2 var(--mono);color:#617478}
.cs-choice strong{display:block;font:600 1.25rem/1.25 var(--body);letter-spacing:-.02em}
.cs-choice small{display:block;margin-top:6px;color:#596c6e;font-size:.8125rem;line-height:1.35}
.cs-choice__arrow{align-self:flex-start;margin-left:auto;color:#71827f;font-size:1.3rem}
.cs-option input:checked+.cs-choice{background:var(--cs-ink);color:white;border-top-color:var(--cs-lime)}
.cs-option input:checked+.cs-choice :is(small,.cs-choice__number){color:#b1c6c6}
.cs-option input:checked+.cs-choice .cs-choice__arrow{color:var(--cs-lime)}
.cs-option:hover input:not(:checked)+.cs-choice{background:#e4ebe5}
.cs-option input:focus-visible+.cs-choice{outline:3px solid #007a76;outline-offset:-4px}
.philosophy-practice .cs-map{position:relative;padding:28px 32px 0;background:var(--cs-ink);color:white;border:1px solid var(--cs-ink);overflow:hidden}
.cs-map:before{content:'';position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(#73978b0a 1px,transparent 1px),linear-gradient(90deg,#73978b0a 1px,transparent 1px);background-size:32px 32px}
.cs-map__caption,.cs-network,.cs-map__foot{position:relative}
.cs-map__caption{display:flex;justify-content:space-between;gap:24px;align-items:center;padding-bottom:25px;border-bottom:1px solid var(--cs-line);color:#adc3c0;font:500 .75rem/1.5 var(--mono);letter-spacing:.07em;text-transform:uppercase}
.cs-map__direction{display:flex;align-items:center;gap:12px;color:#8fb4b2;white-space:nowrap}
.cs-map__direction span{color:var(--cs-lime)}
.cs-network{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(150px,.64fr) minmax(0,1fr);gap:48px;padding:30px 0 28px;align-items:stretch}
.cs-network-lines{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none;fill:none;stroke:#74a6a2;stroke-width:1.5;stroke-linecap:square}
.cs-network-lines__wireless{stroke-dasharray:3 4}
.cs-network[data-wired] :is(.cs-room-controls,.cs-sensors,.cs-router,.cs-poe,.cs-pms,.cs-access,.cs-destination,.cs-switch):before,.cs-network[data-wired] :is(.cs-sensors,.cs-access,.cs-destination):after{display:none}
.cs-zone-label{color:#b1c6c6;font:500 .75rem/1.4 var(--mono);letter-spacing:.07em;text-transform:uppercase;margin-bottom:20px}
.cs-room{min-width:0;position:relative}
.cs-equipment{position:relative;min-height:203px;padding:0 16px 17px;border:1px solid #486067;background:#102a30}
.cs-equipment__visual{position:relative;height:155px}
.cs-equipment__image{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:contain;visibility:hidden;opacity:0;filter:drop-shadow(0 16px 16px #0004)}
.cs-equipment__image.is-active{visibility:visible;opacity:1}
.cs-equipment__image--floor,.cs-equipment__image--vertical{mix-blend-mode:lighten;filter:none}
.cs-equipment__image--floor{mask-image:linear-gradient(to right,transparent,#000 8%,#000 92%,transparent),linear-gradient(to bottom,transparent,#000 16%,#000 86%,transparent);mask-composite:intersect}
@media(prefers-reduced-motion:no-preference){
  .cs-equipment__image{transition:opacity .4s ease,visibility .4s}
  .cs-equipment__image.is-active{transition-delay:.4s}
}
.cs-equipment__caption{position:relative;text-align:center}
.cs-equipment__caption h3{font:500 1.0625rem/1.35 var(--body)}
.cs-equipment__caption p{margin-top:4px;color:var(--cs-muted);font-size:.8125rem;line-height:1.45}
.cs-room-controls{position:relative;margin-top:24px;padding:0 14px 14px;border:1px solid transparent}
.cs-room-controls:before{content:'';position:absolute;top:-25px;left:50%;height:24px;border-left:2px solid #74a6a2}
.cs-thermostat{position:relative;display:flex;gap:16px;align-items:center;justify-content:center;padding:13px 16px;border:1px solid #486067;background:#16343b}
.cs-thermostat>.material-symbols-outlined{font-size:2.15rem;color:#8dd4cf}
.cs-thermostat strong{display:block;font-size:1rem;font-weight:500;line-height:1.35}
.cs-thermostat div>span{display:block;color:var(--cs-muted);font-size:.8125rem;line-height:1.35;margin-top:4px}
.cs-sensors{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:16px;padding-top:22px}
.cs-sensors:before{content:'';position:absolute;top:11px;left:23%;right:23%;height:10px;border:1px dashed #678e8e;border-bottom:0}
.cs-sensors:after{content:'';position:absolute;top:0;left:50%;height:11px;border-left:1px dashed #678e8e}
.cs-sensors>div{display:flex;align-items:center;justify-content:center;gap:7px;min-width:0;color:#cedddb;font-size:.8125rem;line-height:1.3}
.cs-sensors .material-symbols-outlined{font-size:1.3rem;color:#80b8b3}
.cs-room-controls__note{display:block;text-align:center;margin-top:10px;color:#99b6b2;font-size:.75rem}
.cs-backbone{position:relative;display:flex;flex-direction:column;align-items:stretch;min-width:0}
.cs-backbone .cs-zone-label{white-space:nowrap}
.cs-node{position:relative;display:flex;align-items:center;flex-direction:column;text-align:center;padding:17px 12px;border:1px solid #486067;background:#102a30}
.cs-node>.material-symbols-outlined{font-size:1.9rem;color:#89c6c0;margin-bottom:7px}
.cs-node strong{font-size:1rem;font-weight:500;line-height:1.35}
.cs-node__eyebrow{display:block;color:#b1c6c6;font:400 .75rem/1.45 var(--mono)}
.cs-router{margin-top:29px}
.cs-router .cs-node__eyebrow{margin-bottom:4px}
.cs-router:before{content:'';position:absolute;right:100%;top:50%;width:49px;border-top:2px dashed #72aaa5}
.cs-poe{display:block;align-self:center;position:relative;height:39px;line-height:39px;font-size:.75rem;color:#a3bfba;transform:translateX(calc(50% + 10px));white-space:nowrap}
.cs-poe:before{content:'';position:absolute;left:-1px;top:0;bottom:0;border-left:2px solid #74a6a2}
.cs-switch{min-height:74px;justify-content:center;flex-direction:row;gap:8px}
.cs-switch>.material-symbols-outlined{margin:0;font-size:1.6rem}
.cs-pms{margin-top:25px;padding:13px 10px 12px}
.cs-pms:before{content:'';position:absolute;left:50%;bottom:100%;height:26px;border-left:2px solid #74a6a2}
.cs-pms>.material-symbols-outlined{font-size:1.5rem;margin-bottom:4px}
.cs-pms p{font-size:.75rem;line-height:1.5;color:var(--cs-muted);margin-top:6px}
.cs-access{position:relative;display:grid;grid-template-rows:auto 1fr 1fr;gap:20px;min-width:0}
.cs-access>.cs-zone-label{margin-bottom:0}
.cs-access:before{content:'';position:absolute;left:-26px;top:119px;bottom:101px;border-left:2px solid #74a6a2}
.cs-access:after{content:'';position:absolute;left:-48px;width:23px;top:240px;border-top:2px solid #74a6a2}
.cs-destination{position:relative;padding:21px 24px 20px;border:1px solid #486067;background:#102a30}
.cs-destination:before{content:'';position:absolute;right:100%;width:26px;top:50%;border-top:2px solid #74a6a2}
.cs-destination__top{display:flex;align-items:center;gap:12px;margin-bottom:10px}
.cs-destination__top .material-symbols-outlined{color:#80c6bf;font-size:1.75rem}
.cs-destination h3{font:600 1.625rem/1.1 var(--display);letter-spacing:-.02em}
.cs-destination p{margin-top:12px;color:#b8ccca;font-size:.875rem;line-height:1.6}
.cs-map__foot{display:flex;align-items:center;justify-content:space-between;gap:20px;border-top:1px solid var(--cs-line);padding:19px 0;color:#9fb8b5;font-size:.75rem;line-height:1.4}
.cs-map__foot>span:first-child{display:flex;align-items:center;gap:9px;color:#c7d7d3}
.cs-map__foot i{width:6px;height:6px;background:var(--cs-lime);display:inline-block;flex:none}
.cs-explorer:has(#cs-equipment:checked) [data-layer=equipment],.cs-explorer:has(#cs-room:checked) [data-layer=room],.cs-explorer:has(#cs-local:checked) .cs-destination[data-layer=local],.cs-explorer:has(#cs-remote:checked) [data-layer=remote]{border-color:var(--cs-lime);background:#18373b;box-shadow:inset 0 2px var(--cs-lime)}
.cs-explorer:has(#cs-room:checked) .cs-thermostat{border-color:#8abf9c}
.cs-explorer:has(#cs-local:checked) .cs-backbone .cs-node{border-color:#9cc694}
.cs-explorer:has(#cs-remote:checked) .cs-destination--remote h3,.cs-explorer:has(#cs-local:checked) .cs-destination--local h3{color:var(--cs-lime)}
.cs-details{border:1px solid #b6c5c0;border-top:0;background:#e4eeea}
.cs-detail{display:none;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:60px;min-height:260px;padding:32px}
.cs-explorer:has(#cs-equipment:checked) #cs-panel-equipment,.cs-explorer:has(#cs-room:checked) #cs-panel-room,.cs-explorer:has(#cs-local:checked) #cs-panel-local,.cs-explorer:has(#cs-remote:checked) #cs-panel-remote{display:grid}
.cs-detail__eyebrow{display:block;color:#006f6b;font:600 .75rem/1.4 var(--mono);letter-spacing:.06em;text-transform:uppercase;margin-bottom:13px}
.cs-detail h3{font:600 clamp(1.65rem,2.45vw,2.25rem)/1.05 var(--display);letter-spacing:-.02em}
.cs-detail__body p{font-size:1rem;line-height:1.6;color:#3b5559}
.cs-detail__body p+p{margin-top:13px}
.cs-room-states{display:grid;grid-template-columns:1fr 1fr;gap:7px 18px;margin:16px 0 0;padding:0;list-style:none}
.cs-room-states li{display:flex;align-items:center;gap:7px;color:#235d5d;font-size:.8125rem;line-height:1.4}
.cs-room-states li:before{content:'';width:5px;height:5px;border:1px solid #007a76;flex:none}
@media(max-width:1100px){
  .cs-intro{gap:35px;grid-template-columns:1.35fr 1fr}
  .cs-choice{padding:18px 17px;gap:10px}.cs-choice small{font-size:.75rem}.cs-choice__number{display:none}
  .cs-network{grid-template-columns:minmax(0,1.35fr) minmax(132px,.65fr) minmax(0,1fr);gap:32px}
  .philosophy-practice .cs-map{padding-inline:24px}.cs-router:before{width:33px}
  .cs-access:before{left:-18px}.cs-access:after{left:-32px;width:15px}.cs-destination:before{width:18px}
  .cs-destination{padding:20px 17px}.cs-destination__top{gap:8px}.cs-destination__top .cs-node__eyebrow{font-size:.6875rem}
  .cs-room-controls{padding-inline:7px}.cs-sensors{gap:8px}.cs-sensors>div{font-size:.75rem}
  .cs-detail{gap:32px;min-height:280px}
}
@media(max-width:800px){
  .cs-explorer{display:flex;flex-direction:column}.cs-selector{order:0}.cs-details{order:1}.philosophy-practice .cs-map{order:2}
  .cs-intro{grid-template-columns:1fr;gap:24px}.cs-intro__copy{max-width:620px}.cs-intro__copy p{max-width:none}
  .philosophy-practice h2{font-size:clamp(3.15rem,8vw,4.5rem)}
  .cs-map__direction{display:none}.cs-network{grid-template-columns:1.35fr 1fr;gap:28px}
  .cs-room{grid-row:1}.cs-backbone{grid-row:1}.cs-backbone .cs-zone-label{white-space:normal}.cs-router:before{width:29px}
  .cs-access{grid-column:1/-1;grid-template-columns:1fr 1fr;grid-template-rows:auto 1fr;gap:20px}
  .cs-access>.cs-zone-label{grid-column:1/-1;padding-top:6px}
  .cs-access:before,.cs-access:after,.cs-destination:before{display:none}
  .cs-destination--local:after,.cs-destination--remote:after{content:'';position:absolute;top:-13px;left:50%;height:12px;border-left:2px solid #74a6a2}
  .cs-map__foot{align-items:flex-start}.cs-map__foot>span:last-child{text-align:right;max-width:130px}
  .cs-destination__top .cs-node__eyebrow{font-size:.75rem}.cs-details .cs-detail{min-height:295px}
}
@media(max-width:560px){
  .philosophy-practice{padding:72px 0}.philosophy-practice__kicker{margin-bottom:22px}
  .cs-intro{margin-bottom:34px}.philosophy-practice h2{font-size:clamp(2.8rem,10.7vw,3.7rem);text-wrap:initial}
  .cs-intro__copy p{font-size:1rem}.philosophy-practice__link{margin-top:17px}
  .cs-selector{grid-template-columns:1fr 1fr}.cs-option:nth-child(3){border-left:0}.cs-option:nth-child(n+3){border-top:1px solid #b6c5c0}
  .cs-choice{min-height:80px;padding:14px 13px;gap:8px}.cs-choice strong{font-size:1.0625rem}.cs-choice small{font-size:.75rem;margin-top:4px}.cs-choice__arrow{font-size:1.1rem}
  .philosophy-practice .cs-map{padding:21px 20px 0}.cs-map__caption{padding-bottom:20px;font-size:.6875rem;letter-spacing:.03em}
  .cs-network{display:flex;flex-direction:column;gap:27px;padding-top:24px}.cs-zone-label{margin-bottom:15px;font-size:.6875rem}
  .cs-equipment{padding-top:0}.cs-equipment__visual{height:165px}.cs-room-controls{margin-top:23px;padding-inline:10px}
  .cs-sensors>div{font-size:.8125rem}.cs-room-controls__note{font-size:.75rem}
  .cs-backbone{display:grid;grid-template-columns:1fr 1fr;gap:16px;position:relative}
  .cs-backbone>.cs-zone-label{grid-column:1/-1;margin-bottom:0}.cs-router{margin:0}.cs-router:before{display:none}
  .cs-node{padding:14px 8px}.cs-node strong{font-size:.875rem}.cs-node__eyebrow{font-size:.6875rem}
  .cs-poe{display:none}.cs-switch{flex-direction:column;gap:7px}.cs-switch:before{content:'';position:absolute;right:100%;width:17px;top:50%;border-top:2px solid #74a6a2}
  .cs-pms{grid-column:1/-1;display:grid;grid-template-columns:28px auto 1fr;column-gap:9px;text-align:left;margin:0;padding:13px 12px}
  .cs-pms p{margin:0;font-size:.75rem;text-align:right}.cs-pms .material-symbols-outlined{margin:0}.cs-pms:before{left:76%;height:17px}
  .cs-access{display:grid;grid-template-columns:1fr;grid-template-rows:auto;gap:17px}.cs-access>.cs-zone-label{margin:0;padding-top:0}
  .cs-destination{display:grid;grid-template-columns:1fr 1.15fr;column-gap:14px;padding:19px 17px}.cs-destination__top{grid-column:1/-1;margin-bottom:9px}
  .cs-destination h3{font-size:1.7rem}.cs-destination p{margin:0;font-size:.8125rem;line-height:1.65}
  .cs-destination--local:after,.cs-destination--remote:after{display:none}
  .cs-map__foot{flex-direction:column;gap:9px;padding:17px 0;font-size:.6875rem}.cs-map__foot>span:last-child{text-align:left;max-width:none}
  .cs-details .cs-detail{grid-template-columns:1fr;gap:20px;min-height:0;padding:26px 21px}
  .cs-detail h3{font-size:1.85rem}.cs-detail__body p{font-size:1rem}.cs-room-states{grid-template-columns:1fr;gap:10px}
}
@media print{.cs-selector{display:none}.cs-detail{display:grid!important}.cs-map{break-inside:avoid}}
