/**
 * Page CSS: お問い合わせページ
 * Page   : Contact
 * Block  : cont-s00
 *
 * Dependencies:
 *   - reset.css  (global, loaded before this file — no reset rules re-declared here)
 *   - common.css (global, loaded before this file — common vars referenced via var())
 */

/* ================================================================
  PAGE-SCOPED CSS CUSTOM PROPERTIES
  Naming: --cont-s00-{property}
  ================================================================ */
:root {
    /* --- Colors --- */
    --cont-s00-color-header:              #130E0D;
    --cont-s00-color-bg:                  #FDF2F8;
    --cont-s00-color-text-primary:        #831843;
    --cont-s00-color-text-secondary:      #64748B;
    --cont-s00-color-text-muted:          #9CA3AF;
    --cont-s00-color-border:              #E2C4D5;
    --cont-s00-color-input-border:        #D1D5DB;
    --cont-s00-color-input-border-focus:  #831843;
    --cont-s00-color-input-bg:            #FFFFFF;
    --cont-s00-color-card-urgent-bg:      #6B7280;
    --cont-s00-color-card-urgent-text:    #FFFFFF;
    --cont-s00-color-urgent-badge-text:   #FFFFFF;
    --cont-s00-color-urgent-link-bg:      rgba(255, 255, 255, 0.15);
    --cont-s00-color-urgent-link-hover:   rgba(255, 255, 255, 0.28);
    --cont-s00-color-faq-overlay-bg:      rgba(131, 24, 67, 0.55);
    --cont-s00-color-faq-text:            #FFFFFF;
    --cont-s00-color-submit-bg:           transparent;
    --cont-s00-color-submit-border:       #831843;
    --cont-s00-color-submit-text:         #831843;
    --cont-s00-color-submit-bg-hover:     #831843;
    --cont-s00-color-submit-text-hover:   #FDF2F8;
    --cont-s00-color-focus:               #8B5CF6;
    --cont-s00-color-error:               #DC2626;
    --cont-s00-color-checkbox-accent:     #831843;
    --cont-s00-color-privacy-link:        #831843;

    /* --- Typography --- */
    --cont-s00-font-family-display:       'Playfair Display', Georgia, serif;
    --cont-s00-font-family-body:          'Inter', -apple-system, BlinkMacSystemFont,
                                          'Segoe UI', sans-serif;
    --cont-s00-font-size-page-title:      clamp(2rem, 5vw, 3.5rem);
    --cont-s00-font-size-subcopy:         0.9375rem;
    --cont-s00-font-size-label:           0.75rem;
    --cont-s00-font-size-input:           1rem;
    --cont-s00-font-size-submit:          1rem;
    --cont-s00-font-size-urgent-badge:    1.125rem;
    --cont-s00-font-size-urgent-body:     0.875rem;
    --cont-s00-font-size-urgent-label:    0.6875rem;
    --cont-s00-font-size-urgent-main:     1rem;
    --cont-s00-font-size-faq-label:       1.25rem;
    --cont-s00-font-size-faq-sublabel:    0.875rem;
    --cont-s00-font-size-faq-cta:         0.75rem;
    --cont-s00-line-height-body:          1.75;
    --cont-s00-letter-spacing-display:    0.12em;
    --cont-s00-letter-spacing-label:      0.08em;

    /* --- Spacing --- */
    --cont-s00-page-padding-top:          80px;
    --cont-s00-page-padding-bottom:       40px;
    --cont-s00-page-padding-x-mobile:     24px;
    --cont-s00-page-padding-x-desktop:    64px;
    --cont-s00-header-margin-bottom:      48px;
    --cont-s00-content-gap:               40px;
    --cont-s00-form-card-padding-mobile:  32px 24px;
    --cont-s00-form-card-padding-desktop: 48px 40px;
    --cont-s00-field-gap:                 40px;
    --cont-s00-label-gap:                 6px;
    --cont-s00-sidebar-gap:               20px;
    --cont-s00-card-padding:              24px;
    --cont-s00-urgent-link-gap:           12px;
    --cont-s00-submit-margin-top:         32px;

    /* --- Grid --- */
    --cont-s00-max-width:                 1200px;
    --cont-s00-sidebar-col-width:         340px;

    /* --- Form dimensions --- */
    --cont-s00-input-height:              48px;
    --cont-s00-textarea-height:           140px;
    --cont-s00-submit-height:             52px;
    --cont-s00-submit-width:              clamp(180px, 50%, 240px);
    --cont-s00-input-border-width:        1px;
    --cont-s00-input-border-radius:       0;

    /* --- Card dimensions --- */
    --cont-s00-card-photo-height:         200px;
    --cont-s00-card-border-radius:        4px;

    /* --- Animation --- */
    --cont-s00-animate-duration:          600ms;
    --cont-s00-animate-easing:            cubic-bezier(0.25, 0.46, 0.45, 0.94);
    --cont-s00-animate-translate-y:       24px;
    --cont-s00-hover-duration:            280ms;
    --cont-s00-hover-easing:              ease;

    /* Stagger delays for sidebar cards (static count = 3) */
    --cont-s00-card-delay-1:              0ms;
    --cont-s00-card-delay-2:              100ms;
    --cont-s00-card-delay-3:              200ms;
}

