/* ==========================================================================
   INSEWA UI Refresh (v1.0)
   Loaded last on every page (just before </head>), on top of insewa-awesome.css.
   Fixes layout bugs found in the exported Elementor markup and adds polish.
   Remove the <link id="insewa-refresh-css"> tag from a view to opt out.
   ========================================================================== */

::selection {
    background: rgba(21, 184, 174, 0.25);
    color: inherit;
}

/* --------------------------------------------------------------------------
   1. Blog / news card thumbnails (jkit post block)
   The plugin centres the image with left:50% + translate(-50%,-50%) and
   z-index:-1, which put it behind the grey placeholder once the card styles
   forced it to width:100%. Pin it to the box instead.
   -------------------------------------------------------------------------- */
html body .jeg-elementor-kit.jkit-postblock .jkit-thumb .thumbnail-container {
    position: relative !important;
    overflow: hidden !important;
    background: #e2e8f0 !important;
}

html body .jeg-elementor-kit.jkit-postblock .jkit-thumb .thumbnail-container img {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    transform: none !important;
    z-index: 1 !important;
}

html body .jeg-elementor-kit.jkit-postblock .jkit-post:hover .jkit-thumb .thumbnail-container img {
    transform: scale(1.05) !important;
}

/* Category pill on the thumbnail was shifted half off the card */
html body .jeg-elementor-kit.jkit-postblock .jkit-thumb .jkit-post-category,
html body .elementor-100 .elementor-element.elementor-element-7239e1dc .jkit-post-category {
    transform: none !important;
    z-index: 2 !important;
    right: auto !important;
    bottom: auto !important;
    width: auto !important;
    height: auto !important;
    padding: 0 !important;
    background: transparent !important;
}

html body .jeg-elementor-kit.jkit-postblock .jkit-post-meta {
    text-align: left !important;
    justify-content: flex-start !important;
}

html body .elementor-100 .elementor-element.elementor-element-7239e1dc .jkit-post-category span a {
    background: rgba(255, 255, 255, 0.92) !important;
    color: var(--insewa-teal-dark) !important;
    backdrop-filter: blur(6px);
    box-shadow: 0 4px 12px rgba(15, 23, 42, 0.12) !important;
}

/* --------------------------------------------------------------------------
   2. Photo gallery carousel
   The dark figure background showed as an empty bar under every photo.
   -------------------------------------------------------------------------- */
/* The frame had aspect-ratio 4/3 (~275px) while the photo was pinned to 250px */
html body .elementor-widget-image-carousel .swiper-slide {
    padding: 8px 8px 22px !important;
    box-sizing: border-box !important;
}

html body .elementor-widget-image-carousel .swiper-slide-inner {
    aspect-ratio: auto !important;
    background: transparent !important;
    border-radius: 18px !important;
    overflow: hidden !important;
    margin: 0 !important;
    box-shadow: 0 10px 28px rgba(15, 23, 42, 0.14) !important;
}

html body .elementor-widget-image-carousel .swiper-slide-image,
html body .elementor-100 .elementor-element.elementor-element-b5622be .swiper-slide img {
    display: block !important;
    width: 100% !important;
    height: 260px !important;
    object-fit: cover !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    transition: transform 0.5s ease !important;
}

html body .elementor-widget-image-carousel .swiper-slide:hover .swiper-slide-image,
html body .elementor-100 .elementor-element.elementor-element-b5622be .swiper-slide img:hover {
    transform: scale(1.04) !important;
    box-shadow: none !important;
}

html body .elementor-widget-image-carousel .swiper-pagination-bullet {
    width: 8px !important;
    height: 8px !important;
    background: #cbd5e1 !important;
    opacity: 1 !important;
    transition: width 0.3s ease, background 0.3s ease !important;
}

html body .elementor-widget-image-carousel .swiper-pagination-bullet-active {
    width: 24px !important;
    border-radius: 6px !important;
    background: var(--insewa-teal) !important;
}

@media (max-width: 767px) {
    html body .elementor-widget-image-carousel .swiper-slide-image,
    html body .elementor-100 .elementor-element.elementor-element-b5622be .swiper-slide img {
        height: 220px !important;
    }

    /* 22 bullets wrapped onto two lines on phones */
    html body .elementor-widget-image-carousel .swiper-pagination-bullet {
        width: 6px !important;
        height: 6px !important;
        margin: 0 3px !important;
    }

    html body .elementor-widget-image-carousel .swiper-pagination-bullet-active {
        width: 16px !important;
    }
}

/* --------------------------------------------------------------------------
   3. Home: multi-business section collage
   The collage is a single portrait PNG used as a column background with
   background-size:cover, so the tall column cropped both sides off. Frame it
   at its natural 724x1024 ratio instead.
   -------------------------------------------------------------------------- */
/* Both columns share one flat fill so there is no seam between them */
html body .elementor-100 .elementor-element.elementor-element-6ff0851,
html body .elementor-100 .elementor-element.elementor-element-cb74061 {
    background: #0b0d14 !important;
}

html body .elementor-100 .elementor-element.elementor-element-6ff0851 {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    padding: clamp(24px, 3vw, 48px) 0 clamp(24px, 3vw, 48px) clamp(24px, 3vw, 48px) !important;
    border-radius: 0 !important;
    min-height: 0 !important;
}

/* The PNG ends in ~8% of empty white below the photos; crop it off */
html body .elementor-100 .elementor-element.elementor-element-6ff0851 > .elementor-widget-wrap {
    flex: 0 0 auto !important;
    width: 100% !important;
    max-width: 440px !important;
    height: auto !important;
    aspect-ratio: 724 / 945;
    background-size: cover !important;
    background-position: center top !important;
    border-radius: 24px !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    box-shadow: 0 24px 54px rgba(0, 0, 0, 0.45) !important;
}

@media (max-width: 1024px) {
    html body .elementor-100 .elementor-element.elementor-element-6ff0851 > .elementor-widget-wrap {
        max-width: 460px !important;
    }
}

/* Business cards: stack the icon above the text so copy gets the full width */
html body .elementor-100 .elementor-element.elementor-element-cb74061 .elementor-widget-icon-box.elementor-position-inline-start .elementor-icon-box-wrapper {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 16px !important;
    text-align: left !important;
}

html body .elementor-100 .elementor-element.elementor-element-cb74061 .elementor-widget-icon-box.elementor-position-inline-start :is(.elementor-icon-box-content, .elementor-icon-box-title, .elementor-icon-box-description) {
    width: 100% !important;
    text-align: left !important;
}

html body .elementor-100 .elementor-element.elementor-element-cb74061 .elementor-widget-icon-box.elementor-position-inline-start .elementor-icon-box-title {
    margin-bottom: 8px !important;
}

/* --------------------------------------------------------------------------
   Grid alignment
   Boxed sections put content on a 1150px grid (1170px container + 10px wrap
   padding). Full-width "text | photo" split sections padded their text column
   with ad-hoc values (72px / 112px / 119px at 1440px), so their copy started
   off that line. Column padding % resolves against the full-width container,
   so calc((100% - 1150px) / 2) lands exactly on the grid edge.
   -------------------------------------------------------------------------- */
