.elementor-kit-5{--e-global-color-primary:#6EC1E4;--e-global-color-secondary:#54595F;--e-global-color-text:#7A7A7A;--e-global-color-accent:#61CE70;--e-global-color-d95a45b:#F5F0EA;--e-global-color-8fa2fee:#231F1C;--e-global-typography-primary-font-family:"Cormorant";--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Cormorant";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Montserrat";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Montserrat";--e-global-typography-accent-font-weight:500;}.elementor-kit-5 e-page-transition{background-color:#FFBC7D;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}.site-header .site-branding{flex-direction:column;align-items:stretch;}.site-header{padding-inline-end:0px;padding-inline-start:0px;}.site-footer .site-branding{flex-direction:column;align-items:stretch;}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}
/* Start custom CSS *//* =========================================
   Shiro Builders Group - Dark Luxury Global Kit
   Scoped to .shiro-dark-luxury-kit
   ========================================= */



.shiro-dark-luxury-kit {
    /* 1. Brand Fonts */
    --shiro-font-heading: 'Cormorant', serif;
    --shiro-font-body: 'Montserrat', sans-serif; /* Updated to Montserrat */
    --shiro-font-ui: 'Montserrat', sans-serif;

    /* 2. Core Extracted Brand Colors */
    --shiro-primary-dark: #231F1C;   /* Deep Espresso */
    --shiro-primary-light: #F5F0EA;  /* Warm Cashmere */
    --shiro-accent-terra: #9D6A46;   /* Muted Terracotta */
    --shiro-text-tone: #332D29;      /* Rich Charcoal */
    --shiro-divider: #D9D1C7;        /* Warm Greige */
    --shiro-color-white: #FFFFFF;
    --shiro-color-black: #000000;

    /* 2.5 Opacity Variables for High-End Patterns */
    --shiro-dark-03: rgba(35, 31, 28, 0.03);
    --shiro-dark-08: rgba(35, 31, 28, 0.08);
    --shiro-dark-15: rgba(35, 31, 28, 0.15);
    --shiro-terra-10: rgba(157, 106, 70, 0.10);
    --shiro-terra-20: rgba(157, 106, 70, 0.20);
    --shiro-light-05: rgba(245, 240, 234, 0.05);
    --shiro-light-15: rgba(245, 240, 234, 0.15);

    /* 3. Semantic Color Mappings */
    --shiro-primary: var(--shiro-primary-dark);
    --shiro-primary-hover: #14110F;
    --shiro-accent: var(--shiro-accent-terra);

    /* Text Colors */
    --shiro-text-heading: var(--shiro-primary-dark); 
    --shiro-text-body: var(--shiro-text-tone);
    --shiro-text-on-dark: var(--shiro-primary-light) !important;
    --shiro-text-subtle: #7A726C;

    /* Backgrounds */
    --shiro-bg-main-dark: var(--shiro-primary-dark);
    --shiro-bg-main-light: var(--shiro-primary-light); 
    --shiro-bg-surface: var(--shiro-color-white);
    --shiro-bg-page: var(--shiro-primary-light);

    /* Borders and Dividers */
    --shiro-border: var(--shiro-divider);
    --shiro-border-dark: var(--shiro-dark-15); 

    /* 4. Modular Type Scale */
    --shiro-h1: 4.2rem;
    --shiro-h2: 3.0rem;
    --shiro-h3: 1.2rem;
    --shiro-h4: 1.5rem;
    --shiro-h5: 1.25rem;
    --shiro-h6: 1.0rem;
    --shiro-p: 1.1rem;
    --shiro-eyebrow: 0.9rem;
    --shiro-line-height-heading: 1.1;
    --shiro-line-height-body: 1.6;

    /* Spacing and Transitions */
    --shiro-space-xs: 0.5rem;
    --shiro-space-sm: 1rem;
    --shiro-space-md: 2rem;
    --shiro-space-lg: 4rem;
    --shiro-space-xl: 6rem;
    --shiro-transition: 0.3s ease-in-out;
}

@media (max-width: 768px) {
    .shiro-dark-luxury-kit {
        --shiro-h1: 3rem;
        --shiro-h2: 2.2rem;
    }
}

/* =========================================
   Shiro Dark Luxury - Color Utilities 
   ========================================= */
.shiro-dark-luxury-kit .shiro-dark-luxury-bg-dark { background-color: var(--shiro-bg-main-dark); color: var(--shiro-text-on-dark); }
.shiro-dark-luxury-kit .shiro-dark-luxury-bg-light { background-color: var(--shiro-bg-main-light); color: var(--shiro-text-body); }
.shiro-dark-luxury-kit .shiro-dark-luxury-bg-accent { background-color: var(--shiro-accent); color: var(--shiro-color-white); }
.shiro-dark-luxury-kit .shiro-dark-luxury-bg-surface { background-color: var(--shiro-bg-surface); }

.shiro-dark-luxury-kit .shiro-dark-luxury-text-primary { color: var(--shiro-primary); }
.shiro-dark-luxury-kit .shiro-dark-luxury-text-accent { color: var(--shiro-accent); }
.shiro-dark-luxury-kit .shiro-dark-luxury-text-subtle { color: var(--shiro-text-subtle); }
.shiro-dark-luxury-kit .shiro-dark-luxury-text-on-dark { color: var(--shiro-text-on-dark) !important;  }

.shiro-dark-luxury-kit .shiro-dark-luxury-border-bottom { border-bottom: 1px solid var(--shiro-border); }
.shiro-dark-luxury-kit .shiro-dark-luxury-border-top { border-top: 1px solid var(--shiro-border); }
.shiro-dark-luxury-kit .shiro-dark-luxury-border-dark { border-color: var(--shiro-border-dark) !important; }
.shiro-dark-luxury-kit .shiro-dark-luxury-border-accent { border-color: var(--shiro-accent) !important; }

/* =========================================
   Shiro Dark Luxury - Typography 
   ========================================= */
.shiro-dark-luxury-kit h1, 
.shiro-dark-luxury-kit h2, 
.shiro-dark-luxury-kit h3, 
.shiro-dark-luxury-kit h4, 
.shiro-dark-luxury-kit h5, 
.shiro-dark-luxury-kit h6,
.shiro-dark-luxury-kit .shiro-dark-luxury-h1, 
.shiro-dark-luxury-kit .shiro-dark-luxury-h2, 
.shiro-dark-luxury-kit .shiro-dark-luxury-h3, 
.shiro-dark-luxury-kit .shiro-dark-luxury-h4, 
.shiro-dark-luxury-kit .shiro-dark-luxury-h5, 
.shiro-dark-luxury-kit .shiro-dark-luxury-h6 {
    font-family: var(--shiro-font-heading);
    line-height: var(--shiro-line-height-heading);
    font-weight: 600;
    color: var(--shiro-text-heading);
}

.shiro-dark-luxury-kit p, 
.shiro-dark-luxury-kit li, 
.shiro-dark-luxury-kit .shiro-dark-luxury-p {
    font-family: var(--shiro-font-body);
    line-height: var(--shiro-line-height-body);
    font-weight: 400;
    color: var(--shiro-text-body);
}

.shiro-dark-luxury-kit .shiro-dark-luxury-h1 { font-size: var(--shiro-h1); }
.shiro-dark-luxury-kit .shiro-dark-luxury-h2 { font-size: var(--shiro-h2); font-weight: 500; }
.shiro-dark-luxury-kit .shiro-dark-luxury-h3 { font-size: var(--shiro-h3); font-weight: 500; }
.shiro-dark-luxury-kit .shiro-dark-luxury-h4 { font-size: var(--shiro-h4); font-family: var(--shiro-font-body); }
.shiro-dark-luxury-kit .shiro-dark-luxury-h5 { font-size: var(--shiro-h5); font-family: var(--shiro-font-body); }
.shiro-dark-luxury-kit .shiro-dark-luxury-h6 { font-size: var(--shiro-h6); font-family: var(--shiro-font-body); }
.shiro-dark-luxury-kit .shiro-dark-luxury-p { font-size: var(--shiro-p); }

.shiro-dark-luxury-kit .shiro-dark-luxury-text-highlight { color: var(--shiro-accent); }
.shiro-dark-luxury-kit .shiro-dark-luxury-body-large { font-size: 1.25rem; line-height: 1.6; }
.shiro-dark-luxury-kit .shiro-dark-luxury-caption { font-size: 0.9rem; color: var(--shiro-text-subtle); }

.shiro-dark-luxury-kit .shiro-dark-luxury-eyebrowtext {
    font-family: var(--shiro-font-ui);
    font-size: var(--shiro-eyebrow);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.15em;
    color: var(--shiro-accent);
    display: inline-block;
    position: relative;
    padding-bottom: 0.5rem;
    margin-bottom: 1.5rem;
}
.shiro-dark-luxury-kit .shiro-dark-luxury-eyebrowtext::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 2.5rem;
    height: 2px;
    background-color: var(--shiro-accent);
}
.shiro-dark-luxury-kit .shiro-dark-luxury-eyebrowtext.shiro-dark-luxury-dark-eyebrow { 
    color: var(--shiro-text-on-dark); 
}

