:root {
    --color-bg: #FAFAF9;
    /* Warm white/stone */
    --color-text: #333333;
    --color-text-light: #666666;

    /* New Palette: Logo Green */
    --color-primary: #1F2937;
    /* Deep Charcoal/Navy */
    --color-accent: #4A6C5C;
    /* Muted Logo Green (Calm, Confident) */
    --color-accent-soft: #D3DCD8;
    /* Soft Green Tint for backgrounds */
    --color-light-accent: #E5E0D8;
    /* Soft beige for borders (kept for warmth) */

    /* Typography v15 Fix */
    /* Typography v15 Fix */
    --font-heading: "Shippori Mincho B1", serif;
    --font-body: "Zen Kaku Gothic New", sans-serif;
    --font-menu: "Zen Kaku Gothic New", sans-serif;
    --font-article: "Zen Kaku Gothic New", sans-serif;
    /* Update per request */

    --spacing-section: 140px;
    --spacing-container: 2rem;

    --width-container: 1000px;
}

body {
    background-color: var(--color-bg);
    color: var(--color-text);
    font-family: var(--font-body);
    /* Zen Kaku Gothic New */
    font-weight: 400;
    line-height: 1.8;
    letter-spacing: 0.05em;
    overflow-x: hidden;
    margin: 0;
}

/* Exclude Article Body (Use Mincho) */
.entry-content,
.entry-content p {
    font-family: var(--font-article);
}

/* Smooth Scroll */
html {
    scroll-behavior: smooth;
}

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: var(--font-heading);
    font-weight: 500;
    line-height: 1.4;
    margin-bottom: 1.5rem;
    color: var(--color-primary);
}

a {
    color: var(--color-primary);
    text-decoration: none;
    transition: opacity 0.3s ease, color 0.3s ease;
}

/* Base Hover Fallback */
a:hover {
    color: var(--color-accent);
}

/* Utilities */
.container {
    max-width: var(--width-container);
    margin: 0 auto;
    padding: 0 var(--spacing-container);
}

.text-center {
    text-align: center;
}

/* --- GLOBAL BUTTONS (Eterna Style) --- */
.wp-block-button__link,
.btn-eterna,
button,
input[type="submit"],
input[type="button"],
input[type="reset"] {
    display: inline-block;
    background-color: var(--color-accent) !important;
    color: #fff !important;
    padding: 0.8rem 2rem;
    font-family: var(--font-menu);
    font-size: 0.95rem;
    font-weight: 500;
    text-align: center;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.3s ease;
    text-decoration: none;
    letter-spacing: 0.05em;
    line-height: normal;
}

.wp-block-button__link:hover,
.btn-eterna:hover,
button:hover,
input[type="submit"]:hover {
    background-color: var(--color-primary) !important; /* Shifts to Charcoal on hover */
    color: #fff !important;
    transform: translateY(-2px);
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
    opacity: 1 !important;
}

.wp-block-button__link:active,
.btn-eterna:active,
button:active {
    transform: translateY(0);
}

/* Specific adjustments for block buttons to override WP defaults */
.wp-block-button {
    margin-bottom: 1.5rem;
}

.screen-reader-text {
    border: 0;
    clip: rect(1px, 1px, 1px, 1px);
    clip-path: inset(50%);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
    word-wrap: normal !important;
}

/* Utilities: Display Control */
.u-desktop {
    display: block;
}

.u-mobile {
    display: none;
}

@media (max-width: 768px) {
    .u-desktop {
        display: none;
    }

    .u-mobile {
        display: block;
    }
}

/* Header */
.site-header {
    background-color: transparent;
    /* Default transparent for Hero start */
    padding: 1.5rem 0;
    /* Initial spacious */
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    /* Full width */
    max-width: 100%;
    /* Override container constraint for bar itself, inner can be limited */
    margin: 0 auto;
    /* Fixed Positioning for Tracking */
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1001;
    transition: background-color 0.4s ease, padding 0.4s ease, box-shadow 0.4s ease;
    padding-left: 2rem;
    padding-right: 2rem;
    box-sizing: border-box;
}

/* Header Inner Constraints (Logo/Nav alignment) */
/* We rely on Flexbox structure. Logo Left, Nav Right. */

/* --- Adaptive Header States (v19/v23) --- */

/* 1. Hero Mode (Top) */
.site-header.header-hero {
    background-color: transparent;
    box-shadow: none;
    padding: 2rem 2rem;
}

/* In Hero Mode: Hide Text Menu, Show Hamburger */
/* In Hero Mode: Hide Text Menu, Show Hamburger (PC ONLY) */
@media (min-width: 769px) {
    .site-header.header-hero .main-navigation ul {
        display: none !important;
        /* Hide Horizontal Menu on PC */
    }
}

/* Removed Redundant Header Toggle Style */

/* 2. Scrolled Mode (Sticky) */
.site-header.header-scrolled {
    background-color: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(10px);
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
    padding: 1rem 2rem;
}

/* Scrolled Mode: Show Hamburger (PC), Hide Horizontal Menu (PC) */
@media (min-width: 769px) {
/* Removed Redundant Header Toggle Style */

    .site-header.header-scrolled .main-navigation ul {
        display: none !important;
    }
}

/* --- Scroll Down Icon (White + Shadow) --- */
.scroll-down {
    position: absolute;
    bottom: 2rem;
    left: 50%;
    transform: translateX(-50%);
    z-index: 10;
    color: #fff;
    /* White */
    text-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
    /* Shadow */
    text-align: center;
    font-family: var(--font-menu);
    font-size: 0.8rem;
    letter-spacing: 0.1em;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    animation: fadeIn 3s ease 1s forwards;
    opacity: 0;
}

.scroll-line {
    width: 1px;
    height: 60px;
    background: #fff;
    /* White */
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
    /* Shadow for line */
    position: relative;
    overflow: hidden;
}

.scroll-line::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #333;
    /* Darker glint for contrast or just opacity? */
    background: rgba(0, 0, 0, 0.5);
    /* Shadow trail */
    animation: scrollLine 2s cubic-bezier(0.77, 0, 0.175, 1) infinite;
}

@keyframes scrollLine {
    0% {
        transform: translateY(-100%);
    }

    100% {
        transform: translateY(100%);
    }
}

@keyframes fadeIn {
    to {
        opacity: 1;
    }
}

/* --- SP Header Layout (v23) --- */
@media (max-width: 768px) {
    .site-header {
        padding: 1.5rem 1rem;
        /* More space? Or controlled space */
        justify-content: center;
        /* Center everything */
        position: fixed;
        /* Ensure fixed on mobile too */
    }

/* Removed scattered Branding Styles - Consolidated at bottom of Header section */

    /* Removed Redundant SP Toggle Style */
}

.site-title {
    margin: 0;
    font-family: var(--font-heading);
    font-size: 1.5rem;
    letter-spacing: 0.1em;
}

.main-navigation ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    gap: 2rem;
}

    /* Toggle handled via unified wrapper */

/* --- CUSTOMIZER HOVER STYLES (Desktop) --- */
@media (min-width: 769px) {
    .main-navigation ul li a {
        position: relative;
        padding: 0.5rem 0.2rem;
        transition: all 0.3s ease;
    }

    /* Style 1: Underline (Default) */
    .hover-style-underline .main-navigation ul li a::after {
        content: '';
        position: absolute;
        bottom: 0;
        left: 0;
        width: 0%;
        height: 1px;
        background-color: var(--color-accent);
        transition: width 0.3s ease-out;
    }

    .hover-style-underline .main-navigation ul li a:hover {
        opacity: 0.8;
        color: var(--color-primary);
    }

    .hover-style-underline .main-navigation ul li a:hover::after {
        width: 100%;
    }

    /* Style 2: Blur / Glow */
    .hover-style-blur .main-navigation ul li a {
        z-index: 1;
    }

    .hover-style-blur .main-navigation ul li a::before {
        content: '';
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%) scale(0.8);
        width: 120%;
        height: 120%;
        background: var(--color-accent-soft);
        border-radius: 8px;
        filter: blur(4px);
        opacity: 0;
        transition: all 0.4s ease;
        z-index: -1;
    }

    .hover-style-blur .main-navigation ul li a:hover {
        color: var(--color-primary);
    }

    .hover-style-blur .main-navigation ul li a:hover::before {
        opacity: 1;
        filter: blur(8px);
        transform: translate(-50%, -50%) scale(1);
    }

    /* Style 3: Simple Fade */
    .hover-style-fade .main-navigation ul li a:hover {
        opacity: 0.5;
        color: var(--color-accent);
    }

    /* Style 4: Dot Indicator (New) */
    .hover-style-dot .main-navigation ul li a::after {
        content: '';
        position: absolute;
        bottom: -5px;
        left: 50%;
        width: 4px;
        height: 4px;
        background-color: var(--color-accent);
        border-radius: 50%;
        transform: translateX(-50%) translateY(5px);
        opacity: 0;
        transition: all 0.25s ease-out;
    }

    .hover-style-dot .main-navigation ul li a:hover {
        color: var(--color-primary);
        /* Keep text dark */
    }

    .hover-style-dot .main-navigation ul li a:hover::after {
        opacity: 1;
        transform: translateX(-50%) translateY(0);
    }
}


/* Footer */
.site-footer {
    background-color: #fff;
    padding: 4rem 0;
    margin-top: var(--spacing-section);
    border-top: 1px solid #eee;
    text-align: center;
}