@media (min-width: 1025px) {
    html body .elementor-100 .elementor-element.elementor-element-692ba31d,
    html body .elementor-element.elementor-element-6d95c02,
    html body .elementor-element.elementor-element-46227297 {
        padding-left: max(32px, calc((100% - 1150px) / 2)) !important;
        padding-right: 64px !important;
        /* the dark fill lives on the inner wrap; extend it into the new padding */
        background: rgb(11, 12, 19) !important;
    }

    html body .elementor-100 .elementor-element.elementor-element-692ba31d > .elementor-widget-wrap,
    html body .elementor-element.elementor-element-6d95c02 > .elementor-widget-wrap,
    html body .elementor-element.elementor-element-46227297 > .elementor-widget-wrap {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    /* Their vertical padding was a % of the column width, which the new
       horizontal padding shrinks; pin the original pixel values so section
       heights (and the cover-scaled photos beside them) stay the same. */
    html body .elementor-100 .elementor-element.elementor-element-692ba31d > .elementor-widget-wrap {
        padding-top: 62px !important;
        padding-bottom: 62px !important;
    }

    html body .elementor-element.elementor-element-6d95c02 > .elementor-widget-wrap {
        padding-top: 72px !important;
        padding-bottom: 72px !important;
    }

    html body .elementor-element.elementor-element-46227297 > .elementor-widget-wrap {
        padding-top: 119px !important;
        padding-bottom: 119px !important;
    }

    /* Students: photo beside the split section tiled twice (no size/repeat set) */
    html body .elementor-element.elementor-element-5ebe7998 > .elementor-widget-wrap {
        background-size: cover !important;
        background-repeat: no-repeat !important;
        background-position: 60% center !important;
    }

    /* Home "about" intro was indented an extra 50px past the grid */
    html body .elementor-100 .elementor-element.elementor-element-2d7cd1e3 > .elementor-widget-wrap {
        padding-left: 10px !important;
        padding-right: 48px !important;
    }
}

/* --------------------------------------------------------------------------
   Home: "SEWA合同会社が選ばれる理由" (why SEWA) split section
   -------------------------------------------------------------------------- */
/* The teal glow was an overlay on the inner wrap, so its edge coincided with
   the copy and read as a cramped box. Paint it on the whole column instead. */
html body .elementor-100 .elementor-element.elementor-element-692ba31d {
    background:
        radial-gradient(circle at 12% 18%, rgba(20, 184, 166, 0.14), transparent 55%),
        rgb(11, 12, 19) !important;
}

html body .elementor-100 .elementor-element.elementor-element-692ba31d > .elementor-widget-wrap {
    background: transparent !important;
}

html body .elementor-100 .elementor-element.elementor-element-692ba31d > .elementor-widget-wrap > .elementor-background-overlay {
    display: none !important;
}

/* Two tall, narrow feature cards -> two full-width horizontal cards */
html body .elementor-100 .elementor-element.elementor-element-4ba039d6 > .elementor-container {
    flex-direction: column !important;
    gap: 16px !important;
}

html body .elementor-100 .elementor-element.elementor-element-4ba039d6 > .elementor-container > .elementor-column {
    width: 100% !important;
    max-width: 100% !important;
}

html body .elementor-100 .elementor-element.elementor-element-4ba039d6 > .elementor-container > .elementor-column > .elementor-widget-wrap {
    margin: 0 !important;
    width: 100% !important;
}

html body .elementor-100 .elementor-element.elementor-element-4ba039d6 .elementor-widget-icon-box {
    width: 100% !important;
    padding: 22px 24px !important;
    border-radius: 18px !important;
    transition: border-color 0.3s ease, background 0.3s ease, transform 0.3s ease !important;
}

html body .elementor-100 .elementor-element.elementor-element-4ba039d6 .elementor-widget-icon-box:hover {
    background: rgba(255, 255, 255, 0.06) !important;
    border-color: rgba(21, 184, 174, 0.45) !important;
    transform: translateY(-2px) !important;
}

html body .elementor-100 .elementor-element.elementor-element-4ba039d6 .elementor-icon-box-wrapper {
    flex-direction: row !important;
    align-items: flex-start !important;
    gap: 18px !important;
    text-align: left !important;
}

html body .elementor-100 .elementor-element.elementor-element-4ba039d6 .elementor-icon-box-icon {
    flex: 0 0 auto !important;
    margin: 0 !important;
}

html body .elementor-100 .elementor-element.elementor-element-4ba039d6 :is(.elementor-icon-box-content, .elementor-icon-box-title, .elementor-icon-box-description) {
    text-align: left !important;
}

html body .elementor-100 .elementor-element.elementor-element-4ba039d6 .elementor-icon-box-title {
    margin: 2px 0 8px !important;
}

html body .elementor-100 .elementor-element.elementor-element-4ba039d6 .elementor-icon-box-title br {
    display: none;
}

/* On wide screens the 50/50 split squeezed the copy into a ~510px column
   (long, tall blocks) while the photo filled half the screen. Give the
   copy 58% so it needs fewer lines; the section and photo get shorter.
   Same split on the Service page's copy of this section. */
@media (min-width: 1025px) {
    html body #page :is(.elementor-element-692ba31d, .elementor-element-6d95c02) {
        flex: 0 0 58% !important;
        width: 58% !important;
        max-width: 58% !important;
    }

    html body #page :is(.elementor-element-7ad507d, .elementor-element-cc1699f) {
        flex: 0 0 42% !important;
        width: 42% !important;
        max-width: 42% !important;
    }

    html body #page .elementor-element-692ba31d .elementor-widget-text-editor p {
        max-width: 640px;
    }
}

/* Wide screens: the photo stretched to the full height of the copy column
   (~1,000px+, worse in English). Re-lay the section as a grid inside the
   1150px content width:
       badge / heading / paragraph / CTA   |  photo (contained, rounded)
       card 1                              |  card 2
   The text column and its wrap use display:contents so their widgets can be
   placed directly. Phones keep the stacked layout. */