/* =========================================
   Shiro Dark Luxury - UI Elements
   ========================================= */
.shiro-dark-luxury-kit .shiro-dark-luxury-card {
    background-color: var(--shiro-bg-surface);
    border: 1px solid var(--shiro-border);
    transition: var(--shiro-transition);
}
.shiro-dark-luxury-kit .shiro-dark-luxury-card:hover {
    border-color: var(--shiro-accent);
    box-shadow: 0 10px 30px var(--shiro-dark-08);
}

.shiro-dark-luxury-kit .shiro-dark-luxury-container {
    padding-left: var(--shiro-space-md);
    padding-right: var(--shiro-space-md);
    max-width: 1400px;
    margin: 0 auto;
}

/* =========================================
   Shiro Dark Luxury - Buttons
   ========================================= */
.shiro-dark-luxury-kit .shiro-global-button-kit {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 1.5rem;
    padding: 2rem 0;
    width: 100%;
}

.shiro-dark-luxury-kit .shiro-dark-luxury-btn-base, 
.shiro-dark-luxury-kit .shiro-dark-luxury-btn-primary, 
.shiro-dark-luxury-kit .shiro-dark-luxury-btn-primary-2,
.shiro-dark-luxury-kit .shiro-dark-luxury-btn-secondary, 
.shiro-dark-luxury-kit .shiro-dark-luxury-btn-outline {
    font-family: var(--shiro-font-ui);
    font-size: 0.9rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    padding: 0.9rem 2.0rem;
    border-radius: 4px;
    transition: var(--shiro-transition);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    cursor: pointer;
    text-align: center;
}

