/* Classic Reimagined | 20260930-seamless-v4
 * Homepage presentation only. This REPLACES the two old home layout sheets.
 * No viewport-height forcing, inset art panel, backdrop duplication, cover
 * crop, transform scaling, blurred side padding, or hidden logo banner.
 * The approved scene is one full-width image. Navigation/buttons remain HTML.
 */
body.cr-home { margin:0; width:100%; }
.cr-home > .cr-site, .cr-home #main-content { width:100%; max-width:none; }
.cr-home .cr-hero {
    display:block; position:relative; width:100%; max-width:none;
    height:auto; min-height:0; padding:0; background:none;
}
.cr-home .cr-hero-art {
    position:relative; display:block; width:100%; height:auto;
    min-height:0; aspect-ratio:auto; line-height:0; background:none;
}
.cr-home .cr-hero-stage {
    position:static; display:block; width:100%; max-width:none;
    height:auto; margin:0; transform:none; line-height:0;
}
.cr-home .cr-hero-stage > img {
    display:block; width:100%; max-width:none; height:auto; max-height:none;
    object-fit:contain; object-position:center; image-rendering:auto;
    transform:none; filter:none; border:0;
}
.cr-home .cr-action-band {
    position:relative; padding:14px 0 18px;
    background:url('../assets/action-ground-s4.webp') center top / 100% 100% no-repeat;
    border-bottom:1px solid #dcc69f;
}
.cr-home .cr-action-row {
    width:calc(100% - 48px); max-width:1400px;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:16px; margin:0 auto; padding:0;
}
.cr-home .cr-action { height:82px; gap:14px; border-width:2px; }
.cr-home .cr-action strong { font-size:clamp(15px,1.2vw,20px); }
.cr-home .cr-action small { font-size:clamp(12px,.9vw,15px); }
.cr-home .cr-action-icon { padding-right:14px; }
.cr-home .cr-action-icon .cr-icon { width:32px; height:32px; }
@media (min-width:1024px) {
    .cr-home .cr-header { height:72px; }
    .cr-home .cr-header-inner {
        max-width:1600px; height:100%; margin:0 auto; padding:0 28px; gap:12px;
    }
    .cr-home .cr-nav-link {
        font-size:clamp(11px,.82vw,13px); gap:4px; padding:5px 8px;
    }
    .cr-home .cr-nav-link > .cr-icon { width:25px; height:25px; }
    .cr-home .cr-online {
        font-size:clamp(12px,.9vw,15px); gap:14px; margin-left:18px;
    }
    .cr-home .cr-online strong { font-size:27px; }
    .cr-home .cr-main-wrap { padding-top:24px; }
}
@media (min-width:768px) and (max-width:1100px) {
    .cr-home .cr-action-row { width:calc(100% - 32px); gap:10px; }
    .cr-home .cr-action { gap:9px; height:76px; }
    .cr-home .cr-action strong { font-size:14px; }
    .cr-home .cr-action small { font-size:11px; }
    .cr-home .cr-action-icon { padding-right:9px; }
    .cr-home .cr-action-icon .cr-icon { width:27px; height:27px; }
}
@media (max-width:767px) {
    /* All three faces and the whole logo remain inside the mobile image. */
    .cr-home .cr-hero-art, .cr-home .cr-hero-stage { height:auto; min-height:0; }
    .cr-home .cr-action-band { padding:12px 0 16px; }
    .cr-home .cr-action-row {
        width:92%; max-width:none; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px;
    }
    .cr-home .cr-action { height:62px; gap:8px; }
    .cr-home .cr-action strong { font-size:12px; }
    .cr-home .cr-action small { font-size:10px; }
    .cr-home .cr-action-icon { padding-right:8px; }
    .cr-home .cr-action-icon .cr-icon { width:24px; height:24px; }
}