@media (min-width: 1025px) {
    html body #page .elementor-element.elementor-element-4d73e4ae {
        padding: 96px 0 !important;
        background:
            radial-gradient(circle at 12% 18%, rgba(20, 184, 166, 0.14), transparent 50%),
            rgb(11, 12, 19) !important;
    }

    html body #page .elementor-element-4d73e4ae > .elementor-container {
        display: grid !important;
        grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
        grid-template-areas:
            "badge photo"
            "title photo"
            "text  photo"
            "cta   photo"
            "cards cards";
        grid-template-rows: auto auto auto 1fr auto;
        column-gap: 56px;
        width: min(1150px, 100% - 64px) !important;
        max-width: none !important;
        margin: 0 auto !important;
    }

    html body #page .elementor-element-692ba31d,
    html body #page .elementor-element-692ba31d > .elementor-widget-wrap {
        display: contents !important;
    }

    html body #page .elementor-element-692ba31d > .elementor-widget-wrap > .elementor-background-overlay {
        display: none !important;
    }

    html body #page .elementor-element-2946232b { grid-area: badge; }
    html body #page .elementor-element-1fdd31d3 { grid-area: title; }
    html body #page .elementor-element-6aab4da2 { grid-area: text; }

    html body #page .elementor-element-6c212f50 {
        grid-area: cta;
        align-self: start;
        margin-top: 4px !important;
    }

    html body #page .elementor-element-1fdd31d3 .elementor-heading-title {
        font-size: clamp(26px, 2.2vw, 32px) !important;
    }

    /* Photo: contained and rounded, as tall as the copy beside it */
    html body #page .elementor-element.elementor-element-7ad507d {
        grid-area: photo;
        width: 100% !important;
        max-width: none !important;
        min-height: 400px;
        align-self: stretch;
        overflow: hidden !important;
        border-radius: 24px !important;
        box-shadow: 0 24px 54px rgba(0, 0, 0, 0.45) !important;
    }

    html body #page .elementor-element-7ad507d > .elementor-widget-wrap {
        height: 100% !important;
        background-position: center 30% !important;
    }

    html body #page .elementor-element-746826d {
        display: none !important;
    }

    /* Cards: side by side across the full width */
    html body #page .elementor-element.elementor-element-4ba039d6 {
        grid-area: cards;
        margin-top: 48px !important;
    }

    html body #page .elementor-element-4ba039d6 > .elementor-container {
        flex-direction: row !important;
        gap: 20px !important;
        max-width: none !important;
    }

    html body #page .elementor-element-4ba039d6 > .elementor-container > .elementor-column {
        width: calc(50% - 10px) !important;
        max-width: calc(50% - 10px) !important;
        flex: 1 1 0 !important;
    }

    html body #page .elementor-element-4ba039d6 .elementor-widget-icon-box {
        height: 100% !important;
    }

    html body #page .elementor-element-4ba039d6 > .elementor-container > .elementor-column > .elementor-widget-wrap {
        padding: 0 !important;
        height: 100%;
    }
}

/* Phones/tablets: ~60px side padding squeezed the cards to a few words per line */
@media (max-width: 1024px) {
    html body #page .elementor-element.elementor-element-692ba31d {
        padding: 0 20px !important;
    }

    html body #page .elementor-element-692ba31d > .elementor-widget-wrap {
        padding: 56px 0 40px !important;
    }

    html body #page .elementor-element-4ba039d6 .elementor-widget-icon-box {
        padding: 18px !important;
    }

    html body #page .elementor-element-4ba039d6 .elementor-icon-box-wrapper {
        flex-direction: column !important;
        gap: 12px !important;
    }

    html body #page .elementor-element-5b6267f4 > .elementor-widget-wrap {
        justify-content: flex-start !important;
        align-items: center !important;
        gap: 12px 20px !important;
    }

    html body #page .elementor-element-3ef3ca67 .elementor-button-wrapper {
        text-align: left !important;
    }

    html body #page .elementor-element-3ef3ca67,
    html body #page .elementor-element-3ef3ca67 > .elementor-widget-container {
        margin-left: 0 !important;
        padding-left: 0 !important;
    }
}

/* ~80px of stacked margins between the paragraph and the cards */
html body #page .elementor-element-6aab4da2 {
    margin-bottom: 28px !important;
}

html body #page .elementor-element-6aab4da2 p {
    margin-bottom: 0 !important;
}

html body #page .elementor-element-4ba039d6 {
    margin-top: 0 !important;
}

html body #page .elementor-element-6c212f50 {
    margin-top: 28px !important;
}

/* CTA row: the text link had a 40px left margin, so it sat off the copy edge */
html body .elementor-100 .elementor-element.elementor-element-4aeb60af > .elementor-widget-container {
    margin: 0 24px 0 0 !important;
}

html body .elementor-100 .elementor-element.elementor-element-5b6267f4 > .elementor-widget-wrap {
    align-items: center !important;
    margin-right: 0 !important;
}

@media (max-width: 767px) {
    html body .elementor-100 .elementor-element.elementor-element-4ba039d6 .elementor-widget-icon-box {
        padding: 20px 18px !important;
    }

    html body .elementor-100 .elementor-element.elementor-element-4ba039d6 .elementor-icon-box-wrapper {
        gap: 14px !important;
    }
}

/* --------------------------------------------------------------------------
   About page (/about)
   -------------------------------------------------------------------------- */
/* Hero: a six-line paragraph ran the full 1150px under a centred title */
html body .elementor-element.elementor-element-68656cd {
    padding: 150px 0 80px !important;
}

@media (max-width: 767px) {
    html body .elementor-element.elementor-element-68656cd {
        padding: 110px 0 56px !important;
    }
}

html body .elementor-element.elementor-element-1365f6cb .elementor-heading-title {
    font-size: clamp(30px, 3.4vw, 44px) !important;
    letter-spacing: 0.02em !important;
    margin-bottom: 12px !important;
}

html body .elementor-element.elementor-element-1365f6cb .elementor-heading-title::after {
    content: "";
    display: block;
    width: 56px;
    height: 4px;
    margin: 18px auto 0;
    border-radius: 4px;
    background: var(--insewa-teal);
}

html body .elementor-element.elementor-element-24a47a0f {
    max-width: 860px !important;
    margin: 8px auto 0 !important;
}

html body .elementor-element.elementor-element-24a47a0f :is(p, .elementor-widget-container) {
    text-align: center !important;
    font-size: 15.5px !important;
    line-height: 2 !important;
    color: rgba(255, 255, 255, 0.82) !important;
}

/* Representative message row: logo + company profile on the left, message
   card on the right. Every card in this page now shares the 1170px
   container edges (the logo used to sit ~20px inside them). */
html body .elementor-element.elementor-element-5e1acfa > .elementor-widget-wrap {
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    align-content: stretch !important;
    align-items: stretch !important;
    gap: 20px !important;
    padding: 0 !important;
}

html body .elementor-element.elementor-element-7c5ced2 {
    width: 100% !important;
    margin: 0 !important;
}

html body .elementor-element.elementor-element-be0d08f > .elementor-widget-wrap,
html body .elementor-element.elementor-element-4d27c11,
html body .elementor-element.elementor-element-4d27c11 > .elementor-widget-container {
    margin: 0 !important;
    padding: 0 !important;
}

html body .elementor-element.elementor-element-4d27c11 img {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    border-radius: 20px !important;
}

/* Message text was vertically centred in its tall card */
html body .elementor-element.elementor-element-909cd53 > .elementor-widget-wrap {
    align-content: flex-start !important;
    align-items: flex-start !important;
}

@media (min-width: 1025px) {
    html body .elementor-element.elementor-element-5e1acfa > .elementor-widget-wrap {
        padding-right: 12px !important;
    }

    html body .elementor-element.elementor-element-909cd53 > .elementor-widget-wrap {
        margin-left: 12px !important;
    }
}

.insewa-profile {
    width: 100%;
    padding: 28px 30px;
    border: 1px solid var(--insewa-border);
    border-radius: 20px;
    background: #fff;
    box-shadow: var(--insewa-shadow-sm);
    box-sizing: border-box;
}

html body .insewa-profile h3.insewa-profile__title {
    position: relative;
    margin: 0 0 18px !important;
    padding-bottom: 12px !important;
    font-size: 19px !important;
    font-weight: 700 !important;
    color: #0f172a !important;
}

.insewa-profile__title::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 40px;
    height: 3px;
    border-radius: 3px;
    background: var(--insewa-teal);
}

.insewa-profile__list {
    margin: 0 !important;
}

