/* F&F Liquid Glass: native-CSS web approximation, not Apple's native material.
   Existing layout, content, logo, diagrams and brand colours are preserved.
   Material scale: pill controls, 16px small panes, 24px large panes.
   V4.1: sculpted glass edges and directional reflections, September 2026.
   Layers inherited: background < content < header < chat. */
:root {
  --lg-ink: #24333c;
  --lg-edge: rgba(255,255,255,.96);
  --lg-shadow: 0 18px 34px -20px rgba(46,64,76,.32), 0 5px 10px -6px rgba(46,64,76,.24);
  --lg-rim: inset 0 2px 1px rgba(255,255,255,.98), inset 2px 0 2px rgba(255,255,255,.8), inset 0 -2px 3px rgba(62,81,95,.16), inset -2px 0 3px rgba(255,255,255,.78), inset 0 7px 10px -7px #fff, inset 0 -8px 12px -10px rgba(65,84,98,.32);
  --lg-pane: radial-gradient(ellipse at var(--glass-x,12%) var(--glass-y,0%),rgba(255,255,255,.84),transparent 47%),linear-gradient(128deg,rgba(255,255,255,.52),rgba(255,255,255,.1) 28%,rgba(255,255,255,.36) 29%,rgba(255,255,255,.06) 34%,rgba(255,255,255,.18) 72%,rgba(255,255,255,.6)),rgba(247,250,252,.24);
  --lg-clear: radial-gradient(ellipse at var(--glass-x,16%) var(--glass-y,0%),rgba(255,255,255,.86),transparent 66%),linear-gradient(160deg,rgba(255,255,255,.38),rgba(255,255,255,.12) 48%,rgba(255,255,255,.52));
  --lg-action: radial-gradient(ellipse at var(--glass-x,22%) var(--glass-y,0%),rgba(255,255,255,.94),transparent 59%),linear-gradient(176deg,rgba(255,255,255,.76),rgba(255,255,255,.21) 40%,rgba(255,255,255,.04) 44%,rgba(255,255,255,.06) 71%,rgba(255,255,255,.49)),linear-gradient(108deg,rgba(220,99,88,.3),rgba(237,172,120,.14) 50%,rgba(245,207,70,.36));
}
/* A glossy rim creates depth without placing a filter over text or imagery. */
.btn,.btn-primary,.btn-ghost,.burger,.chatbot-toggle,.chatbot-action,.chatbot-send,
.chatbot-close,.chatbot-quick button,.filter-tabs button,.filter-tabs button.active {
  background: var(--lg-action);
  color: var(--lg-ink);
  border: 1px solid var(--lg-edge);
  border-radius: 999px;
  box-shadow: var(--lg-rim),var(--lg-shadow);
  backdrop-filter: blur(22px) saturate(170%);
  -webkit-backdrop-filter: blur(22px) saturate(170%);
  text-shadow: 0 1px 0 rgba(255,255,255,.62);
  transition: transform .22s cubic-bezier(.2,.8,.2,1),box-shadow .22s ease,border-color .22s ease;
}
.btn:hover,.btn-primary:hover,.btn-ghost:hover,.burger:hover,.chatbot-toggle:hover,
.chatbot-action:hover,.chatbot-send:hover,.chatbot-close:hover,.chatbot-quick button:hover,.filter-tabs button:hover {
  background: var(--lg-action);
  color: var(--lg-ink);
  border-color: #fff;
  box-shadow: var(--lg-rim),0 16px 28px -16px rgba(157,88,56,.4),0 5px 9px -5px rgba(58,72,83,.28);
  transform: translateY(-2px);
}
.btn:active,.burger:active,.chatbot-toggle:active,.filter-tabs button:active {
  transform: translateY(1px);
  box-shadow: inset 0 2px 5px rgba(112,89,75,.13),inset 0 -1px 0 #fff;
}
.btn:disabled,.chatbot-send:disabled {transform:none;opacity:.65;cursor:not-allowed;}
.btn-ghost,.chatbot-close {background:var(--lg-clear);}
.filter-tabs button.active {
  border-color:rgba(166,62,49,.55);
  box-shadow:var(--lg-rim),inset 0 -3px 0 rgba(166,62,49,.36),var(--lg-shadow);
  font-weight:700;
}
.burger {min-height:46px;}
.burger span,.burger span::before,.burger span::after {background:var(--lg-ink);}
/* Readable translucent windows. Nested areas use plain tint, not stacked blur. */
.status-card,.info-card,.service-card,.service-strip,.product-card,.photo-card,.team-card,
.device-panel,.showcase,.cta-section,.faq details,.chatbot-panel {
  background:var(--lg-pane);
  border:1px solid var(--lg-edge);
  box-shadow:var(--lg-rim),var(--lg-shadow);
  backdrop-filter:blur(24px) saturate(150%);
  -webkit-backdrop-filter:blur(24px) saturate(150%);
  border-radius:24px;
}
.status-card,.faq details {border-radius:16px;}
.status-card {background:var(--lg-clear);border-bottom-color:rgba(150,166,177,.32);}
.status-card .t2 {color:#53636d;}
.service-card:hover,.product-card:hover,.photo-card:hover,.team-card:hover,.info-card:hover {
  border-color:rgba(255,255,255,.98);
  box-shadow:var(--lg-rim),0 24px 38px -22px rgba(64,81,92,.4);
}
.form-card,.showcase-img,.spec-box,.product-card .pimg {
  background:var(--lg-clear);
  border:1px solid var(--lg-edge);
  box-shadow:var(--lg-rim),0 9px 20px -17px rgba(46,64,76,.28);
}
.form-row input:not([type=hidden]),.form-row textarea,.chatbot-form textarea,.mobile-device-select select {
  color:var(--lg-ink);
  background:linear-gradient(180deg,rgba(255,255,255,.72),rgba(255,255,255,.48));
  border:1px solid rgba(90,108,120,.32);
  border-radius:14px;
  box-shadow:inset 0 2px 5px rgba(66,84,96,.09),inset 0 -1px 1px #fff,0 1px 0 rgba(255,255,255,.9);
  caret-color:#9e3931;
}
.form-row input:focus,.form-row textarea:focus,.chatbot-form textarea:focus {background:rgba(255,255,255,.9);border-color:#a23d34;}
input::placeholder,textarea::placeholder {color:#5c6972;opacity:1;}
#siteHeader,#siteHeader.scrolled {
  background:linear-gradient(180deg,rgba(255,255,255,.72),rgba(255,255,255,.32));
  backdrop-filter:blur(24px) saturate(145%);
  -webkit-backdrop-filter:blur(24px) saturate(145%);
  border-bottom:1px solid rgba(255,255,255,.85);
  box-shadow:inset 0 -1px 0 rgba(255,255,255,.5),0 8px 20px -17px rgba(52,69,83,.35);
}
.navlinks.open {
  background:var(--lg-pane);
  background-color:rgba(250,251,252,.76);
  backdrop-filter:blur(26px) saturate(150%);
  -webkit-backdrop-filter:blur(26px) saturate(150%);
  border-color:var(--lg-edge);
  box-shadow:var(--lg-rim),0 24px 38px -20px rgba(52,69,83,.32);
}
.navlinks.open a:hover,.navlinks.open a.active {background:rgba(225,112,99,.1);color:#923a31;}
.chatbot-panel {background:var(--lg-pane);background-color:rgba(249,250,251,.82);}
.chatbot .chatbot-head,.chatbot-messages,.chatbot-form,.chatbot-quick,.chatbot-disclaimer {background:transparent;}
.chatbot .chatbot-head {border-bottom:1px solid rgba(114,130,139,.16);}
.chatbot-bubble {background:rgba(255,255,255,.78);color:var(--lg-ink);border:1px solid rgba(255,255,255,.85);box-shadow:0 3px 7px -5px rgba(57,77,90,.22);}
.chatbot-message.user .chatbot-bubble {background:linear-gradient(110deg,rgba(242,196,190,.68),rgba(249,230,164,.62));color:var(--lg-ink);}
.chatbot-avatar {background:rgba(255,255,255,.75);box-shadow:var(--lg-rim);}
/* Keep the actual floor plans crisp; only their frame gets a glass edge. */
.house-stage,.business-stage {border:1px solid var(--lg-edge);box-shadow:var(--lg-rim),var(--lg-shadow);border-radius:24px;}
.house-stage {background:rgba(255,255,255,.4);}
.call-link .ring,.device-panel .dp-icon {background:var(--lg-clear);border:1px solid var(--lg-edge);box-shadow:var(--lg-rim);}
.device-panel .dp-specs {background:rgba(255,255,255,.26);border-radius:12px;}
.stage-label {color:var(--lg-ink);background:rgba(255,255,255,.93);border:1px solid #fff;box-shadow:0 3px 9px -5px rgba(35,55,71,.25);}
:is(a,button,input,textarea,select,summary):focus-visible {outline:3px solid #95372f;outline-offset:4px;}
::selection {background:#f2c7ba;color:#24333c;}
html {scrollbar-color:#c9aaa0 #f3f5f6;}
@media(max-width:760px) {
  .status-card,.info-card,.service-card,.service-strip,.product-card,.photo-card,.team-card,.device-panel,.showcase,.cta-section,.faq details,.chatbot-panel,.navlinks.open {backdrop-filter:blur(14px) saturate(140%);-webkit-backdrop-filter:blur(14px) saturate(140%);}
  .btn,.chatbot-quick button {min-height:44px;}
}
@media(prefers-reduced-motion:reduce) {
  .btn,.burger,.chatbot-toggle,.chatbot-action,.filter-tabs button {transition:none!important;transform:none!important;}
}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))) {
  :root {--lg-pane:#f8fafb;--lg-clear:#f8fafb;--lg-action:linear-gradient(110deg,#f4d8d2,#f7e8c3);}
  #siteHeader,#siteHeader.scrolled,.navlinks.open,.chatbot-panel {background:#f8fafb;}
}
@media(prefers-reduced-transparency:reduce),(prefers-contrast:more) {
  :root {--lg-pane:#f8fafb;--lg-clear:#f8fafb;--lg-action:linear-gradient(110deg,#f4d8d2,#f7e8c3);}
  #siteHeader,#siteHeader.scrolled,.navlinks.open,.chatbot-panel,.form-card,.chatbot-bubble {background:#f8fafb;}
  .btn,.burger,.chatbot-toggle,.chatbot-action,.chatbot-send,.chatbot-close,.chatbot-quick button,.filter-tabs button,.status-card,.info-card,.service-card,.service-strip,.product-card,.photo-card,.team-card,.device-panel,.showcase,.cta-section,.faq details,.chatbot-panel,.navlinks.open,#siteHeader {backdrop-filter:none;-webkit-backdrop-filter:none;border-color:#687b86;box-shadow:none;}
}