.footer-navigation ul {
    list-style: none;
    padding: 0;
    margin: 0 0 2rem 0;
    display: flex;
    justify-content: center;
    gap: 1.5rem;
}

input[type="submit"] {
    width: 100%;
    padding: 1.2rem;
}

/* --- Navigation Font Fix (v24) --- */
.main-navigation a,
.footer-navigation a {
    font-family: var(--font-menu);
    font-weight: 500;
}

/* Removed Duplicate Hamburger Styles (v31) to favor Global Refinement (v38) */

/* Full Width Hero (v31 Clean) */
.hero-section {
    height: 100vh;
    min-height: 600px;
    position: relative;
    width: 100%;
    /* Now works effectively as it is root level */
    overflow: hidden;
}

/* --- Layout Stability --- */
body {
    background: var(--color-bg);
    margin: 0;
    /* v7: Global Serif Font */
    font-family: var(--font-body);
    color: var(--color-text);
}

/* v24: Ensure Article Body uses Zen Kaku (Remove system font override) */
.post-template-default .entry-content p,
.post-template-default .entry-content li,
.entry-content,
.entry-content p,
.entry-content li {
    font-family: var(--font-article);
}

/* --- Typography Fix (v6/v7) --- */
h1,
h2,
h3,
.mv-title {
    text-wrap: balance;
    word-wrap: break-word;
    line-height: 1.5;
}

/* v27: MV Sub Copy Zen Kaku */
.mv-desc {
    font-family: var(--font-article);
    text-wrap: balance;
    word-wrap: break-word;
    line-height: 1.8;
}

/* v28: Layout Fix - Site Main Padding */
/* Apply to ALL pages by default to clear the Fixed Header */
.site-main {
    padding-top: 100px;
    min-height: 60vh;
    /* Ensure footer isn't too high on empty pages */
}

/* Exception: Front Page (Hero Section handles the top) */
body.home .site-main,
body.front-page .site-main {
    padding-top: 0 !important;
}

/* Adjust Subpage Padding to clear Header (90px) + Gap */
body:not(.home):not(.front-page) .site-main {
    padding-top: 140px !important;
}

/* Double Check: If specific Templates need it removed, add here */
/* .page-template-landing .site-main { padding-top: 0; } */

/* --- Full Width Content (v7) --- */
.full-width-content {
    width: 100%;
    max-width: 100%;
    /* Keep blocks centered internally but allow background extension */
}

/* --- Page Loader (v7 Fix) --- */
#page-loader {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #fff;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    /* Transition 0.8s as requested */
    transition: opacity 0.8s ease, visibility 0.8s ease;

    /* SAFETY FAILSAFE: Force hide after 5 seconds even if JS fails */
    animation: forceHide 0s linear 5s forwards;
    pointer-events: all;
    /* Initial state */
}

/* While loading, keep it visible (overrides forceHide if we wanted, but forceHide is a safety net) 
   Actually forceHide is "fill-mode: forwards", so we need JS to add class to hide it EARLY. 
   If JS works, it adds .loaded -> opacity 0 immediately. 
   If JS fails, forceHide kicks in at 5s. 
*/

#page-loader.loaded {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}

@keyframes forceHide {
    to {
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        z-index: -1;
    }
}

.loader-spinner {
    width: 40px;
    height: 40px;
    border: 3px solid #f3f3f3;
    border-top: 3px solid var(--color-primary);
    border-radius: 50%;
    animation: spin 0.8s linear infinite;
    /* Spinner speed */
}

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

/* Neutralized early global toggle animation */

.menu-toggle.is-active .bar:nth-child(2) {
    opacity: 0;
    transform: translateX(-10px);
    /* Slight slide out */
}

.menu-toggle.is-active .bar:nth-child(3) {
    transform: translateY(-10px) rotate(-45deg);
}

/* Ensure bars are white when menu serves as overlay (if bg is dark) */
.main-navigation ul.is-open~.menu-toggle .bar,
/* Sibling selector might not work if structure differs */
.menu-toggle.is-active .bar {
    background-color: #fff;
    /* White on dark overlay */
}

/* --- Scroll Animation (v7) --- */
.scroll-init {
    opacity: 0;
    transform: translateY(30px);
    transition: all 0.8s cubic-bezier(0.25, 1, 0.5, 1);
}

.scroll-init.in-view {
    opacity: 1;
    transform: translateY(0);
}

/* --- Store Archive UI (v29) --- */
.store-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 2rem;
    padding-bottom: 4rem;
}

.store-card {
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05);
    overflow: hidden;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    /* Font Base: Zen Kaku */
    font-family: var(--font-article);
}

.store-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}

.store-card .store-image {
    width: 100%;
    aspect-ratio: 16/9;
    overflow: hidden;
}

.store-card .store-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s ease;
}

.store-card:hover .store-image img {
    transform: scale(1.05);
}

.store-info {
    padding: 1.5rem;
}

.store-title {
    /* Title: Mincho */
    font-family: var(--font-heading);
    font-size: 1.25rem;
    margin-bottom: 0.75rem;
    color: var(--color-primary);
}

.store-address {
    font-size: 0.9rem;
    color: var(--color-text-light);
    line-height: 1.6;
}

/* --- Custom Button (v8 Eterna Button) --- */
/* --- Button Styles (Unified) --- */
.btn,
.btn-cta {
    display: inline-block;
    padding: 1rem 3rem;
    background-color: var(--color-primary);
    color: #fff;
    text-decoration: none;
    transition: all 0.3s ease;
    border: 1px solid var(--color-primary);
    font-family: var(--font-heading);
    letter-spacing: 0.1em;
}

.btn:hover,
.btn-cta:hover {
    background-color: #fff !important;
    color: var(--color-primary) !important;
    border: 1px solid var(--color-primary) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.btn-eterna,
.wp-block-button__link.btn-eterna,
.is-style-eterna-rounded,
.is-style-eterna-square,
.is-style-eterna-small,
.is-style-eterna-wide {
    display: inline-block;
    padding: 1rem 3rem;
    background: var(--color-text);
    /* Dark */
    color: #fff;
    text-decoration: none;
    font-size: 0.95rem;
    letter-spacing: 0.1em;
    transition: all 0.3s ease;
    border: 1px solid var(--color-text);
    border-radius: 2px;
    /* Rectangular shape matching inputs */
    /* Default Square-ish or slight? Let's go Clean */
}

/* Shape Variations */
.is-style-eterna-rounded,
.wp-block-button.is-style-eterna-rounded .wp-block-button__link {
    border-radius: 2px;
    /* Override "Rounded" style to enforce rectangle globally */
}

.is-style-eterna-square,
.wp-block-button.is-style-eterna-square .wp-block-button__link {
    border-radius: 0px;
}

/* Size Variations */
.is-style-eterna-small,
.wp-block-button.is-style-eterna-small .wp-block-button__link {
    padding: 0.6rem 2rem;
    font-size: 0.85rem;
}

.is-style-eterna-wide,
.wp-block-button.is-style-eterna-wide .wp-block-button__link {
    padding: 1.2rem 5rem;
    font-size: 1.1rem;
    /* Native Width block setting can also override this */
}

/* --- GLOBAL BUTTON RESET (v39 Force Square) --- */
.wp-block-button__link {
    border-radius: 2px !important;
    /* Force Rectangle globally */
    transition: all 0.3s ease;
}

.wp-block-button__link:hover {
    opacity: 0.8 !important;
    transform: translateY(-3px);
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
}

/* Hover Animation for Eterna Classes */
/* Unified Hover for Block Buttons */
.btn-eterna:hover,
.wp-block-button__link.btn-eterna:hover,
.is-style-eterna-rounded:hover,
.is-style-eterna-square:hover,
.is-style-eterna-small:hover,
.is-style-eterna-wide:hover,
.wp-block-button__link:hover {
    background-color: #fff !important;
    color: var(--color-primary) !important;
    border: 1px solid var(--color-primary) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    opacity: 1 !important;
}

/* --- Main Visual (Slideshow) --- */
.hero-section {
    position: relative;
    width: 100%;
    min-height: 60vh;
    overflow: hidden;
    margin-bottom: var(--spacing-section);
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #333;
}

/* PC Height */
@media (min-width: 769px) {
    .hero-section {
        min-height: 600px;
        aspect-ratio: 16/9;
    }
}

/* SP Height */
@media (max-width: 768px) {
    .hero-section {
        height: 85vh;
        min-height: 85vh;
    }
}

.hero-slider,
.hero-slide,
.hero-media {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.hero-slider {
    z-index: 0;
}

.hero-slide {
    opacity: 0;
    transition: opacity 1.5s ease-in-out;
    z-index: 1;
}

.hero-slide.active {
    opacity: 1;
    z-index: 2;
}

.hero-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* Sub-menu Styling (v22 Enhanced) */
.main-navigation ul ul {
    position: absolute;
    top: 100%;
    left: 0;
    min-width: 200px;
    background: #fff;
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.05);
    opacity: 0;
    visibility: hidden;
    transform: translateY(10px);
    transition: all 0.3s ease;
    z-index: 999;
    padding: 0;
    /* Clean Frame */
    border-radius: 4px;
    /* Slight rounded corners */
    overflow: hidden;
    /* Ensure fill clips correctly */
}

/* Sub-menu Item Links (v30 Stylish Fill) */
.main-navigation ul ul li a {
    display: block;
    padding: 12px 24px;
    margin: 0;
    font-size: 0.9rem;
    color: var(--color-text);
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
    background: transparent;
    border-bottom: 1px solid rgba(0, 0, 0, 0.03);
}

.main-navigation ul ul li:last-child a {
    border-bottom: none;
}

/* Hover Effect: Full Block Fill + Shift */
.main-navigation ul ul li a:hover {
    background-color: var(--color-primary);
    /* Dark Navy */
    color: #fff !important;
    padding-left: 30px;
    /* Stylish Slide */
}

/* Disable Parent Hover Styles if they bleed in */
.main-navigation ul ul li a::after,
.main-navigation ul ul li a::before {
    display: none !important;
    content: none !important;
}

.main-navigation ul li:hover>ul {
    opacity: 1;
    transform: translateY(0);
    visibility: visible;
}

.hero-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.1);
    z-index: 10;
    pointer-events: none;
}