.shiro-dark-luxury-kit .shiro-dark-luxury-btn-primary {
    background-color: var(--shiro-primary);
    color: var(--shiro-text-on-dark) !important;
    border: 2px solid var(--shiro-primary);
}
.shiro-dark-luxury-kit .shiro-dark-luxury-btn-primary:hover {
    background-color: transparent;
    color: var(--shiro-primary) !important;
}

.shiro-dark-luxury-kit .shiro-dark-luxury-btn-secondary {
    background-color: var(--shiro-accent);
    color: var(--shiro-primary-light) !important;
    border: 2px solid var(--shiro-accent);
}
.shiro-dark-luxury-kit .shiro-dark-luxury-btn-secondary:hover {
    background-color: transparent;
    color: var(--shiro-accent) !important;
}

.shiro-dark-luxury-kit .shiro-dark-luxury-btn-outline {
    background-color: transparent;
    border: 2px solid var(--shiro-primary);
    color: var(--shiro-primary) !important;
}
.shiro-dark-luxury-kit .shiro-dark-luxury-btn-outline:hover {
    background-color: var(--shiro-primary);
    color: var(--shiro-text-on-dark) !important;
}

.shiro-dark-luxury-kit .shiro-dark-luxury-btn-icon {
    font-size: 1.1em;
    font-weight: normal;
    margin-left: var(--shiro-space-xs);
    position: relative;
    top: -1px;
}

@media (max-width: 768px) {
    .shiro-dark-luxury-kit .shiro-global-button-kit {
        flex-direction: column;
        align-items: stretch;
    }
    .shiro-dark-luxury-kit .shiro-dark-luxury-btn-primary, 
    .shiro-dark-luxury-kit .shiro-dark-luxury-btn-secondary, 
    .shiro-dark-luxury-kit .shiro-dark-luxury-btn-outline {
        width: 100%;
    }
}

/* =========================================
   Shiro Dark Luxury - Custom Image Backgrounds
   ========================================= */
.shiro-dark-luxury-kit .shiro-dark-luxury-japanese-bg {
    position: relative;
    overflow: hidden;
    color: var(--shiro-color-white);
    background-image:
        linear-gradient(rgba(35, 31, 28, 0.6), rgba(35, 31, 28, 0.7)),
        url("/wp-content/uploads/2026/05/zeren-minimalist-landscape-bg-shiro-builders.png");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.shiro-dark-luxury-kit .shiro-dark-luxury-japanese-bg2 {
    position: relative;
    overflow: hidden;
    z-index: 1;
    background: none !important;
}
.shiro-dark-luxury-kit .shiro-dark-luxury-japanese-bg2::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image: url("/wp-content/uploads/2026/05/abstract-watercolor-background-with-circle-shiro.png");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    opacity: 0.2;
    z-index: -1;
}

/* =========================================
   Shiro Dark Luxury - Master Japanese Patterns
   ========================================= */

