.portal-opening.section { padding:44px 0; }
.portal-opening .container { display:grid;grid-template-columns:1fr 1.1fr;gap:0 44px;align-items:center; }
.portal-opening .container>* { grid-column:1; }
.portal-opening .container>.portal-opening-preview { grid-column:2;grid-row:1/10;margin:0; }
.portal-opening-preview .portal-shot-media { border-radius:14px; }
.portal-opening-preview .portal-shot-media img { height:auto; }
.portal-opening-preview figcaption { font-size:14px;line-height:1.6;color:#315574;margin-top:12px; }
.portal-opening h1 { font-size:clamp(36px,4.2vw,60px); }

.portal-visual-tour { padding:64px 0;background:#edf4fb; }
.portal-visual-tour .container { max-width:1240px; }
.portal-visual-tour h2 { font-size:clamp(29px,3.5vw,46px);letter-spacing:-.035em;line-height:1.15;margin:12px 0 20px; }
.portal-visual-tour>div>p { max-width:780px;line-height:1.7; }
.portal-shot-grid { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px;margin:32px 0;align-items:start; }
.portal-shot-card { min-width:0;margin:0;border:1px solid #c4d7e8;border-radius:14px;background:#fff;overflow:hidden;box-shadow:0 14px 32px #102e500a; }
.portal-shot-media { display:block;position:relative;padding:12px;background:#193f65; }
.portal-shot-media img { display:block;width:100%;height:410px;object-fit:contain;background:#edf2f5;border-radius:5px; }
.portal-shot-media::after { content:'Enlarge screenshot';display:block;text-align:center;color:#e7f3ff;font-size:13px;font-weight:700;padding:12px 8px 0; }
.portal-shot-card figcaption { padding:24px 28px; }
.portal-shot-card h3 { font-size:24px;line-height:1.25;color:#153c63;margin:0 0 12px; }
.portal-shot-card p { font-size:17px;line-height:1.65;margin:0; }
.portal-sample-note { border-left:4px solid #2879bc;background:#e2edf8;padding:18px 22px;margin:24px 0;color:#274e70;font-size:15px;line-height:1.65; }
.portal-phone-grid { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px;max-width:820px;margin:32px auto; }
.portal-phone-grid .portal-shot-media { max-width:330px;margin:24px auto 0;border-radius:24px;border:6px solid #153c63;padding:0;overflow:hidden;background:#153c63; }
.portal-phone-grid .portal-shot-media img { height:auto;border-radius:0; }
.portal-phone-grid .portal-shot-media::after { padding-bottom:12px; }
.portal-phone-grid .portal-shot-card { background:transparent;border:none;box-shadow:none; }
.portal-screen-viewer { width:min(1280px,calc(100vw - 24px));max-width:none;max-height:calc(100dvh - 24px);padding:0;border:0;border-radius:12px;background:#0e2b49;color:white;overflow:auto; }
.portal-screen-viewer::backdrop { background:#051321ed; }
.portal-viewer-top { display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 18px; }
.portal-viewer-top span { font-size:14px;line-height:1.5; }
.portal-screen-viewer button { min-height:46px;min-width:46px;border:1px solid #91aac2;border-radius:6px;padding:10px 16px;color:#fff;background:#1d486f;font:inherit;font-weight:700;cursor:pointer; }
.portal-screen-viewer button:disabled { opacity:.5;cursor:default; }
.portal-zoom-stage { max-height:66dvh;overflow:auto;overscroll-behavior:contain;background:#e8eef5; }
.portal-zoom-stage img { display:block;width:100%;height:64dvh;object-fit:contain; }
.portal-zoom-stage.is-zoomed img { width:auto;height:auto;max-width:none;max-height:none; }
.portal-viewer-caption { padding:14px 20px;margin:0;font-size:15px;line-height:1.6; }
.portal-viewer-controls { display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:12px;padding:0 16px 18px; }
.portal-screen-viewer a { display:flex;align-items:center;min-height:44px;color:#d8eaff;text-decoration:underline; }
.portal-screen-viewer :focus-visible,[data-portal-shot]:focus-visible { outline:3px solid #5ba5f3;outline-offset:4px; }
.home-experience .portal-tour .tour-controls { display:flex;flex-wrap:wrap;gap:10px; }
.home-experience .portal-tour .tour-controls[hidden] { display:none; }
.home-experience .portal-tour .portal-screen img { aspect-ratio:auto;height:560px;object-fit:contain; }
.home-experience .portal-tour .portal-screen a { display:block; }
@media(max-width:680px) {
 .portal-opening.section { padding:28px 0; }
 .portal-opening .container { grid-template-columns:1fr; }
 .portal-opening .container>.portal-opening-preview { grid-column:1;grid-row:auto;margin:20px 0; }
 .portal-visual-tour { padding:40px 0; }
 .portal-shot-grid { grid-template-columns:1fr;gap:24px; }
 .portal-shot-media { padding:6px; }.portal-shot-media img { height:340px; }
 .portal-shot-card figcaption { padding:22px; }
 .portal-phone-grid { gap:18px; }.portal-phone-grid .portal-shot-card figcaption { padding:18px 6px; }
 .portal-phone-grid .portal-shot-card h3 { font-size:20px; }.portal-phone-grid .portal-shot-card p { font-size:15px; }
 .portal-phone-grid .portal-shot-media { border-width:3px;border-radius:16px; }
 .portal-phone-grid .portal-shot-media::after { font-size:11px; }
 .portal-sample-note { padding:16px;font-size:14px; }
 .home-experience .portal-tour .tour-controls { flex-wrap:nowrap;overflow-x:auto;padding:4px 0 12px; }
 .home-experience .portal-tour .tour-controls button { flex:0 0 auto;min-height:46px; }
 .home-experience .portal-tour .portal-screen img { height:380px; }
 .portal-viewer-top { padding:10px 12px;gap:8px; }.portal-viewer-caption { padding:12px 16px;font-size:14px; }
 .portal-viewer-controls { gap:8px; }.portal-viewer-controls button { font-size:14px;padding:10px 12px; }
}