.hero-content.rich-text {
    position: relative;
    z-index: 20;
    width: 100%;
    max-width: 900px;
    padding: 2rem;
    text-align: center;
    background: transparent;
}

.mv-title,
.mv-desc {
    color: #fff;
    text-shadow: 0 4px 12px rgba(0, 0, 0, 0.5), 0 2px 4px rgba(0, 0, 0, 0.6);
    /* v7 Fix: Reduced Line Height */
    line-height: 1.4;
}

.mv-title {
    font-size: 2.5rem;
    font-weight: 700;
    margin-bottom: 1rem;
    /* v7 Fix: Tightened */
    letter-spacing: 0.1em;
}

.mv-desc {
    font-size: 1.1rem;
    font-weight: 500;
    margin-top: 1rem;
}

/* --- Block Styles --- */
.wp-block-media-text {
    margin-bottom: 8rem;
    align-items: center;
}

.wp-block-media-text__content {
    padding: 3rem !important;
}

.wp-block-media-text h2 {
    font-size: 2rem;
    margin-bottom: 1.5rem;
}

.wp-block-media-text p {
    font-size: 1rem;
    color: var(--color-text-light);
    line-height: 2;
}

@media (max-width: 768px) {
    .wp-block-media-text {
        grid-template-columns: 1fr !important;
        margin-bottom: 4rem;
    }

    .wp-block-media-text__content {
        padding: 1.5rem !important;
    }

    .mv-title {
        font-size: 1.8rem;
    }
}

/* --- Menu Logic (v7 Animation) --- */

@keyframes fadeInUpMenu {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* PC */
@media (min-width: 769px) {
    #site-navigation .menu-item {
        position: relative;
    }

    #site-navigation .sub-menu {
        display: none;
        position: absolute;
        top: 100%;
        left: 50%;
        transform: translateX(-50%);
        background: #fff;
        min-width: 220px;
        box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
        /* v7: Simpler shadow */
        z-index: 1000;
        padding: 0.8rem 0;
        /* v7: More spacing */
        border-radius: 2px;
        /* v7: Sharpness for Mincho */
        opacity: 0;
        visibility: hidden;
        margin-top: 10px;
        transition: opacity 0.3s ease, visibility 0.3s ease, margin-top 0.3s ease;
    }

    #site-navigation .sub-menu::before {
        content: '';
        position: absolute;
        top: -15px;
        left: 0;
        width: 100%;
        height: 15px;
        background: transparent;
    }

    #site-navigation .menu-item-has-children:hover>.sub-menu,
    #site-navigation .menu-item-has-children:focus-within>.sub-menu {
        display: block;
        opacity: 1;
        visibility: visible;
        margin-top: 15px;
    }

    /* v7: Submenu Item Staggered Animation */
    #site-navigation .menu-item-has-children:hover>.sub-menu li {
        animation: fadeInUpMenu 0.4s ease forwards;
        opacity: 0;
        /* Start hidden */
    }

    #site-navigation .sub-menu li:nth-child(1) {
        animation-delay: 0.05s;
    }

    #site-navigation .sub-menu li:nth-child(2) {
        animation-delay: 0.1s;
    }

    #site-navigation .sub-menu li:nth-child(3) {
        animation-delay: 0.15s;
    }

    #site-navigation .sub-menu li:nth-child(4) {
        animation-delay: 0.2s;
    }

    #site-navigation .sub-menu li:nth-child(5) {
        animation-delay: 0.25s;
    }

    #site-navigation .sub-menu li a {
        padding: 0.8rem 1.5rem;
        color: var(--color-text);
        font-size: 0.9rem;
        display: block;
        text-align: center;
    }

    #site-navigation .sub-menu li a:hover {
        background: #fafafa;
        color: var(--color-primary);
    }
}

/* SP */
@media (max-width: 768px) {
    #site-navigation .sub-menu {
        display: block;
        position: static;
        padding-left: 20px;
        margin-left: 10px;
        border-left: 1px solid #ddd;
        opacity: 1;
        visibility: visible;
        margin-top: 10px;
        margin-bottom: 10px;
        transform: none;
        left: auto;
    }
}

.copyright {
    font-size: 0.8rem;
    color: var(--color-text-light);
}

/* Front Page Sections */
.hero-section {
    position: relative;
    height: 80vh;
    min-height: 500px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    margin-bottom: var(--spacing-section);
}

/* Slideshow Container */
.hero-slider {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
}

/* Individual Slide (Soft Fade) */
.hero-slide {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    transition: opacity 2.5s ease-in-out;
    /* Super Soft Loop */
    z-index: 1;
}

.hero-slide.active {
    opacity: 1;
    z-index: 2;
}

.hero-media {
    width: 100%;
    height: 100%;
}

.hero-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Overlay */
.hero-overlay {
    position: absolute;

    .hero-overlay {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: rgba(255, 255, 255, 0.3);
    }

    .hero-content {
        position: relative;
        text-align: center;
        background: rgba(255, 255, 255, 0.85);
        padding: 3rem 4rem;
        max-width: 600px;
    }

    .hero-content h1 {
        font-size: 1.8rem;
        margin-bottom: 2rem;
        white-space: pre-wrap;
    }

    .hero-content p {
        font-size: 0.95rem;
        color: var(--color-text-light);
        white-space: pre-wrap;
        margin: 0;
    }

    .fp-section {
        margin-bottom: var(--spacing-section);
    }

    .fp-section-inner {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 4rem;
        align-items: center;
    }

    .fp-section.reverse .fp-section-inner {
        direction: rtl;
    }

    .fp-section.reverse .fp-section-inner>* {
        direction: ltr;
    }

    .fp-text {
        padding: 1rem;
    }

    .fp-text h2 {
        font-size: 1.5rem;
        margin-bottom: 2rem;
    }

    .fp-text p {
        white-space: pre-wrap;
        margin-bottom: 2rem;
    }

    .fp-image img {
        width: 100%;
        height: auto;
        display: block;
        box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
    }

    /* Button & CTA with Motion */
    .btn-cta {
        display: inline-flex;
        justify-content: center;
        padding: 1rem 3.5rem;
        border: 1px solid var(--color-primary);
        color: var(--color-primary);
        margin-top: 1.5rem;
        font-family: var(--font-heading);
        letter-spacing: 0.1em;
        background-color: transparent;
        transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease;
        position: relative;
        overflow: hidden;
    }

    .btn-cta:hover {
        background-color: var(--color-accent-soft);
        /* Tint with new soft green */
        color: var(--color-primary);
        border-color: var(--color-primary);
    }

    .read-more a,
    .back-link a,
    .btn-cta {
        display: inline-flex;
        align-items: center;
        gap: 0.5rem;
    }

    .read-more a:hover,
    .back-link a:hover,
    .btn-cta:hover {
        gap: 0.75rem;
        padding-right: 3.2rem;
    }


    /* Scroll Reveal Classes */
    .reveal-item {
        opacity: 0;
        transform: translateY(20px);
        transition: opacity 0.8s ease-out, transform 0.8s ease-out;
    }

    .reveal-item.is-visible {
        opacity: 1;
        transform: translateY(0);
    }

    /* Store Cards */
    .store-grid {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
        gap: 2rem;
        padding-bottom: 4rem;
    }

    .store-card {
        border: 1px solid #eee;
        background: #fff;
        transition: transform 0.3s ease;
    }

    .store-card:hover {
        transform: translateY(-5px);
        box-shadow: 0 10px 20px rgba(0, 0, 0, 0.05);
    }


    /* --- MOBILE / RESPONSIVE FIXES --- */
    @media (max-width: 768px) {
        .site-header {
            flex-direction: row;
            justify-content: center;
            /* Center content */
            padding: 1.5rem;
            min-height: 80px;
            /* Preserve height since children are absolute/fixed */
        }

        /* Center Logo on SP */
        .site-branding {
            position: absolute;
            left: 50%;
            transform: translateX(-50%);
            top: 20px;
            /* Align with Hamburger which is top:20px/25px */
            margin: 0;
            z-index: 1003;
            width: auto;
            max-width: 60%;
            /* Prevent overlap with burger */
        }

        /* Force Hamburger Visibility */
        .main-navigation button.menu-toggle {
            display: flex !important;
            /* Safety Force */
            flex-direction: column;
            justify-content: space-between;
            background: transparent;
            border: none;
            cursor: pointer;
            padding: 0;
            width: 30px;
            height: 22px;
            position: relative;
            z-index: 2000;
        }

        /* Mobile Menu Overlay - Force Hide/Show */
        /* ... (keeping map logic if needed, but we are replacing lines 1332-1351 mainly) */

        /* NOTE: Hamburger animation moved to Global Scope (below) */

        /* Layout Stack */
        .fp-section-inner {
            grid-template-columns: 1fr;
            gap: 2rem;
        }

        .fp-section.reverse .fp-section-inner {
            direction: ltr;
            /* Reset direction on mobile */
        }
    }

    .hero-content {
        width: 90%;
        padding: 2rem;
    }

    .hero-section {
        height: 60vh;
    }
}