/* ================================================================
  Contactページのみheaderの色を変更
  ================================================================ */
.site-header {
  background-color: var(--cont-s00-color-header);
}
.site-header--scrolled {
    background-color: var(--color--bg--1);
}

/* ================================================================
  PAGE BASE — .cont-s00
  ================================================================ */
.cont-s00 {
    background-color: var(--cont-s00-color-bg);
    padding-top: var(--cont-s00-page-padding-top);
    padding-bottom: var(--cont-s00-page-padding-bottom);
    padding-left: var(--cont-s00-page-padding-x-mobile);
    padding-right: var(--cont-s00-page-padding-x-mobile);
}

@media (width >= 768px) {
    .cont-s00 {
        padding-left: var(--cont-s00-page-padding-x-desktop);
        padding-right: var(--cont-s00-page-padding-x-desktop);
    }
}


/* ================================================================
  PAGE HEADER
  ================================================================ */
.cont-s00__page-header {
    text-align: center;
    margin-bottom: var(--cont-s00-header-margin-bottom);
}

.cont-s00__page-header-inner {
    max-width: var(--cont-s00-max-width);
    margin-left: auto;
    margin-right: auto;
}

.cont-s00__page-title {
    font-family: var(--cont-s00-font-family-display);
    font-size: var(--cont-s00-font-size-page-title);
    font-weight: 600;
    font-style: italic;
    letter-spacing: var(--cont-s00-letter-spacing-display);
    color: var(--cont-s00-color-text-primary);
    line-height: 1.1;
}

.cont-s00__page-subcopy {
    font-family: var(--cont-s00-font-family-body);
    font-size: var(--cont-s00-font-size-subcopy);
    font-weight: 300;
    line-height: var(--cont-s00-line-height-body);
    color: var(--cont-s00-color-text-secondary);
    margin-top: 16px;
}


/* ================================================================
  CONTENT WRAPPER + GRID
  Mobile: single column stack
  Desktop (≥ 960px): form | sidebar
  ================================================================ */
.cont-s00__content-wrapper {
    max-width: var(--cont-s00-max-width);
    margin-left: auto;
    margin-right: auto;
}

.cont-s00__content-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--cont-s00-content-gap);
}

@media (width >= 960px) {
    .cont-s00__content-grid {
        grid-template-columns: 1fr var(--cont-s00-sidebar-col-width);
        align-items: start;
    }
}


/* ================================================================
  FORM CARD
  ================================================================ */
.cont-s00__form-card {
    background-color: var(--cont-s00-color-input-bg);
    padding: var(--cont-s00-form-card-padding-mobile);
    border-radius: var(--cont-s00-card-border-radius);
    box-shadow: 0 2px 16px rgba(131, 24, 67, 0.06);
}

@media (width >= 768px) {
    .cont-s00__form-card {
        padding: var(--cont-s00-form-card-padding-desktop);
    }
}


