/* Heading appearance classes retain typography when semantic heading levels change. */
/* Keep the classic theme's dimensions; blocks add editing, not a new skin. */
.wp-site-blocks {
    padding: var(--karaage-space-0);
}

.wp-site-blocks>*,
.wp-site-blocks .wp-block-template-part {
    margin-block: var(--karaage-space-0);
}

.wp-block-group.main_wrap {
    gap: var(--karaage-space-3);
}

.wp-block-group.main_wrap>main {
    min-width: 0;
    flex: 1;
}

.wp-block-group.main_left {
    min-width: 0;
}

.single .wp-site-blocks h1,
.editor-styles-wrapper h1.title_headline,
.editor-styles-wrapper .wp-block-karaage-section h1.page-title {
    font-feature-settings: "palt";
    letter-spacing: .1em;
    line-height: 1.5;
    font-weight: 700;
    font-size: 1.5rem;
}

:is(.wp-site-blocks, .editor-styles-wrapper) :is(.list_shop, .list_event, .list_item, .list_events, .list_column, .list_related) li :is(h3:not(:where(.karaage-heading-adjusted)), :where(.karaage-heading-look-h3)),
:is(.wp-site-blocks, .editor-styles-wrapper) .sidebar-rankings .ranking-list .ranking-item-title,
:is(.wp-site-blocks, .editor-styles-wrapper) .list_blog li>a,
:is(.wp-site-blocks, .editor-styles-wrapper) .wp-block-post-template .wp-block-post-title {
    font-feature-settings: "palt";
    letter-spacing: .1em;
    font-weight: 700;
    font-size: 16px;
}

:is(.wp-site-blocks, .editor-styles-wrapper) :is(.list_shop, .list_event, .list_item, .list_events, .list_column, .list_related) li :is(h3:not(:where(.karaage-heading-adjusted)), :where(.karaage-heading-look-h3)) a,
:is(.wp-site-blocks, .editor-styles-wrapper) .wp-block-post-template .wp-block-post-title a {
    font-feature-settings: inherit;
}

:is(.wp-site-blocks, .editor-styles-wrapper) :is(time, .wp-block-post-date, .event-date, .list_shop .date) {
    font-size: 12px;
    font-weight: 700;
}

:is(.wp-site-blocks, .editor-styles-wrapper) .column-excerpt {
    font-size: 14px;
}

.fse-sidebar-part {
    flex: 0 0 360px;
    min-width: 0;
}

.fse-sidebar-part .aside_right {
    width: 320px;
}

.karaage-fse-header#masthead {
    display: block;
}

.karaage-fse-header .site-branding {
    flex: 0 0 auto;
}

.karaage-fse-header .site-branding figure {
    margin: var(--karaage-space-0);
}

.karaage-fse-header .site-branding img {
    height: 45px;
    width: auto;
    max-width: 180px;
}

.karaage-fse-header .fse-navigation-shell {
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    gap: var(--karaage-space-1);
}

.karaage-fse-header .wp-block-navigation {
    font-size: 16px;
    font-weight: 700;
    letter-spacing: 0.066em;
}

.karaage-fse-header .wp-block-navigation__container {
    gap: var(--karaage-space-0);
    align-items: center;
}

.karaage-fse-header .wp-block-navigation-item__content {
    padding: var(--karaage-space-1) var(--karaage-space-1);
    font-size: 16px;
    font-weight: 700;
    letter-spacing: 0.066em;
    white-space: nowrap;
    color: var(--karaage-color-black);
}

.karaage-fse-header .wp-block-navigation-item__content:hover {
    color: var(--karaage-color-accent);
    background: var(--karaage-color-white-alpha-20);
    border-radius: 5px;
}

.karaage-fse-header .fse-mobile-link {
    display: none;
}

.karaage-fse-header .info a,
.karaage-fse-header .sns a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    white-space: nowrap;
    padding: var(--karaage-space-1) var(--karaage-space-1);
    background: var(--karaage-color-accent);
    color: var(--karaage-color-white);
    border-radius: 5px;
    font-size: 16px;
    line-height: 1;
}

.karaage-search-toggle {
    display: none;
    background: none;
    border: 0;
    color: var(--karaage-color-black);
    cursor: pointer;
    padding: var(--karaage-space-0);
    font-size: 16px;
    line-height: 1.2;
}

.karaage-fse-header .karaage-search-toggle .wp-block-button__link {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    min-height: 44px;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: inherit;
}