/* --- RICH FORMS (Contact / Recruit) --- */
.contact-form,
.recruit-form {
    max-width: 700px;
    margin: 0 auto;
    padding: 3rem;
    background-color: #fff;
    border: 1px solid #f0f0f0;
}

.form-row {
    margin-bottom: 2rem;
}

.form-row label {
    display: block;
    margin-bottom: 0.75rem;
    font-weight: 500;
    font-family: var(--font-heading);
    font-size: 0.95rem;
    letter-spacing: 0.05em;
}

/* Full Width Inputs */
.form-row input[type="text"],
.form-row input[type="email"],
.form-row input[type="tel"],
.form-row textarea,
.form-row select {
    width: 100%;
    box-sizing: border-box;
    padding: 1.2rem;
    border: 1px solid #eee;
    border-radius: 4px;
    background: #fafafa;
    font-family: var(--font-body);
    font-size: 1rem;
    transition: all 0.3s ease;
}

.form-row input:focus,
.form-row textarea:focus,
.form-row select:focus {
    outline: none;
    background: #fff;
    border-color: var(--color-accent);
    box-shadow: 0 0 0 3px var(--color-accent-soft);
}

.form-row textarea {
    min-height: 180px;
    resize: vertical;
}

.form-row.checkbox-row {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-top: 1rem;
}

.form-row.checkbox-row label {
    margin-bottom: 0;
    font-weight: 400;
    font-size: 0.9rem;
}

.form-submit {
    text-align: center;
    margin-top: 4rem;
}

input[type="submit"] {
    background-color: var(--color-primary);
    color: #fff;
    border: 1px solid var(--color-primary);
    padding: 1.2rem 5rem;
    font-family: var(--font-heading);
    font-size: 1rem;
    letter-spacing: 0.1em;
    cursor: pointer;
    transition: all 0.3s ease;
    border-radius: 2px;
}

input[type="submit"]:hover {
    background-color: #fff !important;
    color: var(--color-primary) !important;
    border: 1px solid var(--color-primary) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

/* Mobile Form Fixes */
@media (max-width: 768px) {

    .contact-form,
    .recruit-form {
        padding: 1.5rem;
        width: 100%;
        box-sizing: border-box;
        border: none;
        background: transparent;
    }

    input[type="submit"] {
        width: 100%;
        padding: 1.2rem;
    }
}

/* --- PC Specific Fixes (v32 Check) --- */
@media (min-width: 769px) {

    /* Center Logo Absolutely */
    /* Removed scattered Branding Styles - Consolidated at bottom of Header section */
}

/* --- Header & Navigation Refinements (v37 Final) --- */

/* 1. Header Scroll Behavior: Logo/Nav scroll away, Burger stays */
/* 1. Header Scroll Behavior: Logo/Nav scroll away, Burger stays */
.site-header {
    position: fixed !important;
    /* Overrides fixed */
    width: 100%;
    z-index: 1000;

    /* CRITICAL SAFEGUARD: Prevent Stacking Context Trap */
    /* If header has transform, fixed child becomes absolute relative to header */
    transform: none !important;
    filter: none !important;
    perspective: none !important;
    contain: none !important;
}

#site-navigation {
    /* Ensure Nav container doesn't trap fixed button */
    transform: none !important;
    filter: none !important;
    perspective: none !important;
    position: static !important;
    /* Allow child to escape */
}

/* --- GLOBAL HAMBURGER BASE (Neutralized) --- */
.menu-toggle {
    display: block !important;
    width: 40px;
    height: 24px;
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    cursor: pointer;
    z-index: 99999;
}

/* 3. Header Navigation Wrapper (NUCLEAR FINAL STABLE FIX) */
.header-navigation-wrapper {
    position: fixed !important;
    top: 40px; 
    right: 25px; 
    display: flex !important;
    align-items: center !important;
    gap: 20px !important;
    height: 24px !important;
    z-index: 99999;
}

@media (max-width: 768px) {
    .header-navigation-wrapper {
        top: 25px !important;
        right: 20px !important;
        gap: 15px !important;
    }
}

.header-sns-links {
    display: flex !important;
    align-items: center !important;
    gap: 15px !important;
    height: 24px !important; /* Lock height */
}

.header-sns-links a {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 24px !important;
    height: 24px !important;
}

.header-sns-links svg {
    width: 100% !important;
    height: 100% !important;
    background-color: transparent !important;
}

/* Clear all individual positioning on children to prevent flow break */
.header-navigation-wrapper .menu-toggle {
    position: relative !important;
    width: 40px !important;
    height: 24px !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: none !important;
    cursor: pointer;
}

/* Burger Bars: ABSOLUTE Positioning for precision */
.menu-toggle .bar {
    display: block !important;
    width: 30px !important;
    height: 2px !important;
    position: absolute !important;
    left: 5px !important;
    border-radius: 2px;
    transition: all 0.3s ease;
}

.menu-toggle .bar:nth-child(1) { top: 0 !important; }
.menu-toggle .bar:nth-child(2) { top: 11px !important; }
.menu-toggle .bar:nth-child(3) { bottom: 0 !important; }

/* Color States (Handled at Wrapper Level) */
.header-navigation-wrapper .bar { background-color: #333 !important; }
.header-sns-links svg { fill: #333 !important; }

/* 1. Base Green: Only apply when Menu is NOT open */
body:not(.menu-open) .header-scrolled .header-navigation-wrapper .bar,
body:not(.menu-open):not(.home):not(.front-page) .header-navigation-wrapper .bar {
    background-color: #294737 !important;
}
body:not(.menu-open) .header-scrolled .header-sns-links svg,
body:not(.menu-open):not(.home):not(.front-page) .header-sns-links svg {
    fill: #294737 !important;
    background-color: transparent !important;
}

/* 2. Priority White: Hero State OR Menu Open State */
.header-hero .header-navigation-wrapper .bar,
body.menu-open .header-navigation-wrapper .bar,
.menu-toggle.is-active .bar {
    background-color: #ffffff !important;
}
.header-hero .header-sns-links svg,
body.menu-open .header-sns-links svg {
    fill: #ffffff !important;
    background-color: transparent !important;
}

/* Active State (Perfect X) - Forced for PC */
.menu-toggle.is-active .bar:nth-child(1) {
    /* Move to center (11px) and Rotate */
    transform: translateY(11px) rotate(45deg) !important;
}

.menu-toggle.is-active .bar:nth-child(2) {
    opacity: 0 !important;
}

.menu-toggle.is-active .bar:nth-child(3) {
    /* Move to center */
    transform: translateY(-11px) rotate(-45deg) !important;
}

/* --- PC Header Fix (v55 Unified Wrapper) --- */
@media (min-width: 769px) {
    /* 1. Subpage Header Height & Scrolled State */
    body:not(.home):not(.front-page) .site-header,
    .site-header.header-scrolled {
        padding: 0 2rem !important; /* 縦パディングを0にして中央寄せを確実にする */
        background-color: #ffffff !important;
        box-shadow: 0 2px 10px rgba(0,0,0,0.08);
        height: 90px !important; /* 明示的な高さ指定 */
        display: flex !important;
        align-items: center !important;
    }

    /* Removed scattered Branding Styles - Consolidated at bottom of Header section */

    /* 2. Unified Navigation Wrapper Positioning (PC) */
    .header-navigation-wrapper {
        top: 40px !important; /* Keep it consistent */
        transform: none !important;
        right: 40px; 
    }

    /* 3. Logo & Branding Alignment */
    .custom-logo-link img {
        max-height: 50px;
        width: auto;
    }
    .site-header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        min-height: 100px;
    }
}

/* Adjust SP Header alignment */
@media (max-width: 768px) {
    .site-header {
        position: absolute !important;
        padding: 5px 1rem !important;
    }

    /* Removed scattered Branding Styles - Consolidated at bottom of Header section */
}

/* --- HEADER LOGO: ABSOLUTE CENTERING (v65 FINAL) --- */
.site-branding {
    position: absolute !important;
    left: 50% !important;
    top: 50% !important;
    transform: translate(-50%, -50%) !important;
    margin: 0 !important;
    padding: 0 !important;
    z-index: 1003;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* User Request: Move Logo 3px Up (Applied to content itself) */
.custom-logo-link img,
.site-title a {
    transform: translateY(-3px) !important;
    transition: transform 0.3s ease;
}

/* --- GLOBAL MENU OVERLAY (v51 NUCLEAR FIX) --- */
/* Unified logic for both PC and Mobile when menu is open */

/* 1. Reset Base State (Hidden) */
@media (max-width: 768px) {
    #primary-menu {
        display: flex !important;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        position: fixed;
        top: 0;
        left: 0;
        width: 100vw;
        height: 100vh;
        background: rgba(31, 41, 55, 0.98);
        z-index: 2000;
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        transition: opacity 0.3s ease, visibility 0.3s;
        padding: 0 !important;
        /* Perfect Center (Removed 80px bias) */
        margin: 0;
    }
}

/* Scroll Lock when Menu is Open */
body.menu-open {
    overflow: hidden !important;
}

/* Foolproof Background Blur (Target all siblings of header to cover all content areas) */
body.menu-open #page > *:not(.site-header),
body.menu-open .site-branding,
body.menu-open .hero-section,
body.menu-open .site-main,
body.menu-open footer {
    filter: blur(10px) !important;
    transition: filter 0.3s ease;
    pointer-events: none !important;
}

/* 2. Open State (Visible - Both PC and Mobile) */
/* Targeted via ID to win specificity */
#primary-menu.is-open {
    display: flex !important;
    flex-direction: column;
    justify-content: center !important;
    align-items: center !important;
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    background: rgba(41, 71, 55, 0.8) !important; 
    backdrop-filter: blur(15px) !important; /* Keep as fallback for modern support */
    -webkit-backdrop-filter: blur(15px) !important;
    z-index: 2000 !important;

    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
    /* No slide, just fade */
    pointer-events: auto !important;

    padding: 0 !important;
    /* Perfect Center (Removed 80px bias) */
    margin: 0 !important;
}