/* 31. Modern Shoji Screen */
.shiro-dark-luxury-kit .shiro-dark-luxury-pattern-31 {
    background-color: var(--shiro-primary-light);
    background-image:
        linear-gradient(var(--shiro-dark-08) 2px, transparent 2px),
        linear-gradient(90deg, var(--shiro-dark-08) 2px, transparent 2px),
        linear-gradient(var(--shiro-dark-03) 1px, transparent 1px),
        linear-gradient(90deg, var(--shiro-dark-03) 1px, transparent 1px);
    background-size: 100px 100px, 100px 100px, 20px 20px, 20px 20px;
    background-position: -2px -2px, -2px -2px, -1px -1px, -1px -1px;
}

/* 32. Karesansui (Zen Sand Garden) */
.shiro-dark-luxury-kit .shiro-dark-luxury-pattern-32 {
    background-color: var(--shiro-primary-light);
    background-image: repeating-radial-gradient(
        circle at 50% 150%,
        transparent, transparent 10px,
        var(--shiro-dark-03) 11px, var(--shiro-dark-03) 12px
    );
}

/* 33. Kumiko Wood Lattice */
.shiro-dark-luxury-kit .shiro-dark-luxury-pattern-33 {
    background-color: var(--shiro-primary-dark);
    background-image:
        linear-gradient(30deg, var(--shiro-terra-20) 1px, transparent 1px),
        linear-gradient(150deg, var(--shiro-terra-20) 1px, transparent 1px);
    background-size: 40px 69px;
}

/* 34. Minimal Shippo (Seven Treasures) */
.shiro-dark-luxury-kit .shiro-dark-luxury-pattern-34 {
    background-color: var(--shiro-primary-light);
    background-image:
        radial-gradient(circle at 0 0, transparent 18px, var(--shiro-terra-10) 19px, var(--shiro-terra-10) 20px, transparent 21px),
        radial-gradient(circle at 40px 0, transparent 18px, var(--shiro-terra-10) 19px, var(--shiro-terra-10) 20px, transparent 21px),
        radial-gradient(circle at 0 40px, transparent 18px, var(--shiro-terra-10) 19px, var(--shiro-terra-10) 20px, transparent 21px),
        radial-gradient(circle at 40px 40px, transparent 18px, var(--shiro-terra-10) 19px, var(--shiro-terra-10) 20px, transparent 21px),
        radial-gradient(circle at 20px 20px, transparent 18px, var(--shiro-dark-08) 19px, var(--shiro-dark-08) 20px, transparent 21px);
    background-size: 40px 40px;
}

/* 36. Ichimatsu (Traditional Checkerboard) */
.shiro-dark-luxury-kit .shiro-dark-luxury-pattern-36 {
    background-color: var(--shiro-primary-light);
    background-image:
        linear-gradient(45deg, var(--shiro-dark-03) 25%, transparent 25%, transparent 75%, var(--shiro-dark-03) 75%, var(--shiro-dark-03)),
        linear-gradient(45deg, var(--shiro-dark-03) 25%, transparent 25%, transparent 75%, var(--shiro-dark-03) 75%, var(--shiro-dark-03));
    background-size: 40px 40px;
    background-position: 0 0, 20px 20px;
}

/* 37. Yabane (Arrow Feathers) */
.shiro-dark-luxury-kit .shiro-dark-luxury-pattern-37 {
    background-color: var(--shiro-primary-light);
    background-image:
        linear-gradient(135deg, var(--shiro-terra-10) 25%, transparent 25%),
        linear-gradient(225deg, var(--shiro-terra-10) 25%, transparent 25%),
        linear-gradient(315deg, var(--shiro-terra-10) 25%, transparent 25%),
        linear-gradient(45deg, var(--shiro-terra-10) 25%, transparent 25%);
    background-size: 60px 60px;
    background-position: 30px 0, 30px 0, 0 0, 0 0;
}

/* 38. Higaki (Cypress Fence) */
.shiro-dark-luxury-kit .shiro-dark-luxury-pattern-38 {
    background-color: var(--shiro-primary-dark);
    background-image:
        repeating-linear-gradient(45deg, transparent, transparent 10px, var(--shiro-terra-20) 10px, var(--shiro-terra-20) 12px),
        repeating-linear-gradient(-45deg, transparent, transparent 10px, var(--shiro-terra-20) 10px, var(--shiro-terra-20) 12px);
}

/* 39. Kikkou (Tortoiseshell / Hexagons) */
.shiro-dark-luxury-kit .shiro-dark-luxury-pattern-39 {
    background-color: var(--shiro-primary-light);
    background-image:
        linear-gradient(30deg, transparent 48%, var(--shiro-dark-08) 49%, var(--shiro-dark-08) 51%, transparent 52%),
        linear-gradient(150deg, transparent 48%, var(--shiro-dark-08) 49%, var(--shiro-dark-08) 51%, transparent 52%),
        linear-gradient(90deg, transparent 48%, var(--shiro-dark-08) 49%, var(--shiro-dark-08) 51%, transparent 52%);
    background-size: 40px 69.28px;
}