.insewa-profile__list > div {
    display: grid;
    grid-template-columns: 88px minmax(0, 1fr);
    gap: 16px;
    padding: 14px 0;
    border-top: 1px solid var(--insewa-border);
}

.insewa-profile__list > div:first-child {
    border-top: 0;
    padding-top: 0;
}

.insewa-profile__list dt {
    margin: 0;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.8;
    color: var(--insewa-teal-dark);
}

.insewa-profile__list dd {
    margin: 0 !important;
    font-size: 14px;
    line-height: 1.8;
    color: var(--insewa-text);
}

.insewa-profile__list dd span {
    display: block;
    font-size: 12.5px;
    color: var(--insewa-muted);
}

.insewa-profile__list ul {
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

.insewa-profile__list li {
    position: relative;
    margin: 0 0 6px !important;
    padding-left: 14px !important;
}

.insewa-profile__list li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.75em;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: var(--insewa-teal);
}

.insewa-profile__list li span {
    display: inline;
}

html body .insewa-profile__list a {
    color: var(--insewa-teal-dark) !important;
    font-weight: 600;
}

html body .insewa-profile a.insewa-profile__cta {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin-top: 20px;
    padding: 13px 20px;
    border-radius: 999px;
    background: var(--insewa-teal);
    font-size: 14.5px;
    font-weight: 700;
    color: #fff !important;
    text-decoration: none !important;
    box-shadow: 0 10px 22px rgba(21, 184, 174, 0.3);
    transition: background 0.25s ease, transform 0.25s ease;
}

html body .insewa-profile a.insewa-profile__cta:hover {
    background: var(--insewa-teal-dark);
    transform: translateY(-2px);
}

.insewa-profile__cta svg {
    width: 16px;
    height: 16px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2.4;
    stroke-linecap: round;
    stroke-linejoin: round;
}

@media (max-width: 1024px) {
    html body .elementor-element.elementor-element-5e1acfa > .elementor-widget-wrap {
        margin-bottom: 24px !important;
    }
}

@media (max-width: 600px) {
    .insewa-profile {
        padding: 22px 20px;
    }

    .insewa-profile__list > div {
        grid-template-columns: minmax(0, 1fr);
        gap: 2px;
    }
}

/* Partner CTA: flat grey (#38393f) clashed with the navy palette */
html body .elementor-element.elementor-element-41438700 {
    background:
        radial-gradient(circle at 85% 20%, rgba(21, 184, 174, 0.22), transparent 45%),
        radial-gradient(circle at 10% 90%, rgba(14, 165, 233, 0.14), transparent 40%),
        linear-gradient(135deg, #0b0c13 0%, #131624 100%) !important;
}

html body .elementor-element.elementor-element-41438700 > .elementor-background-overlay {
    display: none !important;
}

/* Dewan Yoman message (restructured markup: .insewa-msg) */
html body .elementor-element.elementor-element-da883f5 {
    width: 100% !important;
    max-width: 100% !important;
}

html body .elementor-element.elementor-element-094a2da .elementor-heading-title {
    font-size: clamp(22px, 2.3vw, 30px) !important;
    line-height: 1.5 !important;
    margin-bottom: 28px !important;
    padding-bottom: 22px !important;
    border-bottom: 1px solid var(--insewa-border) !important;
}

.insewa-msg {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 300px;
    gap: 48px;
    align-items: start;
}

.insewa-msg__main {
    max-width: 760px;
}

html body .insewa-msg p {
    margin: 0 0 16px !important;
    font-size: 15px !important;
    line-height: 1.95 !important;
    color: #475569 !important;
}

html body .insewa-msg p.insewa-msg__lead {
    font-size: 16.5px !important;
    color: var(--insewa-text) !important;
}

.insewa-msg__h {
    margin: 40px 0 14px !important;
    padding-left: 14px !important;
    border-left: 4px solid var(--insewa-teal) !important;
    font-size: 19px !important;
    font-weight: 700 !important;
    line-height: 1.4 !important;
    color: #0f172a !important;
}

.insewa-msg__list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px 14px;
    margin: 6px 0 24px !important;
    padding: 0 !important;
    list-style: none !important;
}

.insewa-msg__list li {
    position: relative;
    margin: 0 !important;
    padding: 12px 14px 12px 42px !important;
    border: 1px solid var(--insewa-border);
    border-radius: 12px;
    background: #fff;
    font-size: 14px;
    line-height: 1.6;
    color: var(--insewa-text);
}

.insewa-msg__list li::before {
    content: "";
    position: absolute;
    left: 14px;
    top: 14px;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: var(--insewa-teal-soft) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230e968d' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center / 11px no-repeat;
}

.insewa-msg__chips {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 4px 0 16px !important;
    padding: 0 !important;
    list-style: none !important;
}

.insewa-msg__chips li {
    margin: 0 !important;
    padding: 8px 18px;
    border: 1px solid rgba(21, 184, 174, 0.3);
    border-radius: 999px;
    background: var(--insewa-teal-soft);
    font-weight: 700;
    font-size: 14.5px;
    color: var(--insewa-teal-dark);
}

.insewa-msg__card {
    position: sticky;
    top: 120px;
    padding: 28px 26px;
    border-radius: 20px;
    background:
        radial-gradient(circle at 90% 0%, rgba(21, 184, 174, 0.25), transparent 55%),
        linear-gradient(160deg, #131624 0%, #0b0c13 100%);
    box-shadow: var(--insewa-shadow-md);
}

html body .insewa-msg__card p.insewa-msg__name {
    margin: 0 0 4px !important;
    font-size: 20px !important;
    font-weight: 800 !important;
    letter-spacing: 0.06em;
    line-height: 1.4 !important;
    color: #fff !important;
}

.insewa-msg__name span {
    display: block;
    margin-top: 2px;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.04em;
    color: var(--insewa-teal);
}

html body .insewa-msg__card p.insewa-msg__org {
    margin: 0 !important;
    font-size: 14px !important;
    color: rgba(255, 255, 255, 0.65) !important;
}

.insewa-msg__contact {
    margin: 20px 0 0 !important;
    padding: 18px 0 0 !important;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    list-style: none !important;
}

.insewa-msg__contact li {
    display: flex;
    gap: 12px;
    align-items: flex-start;
    margin: 0 0 14px !important;
    padding: 0 !important;
    font-size: 14px;
    line-height: 1.6;
    color: rgba(255, 255, 255, 0.82);
    overflow-wrap: anywhere;
}

.insewa-msg__contact li:last-child {
    margin-bottom: 0 !important;
}

.insewa-msg__contact svg {
    flex: 0 0 auto;
    width: 18px;
    height: 18px;
    margin-top: 2px;
    fill: none;
    stroke: var(--insewa-teal);
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

html body .insewa-msg__contact a {
    color: rgba(255, 255, 255, 0.9) !important;
    text-decoration: none !important;
    transition: color 0.2s ease;
}

html body .insewa-msg__contact a:hover {
    color: var(--insewa-teal) !important;
}

@media (max-width: 1024px) {
    .insewa-msg {
        grid-template-columns: minmax(0, 1fr);
        gap: 32px;
    }

    .insewa-msg__main {
        max-width: none;
    }

    .insewa-msg__card {
        position: static;
    }
}

@media (max-width: 600px) {
    .insewa-msg__list {
        grid-template-columns: minmax(0, 1fr);
    }

    html body .elementor-element.elementor-element-24a47a0f :is(p, .elementor-widget-container) {
        text-align: left !important;
        font-size: 14.5px !important;
    }
}

/* --------------------------------------------------------------------------
   Blog post pages
   Astra's "narrow container" capped single posts at 750px, squeezing the
   Elementor layout inside it (hero 710px, article 442px, sidebar 189px).
   -------------------------------------------------------------------------- */
html body.single-post.post-template-elementor_header_footer .site-content > .ast-container {
    max-width: none !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Post element ids differ per post, so target the shared structure:
   section 1 = hero, section 2 = article column + sidebar column. */
html body.single-post #content .elementor > .elementor-top-section:first-child .jkit-post-title .post-title {
    max-width: 920px;
    margin: 0 auto !important;
    line-height: 1.45 !important;
}

html body.single-post #content .elementor > .elementor-top-section:nth-child(2) {
    background: #f1f5f9 !important;
    padding: 72px 0 96px !important;
}

/* Article as a white reading card */
html body.single-post #content .elementor > .elementor-top-section:nth-child(2) > .elementor-container > .elementor-column:first-child > .elementor-widget-wrap {
    padding: 48px 56px !important;
    border: 1px solid var(--insewa-border) !important;
    border-radius: 24px !important;
    background: #fff !important;
    box-shadow: var(--insewa-shadow-sm) !important;
}