/* ================================================================
  CONTACT FORM 7 — CUSTOM STYLES
  Scoped under .cont-s00__form-card to avoid bleeding into other pages.
  ================================================================ */

/* Remove CF7 default paragraph wrapping margins */
.cont-s00__form-card .wpcf7-form p {
    margin: 0;
}

/* Field group wrapper — each label+input pair */
.cont-s00__form-card .wpcf7-form .cont-s00__field-group {
    display: flex;
    flex-direction: column;
    gap: var(--cont-s00-label-gap);
    margin-bottom: var(--cont-s00-field-gap);
}

/* Field label typography */
.cont-s00__form-card .cont-s00__field-label {
    font-family: var(--cont-s00-font-family-body);
    font-size: var(--cont-s00-font-size-label);
    font-weight: 400;
    letter-spacing: var(--cont-s00-letter-spacing-label);
    color: var(--cont-s00-color-text-secondary);
    text-transform: uppercase;
}

/* Label sub-text (e.g. "/ NAME") */
.cont-s00__field-label-sub {
    font-size: var(--cont-s00-font-size-label);
    color: var(--cont-s00-color-text-muted);
    letter-spacing: 0.04em;
    margin-left: 6px;
}

/* ---- Input / Textarea / Select base styles ---- */
.cont-s00__form-card input[type="text"],
.cont-s00__form-card input[type="email"],
.cont-s00__form-card input[type="tel"],
.cont-s00__form-card select,
.cont-s00__form-card textarea {
    width: 100%;
    height: var(--cont-s00-input-height);
    padding: 0 0 8px;

    background-color: transparent;
    border: none;
    border-bottom: var(--cont-s00-input-border-width) solid var(--cont-s00-color-input-border);
    border-radius: var(--cont-s00-input-border-radius);
    outline: none;

    font-family: var(--cont-s00-font-family-body);
    font-size: var(--cont-s00-font-size-input);
    font-weight: 400;
    color: var(--cont-s00-color-text-primary);
    line-height: 1.5;

    transition:
        border-color var(--cont-s00-hover-duration) var(--cont-s00-hover-easing);

    appearance: none;
    -webkit-appearance: none;
}

/* Textarea overrides */
.cont-s00__form-card textarea {
    height: var(--cont-s00-textarea-height);
    padding-top: 8px;
    resize: vertical;
}

/* Select: custom arrow icon */
.cont-s00__form-card select {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' width='16' height='16'%3E%3Cpath d='M4 6l4 4 4-4' stroke='%23831843' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round' fill='none'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 4px center;
    padding-right: 28px;
    cursor: pointer;
}

/* Placeholder color */
.cont-s00__form-card input::placeholder,
.cont-s00__form-card textarea::placeholder {
    color: var(--cont-s00-color-text-muted);
    font-weight: 300;
}

/* Select default option muted color */
.cont-s00__form-card select option[value=""] {
    color: var(--cont-s00-color-text-muted);
}

/* Focus state — bottom border highlight */
.cont-s00__form-card input[type="text"]:focus,
.cont-s00__form-card input[type="email"]:focus,
.cont-s00__form-card input[type="tel"]:focus,
.cont-s00__form-card select:focus,
.cont-s00__form-card textarea:focus {
    border-bottom-color: var(--cont-s00-color-input-border-focus);
}

/* Focus-visible outline for keyboard navigation — A6 */
.cont-s00__form-card input[type="text"]:focus-visible,
.cont-s00__form-card input[type="email"]:focus-visible,
.cont-s00__form-card input[type="tel"]:focus-visible,
.cont-s00__form-card select:focus-visible,
.cont-s00__form-card textarea:focus-visible {
    outline: 2px solid var(--cont-s00-color-focus);
    outline-offset: 2px;
}

/* ---- Checkbox (privacy policy) ---- */
.cont-s00__privacy-wrap {
    display: flex;
    align-items: center;
    /* margin-bottom: var(--cont-s00-field-gap); */
}

.cont-s00__privacy-wrap .wpcf7-acceptance {
    display: flex;
    align-items: center;
    gap: 10px;
}

.cont-s00__privacy-wrap .wpcf7-list-item {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0;          /* CF7 デフォルトの margin をリセット */
}