/* 3. List Item Reset (Centering & Layout) */
#primary-menu.is-open li {
    width: 100% !important;
    max-width: 600px;
    /* Readability constraint */
    display: block !important;
    text-align: center !important;
    margin: 0 auto !important;
    padding: 0 !important;
    border: none !important;
    background: transparent !important;
    /* Fix white box issue */
}

/* 4. Link Styling (Elegant Hover Enabled) */
#primary-menu.is-open li a {
    display: block !important;
    font-size: 1.2rem !important;
    /* Uni-size */
    font-weight: 500 !important;
    color: #fff !important;
    padding: 15px 0 !important;
    text-align: center !important;
    opacity: 1 !important;
    text-decoration: none !important;
    transition: all 0.3s ease !important;
    /* Enable Animation */
}

/* Hover Effect: Elegant Fade & Subtle Scale */
#primary-menu.is-open li a:hover {
    color: #fff !important;
    opacity: 0.7 !important;
    transform: scale(1.05) !important;
    background: transparent !important;
}

/* 5. Hide Submenus (Strict) */
#primary-menu.is-open .sub-menu,
#primary-menu.is-open .children,
#primary-menu .sub-menu {
    display: none !important;
}

/* 6. Fix PC Menu Inline State (When NOT open) */
@media (min-width: 769px) {

    /* Default Inline State */
    #primary-menu {
        display: flex;
        /* Flexrow */
        flex-direction: row;
        position: static;
        width: auto;
        height: auto;
        background: transparent;
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        justify-content: flex-end;
        align-items: center;
        gap: 2rem;
        padding: 0 !important;
        /* Reset Overlay Padding */
    }

    /* Inline Links */
    #primary-menu li a {
        padding: 0;
        font-size: 1rem;
        color: var(--color-text);
        /* Standard color (overridden by header-scrolled rules) */
    }
}

/* 7. Force Hide default WP Containers if any */
.menu-primary-container {
    height: 100%;
    width: 100%;
}

/* --- Main Visual Fixes (v36 Refactor) --- */
/* 1. Parent Config (100svh Fallback) */
.hero-section {
    position: relative;
    width: 100%;
    height: 100vh;
    /* Fallback */
    height: 100svh;
    /* Modern Mobile */
    min-height: 600px;
    display: block;
    /* Reset flex, we use absolute overlay now */
    overflow: hidden;
}

.hero-slider,
.hero-slide {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

/* 2. Full Screen Overlay (The Fix) */
.hero-content {
    position: absolute;
    inset: 0;
    /* Top/Left/Right/Bottom 0 */
    width: 100% !important;
    /* Force full override */
    height: 100%;

    display: flex;
    align-items: center;
    justify-content: center;

    background: rgba(0, 0, 0, 0.15);
    /* Restored Subtle Overlay */
    z-index: 20;
    pointer-events: none;
    /* Pass clicks through overlay */
}

/* 3. Content Box */
/* 3. Content Box (Reset: No box background) */
.hero-text-wrap {
    padding: 2rem;
    background: transparent !important;
    backdrop-filter: none !important;
    border-radius: 0;
    box-shadow: none !important;
    pointer-events: auto;
    text-align: center;
    /* Ensure centered */
}

/* Ensure typography inherits white color */
.hero-content h2,
.hero-content p {
    color: #fff;
    text-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
}

/* --- SWELL-like Button Styles --- */

/* Base Reset for our Custom Colors */
.wp-block-button__link {
    transition: all 0.3s ease;
    /* Respect Customizer Gradient */
    background-size: 200% auto;
}

.wp-block-button__link:hover {
    opacity: 0.9;
}

/* 1. 3D Style (立体) */
.is-style-eterna-3d .wp-block-button__link {
    box-shadow: 0 4px 0 rgba(0, 0, 0, 0.2);
    transform: translateY(0);
    margin-bottom: 4px;
    /* Reserve space */
}

.is-style-eterna-3d .wp-block-button__link:active {
    transform: translateY(4px);
    box-shadow: none;
}

/* 2. Shiny Style (キラッと) */
.is-style-eterna-shiny .wp-block-button__link {
    position: relative;
    overflow: hidden;
}

.is-style-eterna-shiny .wp-block-button__link::after {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 50%;
    height: 100%;
    background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.5) 50%, rgba(255, 255, 255, 0) 100%);
    transform: skewX(-25deg);
    animation: eterna_shine 3s infinite;
}

@keyframes eterna_shine {
    0% {
        left: -100%;
    }

    20% {
        left: 200%;
    }

    100% {
        left: 200%;
    }
}

/* 3. Outline Style Override (Handles Palette Classes) */
.is-style-outline.has-eterna-red-background-color .wp-block-button__link {
    background: transparent !important;
    border: 2px solid var(--eterna-btn-red) !important;
    color: var(--eterna-btn-red) !important;
}

.is-style-outline.has-eterna-red-background-color .wp-block-button__link:hover {
    background: var(--eterna-btn-red) !important;
    color: #fff !important;
}

.is-style-outline.has-eterna-blue-background-color .wp-block-button__link {
    background: transparent !important;
    border: 2px solid var(--eterna-btn-blue) !important;
    color: var(--eterna-btn-blue) !important;
}

.is-style-outline.has-eterna-blue-background-color .wp-block-button__link:hover {
    background: var(--eterna-btn-blue) !important;
    color: #fff !important;
}

.is-style-outline.has-eterna-green-background-color .wp-block-button__link {
    background: transparent !important;
    border: 2px solid var(--eterna-btn-green) !important;
    color: var(--eterna-btn-green) !important;
}

.is-style-outline.has-eterna-green-background-color .wp-block-button__link:hover {
    background: var(--eterna-btn-green) !important;
    color: #fff !important;
}

/* =========================================
   SWELL-like List Styles
   ========================================= */

/* Common List Reset */
.entry-content ul,
.entry-content ol {
    padding: 0;
    margin: 2em 0;
    list-style: none !important;
}

/* List Item Styles */
.entry-content ul li,
.entry-content ol li {
    position: relative;
    padding: 0.8em 0.5em 0.8em 0;
    /* Vertical spacing */
    border-bottom: 1px dashed #ddd;
    /* Light dotted separation */
    line-height: 1.6;
}

/* Remove border from last item */
.entry-content ul li:last-child,
.entry-content ol li:last-child {
    border-bottom: none;
}

/* --- UL: Check Mark --- */
.entry-content ul li {
    padding-left: 1.8em;
    /* Indent for check */
}

.entry-content ul li::before {
    content: '';
    display: block;
    position: absolute;
    top: 1em;
    left: 0.3em;
    width: 7px;
    height: 12px;
    transform: rotate(45deg);
    border-right: 2px solid var(--color-accent);
    border-bottom: 2px solid var(--color-accent);
}

/* --- OL: Circle Number --- */
.entry-content ol {
    counter-reset: eterna_ol_cnt;
}

.entry-content ol li {
    padding-left: 2.5em;
    /* Indent for number */
}

.entry-content ol li::before {
    content: counter(eterna_ol_cnt);
    counter-increment: eterna_ol_cnt;
    display: block;
    position: absolute;
    top: 0.8em;
    left: 0;
    width: 22px;
    height: 22px;
    line-height: 22px;
    background: var(--color-accent);
    color: #fff;
    text-align: center;
    border-radius: 50%;
    font-size: 12px;
    font-weight: 700;
    font-family: var(--font-body);
}

/* =========================================
   Bug Fixes & Refinements (Auto-Generated)
   ========================================= */

/* 1. Fix Mobile Top Gap (White Band) */
@media (max-width: 768px) {
    .site-main {
        padding-top: 140px !important;
        /* Reverted to 140px as per user request (User felt 84px was too cramped) */
    }

    /* Ensure Header IS fixed on mobile */
    .site-header {
        position: fixed !important;
        top: 0;
        left: 0;
        width: 100%;
    }

    /* Ensure Hero Page doesn't get padding */
    body.home .site-main,
    body.front-page .site-main {
        padding-top: 0 !important;
    }
}

/* Color overrides handled via unified navigation wrapper */

/* 3. H2/H3 Heading Designs (Posts & Pages) */
.entry-content h2 {
    padding: 0.75em 0.5em 0.75em 0.5em;
    /* Top/Bot Left/Right */
    margin-top: 2.5em;
    margin-bottom: 1.5em;
    background-color: transparent;
    border-left: 6px solid var(--color-accent);
    border-bottom: 1px solid var(--color-accent-soft);
    font-size: 1.6rem;
    font-weight: 600;
}