html body.single-post #content .elementor > .elementor-top-section:nth-child(2) > .elementor-container > .elementor-column:first-child .elementor-widget-text-editor > .elementor-widget-container {
    font-size: 15.5px;
    color: #475569;
}

html body.single-post #content .elementor > .elementor-top-section:nth-child(2) > .elementor-container > .elementor-column:first-child .elementor-widget-text-editor :is(h2, h3, h4) {
    color: #0f172a !important;
    font-weight: 700 !important;
}

html body.single-post #content .elementor > .elementor-top-section:nth-child(2) > .elementor-container > .elementor-column:first-child .elementor-widget-text-editor h2 {
    position: relative;
    margin: 52px 0 18px !important;
    padding-bottom: 14px !important;
    border-bottom: 1px solid var(--insewa-border);
    font-size: clamp(21px, 2vw, 25px) !important;
    line-height: 1.5 !important;
}

html body.single-post #content .elementor > .elementor-top-section:nth-child(2) > .elementor-container > .elementor-column:first-child .elementor-widget-text-editor h2::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -2px;
    width: 56px;
    height: 3px;
    border-radius: 3px;
    background: var(--insewa-teal);
}

html body.single-post #content .elementor > .elementor-top-section:nth-child(2) > .elementor-container > .elementor-column:first-child .elementor-widget-text-editor > .elementor-widget-container > h2:first-child {
    margin-top: 0 !important;
}

html body.single-post #content .elementor > .elementor-top-section:nth-child(2) > .elementor-container > .elementor-column:first-child .elementor-widget-text-editor h3 {
    margin: 32px 0 12px !important;
    padding-left: 12px !important;
    border-left: 3px solid var(--insewa-teal);
    font-size: 18px !important;
    line-height: 1.55 !important;
}

html body.single-post #content .elementor > .elementor-top-section:nth-child(2) > .elementor-container > .elementor-column:first-child .elementor-widget-text-editor p {
    margin: 0 0 18px !important;
    font-size: 15.5px !important;
    line-height: 2 !important;
    color: #475569 !important;
}

html body.single-post #content .elementor > .elementor-top-section:nth-child(2) > .elementor-container > .elementor-column:first-child .elementor-widget-text-editor ul {
    margin: 10px 0 26px !important;
    padding: 0 !important;
    list-style: none !important;
}

html body.single-post #content .elementor > .elementor-top-section:nth-child(2) > .elementor-container > .elementor-column:first-child .elementor-widget-text-editor li {
    position: relative;
    margin: 0 0 10px !important;
    padding: 12px 16px 12px 40px !important;
    border: 1px solid var(--insewa-border);
    border-radius: 12px;
    background: #f8fafc;
    font-size: 15px !important;
    line-height: 1.85 !important;
    color: #475569 !important;
}

html body.single-post #content .elementor > .elementor-top-section:nth-child(2) > .elementor-container > .elementor-column:first-child .elementor-widget-text-editor li::before {
    content: "";
    position: absolute;
    left: 17px;
    top: 23px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--insewa-teal);
    box-shadow: 0 0 0 4px var(--insewa-teal-soft);
}

html body.single-post #content .elementor > .elementor-top-section:nth-child(2) > .elementor-container > .elementor-column:first-child .elementor-widget-text-editor :is(li, p) > *:last-child {
    margin-bottom: 0 !important;
}

html body.single-post #content .elementor > .elementor-top-section:nth-child(2) > .elementor-container > .elementor-column:first-child .elementor-widget-text-editor strong {
    color: #0f172a !important;
}

/* Sidebar: rounded cards that stay in view while reading */
@media (min-width: 1025px) {
    html body.single-post #content .elementor > .elementor-top-section:nth-child(2) > .elementor-container > .elementor-column:last-child {
        position: sticky !important;
        top: 110px;
        align-self: flex-start !important;
    }
}

html body.single-post #content .elementor > .elementor-top-section:nth-child(2) > .elementor-container > .elementor-column:last-child .elementor-inner-section {
    overflow: hidden !important;
    border-radius: 20px !important;
    box-shadow: var(--insewa-shadow-sm) !important;
}

html body.single-post #content .elementor > .elementor-top-section:nth-child(2) > .elementor-container > .elementor-column:last-child .elementor-inner-section:first-child {
    border: 1px solid var(--insewa-border) !important;
    background: #fff !important;
}

html body.single-post #content .elementor > .elementor-top-section:nth-child(2) > .elementor-container > .elementor-column:last-child .elementor-inner-section:first-child > .elementor-container > .elementor-column > .elementor-widget-wrap {
    padding: 22px 24px !important;
}

html body.single-post #content .elementor > .elementor-top-section:nth-child(2) > .elementor-container > .elementor-column:last-child .elementor-inner-section:first-child .elementor-heading-title {
    position: relative;
    padding-bottom: 12px !important;
    font-size: 20px !important;
}

html body.single-post #content .elementor > .elementor-top-section:nth-child(2) > .elementor-container > .elementor-column:last-child .elementor-inner-section:first-child .elementor-heading-title::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 40px;
    height: 3px;
    border-radius: 3px;
    background: var(--insewa-teal);
}

html body.single-post #content .elementor > .elementor-top-section:nth-child(2) > .elementor-container > .elementor-column:last-child .elementor-inner-section:first-child a {
    transition: color 0.2s ease !important;
}

html body.single-post #content .elementor > .elementor-top-section:nth-child(2) > .elementor-container > .elementor-column:last-child .elementor-inner-section:first-child a:hover {
    color: var(--insewa-teal-dark) !important;
}

@media (max-width: 767px) {
    html body.single-post #content .elementor > .elementor-top-section:nth-child(2) {
        padding: 40px 0 64px !important;
    }

    html body.single-post #content .elementor > .elementor-top-section:nth-child(2) > .elementor-container > .elementor-column:first-child > .elementor-widget-wrap {
        padding: 28px 20px !important;
        border-radius: 18px !important;
    }
}

