/* Homepage reference preview. The complete responsive homepage is a separate build task. */
.homepage-review { padding-bottom: 7rem; }
.homepage-reference { display: block; width: 100%; max-width: 1586px; height: auto; margin: 0 auto; }
.homepage-reference-note { max-width: 65rem; margin: 1rem auto 2rem; padding: 0 1.2rem; text-align: center; font-size: .875rem; }
.homepage-full { max-width: 850px; margin: 2rem auto; padding: 1rem; }
.homepage-full summary { font-weight: 700; cursor: pointer; padding: 1rem; border: 1px solid #bdc7c6; border-radius: 12px; }
.homepage-full img { display:block; width:100%; height:auto; margin-top: 1rem; }
.homepage-reviewbar { position:fixed; left:0; right:0; bottom:0; z-index:50; padding:14px max(16px,env(safe-area-inset-right)) max(14px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left)); display:flex; align-items:center; justify-content:space-between; gap:12px; background:#f4f0e7f7; border-top:1px solid #c5cdca; }
.homepage-reviewbar p { margin:0; font-size: .8rem; }
.homepage-reviewbar .actions { margin:0; gap:8px; }
.homepage-reviewbar button,.homepage-reviewbar a { min-height:44px; }
.homepage-reviewbar [data-intro-replay] { border:1px solid #17324d; border-radius:100px; background:transparent; color:#17324d; padding:10px 18px; font:inherit; font-size:.85rem; cursor:pointer; }
/* The entire video rectangle is always preserved; controls have their own space. */
.intro-screen { position:fixed; inset:0; z-index:10000; display:flex; align-items:center; justify-content:center; padding: max(20px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) calc(90px + env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left)); background:#f4f0e7; opacity:1; transition:opacity 420ms ease; overscroll-behavior:contain; }
.intro-screen[hidden] { display:none !important; }
html.intro-pending .intro-screen[hidden] { display:flex !important; }
.intro-stage { width:100%; max-width:1600px; height:100%; min-width:0; min-height:0; display:flex; justify-content:center; align-items:center; }
.intro-video { display:block; width:100%; height:100%; max-width:100%; max-height:100%; object-fit:contain !important; object-position:center; background:#f4f0e7; pointer-events:none; }
.intro-screen.is-leaving { opacity:0; pointer-events:none; }
.intro-skip { position:absolute; right:max(20px,env(safe-area-inset-right)); bottom:max(22px,env(safe-area-inset-bottom)); border:1px solid #17324d; border-radius:100px; min-width:136px; min-height:48px; padding:12px 22px; background:#17324d; color:#fffdf8; font:600 1rem/1.25 system-ui,sans-serif; cursor:pointer; }
.intro-skip:hover { background:#2f6f8a; }
.intro-skip:focus-visible,[data-intro-replay]:focus-visible { outline:3px solid #2f6f8a; outline-offset:5px; box-shadow:0 0 0 2px #f4f0e7; }
html.intro-pending,html.intro-active { overflow:hidden; }
@media(max-width:600px) {
  .homepage-reviewbar { align-items:flex-start; flex-wrap:wrap; }
  .homepage-reviewbar p { width:100%; }
  .homepage-reviewbar .actions { width:100%; justify-content:space-between; }
  .homepage-reviewbar .button { padding:10px 15px; font-size:.82rem; }
  .homepage-review { padding-bottom:9rem; }
}
@media(prefers-reduced-motion:reduce) { .intro-screen { transition:none; } }
#main.homepage-review[tabindex="-1"]:focus { outline: none; }