.entry-content h3 {
    padding: 0.5em 0 0.5em 0.8em;
    margin-top: 2em;
    margin-bottom: 1em;
    border-left: 4px solid var(--color-accent);
    font-size: 1.4rem;
    font-weight: 600;
}

/* Mobile Heading Adjustments */
@media (max-width: 768px) {
    .entry-content h2 {
        font-size: 1.4rem;
    }

    .entry-content h3 {
        font-size: 1.2rem;
    }
}

/* 4. Dual Logo Switching */
.logo-colored {
    display: block;
    /* Default for subpages */
}

.logo-white {
    display: none;
}

/* Front Page Hero State: Show White, Hide Colored */
body.home .site-header:not(.header-scrolled) .logo-colored,
body.front-page .site-header:not(.header-scrolled) .logo-colored {
    display: none;
}

body.home .site-header:not(.header-scrolled) .logo-white,
body.front-page .site-header:not(.header-scrolled) .logo-white {
    display: block;
}

/* Scrolled State: Show Colored, Hide White (Consistent with subpages) */
.site-header.header-scrolled .logo-colored {
    display: block;
}

.site-header.header-scrolled .logo-white {
    display: none;
}

/* --- Brand Grid Style (Gallery Block) --- */
.wp-block-gallery.is-style-brand-grid {
    gap: 1rem !important;
    /* Reduced by half (was 2rem) */
}

.wp-block-gallery.is-style-brand-grid .wp-block-image {
    width: calc(25% - 0.75rem) !important;
    /* (100% - 3 gaps * 1rem) / 4 */
    flex-grow: 0 !important;
    margin: 0 !important;
    display: flex;
    align-items: center;
    justify-content: center;
}

.wp-block-gallery.is-style-brand-grid img {
    width: auto !important;
    max-width: 100% !important;
    max-height: 120px;
    /* Increased from 80px */
    object-fit: contain !important;
    filter: grayscale(100%);
    opacity: 0.7;
    transition: all 0.3s ease;
}

.wp-block-gallery.is-style-brand-grid img:hover {
    filter: grayscale(0%);
    opacity: 1;
    transform: scale(1.05);
}

@media (max-width: 768px) {
    .wp-block-gallery.is-style-brand-grid {
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 3rem 1.5rem !important;
        /* Spacious vertical gap */
        justify-content: center;
    }

    .wp-block-gallery.is-style-brand-grid .wp-block-image {
        width: calc(50% - 0.75rem) !important;
        /* (100% - 1 gap * 1.5rem) / 2 */
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .wp-block-gallery.is-style-brand-grid img {
        max-height: 80px;
        /* Slightly smaller on mobile but consistent */
    }
}

/* --- Brand Marquee Style (Auto Scroll) --- */
.wp-block-gallery.is-style-brand-marquee {
    width: 100vw !important;
    position: relative;
    left: 50%;
    right: 50%;
    margin-left: -50vw !important;
    margin-right: -50vw !important;
    margin-bottom: 0 !important;
    padding: 3rem 0;
    overflow: hidden;
    background-color: var(--color-bg);

    /* Layout: Force horizontal flow for direct children (Fallback) */
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center;
}

/* Track: The moving container (ul, div.blocks-gallery-grid, or div.marquee-track) */
.wp-block-gallery.is-style-brand-marquee .blocks-gallery-grid,
.wp-block-gallery.is-style-brand-marquee ul,
.wp-block-gallery.is-style-brand-marquee .marquee-track {
    display: flex !important;
    flex-wrap: nowrap !important;
    width: max-content !important;
    /* Prevent shrinking: Allow track to be as long as needed */
    flex: 0 0 auto !important;
    gap: 6rem !important;
    padding-left: 0 !important;
    margin: 0 !important;
    align-items: center !important;
    will-change: transform;
    animation: marquee 60s linear infinite;
}

/* Items: The individual logo wrappers */
.wp-block-gallery.is-style-brand-marquee .wp-block-image,
.wp-block-gallery.is-style-brand-marquee .marquee-track .wp-block-image {
    flex: 0 0 auto !important;
    display: block !important;
    margin: 0 !important;
    /* Strict Size Enforcement */
    width: 50px !important;
    height: 50px !important;
}

/* Images: The actual logos */
.wp-block-gallery.is-style-brand-marquee img {
    /* Fill the 50x50 container */
    width: 100% !important;
    height: 100% !important;
    object-fit: contain;
    /* Styling */
    filter: grayscale(100%);
    opacity: 0.8;
    transition: opacity 0.3s ease;
}

.wp-block-gallery.is-style-brand-marquee img:hover {
    filter: grayscale(0%);
    opacity: 1;
}

/* Animation Keyframes */
@keyframes marquee {
    0% {
        transform: translate3d(0, 0, 0);
    }

    100% {
        transform: translate3d(-50%, 0, 0);
    }
}

/* SP Adjustments */
@media (max-width: 768px) {

    .wp-block-gallery.is-style-brand-marquee .blocks-gallery-grid,
    .wp-block-gallery.is-style-brand-marquee ul,
    .wp-block-gallery.is-style-brand-marquee .marquee-track {
        gap: 3rem !important;
        animation-duration: 30s;
    }

    /* Keep 50px or adjust if needed, but user requested 50px/60px mix history suggests 40-50px is fine. 
       Keeping strict 50px as per latest request */
}

/* =========================================
   Footer Sitemap (Integrated)
   ========================================= */
.footer-widgets-wrapper {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: 40px;
    width: 100%;
}

.footer-branding {
    flex: 1;
    min-width: 250px;
}

.footer-sitemap {
    flex: 1;
    min-width: 200px;
    text-align: right;
}

.footer-sitemap-title {
    font-family: var(--font-body);
    font-weight: 500;
    font-size: 0.8rem;
    color: var(--text-color);
    margin-bottom: 12px;
    display: inline-block;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    padding-bottom: 4px;
}

.footer-sitemap-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    /* Align right */
    gap: 15px 25px;
    /* Row gap 15px, Column gap 25px */
}

.footer-sitemap-list li {
    margin: 0;
}

.footer-sitemap-list li a {
    text-decoration: none;
    color: var(--text-color);
    font-size: 0.9rem;
    transition: color 0.3s ease, opacity 0.3s ease;
    display: block;
    position: relative;
}

.footer-sitemap-list li a:hover {
    color: var(--color-accent);
    opacity: 0.8;
}

/* Sub-menus for Sitemap */
.footer-sitemap-list .sub-menu {
    list-style: none;
    padding: 0;
    margin: 5px 0 0 0;
    width: 100%;
    /* Force new line within flex item if wrapped, or logic adjustment */
}

/* Since flex parent makes li width auto, block sub-menu might expand it. */
.footer-sitemap-list>li {
    /* Keep top level items flexible but maybe allow column flow for children */
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    /* Align children to right edge */
}

.footer-sitemap-list .sub-menu li {
    margin: 4px 0;
}

.footer-sitemap-list .sub-menu li a {
    font-size: 0.85rem;
    opacity: 0.8;
    position: relative;
    padding-right: 0;
    /* Align right */
}

/* Prefix with hyphen (Visual Hierarchy) */
.footer-sitemap-list .sub-menu li a::before {
    content: "- ";
    margin-right: 4px;
    opacity: 0.6;
}

/* Responsive Adjustments */
@media (max-width: 768px) {
    .footer-widgets-wrapper {
        flex-direction: column;
        gap: 30px;
    }

    .footer-branding {
        width: 100%;
        margin-bottom: 20px;
    }

    .footer-sitemap {
        width: 100%;
        text-align: left;
        /* Align left on mobile */
    }

    .footer-sitemap-list {
        justify-content: flex-start;
        /* Align left on mobile */
        gap: 10px 20px;
    }

    .footer-sitemap-title {
        border-bottom: none;
        margin-bottom: 8px;
        opacity: 0.6;
    }
}

/* =========================================
   Front Page News Block
   ========================================= */
.front-news-section {
    padding: 30px 20px 70px; /* Reduced top padding to kill the empty space above the heading */
    background-color: var(--eterna-h2-bg, #f9f9f9);
}

.front-news-container {
    max-width: 1200px;
    margin: 0 auto;
}

.front-news-heading {
    text-align: center;
    font-size: 2rem;
    font-weight: 700;
    margin-top: 0;
    margin-bottom: 30px; /* Kept it slightly tighter */
    font-family: 'Shippori Mincho B1', serif;
    color: var(--eterna-h2-color, #333);
}

.front-news-heading span {
    display: block;
    font-size: 0.9rem;
    font-weight: 400;
    color: #666;
    margin-top: 5px;
    letter-spacing: 0.1em;
    font-family: 'Zen Kaku Gothic New', sans-serif;
}

.front-news-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 40px;
}

.front-news-card {
    background-color: #fff;
    border-radius: 8px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.05);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    height: 100%;
}

.front-news-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 25px rgba(0,0,0,0.1);
}

.front-news-card-link {
    display: flex;
    flex-direction: column;
    padding: 30px;
    text-decoration: none;
    color: inherit;
    height: 100%;
}

.front-news-meta {
    margin-bottom: 15px;
}

.front-news-date {
    font-family: 'Zen Kaku Gothic New', sans-serif;
    font-size: 0.95rem;
    color: #888;
    letter-spacing: 0.05em;
}