/* --------------------------------------------------------------------------
   Blog listing (/recents): single column of uneven cards -> 2-column grid
   -------------------------------------------------------------------------- */
html body .elementor-element.elementor-element-70760712 .jkit-posts {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 24px !important;
}

html body .elementor-element.elementor-element-70760712 .jkit-post {
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
    margin: 0 !important;
}

html body .elementor-element.elementor-element-70760712 .jkit-thumb,
html body .elementor-element.elementor-element-70760712 .jkit-thumb .thumbnail-container,
html body .elementor-element.elementor-element-70760712 .jkit-thumb img {
    height: 200px !important;
}

html body .elementor-element.elementor-element-70760712 .jkit-postblock-content {
    display: flex !important;
    flex: 1 1 auto !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    padding: 20px 22px 22px !important;
}

html body .elementor-element.elementor-element-70760712 .jkit-post-title {
    margin: 4px 0 8px !important;
    line-height: 1.55 !important;
}

html body .elementor-element.elementor-element-70760712 .jkit-post-title a {
    font-size: 17px !important;
}

/* Excerpts ran 1-12 lines; cap at 3 so cards line up */
html body .elementor-element.elementor-element-70760712 .jkit-post-excerpt p {
    display: -webkit-box !important;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden !important;
    font-size: 14px !important;
    line-height: 1.8 !important;
    color: var(--insewa-muted) !important;
}

html body .elementor-element.elementor-element-70760712 .jkit-post-meta-bottom {
    margin-top: auto !important;
    padding-top: 16px !important;
}

@media (min-width: 1025px) {
    html body .elementor-element.elementor-element-74869263 {
        position: sticky !important;
        top: 110px;
        align-self: flex-start !important;
    }
}

@media (max-width: 767px) {
    html body .elementor-element.elementor-element-70760712 .jkit-posts {
        grid-template-columns: minmax(0, 1fr) !important;
    }
}

/* Category / author archives (Astra blog grid): same uncapped excerpts */
html body.archive .ast-row {
    align-items: stretch !important;
}

html body.archive .ast-row > article {
    display: flex !important;
}

html body.archive .ast-article-inner {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    border: 1px solid var(--insewa-border) !important;
    border-radius: 20px !important;
    background: #fff !important;
    box-shadow: var(--insewa-shadow-sm) !important;
    transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease !important;
}

html body.archive .ast-article-inner:hover {
    transform: translateY(-4px) !important;
    border-color: rgba(21, 184, 174, 0.45) !important;
    box-shadow: var(--insewa-shadow-md) !important;
}

html body.archive .ast-blog-featured-section img {
    width: 100% !important;
    height: 200px !important;
    object-fit: cover !important;
    border-radius: 14px !important;
}

html body.archive .ast-excerpt-container {
    display: -webkit-box !important;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden !important;
    font-size: 14px !important;
    line-height: 1.8 !important;
    color: var(--insewa-muted) !important;
}

html body.archive .entry-title a {
    color: #0f172a !important;
    transition: color 0.2s ease !important;
}

html body.archive .entry-title a:hover {
    color: var(--insewa-teal-dark) !important;
}

/* --------------------------------------------------------------------------
   Sizing scale (site-wide tidy-up)
   Section headings were 30/34/35/36/40px, primary buttons 55/58/68px tall,
   section spacing anywhere from 80/120 to 100/100. One scale everywhere:
   section H2 32px, buttons 48px, sections 80px. Targeted by element id so
   small eyebrow labels (also h2 tags) are left alone.
   -------------------------------------------------------------------------- */
html body #page :is(
    .elementor-element-238bd517, .elementor-element-1fdd31d3, .elementor-element-139b816, .elementor-element-78701dde,
    .elementor-element-7f2203c, .elementor-element-2ee0b32f,
    .elementor-element-3af2c56d, .elementor-element-dfcd308,
    .elementor-element-2eb7d925, .elementor-element-434b987b, .elementor-element-57dfdbd,
    .elementor-element-2c0bac46, .elementor-element-348008b,
    .elementor-element-533082bb, .elementor-element-4e22303b, .elementor-element-6e28dde9, .elementor-element-3debe42,
    .elementor-element-76ce409b, .elementor-element-1ba247f6,
    .elementor-element-2e08425a
) .elementor-heading-title {
    font-size: clamp(24px, 2.3vw, 32px) !important;
    line-height: 1.45 !important;
}

/* Primary buttons -> 48px tall */
html body #page :is(
    .elementor-element-742a3677, .elementor-element-7ff54b3, .elementor-element-3ef3ca67,
    .elementor-element-577c0be, .elementor-element-25156d74, .elementor-element-dec86e8,
    .elementor-element-af9ab17, .elementor-element-59e65366,
    .elementor-element-f3412cc, .elementor-element-577d646, .elementor-element-b82151a
) .elementor-button {
    min-height: 48px !important;
    padding: 12px 28px !important;
    font-size: 15px !important;
    line-height: 1.6 !important;
    box-sizing: border-box !important;
}

/* 「詳しくは」 links: bare text on Support/Students, pills everywhere else */
html body #page :is(
    .elementor-element-54f74be, .elementor-element-e114d55,
    .elementor-element-ed5b2ea, .elementor-element-96f728e
) .elementor-button {
    padding: 9px 20px !important;
    border-radius: 999px !important;
    background: rgba(21, 184, 174, 0.12) !important;
    font-size: 14px !important;
    color: rgb(21, 184, 174) !important;
}

/* Section spacing -> 80px */
html body #page :is(
    .elementor-element-463bbd0d, .elementor-element-5055899e,
    .elementor-element-6eff1b0, .elementor-element-be23509, .elementor-element-41438700,
    .elementor-element-17acf069, .elementor-element-11231f3e, .elementor-element-59097f51
) {
    padding-top: 80px !important;
    padding-bottom: 80px !important;
}

html body #page .elementor-element.elementor-element-9b37c20 {
    padding-top: 64px !important;
    padding-bottom: 80px !important;
}

html body #page .elementor-element.elementor-element-3a967c9f {
    padding-bottom: 80px !important;
}

@media (max-width: 767px) {
    html body #page :is(
        .elementor-element-463bbd0d, .elementor-element-5055899e, .elementor-element-9b37c20,
        .elementor-element-6eff1b0, .elementor-element-be23509, .elementor-element-41438700,
        .elementor-element-17acf069, .elementor-element-11231f3e, .elementor-element-59097f51
    ) {
        padding-top: 56px !important;
        padding-bottom: 56px !important;
    }
}

/* Home hero: the two service cards stretch to the headline column's height,
   so shorten that column (it had ~50px gaps around the paragraph) rather
   than letting the cards end at different heights. */
html body .elementor-100 .elementor-element.elementor-element-6ab23c01 > .elementor-widget-wrap {
    padding: 0 10px 0 0 !important;
}

html body .elementor-100 .elementor-element.elementor-element-58be13b9 {
    margin-bottom: 8px !important;
}

html body .elementor-100 .elementor-element.elementor-element-6ab23c01 .elementor-widget-text-editor {
    margin-bottom: 28px !important;
}

html body .elementor-100 .elementor-element.elementor-element-6ab23c01 .elementor-widget-text-editor p {
    margin-bottom: 0 !important;
}