/* 40. Tatejima (Bamboo Vertical Stripes) */
.shiro-dark-luxury-kit .shiro-dark-luxury-pattern-40 {
    background-color: var(--shiro-primary-light);
    background-image:
        repeating-linear-gradient(90deg, 
            transparent, transparent 20px, 
            var(--shiro-dark-08) 20px, var(--shiro-dark-08) 22px, 
            transparent 22px, transparent 35px, 
            var(--shiro-dark-03) 35px, var(--shiro-dark-03) 36px
        );
}

/* 41. Uroko (Dragon Scales) */
.shiro-dark-luxury-kit .shiro-dark-luxury-pattern-41 {
    background-color: var(--shiro-primary-light);
    background-image:
        linear-gradient(115deg, transparent 75%, var(--shiro-dark-08) 75%),
        linear-gradient(245deg, transparent 75%, var(--shiro-dark-08) 75%),
        linear-gradient(115deg, transparent 75%, var(--shiro-dark-03) 75%),
        linear-gradient(245deg, transparent 75%, var(--shiro-dark-03) 75%);
    background-size: 40px 40px;
    background-position: 0 0, 0 0, 20px 20px, 20px 20px;
}

/* 42. Kanoko (Fawn Spots) */
.shiro-dark-luxury-kit .shiro-dark-luxury-pattern-42 {
    background-color: var(--shiro-primary-dark);
    background-image:
        radial-gradient(circle at 20px 20px, var(--shiro-terra-20) 4px, transparent 5px),
        linear-gradient(45deg, transparent 48%, var(--shiro-light-05) 49%, var(--shiro-light-05) 51%, transparent 52%),
        linear-gradient(-45deg, transparent 48%, var(--shiro-light-05) 49%, var(--shiro-light-05) 51%, transparent 52%);
    background-size: 40px 40px;
}

/* 43. Seigaiha (Abstract Geometric Waves) */
.shiro-dark-luxury-kit .shiro-dark-luxury-pattern-43 {
    background-color: var(--shiro-primary-light);
    background-image:
        radial-gradient(circle at 25px 25px, transparent 15px, var(--shiro-dark-08) 16px, var(--shiro-dark-08) 18px, transparent 19px),
        radial-gradient(circle at 25px 25px, transparent 20px, var(--shiro-dark-08) 21px, var(--shiro-dark-08) 23px, transparent 24px);
    background-size: 50px 50px;
    background-position: 0 0, 25px 25px;
}

/* 44. Sudare (Bamboo Blinds) */
.shiro-dark-luxury-kit .shiro-dark-luxury-pattern-44 {
    background-color: var(--shiro-primary-light);
    background-image:
        repeating-linear-gradient(180deg, 
            transparent, transparent 3px, 
            var(--shiro-dark-03) 3px, var(--shiro-dark-03) 4px, 
            transparent 4px, transparent 8px, 
            var(--shiro-terra-10) 8px, var(--shiro-terra-10) 9px
        );
}

/* 45. Kagome (Woven Basket Grid) */
.shiro-dark-luxury-kit .shiro-dark-luxury-pattern-45 {
    background-color: var(--shiro-primary-light);
    background-image:
        linear-gradient(30deg, transparent 45%, var(--shiro-dark-08) 48%, var(--shiro-dark-08) 52%, transparent 55%),
        linear-gradient(150deg, transparent 45%, var(--shiro-dark-08) 48%, var(--shiro-dark-08) 52%, transparent 55%),
        linear-gradient(90deg, transparent 48%, var(--shiro-terra-10) 50%, var(--shiro-terra-10) 52%, transparent 54%);
    background-size: 60px 103.9px;
}