/* ラベルテキスト（チェックボックスの隣） */
.cont-s00__privacy-wrap .wpcf7-list-item-label {
    font-family: var(--cont-s00-font-family-body);
    font-size: 0.875rem;
    font-weight: 300;
    color: var(--cont-s00-color-text-secondary);
    line-height: 1.6;
    cursor: pointer;
}

/* プライバシーポリシーリンク */
.cont-s00__privacy-wrap .wpcf7-list-item-label a {
    color: var(--cont-s00-color-privacy-link);
    text-decoration: underline;
    text-underline-offset: 2px;
    transition: opacity 200ms ease;
}

.cont-s00__privacy-wrap .wpcf7-list-item-label a:hover {
    opacity: 0.7;
    text-decoration: none;
}

.cont-s00__privacy-wrap .wpcf7-list-item-label a:focus-visible {
    outline: 2px solid var(--cont-s00-color-focus);
    outline-offset: 2px;
    border-radius: 1px;
}

.cont-s00__form-card input[type="checkbox"] {
    width: 18px;
    height: 18px;
    margin: 0;
    accent-color: var(--cont-s00-color-checkbox-accent);
    cursor: pointer;
    flex-shrink: 0;
}

.cont-s00__form-card input[type="checkbox"]:focus-visible {
    outline: 2px solid var(--cont-s00-color-focus);
    outline-offset: 2px;
}

.cont-s00__privacy-label {
    font-family: var(--cont-s00-font-family-body);
    font-size: 0.875rem;
    color: var(--cont-s00-color-text-secondary);
    line-height: 1.6;
}

/* Privacy policy link */
.cont-s00__privacy-label a {
    color: var(--cont-s00-color-privacy-link);
    text-decoration: underline;
    text-underline-offset: 2px;
}

.cont-s00__privacy-label a:hover {
    text-decoration: none;
}

.cont-s00__privacy-label a:focus-visible {
    outline: 2px solid var(--cont-s00-color-focus);
    outline-offset: 2px;
}

/* ---- Validation messages (CF7) ---- */
.cont-s00__form-card .wpcf7-not-valid-tip {
    display: block;
    font-size: 0.75rem;
    color: var(--cont-s00-color-error);
    margin-top: 4px;
}

.cont-s00__form-card .wpcf7-response-output {
    font-size: 0.875rem;
    padding: 12px 16px;
    margin-top: 16px;
    border-radius: 2px;
}

.cont-s00__form-card .wpcf7-mail-sent-ok {
    border: 1px solid #16A34A;
    color: #15803D;
    background-color: #F0FDF4;
}

.cont-s00__form-card .wpcf7-mail-sent-ng,
.cont-s00__form-card .wpcf7-aborted {
    border: 1px solid var(--cont-s00-color-error);
    color: var(--cont-s00-color-error);
    background-color: #FEF2F2;
}

.cont-s00__form-card .wpcf7-validation-errors {
    border: 1px solid #F59E0B;
    color: #92400E;
    background-color: #FFFBEB;
}

.cont-s00__form-card .wpcf7-spinner {
    margin-left: 12px;
    vertical-align: middle;
}

/* ---- Submit button ---- */
.cont-s00__form-card input[type="submit"],
.cont-s00__form-card .wpcf7-submit {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;

    width: var(--cont-s00-submit-width);
    height: var(--cont-s00-submit-height);
    min-height: 44px;

    background-color: var(--cont-s00-color-submit-bg);
    border: 2px solid var(--cont-s00-color-submit-border);
    border-radius: 0;

    font-family: var(--cont-s00-font-family-body);
    font-size: var(--cont-s00-font-size-submit);
    font-weight: 400;
    letter-spacing: 0.08em;
    color: var(--cont-s00-color-submit-text);

    cursor: pointer;
    margin-top: var(--cont-s00-submit-margin-top);

    transition:
        background-color var(--cont-s00-hover-duration) var(--cont-s00-hover-easing),
        color            var(--cont-s00-hover-duration) var(--cont-s00-hover-easing),
        border-color     var(--cont-s00-hover-duration) var(--cont-s00-hover-easing);
}

