html {
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
}
body {
    font-family: 'Be Vietnam Pro', 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    background-color: #FDFBF8;
    color: #1f2937;
    font-size: 16px;
    line-height: 1.6;
    letter-spacing: 0.01em;
    word-spacing: 0.04em;
    overflow-x: hidden;
    word-break: normal;
    overflow-wrap: break-word;
}
.site-header{
    position:sticky; top:0; z-index:50;
    background:rgba(255,255,255,.92);
    backdrop-filter:saturate(140%) blur(12px);
    border-bottom:1px solid #eee7dc;
}
.site-header-inner{
    display:flex; align-items:center; justify-content:space-between;
    min-height:64px; gap:16px;
}
.site-logo img{ height:34px; width:auto; display:block; }
.site-nav{ display:none; align-items:center; gap:2px; }
@media (min-width: 1200px){
    .site-nav{ display:flex; }
}
@media (max-width: 1279px){
    .site-nav-hide-lg{ display:none; }
}
.site-nav-link{
    display:inline-flex; align-items:center; gap:6px;
    padding:8px 10px; border-radius:999px;
    color:#4b5563; font-size:13px; font-weight:500;
    text-decoration:none; white-space:nowrap;
    transition:background .2s, color .2s;
}
.site-nav-link i{ font-size:13px; color:#d97706; }
.site-nav-link:hover{ background:#fff7ed; color:#b45309; }
.site-actions{ display:flex; align-items:center; gap:8px; }
.site-cta{
    display:inline-flex; align-items:center; gap:7px;
    padding:8px 14px; border-radius:999px; border:0;
    background:#d97706; color:#fff; font-size:13px; font-weight:650;
    box-shadow:0 8px 18px -10px rgba(217,119,6,.8);
}
.site-cta:hover{ background:#b45309; color:#fff; }
.site-cta-ghost{ background:#fff7ed; color:#b45309; box-shadow:none; border:1px solid #fde68a; }
.site-cta-ghost:hover{ background:#ffedd5; color:#92400e; }
.site-burger{
    display:inline-flex; align-items:center; justify-content:center;
    width:44px; height:44px; color:#374151; background:transparent; border:0; padding:0;
}
@media (max-width: 1199px){
    .site-actions .site-cta{ display:none; }
}
@media (min-width: 1200px){
    .site-burger{ display:none; }
    .site-mobile{ display:none !important; }
}
.site-drop{
    position:absolute; right:0; top:calc(100% + 8px);
    min-width:180px; background:#fff; border:1px solid #e5e7eb;
    border-radius:12px; box-shadow:0 12px 30px -16px rgba(15,23,42,.35); overflow:hidden; z-index:60;
}
.site-drop a, .site-drop button{
    display:flex; align-items:center; gap:8px; width:100%;
    padding:10px 14px; color:#374151; background:#fff; border:0; text-align:left; font-size:13px;
}
.site-drop a:hover, .site-drop button:hover{ background:#f8fafc; }
.site-mobile{
    display:flex; flex-direction:column; gap:4px;
    padding:8px 16px 16px; border-top:1px solid #f3f4f6;
}
.site-mobile.hidden{ display:none !important; }
.site-mobile a, .site-mobile button{
    display:flex; align-items:center; gap:12px;
    min-height:44px; padding:10px 12px; border-radius:10px;
    color:#374151; background:transparent; border:0; text-align:left; font-size:15px; font-weight:500;
}
.site-mobile a:hover, .site-mobile button:hover{ background:#fff7ed; }
.site-mobile i{ width:18px; text-align:center; color:#d97706; }
.site-footer{ background:#111827; color:#d1d5db; padding:56px 0 0; }
.site-footer-grid{
    display:grid; grid-template-columns:1fr; gap:28px; padding-bottom:36px;
}
@media (min-width: 768px){
    .site-footer-grid{ grid-template-columns:1fr 1fr; }
}
@media (min-width: 1024px){
    .site-footer-grid{ grid-template-columns:1.4fr 1fr 1fr 1fr; }
}
.site-footer h4{ color:#fff; font-size:14px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; margin:0 0 14px; }
.site-footer-brand{ display:flex; align-items:center; gap:10px; color:#fff; font-size:18px; margin-bottom:12px; }
.site-footer-brand img{ height:28px; }
.site-footer-desc{ font-size:14px; line-height:1.7; color:#9ca3af; margin:0; }
.site-footer-list{ list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:10px; }
.site-footer-list a, .site-footer-list span{
    display:flex; align-items:flex-start; gap:10px;
    color:#d1d5db; font-size:14px; text-decoration:none;
}
.site-footer-list a:hover{ color:#fbbf24; }
.site-footer-list i{ width:16px; margin-top:3px; color:#f59e0b; }
.site-social{ display:flex; gap:10px; margin-bottom:14px; }
.site-social a{
    width:36px; height:36px; border-radius:999px;
    display:inline-flex; align-items:center; justify-content:center;
    background:#1f2937; color:#fff; text-decoration:none;
}
.site-social a:hover{ background:#d97706; }
.site-footer-note{ font-size:13px; color:#9ca3af; margin:0; line-height:1.6; }
.site-footer-copy{ border-top:1px solid #1f2937; padding:18px 0; text-align:center; font-size:13px; color:#6b7280; }
.feat-ico{
    width:44px; height:44px; border-radius:12px;
    display:inline-flex; align-items:center; justify-content:center;
    background:#fff7ed; color:#d97706; font-size:18px; margin-bottom:14px;
}
.step-ico{
    width:48px; height:48px; border-radius:999px;
    display:inline-flex; align-items:center; justify-content:center;
    background:#d97706; color:#fff; font-weight:700; margin-bottom:14px;
}
.nav-link {
    transition: color 0.3s, border-bottom-color 0.3s;
    border-bottom: 2px solid transparent;
}
.nav-link:hover {
    color: #D97706;
    border-bottom-color: #D97706;
}
.section-title {
    font-size: clamp(1.5rem, 4vw, 2.25rem);
    font-weight: 700;
    color: #4A5568;
    margin-bottom: 1rem;
    letter-spacing: 0.01em;
    line-height: 1.3;
}
.section-subtitle {
    font-size: clamp(0.95rem, 2.4vw, 1.125rem);
    color: #718096;
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 2rem;
}
.card {
    background-color: #FFFFFF;
    border-radius: 0.75rem;
    box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
    transition: transform 0.3s, box-shadow 0.3s;
}
.card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -2px rgb(0 0 0 / 0.1);
}
.faq-item {
    border-bottom: 1px solid #E5E7EB;
}
.faq-question {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.25rem 0;
    font-weight: 600;
    color: #4A5568;
    cursor: pointer;
    transition: color 0.3s;
}
.faq-question:hover {
    color: #D97706;
}
.faq-answer {
    padding-bottom: 1.25rem;
    color: #6B7280;
    display: none;
}
.faq-question svg {
    transition: transform 0.3s;
}
.faq-question.active svg {
    transform: rotate(180deg);
}

/* Banner Carousel Specific Styles */
.site-banner{
    min-height: 260px;
    height: auto;
}
@media (min-width: 768px){
    .site-banner{ min-height: 380px; }
}
.banner-slide {
    display: none;
    position: relative;
    min-height: inherit;
    width: 100%;
    align-items: center;
    justify-content: center;
    padding: 56px 48px 48px;
    box-sizing: border-box;
    color: white;
    text-shadow: 0 1px 2px rgba(0,0,0,0.35);
}
.banner-slide-content {
    position: relative;
    width: 100%;
    max-width: 720px;
    margin: 0 auto;
    text-align: center;
    padding: 0 4px;
}
.banner-slide-content h2{
    font-size: clamp(1.45rem, 5vw, 2.75rem);
    line-height: 1.25;
    font-weight: 700;
    margin: 0 0 12px;
    letter-spacing: 0.015em;
    word-spacing: 0.08em;
}
.banner-slide-content p{
    font-size: clamp(0.95rem, 2.6vw, 1.2rem);
    line-height: 1.55;
    margin: 0;
    letter-spacing: 0.015em;
    word-spacing: 0.08em;
    opacity: .92;
}
.banner-dot {
    height: 10px;
    width: 10px;
    margin: 0 5px;
    background-color: #bbb;
    border-radius: 50%;
    display: inline-block;
    transition: background-color 0.6s ease;
    cursor: pointer;
}
.banner-dot.active, .banner-dot:hover {
    background-color: #717171;
}
.banner-arrow {
    cursor: pointer;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 36px;
    height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-weight: bold;
    font-size: 16px;
    transition: 0.2s ease;
    border-radius: 999px;
    user-select: none;
    background-color: rgba(0,0,0,0.45);
    z-index: 12;
}
.banner-arrow:hover {
    background-color: rgba(0,0,0,0.7);
}
.banner-prev { left: 8px; }
.banner-next { right: 8px; }
@media (min-width: 768px){
    .banner-arrow{ width:44px; height:44px; font-size:18px; }
    .banner-prev { left: 16px; }
    .banner-next { right: 16px; }
    .banner-slide { padding: 72px 72px 56px; }
}

/* Testimonial Carousel Specific Styles */
.testimonial-carousel-container {
    overflow: hidden;
    position: relative;
}
.testimonial-carousel {
    display: flex;
    transition: transform 0.5s ease-in-out;
}
.testimonial-card-wrapper {
    flex: 0 0 auto;
    width: 100%; /* Default to full width for mobile */
    padding: 0 1rem; /* Padding for spacing between cards */
    box-sizing: border-box;
}
@media (min-width: 768px) {
    .testimonial-card-wrapper {
        width: 50%; /* Two cards per row on medium screens */
    }
}
@media (min-width: 1024px) {
    .testimonial-card-wrapper {
        width: 33.333%; /* Three cards per row on large screens */
    }
}
.testimonial-arrow {
    cursor: pointer;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: auto;
    padding: 12px;
    color: #D97706;
    font-weight: bold;
    font-size: 18px;
    transition: 0.3s ease;
    user-select: none;
    background-color: rgba(255,255,255,0.7);
    border-radius: 50%;
    box-shadow: 0 2px 5px rgba(0,0,0,0.2);
}
.testimonial-arrow:hover {
    background-color: rgba(255,255,255,1);
    color: #B45309;
}
.testimonial-prev { left: 10px; }
.testimonial-next { right: 10px; }
.testimonial-dots {
    text-align: center;
    margin-top: 20px;
}
.testimonial-dot {
    height: 8px;
    width: 8px;
    margin: 0 4px;
    background-color: #bbb;
    border-radius: 50%;
    display: inline-block;
    transition: background-color 0.6s ease;
    cursor: pointer;
}
.testimonial-dot.active, .testimonial-dot:hover {
    background-color: #717171;
}
#particles-js {
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 0;
    pointer-events: none;
}
.banner-slide {
    background-color: transparent !important;
}
.banner-slide.active {
    display: flex;
}

.hero-title{
    font-size: clamp(1.6rem, 5.2vw, 3rem);
    line-height: 1.25;
    font-weight: 700;
    letter-spacing: 0.01em;
    word-spacing: 0.06em;
}
.hero-lead{
    font-size: clamp(0.95rem, 2.4vw, 1.15rem);
    line-height: 1.65;
}

@media (max-width: 639px){
    #tts-try .tts-btn-primary,
    #tts-try .tts-btn-secondary{ width:100%; min-width:0; }
    #tts-try .tts-voice-meta{ flex-direction:column; align-items:stretch; }
    #tts-try .tts-btn-ghost{ width:100%; }
    .testimonial-arrow{ width:36px; height:36px; padding:0; font-size:14px; }
    .testimonial-prev{ left: 4px; }
    .testimonial-next{ right: 4px; }
    .card:hover{ transform:none; }
}

@media (hover: none){
    .card:hover{ transform:none; }
}