.karaage-fse-header .karaage-search-toggle .wp-block-button__link::before {
    content: '';
    display: block;
    flex: 0 0 28px;
    width: 28px;
    height: 28px;
    background: currentColor;
    -webkit-mask: url('../assets/search.svg') center / contain no-repeat;
    mask: url('../assets/search.svg') center / contain no-repeat;
}

.karaage-search-dialog {
    width: min(700px, calc(100vw - 32px));
    max-height: calc(100dvh - 40px);
    overflow: auto;
    border: 0;
    border-radius: 10px;
    padding:0;
    margin: auto;
    color: var(--karaage-color-black);
    background: var(--karaage-color-white);
}

.karaage-search-dialog::backdrop {
    background: var(--karaage-color-black-alpha-55);
}

.karaage-search-dialog :is(h2:not(:where(.karaage-heading-adjusted)), :where(.karaage-heading-look-h2)) {
    margin: 16px 0 12px;
    font-size: 18px;
}

.region-picker .area-map {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    align-items: start;
    gap: 8px;
    margin: 0;
    padding: 0;
    background: url("../assets/japan-map.svg") center / contain no-repeat;
}
.region-picker .area-region {
    display: grid;
    grid-template-columns: 112px minmax(0, 1fr);
    align-items: baseline;
    gap: 8px;
    min-width: 0;
    margin: 0;
}
.region-picker .area-region-title {
    margin: 0;
    padding: 2px;
    border: 0;
    color: var(--karaage-color-warm-text);
    font-size: 16px;
    font-weight: 700;
    line-height: 1.5;
}
.region-picker .wp-block-terms-query {
    margin: 0;
}
.region-picker .area-prefectures {
    display: flex;
    flex-wrap: wrap;
    gap: 2px;
    max-height: none;
    margin: 0;
    padding: 0;
    overflow: visible;
    list-style: none;
}
.region-picker .area-prefectures li,
.region-picker .wp-block-term-name {
    min-width: 0;
    margin: 0;
    padding: 0;
}
.region-picker .area-prefectures a {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 28px;
    padding: 1px 3px;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: var(--karaage-color-black);
    font-size: 16px;
    font-weight: 500;
    line-height: 1.5;
    text-decoration: none;
    white-space: nowrap;
}
.region-picker .area-prefectures a:hover {
    color: var(--karaage-color-warm-text);
    text-decoration: underline;
    text-underline-offset: .2em;
}
.region-picker a:focus-visible {
    outline: 2px solid var(--karaage-color-accent);
    outline-offset: 2px;
}
.region-picker .area-overseas {
    margin: var(--karaage-space-1) 0 0;
    padding-top: var(--karaage-space-1);
    border-top: 1px solid #eedcb9;
    font-size: 16px;
    line-height: 1.7;
    text-align: right;
}
.region-picker .area-overseas a {
    color: var(--karaage-color-black);
    text-decoration: underline;
    text-underline-offset: .25em;
}
/* The search drawer uses the same regional order and links as the home hero. */
.karaage-search-dialog .area-map {
    background: none;
    gap: 8px;
}
.karaage-search-dialog .area-region {
    grid-template-columns: 96px minmax(0, 1fr);
    gap: 6px;
}
.karaage-search-dialog .area-region-title {
    margin: 0;
    padding: 2px 0;
    font-size: 14px;
    line-height: 1.5;
}
.karaage-search-dialog .area-prefectures a {
    min-height: 30px;
    padding-inline: 3px;
    font-size: 14px;
}
.karaage-search-dialog .area-overseas {
    font-size: 14px;
}
.karaage-search-dialog .wp-block-search__inside-wrapper {
    gap: 0;
}
.karaage-search-dialog .wp-block-search__input {
    min-width: 0;
    font-size: 16px;
}
.karaage-search-dialog .wp-block-search__button {
    flex-shrink: 0;
    margin: 0;
    padding-inline: 12px;
    font-size: 14px;
}
@media (max-width: 600px) {
    .region-picker .area-region {
        gap: 6px;
    }
}

.karaage-search-close {
    display: block;
    margin-left: auto;
    border: 0;
    background: var(--karaage-color-transparent);
    font-size: 28px;
    cursor: pointer;
}

.karaage-search-dialog .karaage-search-close .wp-block-button__link {
    display: grid;
    place-items: center;
    width: 36px;
    height: 36px;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: inherit;
    font-size: 28px;
    line-height: 1;
}

.search_keyword .wp-block-search {
    max-width: 600px;
    margin: auto;
}