.cont-s00__form-card input[type="submit"]:hover,
.cont-s00__form-card .wpcf7-submit:hover {
    background-color: var(--cont-s00-color-submit-bg-hover);
    color: var(--cont-s00-color-submit-text-hover);
    border-color: var(--cont-s00-color-submit-bg-hover);
}

.cont-s00__form-card input[type="submit"]:focus-visible,
.cont-s00__form-card .wpcf7-submit:focus-visible {
    outline: 2px solid var(--cont-s00-color-focus);
    outline-offset: 3px;
}

.cont-s00__form-card input[type="submit"]:disabled,
.cont-s00__form-card .wpcf7-submit:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}


/* ================================================================
  SIDEBAR
  ================================================================ */
.cont-s00__sidebar {
    display: flex;
    flex-direction: column;
    gap: var(--cont-s00-sidebar-gap);
}


/* ================================================================
  SIDEBAR CARDS — shared base
  ================================================================ */
.cont-s00__sidebar-card {
    border-radius: var(--cont-s00-card-border-radius);
    overflow: hidden;
}


/* ================================================================
  URGENT CARD
  ================================================================ */
.cont-s00__sidebar-card--urgent {
    background-color: var(--cont-s00-color-card-urgent-bg);
}

.cont-s00__urgent-inner {
    padding: var(--cont-s00-card-padding);
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.cont-s00__urgent-badge {
    font-family: var(--cont-s00-font-family-display);
    font-size: var(--cont-s00-font-size-urgent-badge);
    font-weight: 600;
    font-style: italic;
    letter-spacing: 0.1em;
    color: var(--cont-s00-color-urgent-badge-text);
}

.cont-s00__urgent-body {
    font-family: var(--cont-s00-font-family-body);
    font-size: var(--cont-s00-font-size-urgent-body);
    font-weight: 300;
    line-height: 1.7;
    color: var(--cont-s00-color-card-urgent-text);
}

.cont-s00__urgent-link {
    display: flex;
    align-items: center;
    gap: var(--cont-s00-urgent-link-gap);
    padding: 12px 14px;
    background-color: var(--cont-s00-color-urgent-link-bg);
    border-radius: 2px;
    text-decoration: none;

    transition:
        background-color var(--cont-s00-hover-duration) var(--cont-s00-hover-easing);
}

.cont-s00__urgent-link:hover {
    background-color: var(--cont-s00-color-urgent-link-hover);
}

.cont-s00__urgent-link:focus-visible {
    outline: 2px solid var(--cont-s00-color-focus);
    outline-offset: 2px;
}

.cont-s00__urgent-link-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    /* background-color: rgba(255, 255, 255, 0.2); */
    border-radius: 50%;
    flex-shrink: 0;
    color: var(--cont-s00-color-card-urgent-text);
}