html body .elementor-100 .elementor-element.elementor-element-5f569111 .elementor-icon-box-title {
    font-size: 19px !important;
    line-height: 1.4 !important;
}

html body .elementor-100 :is(.elementor-element-54c5c48, .elementor-element-b1a8b06) > .elementor-widget-wrap {
    padding: 22px 22px 24px !important;
}

/* Briefcase icon sat flush against its title */
html body .elementor-100 .elementor-element.elementor-element-5f569111 .elementor-icon-box-wrapper {
    align-items: center !important;
    gap: 12px !important;
}

html body .elementor-100 .elementor-element.elementor-element-5f569111 .elementor-icon-box-icon {
    margin: 0 !important;
}

/* Home hero photo strip: 320px -> 260px */
html body .elementor-100 .elementor-element.elementor-element-6668c809 .elementor-widget-image img {
    height: 260px !important;
    object-fit: cover !important;
}

/* Home "why SEWA": trim inner padding and card padding */
html body .elementor-100 .elementor-element.elementor-element-692ba31d > .elementor-widget-wrap {
    padding-top: 48px !important;
    padding-bottom: 48px !important;
}

html body .elementor-100 .elementor-element.elementor-element-4ba039d6 > .elementor-container {
    gap: 12px !important;
}

html body .elementor-100 .elementor-element.elementor-element-4ba039d6 .elementor-widget-icon-box {
    padding: 18px 22px !important;
}

/* Home business section: ~150px of stacked padding in the text column */
@media (min-width: 1025px) {
    html body .elementor-100 .elementor-element.elementor-element-cb74061 {
        padding: 56px 48px !important;
    }

    html body .elementor-100 .elementor-element.elementor-element-cb74061 > .elementor-widget-wrap {
        padding: 48px !important;
    }
}

/* Home blog cards: 513px tall -> shorter thumbs, 2-line excerpts */
html body .elementor-100 .elementor-element.elementor-element-7239e1dc .jkit-thumb,
html body .elementor-100 .elementor-element.elementor-element-7239e1dc .jkit-thumb .thumbnail-container {
    height: 190px !important;
}

html body .elementor-100 .elementor-element.elementor-element-7239e1dc .jkit-post-excerpt p {
    display: -webkit-box !important;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden !important;
}

html body .elementor-100 .elementor-element.elementor-element-7239e1dc .jkit-postblock-content {
    padding: 20px 22px 22px !important;
}

/* --------------------------------------------------------------------------
   4. Support page: CTA paragraph was dark slate on a near-black panel
   -------------------------------------------------------------------------- */
html body .insewa-cta-box p {
    color: rgba(226, 232, 240, 0.85) !important;
}

/* --------------------------------------------------------------------------
   5. Mobile gutters: boxed sections sat ~8px from the screen edge
   -------------------------------------------------------------------------- */
@media (max-width: 767px) {
    html body .elementor-top-section.elementor-section-boxed > .elementor-container {
        padding-left: 10px !important;
        padding-right: 10px !important;
    }
}

/* --------------------------------------------------------------------------
   Header popups (all widths)
   backdrop-filter on #masthead makes it the containing block for
   position:fixed descendants. #masthead is only ~10px tall (the visible bar
   is an inner section that overlaps the hero), so the search popup (a
   SweetAlert2 container mounted inside the header) opened 11px tall and
   looked like the button did nothing. The blur only covered that thin
   strip anyway, so drop it.
   -------------------------------------------------------------------------- */
html body #masthead {
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
}

html body #masthead .swal2-container {
    z-index: 10020 !important;
}

/* Search popup: a clear, solid search bar instead of a faint outline.
   The plugin makes the popup full-screen and centres the panel at 50%
   height; only constrain the bar's width. */
html body #masthead .swal2-container.shown {
    background: rgba(5, 6, 10, 0.9) !important;
}

/* The plugin's own animated dark layer covered the bar and greyed it out */
html body #masthead .swal2-container::before {
    display: none !important;
}

/* The plugin pinned the bar to the very top, under the header and the
   close button; place it clearly below them. */
html body #masthead .swal2-container .jkit-modal-search-panel {
    top: auto !important;
    transform: none !important;
    transition: opacity 0.2s ease !important;
    transition-delay: 0s !important;
    width: 100% !important;
    margin-top: max(96px, 22vh) !important;
    padding: 0 16px !important;
    box-sizing: border-box !important;
}

html body #masthead .swal2-container .jkit-search-panel::before {
    content: "サイト内検索 / Search";
    display: block;
    margin: 0 0 14px 8px;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 0.04em;
    color: rgba(255, 255, 255, 0.75);
}

html body #masthead .swal2-container .jkit-search-panel {
    width: 100% !important;
    max-width: 640px !important;
    margin: 0 auto !important;
}

html body #masthead .swal2-container .jkit-search-group {
    width: 100% !important;
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    margin: 0 !important;
}

html body #masthead .swal2-container .jkit-search-field {
    width: 100% !important;
    height: 60px !important;
    margin: 0 !important;
    padding: 0 72px 0 24px !important;
    border: 2px solid transparent !important;
    border-radius: 999px !important;
    background: #ffffff !important;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.45) !important;
    font-size: 16px !important;
    color: #0f172a !important;
}

html body #masthead .swal2-container .jkit-search-field:focus {
    border-color: var(--insewa-teal) !important;
    outline: none !important;
}

html body #masthead .swal2-container .jkit-search-field::placeholder {
    color: #94a3b8 !important;
}

html body #masthead .swal2-container .jkit-search-button {
    position: absolute !important;
    top: 50% !important;
    right: 8px !important;
    width: 46px !important;
    height: 46px !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: translateY(-50%) !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border: 0 !important;
    border-radius: 50% !important;
    background: var(--insewa-teal) !important;
    color: #fff !important;
    cursor: pointer !important;
}

html body #masthead .swal2-container .jkit-search-button:hover {
    background: var(--insewa-teal-dark) !important;
}

html body #masthead .swal2-container .jkit-search-button svg {
    width: 18px !important;
    height: 18px !important;
    fill: currentColor !important;
}

html body #masthead .swal2-container .swal2-close {
    position: fixed !important;
    top: 16px !important;
    right: 16px !important;
    width: 44px !important;
    height: 44px !important;
    margin: 0 !important;
    transform: none !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 50% !important;
    border: 1px solid rgba(255, 255, 255, 0.2) !important;
    background: rgba(255, 255, 255, 0.08) !important;
    font-size: 26px !important;
    color: #fff !important;
}

html body #masthead .swal2-container .swal2-close:hover {
    background: rgba(255, 255, 255, 0.16) !important;
}

/* Phones/tablets: the search icon was hidden (display:none); show it
   between the language pills and the menu button */
@media (max-width: 1024px) {
    html body #page #masthead .elementor-element.elementor-element-d56f36c {
        display: block !important;
        flex: 0 0 auto !important;
    }

    html body #page #masthead .elementor-element-d56f36c .jkit-search-modal {
        width: 40px !important;
        height: 40px !important;
    }

    html body #page #masthead .elementor-element-1745a605 > .elementor-widget-wrap {
        gap: 8px !important;
    }
}