.search_keyword .wp-block-search__inside-wrapper {
    display: flex;
    width: 100%;
    padding: var(--karaage-space-0);
    border: 0;
}

.search_keyword .wp-block-search__input {
    min-width: 0;
    padding: var(--karaage-space-1) var(--karaage-space-2);
    border: 0;
    border-radius: 5px 0 0 5px;
    background: var(--karaage-color-white);
    color: var(--karaage-color-black);
    font: inherit;
    line-height: normal;
}

.search_keyword .wp-block-search__button {
    flex-shrink: 0;
    width: 8rem;
    margin: var(--karaage-space-0);
    padding: var(--karaage-space-1) var(--karaage-space-2);
    border: 0;
    border-radius: 0 5px 5px 0;
    background: var(--karaage-color-black);
    color: var(--karaage-color-white);
    font: inherit;
    font-weight: 500;
    line-height: 1;
}

.site-footer .site-title figure {
    margin: var(--karaage-space-0);
}

.site-footer .site-title img {
    width: 200px;
}

.site-footer ul {
    padding: var(--karaage-space-0);
    list-style: none;
}

.sec_vis_bottom .wp-block-image {
    margin: var(--karaage-space-0);
}

.sec_vis_bottom .list_sns>.wp-block-image a {
    display: block;
    overflow: hidden;
    border-radius: 10px;
    box-shadow: 0 4px 15px var(--karaage-color-black-alpha-10);
}

.entry-meta .wp-block-post-date,
.entry-meta .wp-block-post-author-name {
    display: inline;
}

.wp-site-blocks .main_contents,
.editor-styles-wrapper .main_contents {
    margin-bottom: var(--karaage-space-5);
}

.wp-site-blocks .single_shop_main_content,
.editor-styles-wrapper .single_shop_main_content {
    margin: var(--karaage-space-3) var(--karaage-space-0);
}

.wp-site-blocks .headline_index,
.editor-styles-wrapper .headline_index {
    margin-bottom: var(--karaage-space-3);
}

.wp-site-blocks .aside_left .box_about,
.editor-styles-wrapper .aside_left .box_about {
    margin-bottom: var(--karaage-space-3);
}

.wp-site-blocks .sidebar-section,
.editor-styles-wrapper .sidebar-section {
    margin-bottom: var(--karaage-space-3);
}

.wp-site-blocks .fse-event-section .list_shop,
.wp-site-blocks .main_wrap .list_shop,
.editor-styles-wrapper .fse-event-section .list_shop,
.editor-styles-wrapper .main_wrap .list_shop {
    margin: var(--karaage-space-3) var(--karaage-space-0);
}

.fse-hero {
    padding: var(--karaage-space-5) var(--karaage-space-3);
    text-align: center;
}

.fse-hero :is(h2:not(:where(.karaage-heading-adjusted)), :where(.karaage-heading-look-h2)) {
    font-size: 24px;
    margin-bottom: var(--karaage-space-3);
    line-height: 1.8;
}

.fse-hero h1 {
    font-size: 16px;
    margin-bottom: var(--karaage-space-3);
}

.fse-hero h1 img {
    max-width: 400px;
}

.fse-event-section {
    background: var(--karaage-color-surface);
    padding: var(--karaage-space-5) var(--karaage-space-0);
}

.fse-update-section .box_column {
    margin-bottom: var(--karaage-space-7);
}

.fse-post-navigation {
    display: flex;
    justify-content: space-between;
    gap: var(--karaage-space-2);
}

.karaage-data-block-label {
    display: none;
}

.editor-styles-wrapper .karaage-editor-search-dialog {
    display: none;
}

@media (min-width: 1025px) {
    .editor-styles-wrapper .karaage-editor-search-toggle {
        display: none;
    }

    .karaage-fse-header .wp-block-navigation__responsive-container-open {
        display: none !important;
    }

    .karaage-fse-header .wp-block-navigation__responsive-container:not(.is-menu-open) {
        display: block !important;
        position: static;
    }
}