.front-news-title {
    font-family: 'Zen Kaku Gothic New', sans-serif;
    font-size: 1.1rem;
    font-weight: 500;
    line-height: 1.6;
    color: var(--eterna-h2-color, #333);
    margin: 0 0 25px 0;
    flex-grow: 1; /* Pushes readmore to the bottom */
}

.front-news-readmore {
    display: inline-flex;
    align-items: center;
    font-family: 'Zen Kaku Gothic New', sans-serif;
    font-size: 0.9rem;
    font-weight: 500;
    color: var(--eterna-h2-border, #294737);
    margin-top: auto;
}

.front-news-readmore .arrow {
    display: inline-block;
    width: 20px;
    height: 1px;
    background-color: currentColor;
    margin-left: 10px;
    position: relative;
    transition: width 0.3s ease;
}

.front-news-readmore .arrow::after {
    content: '';
    position: absolute;
    right: 0;
    top: -4px;
    width: 8px;
    height: 8px;
    border-top: 1px solid currentColor;
    border-right: 1px solid currentColor;
    transform: rotate(45deg);
}

.front-news-card:hover .arrow {
    width: 30px;
}

/* Responsive */
@media (max-width: 992px) {
    .front-news-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {
    .front-news-section {
        padding: 20px 15px 50px; /* Tighter on mobile too */
    }
    .front-news-grid {
        grid-template-columns: 1fr;
        gap: 40px;
    }
    .front-news-card-link {
        padding: 25px;
    }
}



/* =========================================
   Eterna Custom Tabs
   ========================================= */
.eterna-tabs-container { margin: 40px 0; }
.eterna-tab-nav {
    display: flex;
    list-style: none;
    padding: 0;
    margin: 0 0 30px 0;
    gap: 10px;
    border-bottom: 2px solid #e0ece6;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}
.eterna-tab-nav::-webkit-scrollbar { display: none; }
.eterna-tab-button {
    position: relative;
    padding: 12px 25px;
    background-color: #f9f9f9;
    color: #666;
    font-weight: bold;
    cursor: pointer;
    border-radius: 8px 8px 0 0;
    transition: all 0.3s ease;
    white-space: nowrap;
    border: 1px solid transparent;
    border-bottom: none;
    /* Reset any inherited ol/ul spacing */
    margin: 0 !important;
}

/* Reset Theme's Default Checkmark for the Tab Nav */
.entry-content ul.eterna-tab-nav li::before {
    display: none !important; 
    border: none !important;
    background: none !important;
    width: auto !important;
    height: auto !important;
    transform: translateY(-50%) !important;
    border-radius: 0 !important;
}

/* Local Image Icons via assets/icons/tabs/ */
.eterna-tabs-container[data-tab-icon]:not([data-tab-icon="none"]) .eterna-tab-button {
    padding-left: 45px !important;
}

/* Base styling for all custom tab icons */
.eterna-tabs-container[data-tab-icon]:not([data-tab-icon="none"]) .eterna-tab-button::before {
    content: '';
    display: block !important;
    position: absolute !important;
    left: 20px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 16px !important;
    height: 16px !important;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    border-radius: 0 !important;
    border: none !important;
    transition: filter 0.3s ease;
}

/* Map specific icon strings directly to Data URIs (bypasses all local server SVG MIME/pathing issues) */
.eterna-tabs-container[data-tab-icon="check"] .eterna-tab-button::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath fill='%23294737' d='M438.6 105.4c12.5 12.5 12.5 32.8 0 45.3l-256 256c-12.5 12.5-32.8 12.5-45.3 0l-128-128c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0L160 338.7 393.4 105.4c12.5-12.5 32.8-12.5 45.3 0z'/%3E%3C/svg%3E"); }
.eterna-tabs-container[data-tab-icon="info"] .eterna-tab-button::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='%23294737' d='M256 512A256 256 0 1 0 256 0a256 256 0 1 0 0 512zM216 336h24V272H216c-13.3 0-24-10.7-24-24s10.7-24 24-24h48c13.3 0 24 10.7 24 24v88h8c13.3 0 24 10.7 24 24s-10.7 24-24 24H216c-13.3 0-24-10.7-24-24s10.7-24 24-24zm40-208a32 32 0 1 1 0 64 32 32 0 1 1 0-64z'/%3E%3C/svg%3E"); }
.eterna-tabs-container[data-tab-icon="building"] .eterna-tab-button::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 384 512'%3E%3Cpath fill='%23294737' d='M48 0C21.5 0 0 21.5 0 48v416c0 26.5 21.5 48 48 48h288c26.5 0 48-21.5 48-48V48c0-26.5-21.5-48-48-48H48zM160 64h64c8.8 0 16 7.2 16 16v32c0 8.8-7.2 16-16 16h-64c-8.8 0-16-7.2-16-16V80c0-8.8 7.2-16 16-16zm-64 80h192c8.8 0 16 7.2 16 16v32c0 8.8-7.2 16-16 16H96c-8.8 0-16-7.2-16-16v-32c0-8.8 7.2-16 16-16zm64 80h64c8.8 0 16 7.2 16 16v32c0 8.8-7.2 16-16 16h-64c-8.8 0-16-7.2-16-16v-32c0-8.8 7.2-16 16-16zm-64 80h192c8.8 0 16 7.2 16 16v32c0 8.8-7.2 16-16 16H96c-8.8 0-16-7.2-16-16v-32c0-8.8 7.2-16 16-16zm64 80h64c8.8 0 16 7.2 16 16v32c0 8.8-7.2 16-16 16h-64c-8.8 0-16-7.2-16-16v-32c0-8.8 7.2-16 16-16z'/%3E%3C/svg%3E"); }
.eterna-tabs-container[data-tab-icon="pc"] .eterna-tab-button::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 512'%3E%3Cpath fill='%23294737' d='M128 32C92.6 32 64 60.6 64 96V352h512V96c0-35.4-28.6-64-64-64H128zM19.2 384C8.6 384 0 392.6 0 403.2C0 445.6 34.4 480 76.8 480H563.2c42.4 0 76.8-34.4 76.8-76.8c0-10.6-8.6-19.2-19.2-19.2H19.2z'/%3E%3C/svg%3E"); }
.eterna-tabs-container[data-tab-icon="smartphone"] .eterna-tab-button::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 384 512'%3E%3Cpath fill='%23294737' d='M16 64C16 28.7 44.7 0 80 0H304c35.3 0 64 28.7 64 64V448c0 35.3-28.7 64-64 64H80c-35.3 0-64-28.7-64-64V64zM224 448a32 32 0 1 0 -64 0 32 32 0 1 0 64 0zM304 64H80V384H304V64z'/%3E%3C/svg%3E"); }
.eterna-tabs-container[data-tab-icon="instagram"] .eterna-tab-button::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath fill='%23294737' d='M224.1 141c-63.6 0-114.9 51.3-114.9 114.9s51.3 114.9 114.9 114.9S339 319.5 339 255.9 287.7 141 224.1 141zm0 189.6c-41.1 0-74.7-33.5-74.7-74.7s33.5-74.7 74.7-74.7 74.7 33.5 74.7 74.7-33.6 74.7-74.7 74.7zm146.4-194.3c0 14.9-12 26.8-26.8 26.8-14.9 0-26.8-12-26.8-26.8s12-26.8 26.8-26.8 26.8 12 26.8 26.8zm76.1 27.2c-1.7-35.9-9.9-67.7-36.2-93.9-26.2-26.2-58-34.4-93.9-36.2-37-2.1-147.9-2.1-184.9 0-35.8 1.7-67.6 9.9-93.9 36.1s-34.4 58-36.2 93.9c-2.1 37-2.1 147.9 0 184.9 1.7 35.9 9.9 67.7 36.2 93.9s58 34.4 93.9 36.2c37 2.1 147.9 2.1 184.9 0 35.9-1.7 67.7-9.9 93.9-36.2 26.2-26.2 34.4-58 36.2-93.9 2.1-37 2.1-147.8 0-184.8zM398.8 388c-7.8 19.6-22.9 34.7-42.6 42.6-29.5 11.7-99.5 9-132.1 9s-102.7 2.6-132.1-9c-19.6-7.8-34.7-22.9-42.6-42.6-11.7-29.5-9-99.5-9-132.1s-2.6-102.7 9-132.1c7.8-19.6 22.9-34.7 42.6-42.6 29.5-11.7 99.5-9 132.1-9s102.7-2.6 132.1 9c19.6 7.8 34.7 22.9 42.6 42.6 11.7 29.5 9 99.5 9 132.1s2.7 102.7-9 132.1z'/%3E%3C/svg%3E"); }
.eterna-tabs-container[data-tab-icon="x"] .eterna-tab-button::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='%23294737' d='M389.2 48h70.6L305.6 224.2 487 464H345L233.6 318.6 106.5 464H35.8L200.7 275.5 26.8 48H172.4L272.9 180.9 389.2 48zM364.4 421.8h39.1L151.1 88h-42L364.4 421.8z'/%3E%3C/svg%3E"); }
.eterna-tabs-container[data-tab-icon="youtube"] .eterna-tab-button::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 576 512'%3E%3Cpath fill='%23294737' d='M549.655 124.083c-6.281-23.65-24.787-42.276-48.284-48.597C458.781 64 288 64 288 64S117.22 64 74.629 75.486c-23.497 6.322-42.003 24.947-48.284 48.597-11.412 42.867-11.412 132.305-11.412 132.305s0 89.438 11.412 132.305c6.281 23.65 24.787 41.5 48.284 47.821C117.22 448 288 448 288 448s170.78 0 213.371-11.486c23.497-6.321 42.003-24.171 48.284-47.821 11.412-42.867 11.412-132.305 11.412-132.305s0-89.438-11.412-132.305zm-317.51 213.508V175.185l142.739 81.205-142.739 81.201z'/%3E%3C/svg%3E"); }
.eterna-tabs-container[data-tab-icon="line"] .eterna-tab-button::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath fill='%23294737' d='M273.39 249.27H219.06v-73.08h-23.7v96.06c0 1.29.54 2.49 1.44 3.39a4.89 4.89 0 0 0 3.39 1.44h73.2v-27.81zm-96.84 0h-54.33v-73.08h-23.7v96.06c0 1.29.54 2.49 1.44 3.39a4.89 4.89 0 0 0 3.39 1.44h73.2v-27.81zm154.59-73.08h-23.7v96.06h23.7v-96.06zm-45.72 26.58V176.19h-24.36l-37.14 55.44v-55.44h-23.7v96.06h24.36l37.14-55.44v55.44h23.7v-69.48zM224 53.33C100.29 53.33 0 137.66 0 241.6c0 46.5 22.89 89.25 61.53 122.13 18.06 15.39 28.53 35.85 24.33 59.88-1.56 8.79-11.16 38.31-28.5 61.35-2.22 2.97-3.87 6.36-4.89 9.87-.24.84-.45 1.68-.69 2.55-1.53 5.43-2.1 11.22-1.59 17.1.66 7.62 3.63 14.79 8.28 20.46 8.43 10.32 21.09 16.59 34.62 17.58 24.24 1.77 50.19-2.58 76.47-12.87 43.14-16.89 80.97-39.75 110.13-64.83 54.48 11.88 114.78 4.29 162.75-22.14C408.81 405 448 327.91 448 241.6 448 137.66 347.71 53.33 224 53.33z'/%3E%3C/svg%3E"); }

/* Automatically turn icons pure white when the tab is Active (or dark theme logic) */
/* Supports any uploaded image that has a transparent background */
.eterna-tab-button.active::before {
    filter: brightness(0) invert(1);
}

.eterna-tabs-container[data-tab-icon="none"] .eterna-tab-button {
    padding-left: 25px !important;
    padding-right: 25px !important;
    text-align: center !important;
}

.eterna-tab-button:hover {
    background-color: #e0ece6;
    color: #294737;
}

/* =========================================
   Table Custom Styles (Gutenberg)
   ========================================= */

/* 1. モダン（左見出し） */
.wp-block-table.is-style-eterna-modern-corp table {
    border-collapse: collapse;
    width: 100%;
    border: none !important;
    margin-bottom: 2em;
}
.wp-block-table.is-style-eterna-modern-corp tr {
    border-bottom: 1px solid #e0ece6;
}
.wp-block-table.is-style-eterna-modern-corp thead tr:first-child,
.wp-block-table.is-style-eterna-modern-corp tbody:first-child tr:first-child {
    border-top: 1px solid #e0ece6;
}
.wp-block-table.is-style-eterna-modern-corp tbody:last-child tr:last-child,
.wp-block-table.is-style-eterna-modern-corp tfoot tr:last-child {
    border-bottom: 1px solid #e0ece6;
}
.wp-block-table.is-style-eterna-modern-corp td,
.wp-block-table.is-style-eterna-modern-corp th {
    padding: 1.2em 1.5em;
    border: none !important;
    vertical-align: middle;
}
.wp-block-table.is-style-eterna-modern-corp tr > *:first-child {
    background-color: #f5f8f6;
    font-weight: 600;
    color: #294737;
    width: 25%;
    min-width: 120px;
}
/* Responsive adjust for modern table */
@media (max-width: 768px) {
    .wp-block-table.is-style-eterna-modern-corp td,
    .wp-block-table.is-style-eterna-modern-corp th {
        padding: 1em;
        font-size: 0.9em;
    }
    .wp-block-table.is-style-eterna-modern-corp tr > *:first-child {
        width: 35%;
    }
}

/* 2. ミニマル */
.wp-block-table.is-style-eterna-minimal table {
    border-collapse: collapse;
    width: 100%;
    border: none !important;
    margin-bottom: 2em;
}
.wp-block-table.is-style-eterna-minimal tr {
    border-bottom: 1px dashed #ccc;
}
.wp-block-table.is-style-eterna-minimal thead tr:first-child,
.wp-block-table.is-style-eterna-minimal tbody:first-child tr:first-child {
    border-top: 2px solid #294737;
}
.wp-block-table.is-style-eterna-minimal tbody:last-child tr:last-child,
.wp-block-table.is-style-eterna-minimal tfoot tr:last-child {
    border-bottom: 1px solid #294737;
}
.wp-block-table.is-style-eterna-minimal td,
.wp-block-table.is-style-eterna-minimal th {
    padding: 1.2em 0.5em;
    border: none !important;
    background: transparent !important;
    vertical-align: top;
}
.wp-block-table.is-style-eterna-minimal thead th {
    font-weight: 700;
    color: #294737;
    border-bottom: 1px solid #333;
}
.eterna-tab-button.active {
    background-color: #294737;
    color: #fff;
    border-color: #294737;
    position: relative;
    z-index: 2;
}
.eterna-tab-button.active::after {
    content: '';
    position: absolute;
    bottom: -2px;
    left: 0;
    width: 100%;
    height: 2px;
    background-color: #294737;
}

/* Scroll Hint Overlay */
.eterna-tab-nav-wrap {
    position: relative;
}
.eterna-tab-scroll-hint {
    display: none; /* JS will toggle */
    text-align: right;
    font-size: 0.85rem;
    color: #888;
    margin-bottom: 8px;
    font-weight: bold;
}
.eterna-tab-scroll-hint span {
    display: inline-block;
    animation: bounceHoriz 2s infinite ease-in-out;
}
@keyframes bounceHoriz {
    0%, 100% { transform: translateX(0); }
    50% { transform: translateX(-5px); }
}


.eterna-tab-item {
    transition: opacity 0.4s ease;
}

/* --- BLOG CARD STYLES (v5) --- */
.blog-card .entry-summary {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    line-height: 1.6;
    height: calc(1.6em * 3); /* Fixed height for 3 lines to maintain grid alignment */
    margin-bottom: 1.5rem;
}

.blog-card .entry-summary p {
    margin: 0;
}

/* Ensure consistent card height in the grid */
.blog-card {
    height: 100%;
}

/* --- BLOG TAB NAVIGATION (SWELL-like) --- */
.blog-tab-wrapper {
    margin-bottom: 3.5rem;
    border-bottom: 1px solid #eee;
    padding-bottom: 1rem;
}

.blog-tab-nav {
    display: flex;
    justify-content: center;
    list-style: none;
    padding: 0;
    margin: 0;
    gap: 3rem;
    flex-wrap: wrap;
}

.blog-tab-nav li {
    font-family: var(--font-heading);
    font-size: 1.1rem;
    font-weight: 500;
    color: #999;
    cursor: pointer;
    position: relative;
    padding: 0.5rem 0.5rem 1.2rem;
    transition: color 0.3s ease;
}

.blog-tab-nav li:hover {
    color: var(--color-accent);
}

.blog-tab-nav li.active {
    color: var(--color-accent);
    font-weight: 700;
}

.blog-tab-nav li.active::after {
    content: '';
    position: absolute;
    bottom: -1px; /* Align with wrapper border-bottom */
    left: 0;
    width: 100%;
    height: 3px;
    background-color: var(--color-accent);
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

/* AJAX Loading State Animation */
#blog-grid-ajax {
    transition: opacity 0.3s ease;
}

/* --- BLOG PAGINATION (SWELL-like) --- */
.blog-pagination {
    margin-top: 4rem;
    display: flex;
    justify-content: center;
}

.blog-pagination ul.page-numbers {
    display: flex;
    list-style: none;
    padding: 0;
    margin: 0;
    gap: 10px;
}

.blog-pagination .page-numbers li {
    margin: 0;
}

.blog-pagination .page-numbers a,
.blog-pagination .page-numbers span {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 45px;
    height: 45px;
    background: #f8f8f8;
    color: #333;
    text-decoration: none;
    font-weight: 500;
    border-radius: 4px;
    transition: all 0.3s ease;
    font-size: 1rem;
}

.blog-pagination .page-numbers a:hover {
    background: #eee;
    color: var(--color-accent);
    transform: translateY(-2px);
}

.blog-pagination .page-numbers .current {
    background: var(--color-accent);
    color: #fff;
    cursor: default;
    box-shadow: 0 4px 10px rgba(0,0,0,0.1);
}

.blog-pagination .page-numbers .dots {
    background: transparent;
    cursor: default;
}

/* Pagination Fade Effect during AJAX */
#blog-pagination-ajax {
    transition: opacity 0.3s ease;
}

@media (max-width: 768px) {
    .blog-pagination .page-numbers a,
    .blog-pagination .page-numbers span {
        width: 38px;
        height: 38px;
        font-size: 0.9rem;
    }
    .blog-tab-nav {
        gap: 1.5rem;
    }
    .blog-tab-nav li {
        font-size: 0.95rem;
        padding-bottom: 0.8rem;
    }
}