@media (max-width: 420px) {
    html body #masthead .gt-lang-pill {
        padding-left: 7px !important;
        padding-right: 7px !important;
    }
}

/* Smallest phones: logo + pills + search + menu overlapped at 360px */
@media (max-width: 380px) {
    html body #masthead .elementor-element-4b0e4419 img {
        max-height: 30px !important;
    }

    html body #masthead .gt-lang-pill {
        padding-left: 5px !important;
        padding-right: 5px !important;
    }

    html body #masthead .gt-lang-pill img {
        display: none !important;
    }
}

/* --------------------------------------------------------------------------
   Mobile / tablet header and slide-out menu (<= 1024px)
   The glass header's backdrop-filter makes #masthead the containing block
   for position:fixed children, so the slide-out menu panel (fixed, inside
   the header) opened at the header's ~8px height and its links were
   invisible. The three header columns (117 + 189 + 68px) also overflowed a
   362px row, pushing the menu button off-screen.
   -------------------------------------------------------------------------- */
@media (max-width: 1024px) {
    html body #masthead {
        -webkit-backdrop-filter: none !important;
        backdrop-filter: none !important;
        background: rgba(11, 12, 19, 0.97) !important;
    }

    html body #masthead .elementor-element-7d464e98 {
        padding: 10px 12px !important;
    }

    html body #masthead .elementor-element-7d464e98 > .elementor-container {
        flex-wrap: nowrap !important;
        align-items: center !important;
        gap: 8px !important;
        padding: 0 !important;
    }

    html body #masthead :is(.elementor-element-7fc25b9a, .elementor-element-4da2c238) {
        flex: 0 0 auto !important;
        width: auto !important;
    }

    html body #masthead .elementor-element-1745a605 {
        flex: 1 1 auto !important;
        width: auto !important;
        min-width: 0 !important;
    }

    html body #masthead :is(.elementor-element-7fc25b9a, .elementor-element-1745a605, .elementor-element-4da2c238) > .elementor-widget-wrap {
        padding: 0 !important;
        margin: 0 !important;
    }

    html body #masthead .elementor-element-1745a605 > .elementor-widget-wrap {
        flex: 1 1 auto !important;
        width: 100% !important;
        justify-content: flex-end !important;
    }

    html body #masthead .gtranslate_wrapper {
        margin-left: auto !important;
    }

    html body #masthead .elementor-element-4b0e4419 img {
        max-height: 40px !important;
        width: auto !important;
    }

    /* Menu button */
    html body #masthead .jkit-hamburger-menu {
        width: 42px !important;
        height: 42px !important;
        margin: 0 !important;
        padding: 0 !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        border-radius: 12px !important;
        border: 1px solid rgba(255, 255, 255, 0.14) !important;
        background: rgba(255, 255, 255, 0.06) !important;
        color: #fff !important;
    }

    html body #masthead .jkit-hamburger-menu svg {
        width: 20px !important;
        height: 20px !important;
        fill: currentColor !important;
    }

    /* Slide-out panel: full height, readable, scrolls if needed */
    html body #masthead .jkit-menu-wrapper {
        z-index: 10010 !important; /* above the language pills (10002) */
        width: min(330px, 86vw) !important;
        height: 100vh !important;
        height: 100dvh !important;
        overflow-y: auto !important;
        background: #0b0c13 !important;
        box-shadow: 18px 0 48px rgba(0, 0, 0, 0.5) !important;
        /* jkit renders the logo/close row after the links and flips them with
           column-reverse; flex-end packs both at the top of the full-height panel */
        flex-direction: column-reverse !important;
        justify-content: flex-end !important;
    }

    html body #masthead .jkit-menu-wrapper .jkit-menu-container,
    html body #masthead .jkit-menu-wrapper .jkit-menu {
        height: auto !important;
        overflow: visible !important;
    }

    html body #masthead .jkit-menu-wrapper .jkit-nav-identity-panel {
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        padding: 18px 20px !important;
        border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
    }

    html body #masthead .jkit-menu-wrapper .jkit-nav-identity-panel img {
        max-height: 40px !important;
        width: auto !important;
    }

    html body #masthead .jkit-menu-wrapper .jkit-close-menu {
        width: 40px !important;
        height: 40px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        border-radius: 12px !important;
        border: 1px solid rgba(255, 255, 255, 0.14) !important;
        background: rgba(255, 255, 255, 0.06) !important;
        color: #fff !important;
    }

    html body #masthead .jkit-menu-wrapper .jkit-close-menu svg {
        fill: currentColor !important;
    }

    html body #masthead .jkit-menu-wrapper .jkit-menu {
        padding: 12px 12px 24px !important;
    }

    html body #masthead .jkit-menu-wrapper .jkit-menu > li > a {
        padding: 14px 14px !important;
        border-radius: 12px !important;
        font-size: 16px !important;
        font-weight: 600 !important;
        color: rgba(255, 255, 255, 0.92) !important;
    }

    html body #masthead .jkit-menu-wrapper .jkit-menu > li > a:hover,
    html body #masthead .jkit-menu-wrapper .jkit-menu > li.current-menu-item > a {
        background: rgba(21, 184, 174, 0.12) !important;
        color: var(--insewa-teal) !important;
    }

    html body #masthead .jkit-menu-wrapper .sub-menu {
        margin: 2px 0 6px 14px !important;
        padding-left: 10px !important;
        border-left: 2px solid rgba(21, 184, 174, 0.35) !important;
        background: transparent !important;
    }

    html body #masthead .jkit-menu-wrapper .sub-menu a {
        padding: 10px 12px !important;
        font-size: 14.5px !important;
        color: rgba(255, 255, 255, 0.8) !important;
    }

    /* Dimmed backdrop behind the panel, only while it is open */
    html body #masthead .jkit-menu-wrapper.active + .jkit-overlay {
        position: fixed !important;
        inset: 0 !important;
        background: rgba(0, 0, 0, 0.55) !important;
        z-index: 10005 !important;
    }

    /* Hero copy sat ~4px from the screen edge */
    html body #page .elementor-element-6ab23c01 > .elementor-widget-wrap {
        padding: 0 !important;
    }

    html body #page .elementor-element-6ab23c01 .elementor-widget {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
}

@media (max-width: 380px) {
    html body #masthead .gt-lang-pill {
        padding-left: 6px !important;
        padding-right: 6px !important;
    }
}

/* --------------------------------------------------------------------------
   6. Back-to-top button: theme default was a blue square
   -------------------------------------------------------------------------- */
html body #ast-scroll-top {
    width: 46px !important;
    height: 46px !important;
    line-height: 46px !important;
    border-radius: 50% !important;
    background: var(--insewa-teal) !important;
    color: #fff !important;
    box-shadow: 0 10px 24px rgba(21, 184, 174, 0.35) !important;
    transition: transform 0.25s ease, background 0.25s ease !important;
}

html body #ast-scroll-top:hover {
    background: var(--insewa-teal-dark) !important;
    transform: translateY(-3px) !important;
}

/* --------------------------------------------------------------------------
   7. Accessibility
   -------------------------------------------------------------------------- */
:where(a, button, input, textarea, select, summary, [tabindex]):focus-visible {
    outline: 3px solid rgba(21, 184, 174, 0.6) !important;
    outline-offset: 3px !important;
}

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

    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}