@media (max-width: 1024px) {
    .karaage-search-dialog {
        position: fixed;
        inset: 0;
        width: 100%;
        max-width: none;
        height: 100dvh;
        max-height: none;
        margin: 0;
        padding: max(var(--karaage-space-2), env(safe-area-inset-top)) max(var(--karaage-space-2), env(safe-area-inset-right)) max(var(--karaage-space-2), env(safe-area-inset-bottom)) max(var(--karaage-space-2), env(safe-area-inset-left));
        border-radius: 0;
        overscroll-behavior: contain;
    }

    html:has(.karaage-search-dialog[open]),
    body:has(.karaage-search-dialog[open]) {
        overflow: hidden;
    }

    .fse-sidebar-part {
        flex: 1 1 100%;
    }

    .fse-sidebar-part .aside_right {
        width: 100%;
        margin-left: var(--karaage-space-0);
    }

    .karaage-search-toggle {
        display: block;
    }

    .karaage-fse-header .site-branding img {
        max-width: 180px;
    }

    .karaage-fse-header .fse-navigation-shell {
        flex: 0 0 36px;
    }

    .karaage-fse-header .info,
    .karaage-fse-header .sns {
        display: none;
    }

    .karaage-fse-header .wp-block-navigation__responsive-container-open {
        display: flex !important;
        width: 36px;
        height: 36px;
        align-items: center;
        justify-content: center;
    }

    .karaage-fse-header .wp-block-navigation__responsive-container-open svg {
        width: 36px;
        height: 36px;
    }

    .karaage-fse-header .wp-block-navigation__responsive-container:not(.is-menu-open) {
        display: none !important;
    }

    .karaage-fse-header .wp-block-navigation__responsive-container.is-menu-open {
        position: fixed;
        inset: 0;
        padding: var(--karaage-space-2);
        background: var(--karaage-color-white);
        color: var(--karaage-color-black);
    }

    .karaage-fse-header .wp-block-navigation__responsive-container-content {
        align-items: stretch;
        padding-top: var(--karaage-space-4);
    }

    .karaage-fse-header .wp-block-navigation__container {
        align-items: stretch !important;
        width: 100%;
        gap: var(--karaage-space-0);
    }

    .karaage-fse-header .wp-block-navigation-item {
        width: 100%;
        border-bottom: 1px solid var(--karaage-color-border);
    }

    .karaage-fse-header .wp-block-navigation-item__content {
        width: 100%;
        padding: var(--karaage-space-1) var(--karaage-space-2) !important;
        white-space: nowrap;
    }

    .karaage-fse-header .fse-mobile-link {
        display: flex;
    }

    .karaage-fse-header .fse-mobile-cta a {
        color: var(--karaage-color-white);
        margin-top: var(--karaage-space-2);
        text-align: center;
        justify-content: center;
        background: var(--karaage-color-accent);
        color: var(--karaage-color-white);
        border-radius: 5px;
    }
}

@media (max-width: 768px) {
    .search_keyword .wp-block-search__button {
        width: 7rem;
    }
}

/* Home hero: image and an editable search guide, built with standard blocks. */
#sec_vis.hero-split {
    max-width: var(--karaage-container-width);
    margin-inline: auto;
    padding: var(--karaage-space-2) var(--karaage-space-2) var(--karaage-space-3);
    text-align: left;
}

.hero-split .hero-layout {
    display: grid;
    grid-template-columns: minmax(0, min(883.2px, calc((100vw - 88px) * .6))) minmax(0, 1fr);
    gap: var(--karaage-space-2);
    max-width: 1280px;
    margin: var(--karaage-space-0) auto;
    align-items: stretch;
}

.hero-split .hero-photo {
    min-width: 0;
    margin: var(--karaage-space-0);
    overflow: hidden;
    border-radius: 20px;
}

.hero-split .hero-photo img {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 520px;
    object-fit: cover;
    object-position: center;
}

.hero-split .hero-guide {
    display: flex;
    flex-direction: column;
    gap: var(--karaage-space-2);
    min-width: 0;
    margin: var(--karaage-space-0);
}

#sec_vis.hero-split h1.hero-title {
    margin: var(--karaage-space-0);
    color: var(--karaage-color-black);
    font-size: 26px;
    font-weight: 700;
    line-height: 1.5;
    letter-spacing: .06em;
    font-feature-settings: "palt";
}

.hero-split .hero-area {
    width: 100%;
    margin: var(--karaage-space-0);
    padding: var(--karaage-space-0);
    border: 1px solid var(--karaage-color-primary);
    border-radius: 10px;
    background: var(--karaage-color-primary-alpha-10);
}

.hero-split .hero-area>summary {
    padding: var(--karaage-space-1) var(--karaage-space-1);
    font-size: 16px;
    font-weight: 700;
    cursor: pointer;
}

.hero-split .hero-area .native-area-tree {
    max-height: 220px;
    overflow-y: auto;
    margin: var(--karaage-space-0);
    padding: var(--karaage-space-0) var(--karaage-space-2) var(--karaage-space-1) var(--karaage-space-3);
}

