/**
 * LANTES Japan - Contact Page Styles (LANTES Japan - 联系页面样式)
 * Washi Theme Enhancements & Interactive Animations (和纸主题增强和交互动画)
 */

/* === Contact Hero Section (联系页面英雄区域) === */
.contact-hero {
    position: relative;
    background-color: var(--washi-base-light); /* 英雄区域使用较浅的和纸底色 */
    overflow: hidden;
}

.contact-hero-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: var(--washi-gradient-overlay); /* 和纸渐变覆盖层 */
    z-index: 1;
}

.contact-hero .hero-title {
    font-size: 3rem;
    font-weight: 700;
    margin-bottom: 1rem;
    color: var(--washi-primary-dark); /* 英雄区域标题颜色 */
}

.contact-hero .hero-subtitle {
    font-size: 1.3rem;
    margin-bottom: 1rem;
    color: var(--washi-text-secondary); /* 英雄区域副标题颜色 */
}

.contact-hero .hero-description {
    font-size: 1.1rem;
    color: var(--washi-text-muted); /* 英雄区域描述文字颜色 */
}

/* === Contact Information Section (联系信息区域) === */
.contact-info {
    background-color: var(--washi-bg-main); /* 联系信息区域背景色 */
}

.contact-card {
    text-align: center;
    padding: 2rem;
    transition: all var(--washi-transition); /* 和纸主题通用过渡效果 */
    border-top: 3px solid transparent; /* 悬停效果的顶部边框 */
}

.contact-card:hover {
    transform: translateY(-8px); /* 悬停时向上移动 */
    box-shadow: var(--washi-shadow-strong); /* 应用和纸强阴影 */
    border-top-color: var(--washi-accent); /* 悬停时顶部边框颜色变为强调色 */
}

.contact-icon {
    margin-bottom: 1.5rem;
    font-size: 2.5rem; /* 增大图标尺寸 */
    transition: transform var(--washi-transition);
}

.contact-card:hover .contact-icon {
    transform: scale(1.1) rotate(-5deg); /* 悬停时图标放大并轻微旋转 */
}

.contact-card h4 {
    font-size: 1.5rem;
    margin-bottom: 1rem;
    font-weight: 600;
}

.contact-value {
    font-size: 1.1rem;
    font-weight: 500;
    margin-bottom: 0.5rem;
}

.contact-value a {
    text-decoration: none;
    transition: color var(--washi-transition);
}

.contact-value a:hover {
    color: var(--washi-accent-dark); /* 链接悬停颜色 */
    text-decoration: underline;
}

.contact-hours {
    font-size: 0.95rem;
}

/* === Contact Form Section (联系表单区域) === */
.contact-form-section {
    padding-top: 4rem;
    padding-bottom: 4rem;
}

.form-container.washi-card {
    padding: 2.5rem; /* 表单容器内边距 */
}

.form-container .section-title {
    font-size: 2.2rem;
}

.form-control,
.form-select {
    border-radius: var(--washi-radius); /* 和纸主题圆角 */
    border: 1px solid var(--washi-border); /* 和纸主题边框 */
    padding: 0.85rem 1rem;
    transition: border-color var(--washi-transition), box-shadow var(--washi-transition);
    background-color: var(--washi-bg-paper); /* 和纸背景色 */
    color: var(--washi-text-primary); /* 和纸主要文字颜色 */
}

.form-control:focus,
.form-select:focus {
    border-color: var(--washi-primary); /* 焦点状态边框颜色 */
    box-shadow: 0 0 0 0.2rem rgba(var(--washi-primary-rgb), 0.25); /* Bootstrap焦点阴影，使用和纸颜色 */
    background-color: var(--washi-base-light); /* 焦点状态背景色 */
}

.form-floating > label {
    color: var(--washi-text-muted); /* 浮动标签文字颜色 */
    padding-top: 0.85rem; /* 调整以适应输入框内边距 */
    padding-bottom: 0.85rem;
}

