/* A persistent sound action stays outside every video picture. */
.video-sound-toggle{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;min-width:120px;max-width:100%;padding:10px 16px;border:1px solid var(--brand);border-radius:24px;background:var(--paper);color:var(--brand-deep);font:inherit;font-size:16px;font-weight:500;line-height:1.5;white-space:normal;overflow-wrap:anywhere;cursor:pointer;touch-action:manipulation}
.video-sound-toggle[aria-pressed="true"]{background:var(--soft);border-color:var(--brand);color:var(--brand)}
.video-sound-toggle[hidden]{display:none!important}
.video-sound-toggle:focus-visible{outline:2px solid var(--brand);outline-offset:4px}
@media(hover:hover){.video-sound-toggle:hover{background:var(--soft)}}
/* A small guide entry keeps the villa photographs at the centre of the page. */
.site-tour-link{display:inline-flex;align-items:center;gap:10px;min-height:44px;max-width:100%;margin-top:14px;color:var(--brand);font-size:14px;line-height:1.65;text-underline-offset:4px}
.site-tour-link svg,.site-tour-card-play svg{width:18px;height:18px;flex:none;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linejoin:round}
.site-tour-link-copy{display:grid;gap:2px}
.site-tour-link small{font-size:13px;color:var(--muted)}
.site-tour-link span{min-width:0;overflow-wrap:anywhere}
.site-tour-card{display:grid;grid-template-columns:minmax(0,280px) minmax(0,1fr);gap:28px;align-items:center;padding:24px 0;margin-bottom:20px;border-block:1px solid var(--line);color:var(--ink)}
.site-tour-card-poster{display:block;position:relative;aspect-ratio:16/9;overflow:hidden;background:var(--soft)}
.site-tour-card-poster img{width:100%;height:100%;object-fit:contain}
.site-tour-card-play{position:absolute;left:12px;bottom:12px;display:grid;place-items:center;width:44px;height:44px;border:1px solid var(--line);background:var(--paper);color:var(--brand)}
.site-tour-card-copy{display:grid;gap:8px;min-width:0;line-height:1.75}
.site-tour-card-copy strong{font-family:var(--sans);font-weight:500;font-size:20px;line-height:1.6;word-break:keep-all;overflow-wrap:anywhere}
.site-tour-card-copy>span:last-child{font-size:15px;color:var(--muted);overflow-wrap:anywhere}
.site-tour-disclosure{font-size:13px;color:var(--muted)}
.site-tour-dialog{width:min(960px,calc(100% - 32px));max-width:none;max-height:calc(100svh - 32px);max-height:calc(100dvh - 32px);margin:auto;padding:20px 24px;border:1px solid var(--line);background:var(--paper);color:var(--ink);overflow:auto;overscroll-behavior:contain}
.site-tour-dialog::backdrop{background:#17120ed9}
/* Keep the close action reachable while the optional written guide scrolls. */
.site-tour-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:16px;position:sticky;top:0;z-index:1;background:var(--paper)}
.site-tour-heading>div{min-width:0}
.site-tour-heading h2{margin:0;font-family:var(--sans);font-size:clamp(17px,2vw,22px);font-weight:500;line-height:1.6;word-break:keep-all;overflow-wrap:anywhere}
.site-tour-heading p{margin:3px 0 0;font-size:13px;color:var(--muted);line-height:1.6}
.site-tour-heading button{display:grid;place-items:center;flex:none;width:44px;height:44px;border:1px solid var(--line);color:var(--brand-deep);touch-action:manipulation}
.site-tour-heading button svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round}
.site-tour-media{width:100%;margin-inline:auto;background:#17120e;line-height:0}
.site-tour-media video{display:block;width:100%;height:auto;aspect-ratio:16/9;max-height:calc(100svh - 292px);max-height:calc(100dvh - 292px);object-fit:contain}
.site-tour-dialog:is([data-tour-layout="mobile"],[data-tour-layout="portrait"]) .site-tour-media video{aspect-ratio:9/16}
.site-tour-dialog[data-tour-layout="desktop"] .site-tour-media video{aspect-ratio:16/9}
.site-tour-status{margin:12px 0 0;font-size:14px;line-height:1.7;overflow-wrap:anywhere}
.site-tour-footer{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px 20px;margin-top:14px;font-size:14px;line-height:1.6}
.site-tour-footer a{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:44px;max-width:100%;color:var(--brand);overflow-wrap:anywhere;text-underline-offset:4px}
.site-tour-footer #siteTourInquiry{padding:10px 16px;background:var(--brand);color:var(--paper)}
.site-tour-footer a>span[aria-hidden]{flex:none}
.site-tour-dialog [hidden]{display:none!important}
.travel-video-card:focus-visible,.faq-video-link:focus-visible,.site-tour-link:focus-visible,.site-tour-card:focus-visible,.site-tour-dialog :is(a,button):focus-visible{outline:2px solid var(--brand);outline-offset:4px}
@media(hover:hover){.site-tour-link:hover,.site-tour-footer #siteTourOriginal:hover{text-decoration:underline}.site-tour-card:hover strong{text-decoration:underline;text-underline-offset:5px}.site-tour-heading button:hover{background:var(--soft)}.site-tour-footer #siteTourInquiry:hover{background:var(--brand-deep)}}
@media(min-width:701px){.site-tour-dialog[data-tour-layout="portrait"]{width:min(480px,calc(100% - 32px))}}
@media(max-width:700px){
 .site-tour-card{grid-template-columns:minmax(0,1fr);gap:18px;padding:20px 0;margin-bottom:8px}
 .site-tour-card-poster{width:min(100%,360px)}
 .site-tour-card-copy strong{font-size:18px}
 .site-tour-card-copy>span:last-child{font-size:14px}
 .site-tour-dialog{width:calc(100% - 16px);max-height:calc(100svh - 16px);max-height:calc(100dvh - 16px);padding:12px}
 .site-tour-heading{gap:10px;margin-bottom:12px}
 .site-tour-dialog:not([data-tour-layout]) .site-tour-media video{aspect-ratio:9/16}
 .site-tour-footer{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px 14px;margin-top:12px}
 .site-tour-footer #siteTourSound,.site-tour-footer #siteTourRetry{grid-column:1/-1;width:100%}
 .site-tour-footer a{min-width:0}
 .site-tour-footer #siteTourInquiry{padding-inline:12px}
}
@media(prefers-reduced-motion:reduce){.site-tour-dialog,.site-tour-link,.site-tour-card{scroll-behavior:auto}}

/* Keep optional help in the same landing for input and prepared inquiry states. */
.inquiry-guide-entry{display:flex;align-items:center;gap:12px;padding-bottom:20px;margin-bottom:24px;border-bottom:1px solid var(--line);scroll-margin-top:0}
.inquiry-guide-entry .site-tour-link{flex:1;min-width:0;margin-top:0}
#resetPreparedInquiry{display:inline-flex;align-items:center;justify-content:center;flex:none;min-width:44px;min-height:44px;font-size:14px;line-height:1.6;color:var(--brand-deep);text-decoration:underline;text-underline-offset:4px;text-decoration-color:var(--line)}
/* Video help and answer sharing form one wrapping action row. */
#guide .faq-content .faq-video-link{display:inline-flex;align-items:center;flex:1 1 156px;gap:10px;min-height:48px;min-width:0;max-width:100%;margin:0;border:0;color:var(--ink);text-decoration:none}
.faq-video-link>.icon{box-sizing:border-box;width:34px;height:34px;padding:8px;flex:none;border:1px solid var(--line);border-radius:50%;color:var(--brand-deep)}
#guide .faq-video-link:hover>.icon{transform:none}
.faq-video-link-copy{display:grid;gap:2px;min-width:0;overflow-wrap:anywhere}
.faq-video-link-copy>span{font-size:14px;font-weight:500;line-height:1.6}
.faq-video-link-copy>small{font-size:13px;line-height:1.6;color:var(--muted)}
@media(hover:hover){.faq-video-link:hover .faq-video-link-copy>span{text-decoration:underline}}

/* Explicit series navigation keeps one player and one Back-to-close session. */
.site-tour-faq-navigation{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:10px;margin-top:12px}
.site-tour-faq-navigation button{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:44px;min-width:0;padding:8px;border:1px solid var(--line);background:transparent;color:var(--ink);font:inherit;font-size:14px;line-height:1.5;overflow-wrap:anywhere;touch-action:manipulation}
.site-tour-faq-navigation button:disabled{opacity:.45;cursor:default}
.site-tour-faq-navigation button .icon{flex:none;width:16px;height:16px}
.site-tour-faq-navigation #siteTourPrevious .icon{transform:rotate(180deg)}
.site-tour-faq-navigation #siteTourPosition{font-size:13px;line-height:1.5;font-variant-numeric:tabular-nums;color:var(--muted);white-space:nowrap}
.site-tour-dialog[data-tour-kind="faq"] .site-tour-media video{max-height:max(96px,calc(100svh - 400px));max-height:max(96px,calc(100dvh - 400px))}
@media(hover:hover){.site-tour-faq-navigation button:not(:disabled):hover{background:var(--soft);border-color:var(--brand)}}

/* Keep the picture beside its secondary actions in short landscape windows. */
@media(max-height:540px) and (min-width:540px){
 .site-tour-dialog[data-tour-layout]{--site-tour-video-height:calc(100svh - 50px);--site-tour-video-height:calc(100dvh - 50px);width:min(860px,calc(100% - 24px));max-height:calc(100svh - 16px);max-height:calc(100dvh - 16px);padding:12px max(16px,env(safe-area-inset-right)) 12px max(16px,env(safe-area-inset-left))}
 .site-tour-dialog[data-tour-layout][open]{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(220px,1fr);grid-template-rows:auto auto minmax(0,1fr) auto;align-items:start;gap:10px 24px}
 .site-tour-dialog:is([data-tour-layout="portrait"],[data-tour-layout="mobile"])[open]{grid-template-columns:calc(var(--site-tour-video-height)*.5625) minmax(0,1fr)}
 .site-tour-dialog[data-tour-layout] .site-tour-heading{grid-column:2;grid-row:1;margin:0;align-items:flex-start}
 .site-tour-dialog[data-tour-layout] .site-tour-media{grid-column:1;grid-row:1/5;width:100%;align-self:start;position:sticky;top:0}
 .site-tour-dialog[data-tour-layout] .site-tour-media video{width:100%;height:auto;max-height:var(--site-tour-video-height);object-fit:contain}
 .site-tour-dialog:is([data-tour-layout="portrait"],[data-tour-layout="mobile"]) .site-tour-media video{width:100%;height:var(--site-tour-video-height);max-height:none;aspect-ratio:9/16;object-fit:contain}
 .site-tour-dialog[data-tour-layout] .site-tour-faq-navigation{grid-column:2;grid-row:2;margin:0}
 .site-tour-dialog[data-tour-layout] .site-tour-status{grid-column:2;grid-row:3;margin:0}
 .site-tour-dialog[data-tour-layout] .site-tour-footer{grid-column:2;grid-row:4;display:flex;margin:0;justify-content:flex-start}
}

/* A small portrait preview keeps the arrival photograph and map actions primary. */
.travel-video-card{display:grid;grid-template-columns:72px minmax(0,1fr);align-items:center;gap:16px;min-height:44px;max-width:100%;padding-block:16px;border-top:1px solid var(--line);color:var(--ink);touch-action:manipulation}
.travel-video-poster{position:relative;display:block;aspect-ratio:9/16;overflow:hidden;background:var(--soft)}
#location .travel-video-poster img{display:block;width:100%;height:100%;object-fit:contain}
.travel-video-play{position:absolute;left:50%;top:50%;display:grid;place-items:center;width:44px;height:44px;transform:translate(-50%,-50%);color:var(--brand-deep);background:var(--paper);border:1px solid var(--line)}
.travel-video-play .icon{width:18px;height:18px}
.travel-video-copy{display:grid;gap:6px;min-width:0;line-height:1.65;overflow-wrap:anywhere}
.travel-video-copy strong{font-size:16px;font-weight:500;word-break:keep-all}
.travel-video-copy .site-tour-disclosure{font-size:14px}
.travel-video-watch{display:inline-flex;align-items:center;gap:10px;color:var(--brand);font-size:14px}
.travel-video-watch .icon{flex:none;width:16px;height:16px}
#location .travel-video-note{margin:0;color:var(--muted);font-size:14px;line-height:1.8;word-break:keep-all;overflow-wrap:anywhere}
@media(hover:hover){.travel-video-card:hover .travel-video-watch{text-decoration:underline;text-underline-offset:4px}}
@media(max-width:700px){.travel-video-card{grid-template-columns:64px minmax(0,1fr);gap:14px}}

.site-tour-footer #siteTourRetry{min-height:44px;padding:8px 16px;border:1px solid var(--line);border-radius:24px;background:var(--paper);color:var(--brand);font:inherit;cursor:pointer}
.site-tour-footer #siteTourRetry:focus-visible{outline:2px solid var(--brand);outline-offset:3px}

/* Leave room for recovery feedback and all actions in a narrow portrait window. */
@media(max-width:700px) and (min-height:541px){
 .site-tour-dialog:has(#siteTourRetry:not([hidden])) .site-tour-media video{max-height:max(120px,calc(100svh - 404px));max-height:max(120px,calc(100dvh - 404px))}
 .site-tour-dialog[data-tour-kind="faq"]:has(#siteTourRetry:not([hidden])) .site-tour-media video{max-height:max(96px,calc(100svh - 484px));max-height:max(96px,calc(100dvh - 484px))}
}

/* Optional written guidance uses the dialog's existing scroll, never player space. */
.site-tour-guide{min-width:0;margin-top:16px;border-top:1px solid var(--line);font-size:16px;line-height:1.8;overflow-wrap:anywhere}
.site-tour-guide>summary{min-height:48px;padding-block:10px;color:var(--brand-deep);cursor:pointer;touch-action:manipulation}
.site-tour-guide>summary::marker{color:var(--brand)}
.site-tour-guide>summary h3{display:inline;font:inherit;font-weight:500}
.site-tour-guide>summary:focus-visible{outline:2px solid var(--brand);outline-offset:4px}
.site-tour-guide-note{margin:0 0 12px;color:var(--muted);font-size:14px;line-height:1.75}
.site-tour-guide-content>p+*,.site-tour-guide-content>ol+*,.site-tour-guide-content>ul+*,.site-tour-guide-content>dl+*{margin-top:12px}
.site-tour-guide-content :is(ol,ul){margin:0;padding-inline-start:24px}
.site-tour-guide-content ul{list-style:disc}
.site-tour-guide-content li+li{margin-top:8px}
.site-tour-guide-content li p{margin-top:6px}
.site-tour-guide-content dl{display:grid;gap:10px;margin:0}
.site-tour-guide-content dt{font-weight:500;color:var(--brand-deep)}
.site-tour-guide-content dd{margin:0}
@media(max-height:540px) and (min-width:540px){
 .site-tour-dialog[data-tour-layout][open]{grid-template-rows:auto auto minmax(min-content,1fr) auto auto}
 .site-tour-dialog[data-tour-layout] .site-tour-guide{grid-column:2;grid-row:5;margin-top:0}
 .site-tour-dialog[data-tour-layout] .site-tour-media{grid-row:1/6}
}

/* An explicit mobile quality choice shares the existing sound-control row. */
.site-tour-quality{display:inline-flex;align-items:center;justify-content:center;min-height:44px;min-width:0;max-width:100%;padding:8px 10px;border:1px solid var(--line);border-radius:24px;background:var(--paper);color:var(--brand);font:inherit;line-height:1.5;overflow-wrap:anywhere;cursor:pointer}
@media(max-width:700px){.site-tour-footer:has(#siteTourQuality:not([hidden])) #siteTourSound{grid-column:auto}.site-tour-quality{font-size:14px}}
