/* Information panels share Contact's warm paper and quiet movement. */
.sense-about-dialog,.sense-privacy-dialog{box-sizing:border-box;position:fixed;isolation:isolate;overflow:auto;overscroll-behavior:contain;width:min(710px,calc(100vw - 36px));max-height:calc(100dvh - 36px);padding:70px 64px 52px!important;border:1px solid #827c6b2e;background:#f7f2eb;color:#463d34;box-shadow:0 30px 100px #292d2814;animation:info-panel-in .7s cubic-bezier(.22,1,.36,1) both;scrollbar-width:thin;scrollbar-color:#b9ac9b transparent}
.sense-about-dialog::before,.sense-privacy-dialog::before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 0 0,#eee1ce,transparent 68%),radial-gradient(ellipse at 100% 100%,#d8bba577,transparent 70%);background-size:130% 130%;animation:contact-light 16s ease-in-out infinite alternate}
.sense-about-dialog::backdrop,.sense-privacy-dialog::backdrop{background:#3d31274d;backdrop-filter:blur(6px);animation:info-backdrop-in .6s ease both}
:is(.sense-about-dialog,.sense-privacy-dialog)>.eyebrow{font:300 10px/1.8 Roboto,Arial,sans-serif;letter-spacing:.15em;color:#8b7a63;margin:0 0 18px}
:is(.sense-about-dialog,.sense-privacy-dialog) h2{font:200 clamp(29px,3vw,38px)/1.5 Roboto,Arial,sans-serif;letter-spacing:-.015em;margin:0 0 28px;color:#463d34}
:is(.sense-about-dialog,.sense-privacy-dialog) p,.sense-privacy-dialog li{font:300 14px/1.95 Roboto,Arial,sans-serif;color:#776b60;letter-spacing:0}
.sense-services{margin:30px 0}.sense-services section{border-top:1px solid #a29c8e44;padding:20px 0 4px}.sense-services h3{font:300 15px/1.6 Roboto,Arial,sans-serif;color:#51473d}.sense-services p{margin:9px 0 14px}
.sense-privacy-dialog h3{font:300 17px/1.7 Roboto,Arial,sans-serif;margin:30px 0 12px;padding-top:22px;border-top:1px solid #a29c8e44;color:#51473d}
.sense-privacy-dialog h2:not(#sense-privacy-title){font:300 17px/1.7 Roboto,Arial,sans-serif;margin:30px 0 12px;padding-top:22px;border-top:1px solid #a29c8e44}
.sense-privacy-dialog ul{padding-left:20px}.sense-privacy-dialog a,.sense-about-dialog .about-email{color:#51473d;text-decoration:none;border-bottom:1px solid #a29c8e55;padding-bottom:4px;font-size:13px;transition:color .4s}
.sense-about-dialog .about-email{display:inline-block;min-height:32px}
:is(.sense-about-dialog,.sense-privacy-dialog)[open]>:not(button){animation:info-content-in .9s cubic-bezier(.22,1,.36,1) .12s both}
:is(.sense-about-dialog,.sense-privacy-dialog)[open]>h2{animation-delay:.2s}
:is(.sense-about-dialog,.sense-privacy-dialog)[open]>.sense-services{animation-delay:.3s}
:is(.sense-about-dialog,.sense-privacy-dialog)[open]>.about-email{animation-delay:.38s}
.info-close,.sense-about-dialog>.close-button,.contact-dialog>.close-button{appearance:none!important;-webkit-appearance:none!important;position:absolute;right:12px;top:12px;display:grid;place-items:center;width:44px;height:44px;min-width:44px;padding:10px!important;margin:0;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;color:#776b60;cursor:pointer;line-height:1;transition:color .4s,transform .65s cubic-bezier(.22,1,.36,1)}
.info-close svg,.sense-about-dialog>.close-button svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.1;stroke-linecap:round}

.info-letter{display:inline-block;white-space:pre;transition:transform .5s cubic-bezier(.22,1,.36,1)}
@media(hover:hover) and (pointer:fine){.info-close:hover,.sense-about-dialog>.close-button:hover{transform:rotate(90deg);color:#302920}.info-hover:hover .info-letter{animation:info-letter-sway .7s ease-in-out var(--delay) both}}
@keyframes info-letter-sway{40%{transform:translate(var(--spread),-.8px) rotate(-1deg)}75%{transform:translate(var(--spread),.6px) rotate(1deg)}100%{transform:translate(var(--spread),0)}}
@keyframes info-panel-in{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes info-content-in{from{opacity:0;transform:translateY(7px);filter:blur(2px)}to{opacity:1;transform:none;filter:blur(0)}}
@keyframes info-backdrop-in{from{background:transparent;backdrop-filter:blur(0)}to{background:#3d31274d;backdrop-filter:blur(6px)}}
body.info-standalone{margin:0;min-height:100dvh;background:#faf9f6}.info-standalone .sense-privacy-dialog{position:relative;display:block;margin:40px auto;max-height:none;overflow:visible}.info-standalone .info-close{position:absolute}
@media(max-width:650px){.sense-about-dialog,.sense-privacy-dialog{width:calc(100vw - 24px);max-height:calc(100dvh - 24px);padding:58px 26px 34px!important}.sense-about-dialog h2,.sense-privacy-dialog h2{font-size:28px}.sense-about-dialog p,.sense-privacy-dialog p,.sense-privacy-dialog li{font-size:13px;line-height:1.9}.sense-services h3{font-size:14px}.sense-services{margin:26px 0}.info-standalone .sense-privacy-dialog{margin:12px auto;max-height:none}.sense-privacy-dialog .eyebrow{font-size:9px}}
@media(prefers-reduced-motion:reduce){.sense-about-dialog,.sense-privacy-dialog,.sense-about-dialog::before,.sense-privacy-dialog::before,.sense-about-dialog::backdrop,.sense-privacy-dialog::backdrop,:is(.sense-about-dialog,.sense-privacy-dialog)[open]>:not(button),.info-letter{animation:none!important;transition:none!important;transform:none!important}}

.info-word{display:inline-block;white-space:nowrap}

.sense-about-dialog,.sense-privacy-dialog{max-width:calc(100vw - 36px)}@media(max-width:650px){.sense-about-dialog,.sense-privacy-dialog{max-width:calc(100vw - 24px)}}
@font-face{font-family:Roboto;font-style:normal;font-weight:200;font-display:swap;src:url('/vy-house/assets/roboto-200.ttf') format('truetype')}@font-face{font-family:Roboto;font-style:normal;font-weight:300;font-display:swap;src:url('/vy-house/assets/roboto-300.ttf') format('truetype')}

/* One palette for all information panels, including the standalone policy. */
:root{--panel-paper:#f7f5f0;--panel-ink:#48423c;--panel-body:#6f675f;--panel-muted:#84796e;--panel-rule:#d9d2c8;--panel-shade:rgba(50,46,41,.28)}
:is(.contact-dialog,.sense-about-dialog,.sense-privacy-dialog){background-color:var(--panel-paper);background-image:radial-gradient(ellipse at 0% 0%,rgba(229,207,175,.28),transparent 72%),radial-gradient(ellipse at 100% 100%,rgba(224,196,175,.20),transparent 72%);background-repeat:no-repeat;background-attachment:local;color:var(--panel-ink);border-color:var(--panel-rule);box-shadow:0 24px 80px rgba(50,46,41,.09);scrollbar-color:#bdb3a6 transparent}
:is(.contact-dialog,.sense-about-dialog,.sense-privacy-dialog)::before{display:none}
:is(.contact-dialog,.sense-about-dialog,.sense-privacy-dialog)::backdrop{background:var(--panel-shade);backdrop-filter:blur(6px);animation:panel-shade-in .6s ease both}
:is(.contact-dialog,.sense-about-dialog,.sense-privacy-dialog) :is(h2,h3){color:var(--panel-ink)}
:is(.sense-about-dialog,.sense-privacy-dialog) p,.sense-services p,.sense-privacy-dialog li,.contact-dialog .address{color:var(--panel-body)}
:is(.contact-dialog,.sense-about-dialog,.sense-privacy-dialog)>.eyebrow{color:var(--panel-muted)}
.contact-dialog :is(.contact-email,.contact-phones,.contact-phones a),.sense-about-dialog .about-email,.sense-privacy-dialog a{color:var(--panel-ink);border-color:var(--panel-rule)}
.sense-services section,.sense-privacy-dialog :is(h2:not(#sense-privacy-title),h3){border-color:var(--panel-rule)}
.contact-dialog .socials a,.contact-dialog .close-button,.sense-about-dialog>.close-button,.sense-privacy-dialog .info-close{color:var(--panel-ink)}
@media(hover:hover) and (pointer:fine){.contact-dialog .contact-email:hover,.contact-dialog .contact-phones a:hover,.sense-about-dialog .about-email:hover,.sense-privacy-dialog a:hover,.contact-dialog .socials a:hover{color:var(--panel-ink)}}
@keyframes panel-shade-in{from{background:transparent;backdrop-filter:blur(0)}to{background:var(--panel-shade);backdrop-filter:blur(6px)}}
@media(prefers-reduced-motion:reduce){:is(.contact-dialog,.sense-about-dialog,.sense-privacy-dialog)::backdrop{animation:none}}

/* A translucent paper surface; text retains its full contrast. */
:is(.contact-dialog,.sense-about-dialog,.sense-privacy-dialog){background-color:rgba(247,245,240,.72);backdrop-filter:blur(12px) saturate(.85);-webkit-backdrop-filter:blur(12px) saturate(.85)}


.contact-dialog>.close-button svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.1;stroke-linecap:round}

/* Modal autofocus and mobile tap must never draw a square around the close icon. */
:is(#contact-dialog,#sense-about,#sense-privacy) :is(.close-button,.info-close),
:is(#contact-dialog,#sense-about,#sense-privacy) :is(.close-button,.info-close):is(:focus,:focus-visible,:active,:hover){outline:none!important;border:0!important;background:transparent!important;box-shadow:none!important;-webkit-tap-highlight-color:transparent;opacity:1;transition:transform .6s cubic-bezier(.22,1,.36,1),color .4s}
:is(#contact-dialog,#sense-about,#sense-privacy) :is(.close-button,.info-close):is(:hover,:active){transform:rotate(90deg)}
:is(#contact-dialog,#sense-about,#sense-privacy) :is(.close-button,.info-close):focus-visible svg{stroke-width:1.8}
@media(prefers-reduced-motion:reduce){:is(#contact-dialog,#sense-about,#sense-privacy) :is(.close-button,.info-close){transform:none!important;transition:none!important}}