/* 浮动标签激活状态 (输入时或获得焦点时) */
.form-floating > .form-control:focus ~ label,
.form-floating > .form-control:not(:placeholder-shown) ~ label,
.form-floating > .form-select ~ label {
    color: var(--washi-primary); /* 激活的浮动标签颜色 */
    transform: scale(0.85) translateY(-0.7rem) translateX(0.15rem); /* 调整浮动标签位置和大小 */
}

.form-check-input {
    border-color: var(--washi-border-dark); /* 复选框边框颜色 */
}

.form-check-input:checked {
    background-color: var(--washi-primary); /* 复选框选中背景色 */
    border-color: var(--washi-primary); /* 复选框选中边框色 */
}

.form-check-label a {
    font-weight: 500;
}

.required-star {
    color: var(--washi-accent); /* 必填项星号颜色 */
    margin-left: 0.25rem;
    font-weight: bold;
}

.btn-washi-primary {
    padding: 0.8rem 2rem;
    font-size: 1.1rem;
}

/* === Map Section Styles Removed (地图模块样式已移除) === */

/* === General Interactive Enhancements (通用交互增强) === */
[data-aos] { /* AOS动画库默认过渡 */
    transition-property: transform, opacity, filter;
    transition-duration: 0.8s;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}

/* Input field focus animation (输入框焦点动画) */
.form-control:focus,
.form-select:focus {
    transform: scale(1.01); /* 焦点时轻微放大 */
}

/* Button hover/active animation (按钮悬停/激活动画) */
.btn {
    position: relative;
    overflow: hidden;
    transition: transform 0.2s ease-out, box-shadow 0.2s ease-out;
}

.btn:hover {
    transform: translateY(-3px) scale(1.02); /* 悬停时向上移动并放大 */
    box-shadow: var(--washi-shadow-medium);
}

.btn:active {
    transform: translateY(-1px) scale(0.98); /* 激活时轻微按下并缩小 */
    box-shadow: var(--washi-shadow-soft);
}

/* Ripple effect for buttons (按钮波纹效果 - CSS实现) */
.btn::after {
    content: "";
    background: rgba(255, 255, 255, 0.3); /* 波纹颜色 */
    display: block;
    position: absolute;
    border-radius: 50%;
    padding-top: 350%;
    padding-left: 350%;
    margin-left: -20px !important;
    margin-top: -120%;
    opacity: 0;
    transition: all 0.8s;
}

.btn:active::after {
    padding: 0;
    margin: 0;
    opacity: 1;
    transition: 0s;
}

/* Card hover animations (卡片悬停动画) */
.washi-card {
    transition: transform 0.3s ease-in-out, box-shadow 0.3s ease-in-out, border-color 0.3s ease-in-out;
}

/* Staggered animation for cards in a row (行内卡片交错动画) */
.row > [class*='col-'] > .washi-card {
    animation: cardEntrance 0.6s ease-out forwards;
    opacity: 0;
    transform: translateY(20px);
}

@keyframes cardEntrance { /* 卡片入场动画关键帧 */
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Delay for staggered animation (交错动画延迟 - 示例) */
.row > [class*='col-']:nth-child(1) > .washi-card { animation-delay: 0.1s; }
.row > [class*='col-']:nth-child(2) > .washi-card { animation-delay: 0.2s; }
.row > [class*='col-']:nth-child(3) > .washi-card { animation-delay: 0.3s; }
.row > [class*='col-']:nth-child(4) > .washi-card { animation-delay: 0.4s; } /* 适用于一行4张卡片的情况 */


/* Responsive adjustments for contact page (联系页面响应式调整) */
@media (max-width: 767.98px) {
    .contact-hero .hero-title {
        font-size: 2.5rem;
    }
    .contact-card {
        padding: 1.5rem;
    }
    .form-container.washi-card {
        padding: 1.5rem;
    }
    /* .access-info.washi-card was related to map, can be removed if not used elsewhere */
} 