/* =========================================
   SHIRO DARK LUXURY - BUTTON KIT
   Drop-in ready for Elementor HTML Widget
   Scoped to .shiro-dark-luxury-kit
   ========================================= */

    /* Shared Button Base */
    .shiro-dark-luxury-kit .shiro-dark-luxury-btn {
        font-family: var(--shiro-font-ui);
        font-size: 0.9rem;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 0.1em;
        padding: 1rem 2.5rem;
        border-radius: 2px;
        transition: all 0.3s ease-in-out;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        text-decoration: none;
        cursor: pointer;
        text-align: center;
    }

    .shiro-dark-luxury-kit .shiro-dark-luxury-btn span {
        display: inline-block;
        margin-left: 8px;
        transition: transform 0.3s ease-in-out;
    }

    .shiro-dark-luxury-kit .shiro-dark-luxury-btn:hover span {
        transform: translateX(4px);
    }

    /* =========================================
       1. BUTTONS FOR LIGHT BACKGROUNDS
       (Warm Cashmere #F5F0EA or White)
       ========================================= */
    
    /* Primary (Deep Espresso) */
    .shiro-dark-luxury-kit .shiro-btn-primary-dark {
        background-color: var(--shiro-color-dark, #231F1C);
        color: var(--shiro-color-white, #FFFFFF);
        border: 1px solid var(--shiro-color-dark, #231F1C);
    }
    .shiro-dark-luxury-kit .shiro-btn-primary-dark:hover {
        background-color: transparent;
        color: var(--shiro-color-dark, #231F1C);
    }

    /* Secondary (Muted Terracotta) */
    .shiro-dark-luxury-kit .shiro-btn-secondary-accent {
        background-color: var(--shiro-accent, #9D6A46);
        color: var(--shiro-color-white, #FFFFFF);
        border: 1px solid var(--shiro-accent, #9D6A46);
    }
    .shiro-dark-luxury-kit .shiro-btn-secondary-accent:hover {
        background-color: transparent;
        color: var(--shiro-accent, #9D6A46);
    }

    /* Optional Outline (Espresso) */
    .shiro-dark-luxury-kit .shiro-btn-outline-dark {
        background-color: transparent;
        color: var(--shiro-color-dark, #231F1C);
        border: 1px solid var(--shiro-color-dark, #231F1C);
    }
    .shiro-dark-luxury-kit .shiro-btn-outline-dark:hover {
        background-color: var(--shiro-color-dark, #231F1C);
        color: var(--shiro-color-white, #FFFFFF);
    }


    /* =========================================
       2. BUTTONS FOR DARK BACKGROUNDS
       (Deep Espresso #231F1C or Dark Images)
       ========================================= */

    /* Primary (Warm Cashmere) */
    .shiro-dark-luxury-kit .shiro-btn-primary-light {
        background-color: var(--shiro-color-light, #F5F0EA);
        color: var(--shiro-color-dark, #231F1C);
        border: 1px solid var(--shiro-color-light, #F5F0EA);
    }
    .shiro-dark-luxury-kit .shiro-btn-primary-light:hover {
        background-color: transparent;
        color: var(--shiro-color-light, #F5F0EA);
    }

    /* Secondary (White/Cashmere Outline) */
    .shiro-dark-luxury-kit .shiro-btn-outline-light {
        background-color: transparent;
        color: var(--shiro-color-light, #F5F0EA);
        border: 1px solid var(--shiro-color-light, #F5F0EA);
    }
    .shiro-dark-luxury-kit .shiro-btn-outline-light:hover {
        background-color: var(--shiro-color-light, #F5F0EA);
        color: var(--shiro-color-dark, #231F1C);
    }


    /* Utility Classes just for this preview block */
    .shiro-dark-luxury-kit .shiro-preview-box {
        padding: 3rem;
        border-radius: 4px;
        margin-bottom: 2rem;
        display: flex;
        flex-wrap: wrap;
        gap: 1.5rem;
        align-items: center;
    }
    .shiro-dark-luxury-kit .shiro-bg-light-preview { background-color: #F5F0EA; }
    .shiro-dark-luxury-kit .shiro-bg-dark-preview { background-color: #231F1C; }
    
    @media (max-width: 768px) {
        .shiro-dark-luxury-kit .shiro-dark-luxury-btn {
            width: 100%;
            justify-content: center;
        }
    }
    
    
    
/* =========================================
   Shiro Dark Luxury - Elementor Specificity Integration
   ========================================= */

/* Force Elementor Headings to inherit Shiro Global Type Scale */
.shiro-dark-luxury-kit .elementor-widget-heading h1.elementor-heading-title { 
    font-size: var(--shiro-h1); 
    font-family: var(--shiro-font-heading);
    line-height: var(--shiro-line-height-heading);
    color: var(--shiro-text-heading);
}
.shiro-dark-luxury-kit .elementor-widget-heading h2.elementor-heading-title { 
    font-size: var(--shiro-h2); 
    font-family: var(--shiro-font-heading);
    line-height: var(--shiro-line-height-heading);
    color: var(--shiro-text-heading);
}
.shiro-dark-luxury-kit .elementor-widget-heading h3.elementor-heading-title { 
    font-size: var(--shiro-h3); 
    font-family: var(--shiro-font-heading);
    line-height: var(--shiro-line-height-heading);
    color: var(--shiro-text-heading);
}
.shiro-dark-luxury-kit .elementor-widget-heading h4.elementor-heading-title { 
    font-size: var(--shiro-h4); 
    font-family: var(--shiro-font-heading);
    line-height: var(--shiro-line-height-heading);
    color: var(--shiro-text-heading);
}
.shiro-dark-luxury-kit .elementor-widget-heading h5.elementor-heading-title { 
    font-size: var(--shiro-h5); 
    font-family: var(--shiro-font-heading);
    line-height: var(--shiro-line-height-heading);
    color: var(--shiro-text-heading);
}
.shiro-dark-luxury-kit .elementor-widget-heading h6.elementor-heading-title { 
    font-size: var(--shiro-h6); 
    font-family: var(--shiro-font-heading);
    line-height: var(--shiro-line-height-heading);
    color: var(--shiro-text-heading);
}

/* Force Elementor Text Editor (P tags) to inherit Shiro Body text */
.shiro-dark-luxury-kit .elementor-widget-text-editor,
.shiro-dark-luxury-kit .elementor-widget-text-editor p,
.shiro-dark-luxury-kit .elementor-text-editor {
    font-family: var(--shiro-font-body);
    font-size: var(--shiro-p);
    line-height: var(--shiro-line-height-body);
    font-weight: 400;
    color: var(--shiro-text-body);
}

/* Ensure Links inside Elementor inherit correctly unless styled as a button */
.shiro-dark-luxury-kit .elementor-widget-text-editor a {
    color: var(--shiro-accent);
    text-decoration: none;
    transition: var(--shiro-transition);
}
.shiro-dark-luxury-kit .elementor-widget-text-editor a:hover {
    color: var(--shiro-primary-hover);
}


   /* =========================================
       SHIRO DARK LUXURY - SHORT MID CTA STRIP
       Scoped to .shiro-dark-luxury-kit
       ========================================= */

    /* Outer Wrapper Constraint */
    .shiro-dark-luxury-kit .shiro-dark-luxury-cta-strip {
        position: relative;
        width: 100%;
        max-width: 100%;
        background-color: var(--shiro-bg-main-dark, #231F1C);
        padding: 3.5rem 0; /* Significantly reduced for a strip feel */
        overflow: hidden;
        box-sizing: border-box;
    }

    .shiro-dark-luxury-kit .shiro-dark-luxury-cta-strip * {
        box-sizing: border-box;
    }

    /* Japanese Theme Texture Background (Faint Seigaiha Waves) */
    .shiro-dark-luxury-kit .shiro-dark-luxury-cta-texture {
        position: absolute;
        inset: 0;
        z-index: 0;
        opacity: 0.03; /* Extremely faint for elegance */
        background-image: radial-gradient(circle at 25px 25px, transparent 15px, #FFFFFF 16px, #FFFFFF 18px, transparent 19px), 
                          radial-gradient(circle at 25px 25px, transparent 20px, #FFFFFF 21px, #FFFFFF 23px, transparent 24px);
        background-size: 50px 50px;
        background-position: 0 0, 25px 25px;
        pointer-events: none;
    }

    /* Inner Wrapper Constraint */
    .shiro-dark-luxury-kit .shiro-dark-luxury-cta-inner {
        position: relative;
        z-index: 1;
        width: 100%;
        max-width: 1280px; /* Specific user constraint */
        margin: 0 auto;
        padding: 0 var(--shiro-space-md, 2rem);
        display: grid;
        grid-template-columns: 4fr 8fr; /* Wider text column for horizontal flow */
        gap: 3rem;
        align-items: center;
    }

    /* Image Column */
    .shiro-dark-luxury-kit .shiro-dark-luxury-cta-img-col {
        position: relative;
    }

    .shiro-dark-luxury-kit .shiro-dark-luxury-cta-img-wrapper {
        position: relative;
        z-index: 2;
        border-radius: 2px;
        overflow: hidden;
        box-shadow: 0 20px 40px rgba(0, 0, 0, 0.4);
        height: 260px; /* Forced short height for strip layout */
        width: 100%;
    }

    .shiro-dark-luxury-kit .shiro-dark-luxury-cta-img-wrapper img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        display: block;
        transition: transform 1.2s cubic-bezier(0.19, 1, 0.22, 1);
    }

    .shiro-dark-luxury-kit .shiro-dark-luxury-cta-strip:hover .shiro-dark-luxury-cta-img-wrapper img {
        transform: scale(1.05);
    }

    /* Offset Architectural Block (Muted Terracotta) */
    .shiro-dark-luxury-kit .shiro-dark-luxury-cta-img-accent {
        position: absolute;
        bottom: -15px;
        left: -15px;
        width: 50%;
        height: 50%;
        background-color: var(--shiro-accent, #9D6A46);
        z-index: 1;
        border-radius: 2px;
    }

    /* Content Column */
    .shiro-dark-luxury-kit .shiro-dark-luxury-cta-content-col {
        display: flex;
        flex-direction: column;
        justify-content: center;
    }

    /* Typography */
    .shiro-dark-luxury-kit .shiro-dark-luxury-cta-eyebrow {
        font-family: var(--shiro-font-body, 'EB Garamond', serif);
        font-size: 0.8rem;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 0.2em;
        color: var(--shiro-accent, #9D6A46);
        margin-bottom: 0.75rem;
        display: flex;
        align-items: center;
        gap: 12px;
    }

    .shiro-dark-luxury-kit .shiro-dark-luxury-cta-eyebrow::before {
        content: '';
        width: 25px;
        height: 1px;
        background-color: var(--shiro-accent, #9D6A46);
    }

    .shiro-dark-luxury-kit .shiro-dark-luxury-cta-h2 {
        font-family: var(--shiro-font-heading, 'Cormorant', serif);
        font-size: clamp(1.8rem, 3vw, 2.5rem); /* Scaled down slightly */
        line-height: 1.1;
        font-weight: 600;
        color: var(--shiro-color-white, #FFFFFF);
        margin: 0 0 1rem 0;
    }

    .shiro-dark-luxury-kit .shiro-dark-luxury-cta-p {
        font-family: var(--shiro-font-body, 'EB Garamond', serif);
        font-size: 1rem;
        line-height: 1.6;
        color: rgba(255, 255, 255, 0.85);
        margin: 0 0 1.5rem 0;
        max-width: 95%;
    }

    /* CTA Buttons */
    .shiro-dark-luxury-kit .shiro-dark-luxury-cta-actions {
        display: flex;
        flex-wrap: wrap;
        gap: 1rem;
    }

    .shiro-dark-luxury-kit .shiro-dark-luxury-btn {
        font-family: var(--shiro-font-body, 'EB Garamond', serif);
        font-size: 0.85rem;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 0.1em;
        padding: 0.8rem 1.8rem;
        border-radius: 2px;
        transition: all 0.3s ease-in-out;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        text-decoration: none;
        cursor: pointer;
        text-align: center;
    }

    /* Primary Accent Button */
    .shiro-dark-luxury-kit .shiro-btn-accent {
        background-color: var(--shiro-accent, #9D6A46);
        color: var(--shiro-color-white, #FFFFFF);
        border: 1px solid var(--shiro-accent, #9D6A46);
    }

    .shiro-dark-luxury-kit .shiro-btn-accent:hover {
        background-color: transparent;
        color: var(--shiro-accent, #9D6A46);
    }

    /* Secondary Outline Button */
    .shiro-dark-luxury-kit .shiro-btn-outline {
        background-color: transparent;
        color: var(--shiro-color-white, #FFFFFF);
        border: 1px solid rgba(255, 255, 255, 0.3);
    }

    .shiro-dark-luxury-kit .shiro-btn-outline:hover {
        background-color: var(--shiro-color-white, #FFFFFF);
        color: var(--shiro-bg-main-dark, #231F1C);
    }

    /* Responsive */
    @media (max-width: 1024px) {
        .shiro-dark-luxury-kit .shiro-dark-luxury-cta-inner {
            grid-template-columns: 1fr 1fr;
            gap: 2.5rem;
        }
        .shiro-dark-luxury-kit .shiro-dark-luxury-cta-p {
            max-width: 100%;
        }
    }

    @media (max-width: 768px) {
        .shiro-dark-luxury-kit .shiro-dark-luxury-cta-strip {
            padding: 4rem 0;
        }
        .shiro-dark-luxury-kit .shiro-dark-luxury-cta-inner {
            grid-template-columns: 1fr;
            gap: 2.5rem;
        }
        .shiro-dark-luxury-kit .shiro-dark-luxury-cta-img-col {
            padding-left: 15px; 
            max-width: 450px;
            margin: 0 auto;
        }
        .shiro-dark-luxury-kit .shiro-dark-luxury-cta-content-col {
            text-align: center;
        }
        .shiro-dark-luxury-kit .shiro-dark-luxury-cta-eyebrow {
            justify-content: center;
        }
        .shiro-dark-luxury-kit .shiro-dark-luxury-cta-eyebrow::before,
        .shiro-dark-luxury-kit .shiro-dark-luxury-cta-eyebrow::after {
            content: '';
            width: 20px;
            height: 1px;
            background-color: var(--shiro-accent, #9D6A46);
        }
        .shiro-dark-luxury-kit .shiro-dark-luxury-cta-actions {
            justify-content: center;
            flex-direction: column;
        }
        .shiro-dark-luxury-kit .shiro-dark-luxury-cta-actions a {
            width: 100%;
        }
    }/* End custom CSS */