.cont-s00__urgent-link-meta {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.cont-s00__urgent-link-label-small {
    font-family: var(--cont-s00-font-family-body);
    font-size: var(--cont-s00-font-size-urgent-label);
    font-weight: 400;
    letter-spacing: 0.1em;
    color: rgba(255, 255, 255, 0.7);
    text-transform: uppercase;
}

.cont-s00__urgent-link-label-main {
    font-family: var(--cont-s00-font-family-body);
    font-size: var(--cont-s00-font-size-urgent-main);
    font-weight: 400;
    color: var(--cont-s00-color-card-urgent-text);
}


/* ================================================================
  FAQ CARD
  ================================================================ */
.cont-s00__sidebar-card--faq {
    position: relative;
    display: block;
    text-decoration: none;
    overflow: hidden;

    transition: box-shadow var(--cont-s00-hover-duration) var(--cont-s00-hover-easing);
}

.cont-s00__sidebar-card--faq:focus-visible {
    outline: 2px solid var(--cont-s00-color-focus);
    outline-offset: 3px;
}

.cont-s00__faq-photo-wrapper {
    position: relative;
    width: 100%;
    height: var(--cont-s00-card-photo-height);
    overflow: hidden;
}

.cont-s00__faq-photo {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;

    transition: transform 400ms var(--cont-s00-hover-easing);
}

.cont-s00__sidebar-card--faq:hover .cont-s00__faq-photo {
    transform: scale(1.04);
}

.cont-s00__faq-overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: 20px 20px 18px;
    background: linear-gradient(
        to top,
        var(--cont-s00-color-faq-overlay-bg) 0%,
        transparent 100%
    );
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.cont-s00__faq-label {
    font-family: var(--cont-s00-font-family-display);
    font-size: var(--cont-s00-font-size-faq-label);
    font-weight: 600;
    font-style: italic;
    color: var(--cont-s00-color-faq-text);
    letter-spacing: 0.06em;
}

.cont-s00__faq-sublabel {
    font-family: var(--cont-s00-font-family-body);
    font-size: var(--cont-s00-font-size-faq-sublabel);
    font-weight: 300;
    color: var(--cont-s00-color-faq-text);
    line-height: 1.5;
}

.cont-s00__faq-cta {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-family: var(--cont-s00-font-family-body);
    font-size: var(--cont-s00-font-size-faq-cta);
    font-weight: 400;
    letter-spacing: 0.1em;
    color: var(--cont-s00-color-faq-text);
    text-transform: uppercase;
    margin-top: 6px;
}


/* ================================================================
  LIFESTYLE PHOTO CARD
  ================================================================ */
.cont-s00__sidebar-card--photo {
    overflow: hidden;
}

.cont-s00__lifestyle-photo {
    width: 100%;
    height: var(--cont-s00-card-photo-height);
    object-fit: cover;
    object-position: center;
    display: block;
}


/* ================================================================
  ANIMATION INITIAL STATES
  Set in CSS before JS runs.
  JS adds the -visible class to trigger the transition.
  ================================================================ */

/* Page header fade-in */
.cont-s00-js-fade-hidden {
    opacity: 0;
    transform: translateY(var(--cont-s00-animate-translate-y));
}

.cont-s00-js-fade-visible {
    opacity: 1;
    transform: translateY(0);
    transition:
        opacity   var(--cont-s00-animate-duration) var(--cont-s00-animate-easing),
        transform var(--cont-s00-animate-duration) var(--cont-s00-animate-easing);
}

/* Form section + sidebar cards slide-in */
.cont-s00-js-slide-hidden {
    opacity: 0;
    transform: translateY(var(--cont-s00-animate-translate-y));
}

.cont-s00-js-slide-visible {
    opacity: 1;
    transform: translateY(0);
    transition:
        opacity   var(--cont-s00-animate-duration) var(--cont-s00-animate-easing),
        transform var(--cont-s00-animate-duration) var(--cont-s00-animate-easing);
}

/* Sidebar card stagger delays (static — 3 cards fixed) */
.cont-s00__sidebar [data-cont-s00-card]:nth-child(1).cont-s00-js-slide-visible {
    transition-delay: var(--cont-s00-card-delay-1);
}

.cont-s00__sidebar [data-cont-s00-card]:nth-child(2).cont-s00-js-slide-visible {
    transition-delay: var(--cont-s00-card-delay-2);
}

.cont-s00__sidebar [data-cont-s00-card]:nth-child(3).cont-s00-js-slide-visible {
    transition-delay: var(--cont-s00-card-delay-3);
}


/* ================================================================
  FOCUS-VISIBLE — all interactive elements in page scope
  ================================================================ */
.cont-s00 a:focus-visible,
.cont-s00 button:focus-visible,
.cont-s00 input:focus-visible,
.cont-s00 select:focus-visible,
.cont-s00 textarea:focus-visible {
    outline: 2px solid var(--cont-s00-color-focus);
    outline-offset: 2px;
}


/* ================================================================
  REDUCED MOTION
  Scoped to this page's animation classes only.
  Does not interfere with global rules in common.css or reset.css.
  ================================================================ */
@media (prefers-reduced-motion: reduce) {
    .cont-s00-js-fade-hidden,
    .cont-s00-js-fade-visible,
    .cont-s00-js-slide-hidden,
    .cont-s00-js-slide-visible {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        opacity: 1;
        transform: none;
    }
}