/* ===== RESET & BASE ===== */*,*::before,*::after { margin: 0; padding: 0; box-sizing: border-box;}:root { --primary: #1e7a4d; --primary-dark: #155c3b; --secondary: #1a1a1a; --white: #ffffff; --light: #f5f5f5; --gray: #888; --text: #333; --shadow: 0 4px 20px rgba(0, 0, 0, 0.08); --radius: 12px; --transition: 0.3s ease;}html { scroll-behavior: smooth;}body { font-family: 'Poppins', sans-serif; color: var(--text); line-height: 1.6; overflow-x: hidden;}a { text-decoration: none; color: inherit;}ul { list-style: none;}img { max-width: 100%; height: auto; display: block;}.container { max-width: 1200px; margin: 0 auto; padding: 0 20px;}.section { padding: 80px 0;}.text-center { text-align: center;}.section-subtitle { color: var(--primary); font-size: 14px; font-weight: 600; text-transform: uppercase; letter-spacing: 3px; margin-bottom: 8px;}.section-title { font-size: 32px; font-weight: 700; color: var(--secondary); margin-bottom: 40px; line-height: 1.3;}/* ===== BUTTONS ===== */.btn { display: inline-block; padding: 14px 32px; font-family: 'Poppins', sans-serif; font-size: 14px; font-weight: 600; letter-spacing: 1px; border: none; border-radius: 6px; cursor: pointer; transition: var(--transition); text-align: center;}.btn-primary { background: var(--primary); color: var(--white);}.btn-primary:hover { background: var(--primary-dark); transform: translateY(-2px); box-shadow: 0 6px 20px rgba(0, 150, 64, 0.3);}.btn-outline { background: transparent; color: var(--primary); border: 2px solid var(--primary); padding: 10px 28px;}.btn-outline:hover { background: var(--primary); color: var(--white); transform: translateY(-2px);}/* ===== HEADER / NAVBAR ===== */.header { position: fixed; top: 0; left: 0; width: 100%; z-index: 1000; background: transparent; transition: var(--transition); padding: 15px 0;}.header.scrolled { background: rgba(255, 255, 255, 0.98); box-shadow: 0 2px 20px rgba(0, 0, 0, 0.1); padding: 8px 0;}.header-inner { display: flex; align-items: center; justify-content: space-between;}.logo { display: flex; align-items: center; gap: 10px; font-size: 22px; font-weight: 700; color: var(--white); transition: var(--transition);}.header.scrolled .logo { color: var(--secondary);}.logo-icon { font-size: 26px; color: var(--primary);}/* ===== LANGUAGE SWITCHER ===== */.lang-switcher { position: relative; margin-left: 12px;}.lang-current { background: #e30a17; border: none; color: #fff; padding: 7px 16px; border-radius: 6px; font-family: 'Poppins', sans-serif; font-size: 13px; font-weight: 700; cursor: pointer; transition: var(--transition); display: flex; align-items: center; gap: 6px; letter-spacing: 1px;}.header.scrolled .lang-current { background: #e30a17; color: #fff;}.lang-flag { width: 20px; height: 14px; object-fit: cover; border-radius: 2px;}.lang-current .lang-flag { display: none;}.lang-current:hover { background: #c00;}.lang-dropdown { position: absolute; top: 100%; right: 0; background: var(--white); border-radius: 8px; box-shadow: 0 8px 30px rgba(0,0,0,0.15); overflow: hidden; opacity: 0; visibility: hidden; transform: translateY(8px); transition: all 0.25s ease; min-width: 140px; z-index: 100; margin-top: 6px;}.lang-dropdown.open { opacity: 1; visibility: visible; transform: translateY(0);}.lang-dropdown button { display: block; width: 100%; padding: 10px 16px; background: none; border: none; font-family: 'Poppins', sans-serif; font-size: 13px; color: var(--text); cursor: pointer; text-align: left; transition: background 0.2s;}.lang-dropdown button { display: flex; align-items: center; gap: 8px; padding: 10px 16px; font-size: 13px;}.lang-dropdown button .lang-flag { width: 20px; height: 14px; flex-shrink: 0;}.lang-dropdown button:hover { background: var(--light); color: var(--primary);}/* ===== RTL SUPPORT ===== */[dir="rtl"] { direction: rtl; text-align: right; }[dir="rtl"] .header-inner { flex-direction: row-reverse; }[dir="rtl"] .lang-switcher { margin-left: 0; margin-right: 12px; }[dir="rtl"] .lang-dropdown { right: auto; left: 0; }[dir="rtl"] .about-inner { direction: rtl; }[dir="rtl"] .contact-inner { direction: rtl; }[dir="rtl"] .footer-inner { direction: rtl; }[dir="rtl"] .slide-content { text-align: center; }[dir="rtl"] .footer-col ul a:hover { padding-left: 0; padding-right: 6px; }[dir="rtl"] .footer-col p i { margin-right: 0; margin-left: 8px; }[dir="rtl"] .contact-item { flex-direction: row-reverse; text-align: right; }[dir="rtl"] .feature-item { flex-direction: row-reverse; }[dir="rtl"] .room-amenities span i { margin-right: 0; margin-left: 4px; }[dir="rtl"] .form-group label i { margin-right: 0; margin-left: 4px; }[dir="rtl"] .faq-question { flex-direction: row-reverse; text-align: right; }[dir="rtl"] .review-author { flex-direction: row-reverse; }[dir="rtl"] .campaign-inner { flex-direction: row-reverse; }[dir="rtl"] .wa-chat-box { right: auto; left: 0; }[dir="rtl"] .wa-widget { right: auto; left: 24px; }[dir="rtl"] .slider-prev { left: auto; right: 30px; }[dir="rtl"] .slider-next { right: auto; left: 30px; }[dir="rtl"] .back-link i { transform: rotate(180deg); }@media (max-width: 768px) { [dir="rtl"] .nav { right: auto; left: -100%; } [dir="rtl"] .nav.active { left: 0; } [dir="rtl"] .campaign-inner { flex-direction: column; } [dir="rtl"] .wa-widget { left: 16px; } .lang-switcher { margin-left: 8px; }}.logo-img { height: 50px; width: auto; object-fit: contain; transition: var(--transition);}.header.scrolled .logo-img { height: 40px;}.footer-logo-img { height: 45px; margin-bottom: 16px;}.nav-list { display: flex; align-items: center; gap: 28px;}.nav-list a { font-size: 14px; font-weight: 500; color: rgba(255, 255, 255, 0.9); transition: var(--transition); position: relative;}.header.scrolled .nav-list a { color: var(--text);}.nav-list a:hover,.header.scrolled .nav-list a:hover { color: var(--primary);}.nav-list a::after { content: ''; position: absolute; bottom: -4px; left: 0; width: 0; height: 2px; background: var(--primary); transition: var(--transition);}.nav-list a:hover::after { width: 100%;}.nav-btn { background: var(--primary) !important; color: var(--white) !important; padding: 10px 24px; border-radius: 6px;}.nav-btn:hover { background: var(--primary-dark) !important;}.nav-btn::after { display: none !important;}.hamburger { display: none; flex-direction: column; gap: 5px; background: none; border: none; cursor: pointer; padding: 5px; z-index: 1001;}.hamburger span { display: block; width: 25px; height: 2px; background: var(--white); transition: var(--transition);}.header.scrolled .hamburger span { background: var(--secondary);}.hamburger.active span:nth-child(1) { transform: rotate(45deg) translate(5px, 5px);}.hamburger.active span:nth-child(2) { opacity: 0;}.hamburger.active span:nth-child(3) { transform: rotate(-45deg) translate(5px, -5px);}/* ===== HERO SLIDER ===== */.hero-slider { position: relative; width: 100%; height: 100vh; min-height: 600px; overflow: hidden;}.slider { width: 100%; height: 100%;}.slide { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-size: cover; background-position: center; opacity: 0; transition: opacity 1s ease;}.slide.active { opacity: 1;}.slide-overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(135deg, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0.2) 100%);}.slide-content { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); text-align: center; color: var(--white); z-index: 2; width: 90%; max-width: 800px;}.slide-subtitle { font-size: 18px; font-weight: 300; letter-spacing: 5px; text-transform: uppercase; margin-bottom: 16px; opacity: 0; transform: translateY(20px); animation: fadeInUp 0.8s ease 0.3s forwards;}.slide-title { font-size: 52px; font-weight: 700; line-height: 1.2; margin-bottom: 30px; opacity: 0; transform: translateY(20px); animation: fadeInUp 0.8s ease 0.5s forwards;}.slide-content .btn { opacity: 0; transform: translateY(20px); animation: fadeInUp 0.8s ease 0.7s forwards;}.slide:not(.active) .slide-subtitle,.slide:not(.active) .slide-title,.slide:not(.active) .btn { animation: none; opacity: 0;}@keyframes fadeInUp { to { opacity: 1; transform: translateY(0); }}.slider-btn { position: absolute; top: 50%; transform: translateY(-50%); background: rgba(255, 255, 255, 0.15); backdrop-filter: blur(10px); border: 1px solid rgba(255, 255, 255, 0.3); color: var(--white); width: 50px; height: 50px; border-radius: 50%; font-size: 18px; cursor: pointer; transition: var(--transition); z-index: 3; display: flex; align-items: center; justify-content: center;}.slider-btn:hover { background: var(--primary); border-color: var(--primary);}.slider-prev { left: 30px;}.slider-next { right: 30px;}.slider-dots { position: absolute; bottom: 30px; left: 50%; transform: translateX(-50%); display: flex; gap: 10px; z-index: 3;}.slider-dot { width: 12px; height: 12px; border-radius: 50%; background: rgba(255, 255, 255, 0.4); border: none; cursor: pointer; transition: var(--transition);}.slider-dot.active { background: var(--primary); transform: scale(1.2);}/* ===== BOOKING WIDGET ===== */.booking-widget { background: var(--white); padding: 30px 0; margin-top: -60px; position: relative; z-index: 10;}.booking-form { display: flex; align-items: flex-end; gap: 16px; background: var(--white); padding: 30px; border-radius: var(--radius); box-shadow: 0 10px 40px rgba(0, 0, 0, 0.12);}.form-group { flex: 1; display: flex; flex-direction: column;}.form-group label { font-size: 12px; font-weight: 600; color: var(--gray); text-transform: uppercase; letter-spacing: 1px; margin-bottom: 8px;}.form-group label i { color: var(--primary); margin-right: 4px;}.form-group input,.form-group select { padding: 12px 14px; border: 2px solid #e8e8e8; border-radius: 8px; font-family: 'Poppins', sans-serif; font-size: 14px; color: var(--text); transition: var(--transition); background: var(--white);}.form-group input:focus,.form-group select:focus { outline: none; border-color: var(--primary);}.form-group input[type="date"] { cursor: pointer; position: relative;}.form-group input[type="date"]::-webkit-calendar-picker-indicator { position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer;}.form-group-btn { flex: 0 0 auto;}.btn-book { padding: 14px 28px; white-space: nowrap;}/* ===== ABOUT ===== */.about { background: var(--white);}.about-inner { display: grid; grid-template-columns: 1fr 1fr; gap: 60px; align-items: center;}.about-image { position: relative;}.about-image img { border-radius: var(--radius); width: 100%; height: 500px; object-fit: cover;}.about-image-badge { position: absolute; bottom: -20px; right: -20px; background: var(--primary); color: var(--white); padding: 20px 24px; border-radius: var(--radius); text-align: center; box-shadow: var(--shadow);}.badge-number { display: block; font-size: 32px; font-weight: 700;}.badge-text { font-size: 12px; font-weight: 500; text-transform: uppercase; letter-spacing: 1px;}.about-text { color: #666; margin-bottom: 16px; font-size: 15px;}.about-features { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 30px;}.feature-item { display: flex; align-items: center; gap: 10px; padding: 12px; background: var(--light); border-radius: 8px; transition: var(--transition);}.feature-item:hover { background: var(--primary); color: var(--white);}.feature-item:hover i { color: var(--white);}.feature-item i { font-size: 20px; color: var(--primary); transition: var(--transition);}.feature-item span { font-size: 13px; font-weight: 500;}/* ===== ROOMS ===== */.rooms { background: var(--light);}.rooms-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px;}.room-card { background: var(--white); border-radius: var(--radius); overflow: hidden; box-shadow: var(--shadow); transition: var(--transition);}.room-card:hover { transform: translateY(-8px); box-shadow: 0 12px 40px rgba(0, 0, 0, 0.15);}.room-image { position: relative; height: 240px; overflow: hidden;}.room-image img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.5s ease;}.room-card:hover .room-image img { transform: scale(1.08);}.room-badge { position: absolute; top: 16px; left: 16px; background: var(--primary); color: var(--white); padding: 4px 14px; border-radius: 20px; font-size: 12px; font-weight: 600;}.room-info { padding: 24px;}.room-title { font-size: 18px; font-weight: 600; margin-bottom: 12px; color: var(--secondary);}.room-amenities { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 20px;}.room-amenities span { font-size: 12px; color: var(--gray); background: var(--light); padding: 4px 10px; border-radius: 20px;}.room-amenities span i { color: var(--primary); margin-right: 4px; font-size: 11px;}/* ===== GALLERY ===== */.gallery { background: var(--white);}.gallery-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px;}.gallery-item { border-radius: var(--radius); overflow: hidden; height: 280px; cursor: pointer;}.gallery-item-wide { grid-column: span 2;}.gallery-item img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.5s ease;}.gallery-item:hover img { transform: scale(1.05);}/* ===== ACTIVITIES ===== */.activities { background: var(--light);}.activities-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px;}.activity-card { background: var(--white); padding: 40px 24px; border-radius: var(--radius); text-align: center; box-shadow: var(--shadow); transition: var(--transition);}.activity-card:hover { transform: translateY(-6px); box-shadow: 0 12px 40px rgba(0, 0, 0, 0.12);}.activity-icon { width: 70px; height: 70px; border-radius: 50%; background: rgba(0, 150, 64, 0.1); display: flex; align-items: center; justify-content: center; margin: 0 auto 20px; font-size: 28px; color: var(--primary); transition: var(--transition);}.activity-card:hover .activity-icon { background: var(--primary); color: var(--white);}.activity-card h3 { font-size: 18px; font-weight: 600; margin-bottom: 10px; color: var(--secondary);}.activity-card p { font-size: 14px; color: var(--gray); line-height: 1.6;}/* ===== FAQ ===== */.faq { background: var(--white);}.faq-list { max-width: 800px; margin: 0 auto;}.faq-item { border: 1px solid #e8e8e8; border-radius: var(--radius); margin-bottom: 12px; overflow: hidden; transition: var(--transition);}.faq-item.active { border-color: var(--primary);}.faq-question { width: 100%; display: flex; justify-content: space-between; align-items: center; padding: 18px 24px; background: none; border: none; font-family: 'Poppins', sans-serif; font-size: 15px; font-weight: 500; color: var(--secondary); cursor: pointer; text-align: left; transition: var(--transition);}.faq-question:hover { color: var(--primary);}.faq-question i { font-size: 14px; color: var(--primary); transition: transform var(--transition);}.faq-item.active .faq-question i { transform: rotate(180deg);}.faq-answer { max-height: 0; overflow: hidden; transition: max-height 0.4s ease, padding 0.4s ease;}.faq-item.active .faq-answer { max-height: 200px;}.faq-answer p { padding: 0 24px 18px; font-size: 14px; color: var(--gray); line-height: 1.7;}/* ===== CONTACT ===== */.contact { background: var(--light);}.contact-inner { display: grid; grid-template-columns: 1fr 1fr; gap: 50px; align-items: start;}.contact-item { display: flex; gap: 16px; margin-bottom: 24px;}.contact-item > i { width: 48px; height: 48px; background: rgba(0, 150, 64, 0.1); border-radius: 50%; display: flex; align-items: center; justify-content: center; color: var(--primary); font-size: 18px; flex-shrink: 0;}.contact-item h4 { font-size: 14px; font-weight: 600; margin-bottom: 4px; color: var(--secondary);}.contact-item p { font-size: 14px; color: var(--gray);}.contact-item a { color: var(--primary);}.contact-item a:hover { text-decoration: underline;}.contact-map iframe { width: 100%; border-radius: var(--radius);}/* ===== FOOTER ===== */.footer { background: var(--secondary); color: rgba(255, 255, 255, 0.7); padding-top: 60px;}.footer-inner { display: grid; grid-template-columns: 2fr 1fr 1fr 1fr; gap: 40px; padding-bottom: 40px; border-bottom: 1px solid rgba(255, 255, 255, 0.1);}.footer-logo { display: flex; align-items: center; gap: 10px; margin-bottom: 16px;}.footer-logo .logo-icon { font-size: 24px; color: var(--primary);}.footer-logo .logo-text { font-size: 20px; font-weight: 700; color: var(--white);}.footer-desc { font-size: 14px; line-height: 1.7; margin-bottom: 20px;}.footer-social { display: flex; gap: 12px;}.footer-social a { width: 40px; height: 40px; border-radius: 50%; background: rgba(255, 255, 255, 0.1); display: flex; align-items: center; justify-content: center; color: var(--white); font-size: 16px; transition: var(--transition);}.footer-social a:hover { background: var(--primary);}.footer-col h4 { color: var(--white); font-size: 16px; font-weight: 600; margin-bottom: 20px;}.footer-col ul li { margin-bottom: 10px;}.footer-col ul a { font-size: 14px; transition: var(--transition);}.footer-col ul a:hover { color: var(--primary); padding-left: 6px;}.footer-col p { font-size: 14px; margin-bottom: 10px;}.footer-col p i { color: var(--primary); margin-right: 8px; width: 16px;}.footer-bottom { padding: 20px 0; text-align: center; font-size: 13px;}/* ===== CAMPAIGN BANNER ===== */.campaign-banner { background: var(--primary); padding: 12px 0; position: relative; z-index: 5;}.campaign-inner { display: flex; align-items: center; justify-content: space-between; gap: 20px;}.campaign-text h3 { color: var(--white); font-size: 18px; font-weight: 700;}.campaign-text p { color: rgba(255, 255, 255, 0.9); font-size: 14px;}.btn-campaign { background: var(--white); color: var(--primary); padding: 10px 22px; border-radius: 6px; font-weight: 600; font-size: 13px; white-space: nowrap; transition: var(--transition); flex-shrink: 0;}.btn-campaign:hover { background: var(--secondary); color: var(--white); transform: translateY(-2px);}/* ===== ROOM PRICE ===== */.room-price { font-size: 20px; font-weight: 700; color: var(--primary); margin-bottom: 16px;}.room-price small { font-size: 13px; font-weight: 400; color: var(--gray);}/* ===== REVIEWS ===== */.reviews { background: var(--light);}.reviews-slider { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px;}.review-card { background: var(--white); padding: 28px; border-radius: var(--radius); box-shadow: var(--shadow); position: relative;}.review-card::before { content: '\201C'; position: absolute; top: 16px; right: 20px; font-size: 48px; color: rgba(0, 150, 64, 0.1); font-family: Georgia, serif; line-height: 1;}.review-stars { display: flex; gap: 3px; margin-bottom: 12px;}.review-stars i { color: #f5a623; font-size: 14px;}.review-stars i.empty { color: #ddd;}.review-text { font-size: 14px; color: #555; line-height: 1.7; margin-bottom: 16px; font-style: italic;}.review-author { display: flex; align-items: center; gap: 12px;}.review-avatar { width: 42px; height: 42px; border-radius: 50%; background: rgba(0, 150, 64, 0.1); display: flex; align-items: center; justify-content: center; color: var(--primary); font-weight: 700; font-size: 16px;}.review-author-info h4 { font-size: 14px; font-weight: 600; color: var(--secondary);}.review-author-info span { font-size: 12px; color: var(--gray);}/* ===== WHATSAPP CHAT WIDGET ===== */.wa-widget { position: fixed; bottom: 24px; right: 24px; z-index: 9999;}.wa-float-btn { width: 60px; height: 60px; border-radius: 50%; background: #25d366; border: none; color: #fff; font-size: 30px; cursor: pointer; box-shadow: 0 4px 20px rgba(37, 211, 102, 0.4); transition: all 0.3s ease; position: relative; display: flex; align-items: center; justify-content: center; animation: waPulse 2s infinite;}.wa-float-btn:hover { transform: scale(1.08); box-shadow: 0 6px 28px rgba(37, 211, 102, 0.5);}@keyframes waPulse { 0%, 100% { box-shadow: 0 4px 20px rgba(37, 211, 102, 0.4); } 50% { box-shadow: 0 4px 30px rgba(37, 211, 102, 0.6); }}.wa-badge { position: absolute; top: -4px; right: -4px; width: 22px; height: 22px; background: #e74c3c; color: #fff; border-radius: 50%; font-size: 12px; font-weight: 700; display: flex; align-items: center; justify-content: center; border: 2px solid #fff; animation: waBadgeBounce 2s ease infinite;}@keyframes waBadgeBounce { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.15); }}/* Chat Box */.wa-chat-box { position: absolute; bottom: 76px; right: 0; width: 360px; border-radius: 16px; overflow: hidden; box-shadow: 0 12px 50px rgba(0, 0, 0, 0.18); transform: scale(0.5) translateY(20px); transform-origin: bottom right; opacity: 0; visibility: hidden; transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1);}.wa-chat-box.open { transform: scale(1) translateY(0); opacity: 1; visibility: visible;}.wa-chat-header { background: #075e54; padding: 16px 20px; display: flex; align-items: center; justify-content: space-between;}.wa-chat-header-info { display: flex; align-items: center; gap: 12px;}.wa-avatar { width: 44px; height: 44px; border-radius: 50%; background: var(--primary); display: flex; align-items: center; justify-content: center; color: #fff; font-size: 20px;}.wa-chat-header h4 { color: #fff; font-size: 15px; font-weight: 600;}.wa-status { color: rgba(255, 255, 255, 0.8); font-size: 12px; display: flex; align-items: center; gap: 5px;}.wa-online-dot { width: 8px; height: 8px; border-radius: 50%; background: #25d366; display: inline-block;}.wa-close { background: none; border: none; color: rgba(255, 255, 255, 0.8); font-size: 18px; cursor: pointer; padding: 4px; transition: color 0.2s;}.wa-close:hover { color: #fff; }/* Chat Body */.wa-chat-body { background: #e5ddd5; background-image: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ccc6be' fill-opacity='0.15'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E"); padding: 20px; min-height: 160px;}.wa-chat-bubble { background: #fff; padding: 12px 16px; border-radius: 0 12px 12px 12px; max-width: 85%; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.08); position: relative; animation: waBubbleIn 0.4s ease 0.3s both;}@keyframes waBubbleIn { from { transform: translateY(10px); opacity: 0; } to { transform: translateY(0); opacity: 1; }}.wa-chat-bubble p { font-size: 14px; color: #333; line-height: 1.5; margin: 0;}.wa-time { display: block; text-align: right; font-size: 11px; color: #999; margin-top: 4px;}/* Chat Footer */.wa-chat-footer { background: #f0f0f0; padding: 10px 12px;}.wa-chat-footer form { display: flex; gap: 8px; align-items: center;}.wa-chat-footer input { flex: 1; padding: 10px 16px; border: none; border-radius: 24px; font-family: 'Poppins', sans-serif; font-size: 14px; background: #fff; outline: none;}.wa-chat-footer button { width: 42px; height: 42px; border-radius: 50%; background: #25d366; border: none; color: #fff; font-size: 16px; cursor: pointer; display: flex; align-items: center; justify-content: center; transition: background 0.2s; flex-shrink: 0;}.wa-chat-footer button:hover { background: #1fb855; }@media (max-width: 480px) { .wa-chat-box { width: calc(100vw - 32px); right: -8px; }}/* ===== RESPONSIVE ===== */@media (max-width: 1024px) { .about-inner { grid-template-columns: 1fr; gap: 40px; } .about-image img { height: 350px; } .rooms-grid { grid-template-columns: repeat(2, 1fr); } .activities-grid { grid-template-columns: repeat(2, 1fr); } .footer-inner { grid-template-columns: 1fr 1fr; }}@media (max-width: 768px) { .hamburger { display: flex; } .nav { position: fixed; top: 0; right: -100%; width: 280px; height: 100vh; background: var(--white); padding: 80px 30px 30px; box-shadow: -4px 0 20px rgba(0, 0, 0, 0.1); transition: right 0.4s ease; z-index: 1000; } .nav.active { right: 0; } .nav-list { flex-direction: column; align-items: flex-start; gap: 0; } .nav-list li { width: 100%; } .nav-list a { color: var(--text) !important; display: block; padding: 14px 0; border-bottom: 1px solid #eee; font-size: 15px; } .nav-btn { margin-top: 10px; text-align: center !important; display: block !important; } .section { padding: 60px 0; } .section-title { font-size: 24px; margin-bottom: 30px; } .section-subtitle { font-size: 12px; letter-spacing: 2px; } .slide-title { font-size: 28px; } .slide-subtitle { font-size: 13px; letter-spacing: 3px; } .slide-content .btn { padding: 12px 24px; font-size: 13px; } .booking-form { flex-direction: column; padding: 20px; } .form-group { width: 100%; } .btn-book { width: 100%; padding: 14px; } .about-inner { gap: 30px; } .about-image img { height: 280px; } .about-features { grid-template-columns: repeat(2, 1fr); gap: 10px; } .feature-item { padding: 10px; font-size: 12px; } .feature-item i { font-size: 16px; } .rooms-grid { grid-template-columns: 1fr; gap: 20px; } .room-image { height: 200px; } .room-info { padding: 18px; } .gallery-grid { grid-template-columns: 1fr 1fr; gap: 10px; } .gallery-item { height: 180px; } .gallery-item-wide { grid-column: span 2; } .activities-grid { grid-template-columns: 1fr; gap: 16px; } .activity-card { padding: 28px 20px; } .contact-inner { grid-template-columns: 1fr; gap: 30px; } .contact-map iframe { height: 280px !important; } .footer { padding-top: 40px; } .footer-inner { grid-template-columns: 1fr; gap: 28px; } .footer-bottom { padding: 16px 0; } .campaign-inner { flex-direction: column; text-align: center; gap: 12px; } .campaign-banner { margin-top: -40px; padding: 14px 0; } .reviews-slider { grid-template-columns: 1fr; gap: 16px; } .review-card { padding: 20px; } .slider-btn { width: 38px; height: 38px; font-size: 14px; } .slider-prev { left: 12px; } .slider-next { right: 12px; } .slider-dots { bottom: 20px; } .slider-dot { width: 10px; height: 10px; } .faq-question { padding: 14px 18px; font-size: 14px; } .faq-answer p { padding: 0 18px 14px; font-size: 13px; } .wa-widget { bottom: 16px; right: 16px; } .wa-float-btn { width: 54px; height: 54px; font-size: 26px; }}@media (max-width: 480px) { .container { padding: 0 16px; } .section { padding: 44px 0; } .section-title { font-size: 20px; margin-bottom: 24px; } .hero-slider { min-height: 500px; } .slide-title { font-size: 22px; margin-bottom: 20px; } .slide-subtitle { font-size: 12px; margin-bottom: 10px; } .booking-widget { margin-top: -40px; padding: 20px 0; } .booking-form { padding: 16px; border-radius: 10px; } .about-image img { height: 220px; } .about-image-badge { right: 10px; bottom: -12px; padding: 14px 18px; } .badge-number { font-size: 24px; } .badge-text { font-size: 10px; } .about-text { font-size: 14px; } .about-features { grid-template-columns: 1fr 1fr; gap: 8px; } .feature-item span { font-size: 11px; } .room-image { height: 180px; } .gallery-grid { grid-template-columns: 1fr; gap: 8px; } .gallery-item { height: 200px; } .gallery-item-wide { grid-column: span 1; } .activity-icon { width: 56px; height: 56px; font-size: 22px; } .activity-card h3 { font-size: 16px; } .activity-card p { font-size: 13px; } .contact-item > i { width: 40px; height: 40px; font-size: 16px; } .contact-map iframe { height: 220px !important; } .wa-chat-box { width: calc(100vw - 32px); right: -8px; bottom: 68px; } .wa-chat-header { padding: 12px 16px; } .wa-avatar { width: 38px; height: 38px; font-size: 16px; } .wa-chat-header h4 { font-size: 14px; } .wa-chat-body { padding: 16px; min-height: 130px; }}/* ===== MOBILE TOUCH TARGET FIXES (WCAG/Google Guidelines) ===== */@media (max-width:768px){/* Hamburger: 48x48 minimum */.hamburger{padding:12px !important;min-width:48px !important;min-height:48px !important;align-items:center;justify-content:center}.hamburger span{width:22px}/* Lang switcher button: min 44x44 */.lang-current{padding:11px 14px !important;min-height:44px !important;font-size:14px !important}.lang-dropdown button{padding:12px 16px !important;min-height:44px !important}/* Slider nav buttons: min 44x44 */.slider-btn{width:44px !important;height:44px !important;font-size:16px !important}/* Slider dots: increase touch area (pseudo-padding) */.slider-dot{position:relative;padding:10px !important;width:32px !important;height:32px !important;background:transparent !important;display:flex;align-items:center;justify-content:center;border-radius:0 !important}.slider-dot::before{content:'';width:10px;height:10px;border-radius:50%;background:rgba(255,255,255,0.5);transition:var(--transition)}.slider-dot.active::before{background:var(--primary);transform:scale(1.2)}.slider-dots{gap:4px !important}/* Contact links: min 44px height */.contact-item p a{display:inline-block;padding:8px 0;min-height:32px}.footer-col ul a{padding:8px 0 !important;display:inline-block;min-height:32px;line-height:1.4}/* Skip-to-content: 44x44 */.sr-only-focusable:focus{padding:14px 20px !important;min-height:44px !important}/* Review stars: readable */.review-stars i{font-size:16px !important}/* Form inputs: prevent zoom on iOS (16px min) */.form-group input,.form-group select,.form-control,input[type="text"],input[type="email"],input[type="tel"],input[type="date"],input[type="number"],select,textarea{font-size:16px !important;min-height:44px}/* Buttons: min 44px */.btn,button.btn{min-height:44px;padding:12px 24px !important}/* Nav items: larger tap targets */.nav-list a{padding:16px 0 !important;min-height:48px;display:flex;align-items:center}.nav-btn{padding:14px 24px !important;min-height:48px;justify-content:center}/* FAQ questions: tap area */.faq-question{padding:18px 20px !important;min-height:56px}/* Contact item icons size */.contact-item > i{width:44px !important;height:44px !important}/* Room card link touch */.room-card .btn{padding:14px 24px !important;min-height:44px;display:flex;align-items:center;justify-content:center}/* WhatsApp float button */.wa-float-btn{width:58px !important;height:58px !important}/* WhatsApp chat close */.wa-close{padding:10px !important;min-width:44px;min-height:44px}/* WhatsApp chat send */.wa-chat-footer button{width:44px !important;height:44px !important}/* Legal footer links tap area */.footer-col ul li{margin-bottom:4px !important}/* Ensure tables don't overflow */table{max-width:100%;font-size:13px}/* Prevent text overflow */h1,h2,h3,h4,p{word-wrap:break-word;overflow-wrap:break-word;hyphens:auto}/* Image responsive */img{max-width:100%;height:auto}/* Prevent fixed elements from blocking content */.wa-widget{z-index:990}.header{z-index:991}}@media (max-width:480px){/* Extra small screens */.slide-title{font-size:20px !important;line-height:1.3}.slide-subtitle{font-size:11px !important;letter-spacing:2px !important}/* Container padding */.container{padding:0 14px !important}/* Cards */.room-card .btn,.activity-card .btn{width:100%;margin-top:10px}/* Room card: image smaller */.room-image{height:200px !important}/* Section padding reduction */.section-title{font-size:22px !important;line-height:1.2}/* FAQ more compact */.faq-question{padding:14px 16px !important;font-size:14px !important;line-height:1.4}.faq-answer p{padding:0 16px 14px !important;font-size:13px !important}/* Footer padding */.footer{padding-top:32px !important}.footer-inner{padding-bottom:24px !important;gap:20px !important}/* Campaign banner: text alignment */.campaign-text h3{font-size:15px !important;line-height:1.3}.campaign-text p{font-size:12px !important}.btn-campaign{font-size:12px !important;padding:10px 18px !important}/* Review card compact */.review-card{padding:16px !important}.review-text{font-size:13px !important}/* Activity card compact */.activity-card{padding:24px 16px !important}.activity-card h3{font-size:15px !important}.activity-card p{font-size:12.5px !important}/* About image badge position */.about-image-badge{right:8px !important;bottom:-10px !important;padding:12px 14px !important}/* Contact items */.contact-item{gap:12px !important;margin-bottom:18px !important}.contact-item > i{width:40px !important;height:40px !important;font-size:14px !important}/* Logo smaller */.logo{font-size:18px !important}.logo-icon{font-size:22px !important}.logo-img{height:40px !important}.header.scrolled .logo-img{height:32px !important}/* Lang button smaller but tappable */.lang-current{padding:10px 12px !important;font-size:12px !important}/* Slider dots smaller but tap area same */.slider-dot{width:28px !important;height:28px !important;padding:8px !important}/* Nav width full-ish */.nav{width:calc(100vw - 40px) !important;max-width:320px !important}}/* iOS tap highlight */a,button,input,select,textarea{-webkit-tap-highlight-color:rgba(22,163,74,0.2)}/* iOS input zoom prevention */@media screen and (max-width:768px){input,select,textarea{font-size:16px !important}}/* MOBILE-V2 */@media (max-width:768px){.lang-current{min-width:50px !important;width:auto !important;padding:10px 14px !important}.slider-dot{width:44px !important;height:44px !important}.logo{min-height:44px;padding:4px 0}}/* ===== iOS SPECIFIC FIXES ===== *//* iOS 100vh bug - use -webkit-fill-available or dvh */@supports (height: 100dvh){.hero-slider,.slider{height:100dvh !important;min-height:100dvh !important}}@supports (-webkit-touch-callout: none){/* iOS only */.hero-slider,.slider{height:-webkit-fill-available;min-height:-webkit-fill-available}}/* iOS safe area for notch (iPhone X+) */@supports (padding: max(0px)){.header{padding-top:max(15px, env(safe-area-inset-top)) !important;padding-left:max(0px, env(safe-area-inset-left));padding-right:max(0px, env(safe-area-inset-right))}.footer{padding-bottom:max(20px, env(safe-area-inset-bottom));padding-left:max(0px, env(safe-area-inset-left));padding-right:max(0px, env(safe-area-inset-right))}.wa-widget{bottom:max(24px, env(safe-area-inset-bottom) + 8px) !important;right:max(24px, env(safe-area-inset-right) + 8px) !important}.nav.active{padding-top:max(80px, env(safe-area-inset-top) + 60px);padding-right:max(30px, env(safe-area-inset-right) + 20px)}}/* Prevent iOS text size adjust */html{-webkit-text-size-adjust:100%;text-size-adjust:100%}/* iOS momentum scrolling */.nav,.wa-chat-body,.footer,body{-webkit-overflow-scrolling:touch}/* iOS date picker fix */input[type="date"]::-webkit-date-and-time-value{text-align:left}input[type="date"]{-webkit-appearance:none;appearance:none;min-height:44px}/* iOS select appearance */select{-webkit-appearance:none;appearance:none;background-image:url("data:image/svg+xml;charset=US-ASCII,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='%23666'%3E%3Cpath d='M7 10l5 5 5-5z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;padding-right:34px !important}/* iOS button reset */button{-webkit-appearance:none;appearance:none;-webkit-user-select:none;user-select:none}/* Prevent iOS yellow phone link auto-style */a[href^="tel:"]{color:inherit;text-decoration:none}/* iOS tap highlight */*{-webkit-tap-highlight-color:transparent}a,button,input,select,textarea,[role="button"]{-webkit-tap-highlight-color:rgba(22,163,74,0.15)}/* iOS smooth scrolling without bouncing issues */html,body{overscroll-behavior-y:contain}/* ===== MOBILE-FIX-V3 ===== */@media (max-width:768px){html,body{overflow-x:hidden}.header-inner{gap:8px}.logo{flex:0 1 auto;min-width:0;overflow:hidden}.logo-img{height:36px !important;width:auto !important;max-width:100%;object-fit:contain}.header.scrolled .logo-img{height:32px !important}.hamburger{flex-shrink:0;display:flex !important}.nav{position:fixed !important;top:0 !important;right:-100% !important;left:auto !important;width:min(85vw,320px) !important;height:100vh !important;background:#fff !important;padding:80px 24px 30px !important;box-shadow:-4px 0 20px rgba(0,0,0,0.1);transition:right .35s ease !important;z-index:1000 !important;overflow-y:auto}.nav.active{right:0 !important}.nav-list{flex-direction:column !important;align-items:stretch !important;gap:0 !important;width:100% !important}.nav-list li{width:100% !important}.nav-list a{color:#1a1a1a !important;display:flex !important;padding:14px 0 !important;border-bottom:1px solid #eee !important;font-size:15px !important;min-height:48px;align-items:center}.nav-btn{margin-top:12px !important;text-align:center !important;justify-content:center !important;border-bottom:none !important}}@media (max-width:480px){.logo-img{height:32px !important}.header.scrolled .logo-img{height:28px !important}.lang-current{min-width:44px !important;padding:8px 10px !important;font-size:12px !important}.hamburger{padding:10px !important;min-width:44px !important;min-height:44px !important}}/* ===== FOOTER GUIDES COMPACT ===== */.footer-col-guides { grid-column: span 2; }.footer-col-guides ul { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 2px 18px; }.footer-col-guides ul li { margin-bottom: 0 !important; }.footer-col-guides ul a { font-size: 12px; line-height: 1.3; padding: 2px 0 !important; }@media (max-width: 768px) { .footer-col-guides { grid-column: auto; } .footer-col-guides ul { grid-template-columns: 1fr 1fr; gap: 1px 12px; } .footer-col-guides ul a { font-size: 11px !important; padding: 3px 0 !important; line-height: 1.3; }}/* ===== MOBILE TOUCH TARGETS (44x44 minimum) ===== */.nav-btn { min-height: 44px !important; padding: 12px 24px !important; display: inline-flex; align-items: center; justify-content: center; }.lang-current { min-width: 44px !important; min-height: 44px !important; padding: 10px 14px !important; }.lang-dropdown button { min-height: 44px !important; padding: 12px 16px !important; display: flex; align-items: center; gap: 8px; }.slider-dot { width: 12px; height: 12px; }.slider-dots { padding: 12px; }.slider-dot::before { content: ""; position: absolute; inset: -12px; }.slider-dot { position: relative; }@media (max-width: 768px) { .slider-dot { width: 14px; height: 14px; } .slider-dot::before { inset: -16px; } .nav-btn { min-height: 48px !important; } button, a.btn, .nav-btn { -webkit-tap-highlight-color: rgba(22,163,74,0.2); }}/* ===== MOBILE TOUCH TARGETS (44x44 minimum) ===== */.nav-btn { min-height: 44px !important; padding: 12px 24px !important; display: inline-flex; align-items: center; justify-content: center; }.lang-current { min-width: 44px !important; min-height: 44px !important; padding: 10px 14px !important; }.lang-dropdown button { min-height: 44px !important; padding: 12px 16px !important; display: flex; align-items: center; gap: 8px; }.slider-dot { position: relative; width: 12px; height: 12px; }.slider-dot::before { content: ""; position: absolute; inset: -14px; }.slider-dots { padding: 12px; }@media (max-width: 768px) { .slider-dot { width: 14px; height: 14px; } .slider-dot::before { inset: -16px; } .nav-btn { min-height: 48px !important; } button, a.btn, .nav-btn { -webkit-tap-highlight-color: rgba(22,163,74,0.2); }}