.hero-split .hero-keyword {
    margin: var(--karaage-space-0);
}

:is(.hero-split .hero-keyword, .sidebar-search) .wp-block-search {
    max-width: none;
    margin: var(--karaage-space-0);
}

.hero-split .wp-block-search__label {
    display: block;
    margin-bottom: var(--karaage-space-1);
    font-size: 16px;
    font-weight: 700;
}

:is(.hero-split .search_keyword, .sidebar-search) .wp-block-search__input {
    width: 100%;
    padding: var(--karaage-space-1);
    border: 1px solid var(--karaage-color-border);
    border-right: 0;
    font-size: 16px;
}

:is(.hero-split .search_keyword, .sidebar-search) .wp-block-search__button {
    width: auto;
    min-width: 72px;
    padding: var(--karaage-space-1) var(--karaage-space-1);
    background: var(--karaage-color-primary);
    color: var(--karaage-color-black);
    font-size: 16px;
    font-weight: 700;
}

:is(.hero-split .hero-stats, .sidebar-search .sidebar-stats) {
    margin: var(--karaage-space-0);
}

:is(.hero-split .hero-stats, .sidebar-search .sidebar-stats) .native-stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--karaage-space-1);
    margin: var(--karaage-space-0);
}

:is(.hero-split .hero-stats, .sidebar-search .sidebar-stats) .native-stat {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: var(--karaage-space-1);
    min-width: 0;
    padding: var(--karaage-space-1) var(--karaage-space-1);
    background: var(--karaage-color-surface);
    border-radius: 10px;
    text-align: center;
}

:is(.hero-split .hero-stats, .sidebar-search .sidebar-stats) .native-stat p {
    font-size: 16px;
    line-height: 1.5;
    white-space: nowrap;
}

:is(.hero-split .hero-stats, .sidebar-search .sidebar-stats) .native-stat a {
    color: var(--karaage-color-black);
    text-decoration: none;
}

:is(.hero-split .hero-stats, .sidebar-search .sidebar-stats) .native-stat a:hover {
    text-decoration: underline;
}

:is(.hero-split .hero-stats, .sidebar-search .sidebar-stats) .wp-block-query {
    margin: var(--karaage-space-0);
}

:is(.hero-split .hero-stats, .sidebar-search .sidebar-stats) .wp-block-query-total {
    color: var(--karaage-color-warm-text);
    font-size: 28px;
    font-weight: 700;
    line-height: 1.3;
}

.hero-split .hero-banners {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--karaage-space-1);
    margin: auto var(--karaage-space-0) var(--karaage-space-0);
}

.hero-split .hero-banners .wp-block-image {
    min-width: 0;
    margin: var(--karaage-space-0);
}

.hero-split .hero-banners a {
    display: block;
    overflow: hidden;
    border-radius: 10px;
    transition: opacity .2s;
}

.hero-split .hero-banners a:hover {
    opacity: .8;
}

.hero-split .hero-banners img {
    display: block;
    width: 100%;
    height: auto;
}

@media (min-width: 1600px) {
    .hero-split .hero-guide {
        padding: var(--karaage-space-0);
        gap: var(--karaage-space-2);
    }

    .hero-split .hero-photo img {
        min-height: 580px;
    }
}

@media (max-width: 1100px) {
    #sec_vis.hero-split {
        padding: var(--karaage-space-2) var(--karaage-space-2) var(--karaage-space-3);
    }

    .hero-split .hero-layout {
        grid-template-columns: minmax(0, 1.1fr) minmax(360px, 1fr);
        gap: var(--karaage-space-2);
    }

    .hero-split .hero-guide {
        padding: var(--karaage-space-2);
        gap: var(--karaage-space-1);
    }
}

@media (max-width: 800px) {
    #sec_vis.hero-split {
        padding: var(--karaage-space-1) var(--karaage-space-1) var(--karaage-space-2);
    }

    .hero-split .hero-layout {
        grid-template-columns: minmax(0, 1fr);
        gap: var(--karaage-space-1);
    }

    .hero-split .hero-photo img {
        height: auto;
        min-height: 0;
        aspect-ratio: 3 / 2;
    }

    .hero-split .hero-photo,
    .hero-split .hero-guide {
        border-radius: 14px;
    }

    .hero-split .hero-guide {
        padding: var(--karaage-space-2) var(--karaage-space-1);
    }

    #sec_vis.hero-split h1.hero-title {
        font-size: 24px;
    }
}
