﻿/*
Theme Name: Villa Nord
Theme URI: https://villanord.ee
Author: Villa Nord
Author URI: https://villanord.ee
Description: Luxury Seaside Villa one-page booking theme for Villa Nord, Northern Estonia.
Version: 1.1.0
Requires at least: 6.0
Tested up to: 6.5
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: villa-nord
Tags: one-page, hotel, booking, luxury, full-width-template
*/

/* Reset */
* { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-padding-top: 80px; scroll-behavior: smooth; }
body { font-family: 'Inter', sans-serif; scroll-behavior: smooth; background: #fff; color: #1f2937; -webkit-font-smoothing: antialiased; }

/* Typography */
.font-serif, .font-heading { font-family: 'Playfair Display', serif; }
.font-body { font-family: 'Inter', sans-serif; }

/* Nav */
.backdrop-blur-custom { backdrop-filter: blur(12px); background-color: #ffffff; }

/* Mobile Menu */
#mobile-menu { display: none; background-color: #ffffff; }
#mobile-menu.is-open { display: flex; }

/* Hover Lift */
.hover-lift { transition: transform 0.25s ease, box-shadow 0.3s ease; }
.hover-lift:hover { transform: translateY(-4px); box-shadow: 0 20px 25px -12px rgba(0,0,0,0.1); }

/* Hero */
.hero-gradient { background: linear-gradient(to bottom, rgba(0,0,0,0.35), rgba(0,0,0,0.55)); }
.hero-content { opacity: 0; transform: translateY(16px); animation: heroFade 0.9s ease forwards; animation-delay: 0.2s; }
@keyframes heroFade { to { opacity: 1; transform: translateY(0); } }

/* Reveal */
.reveal { opacity: 0; transform: translateY(22px); transition: opacity 0.75s ease, transform 0.75s ease; will-change: opacity, transform; }
.reveal.is-visible { opacity: 1; transform: translateY(0); }

/* Success messages */
.villa-nord-success { background-color: #dcfce7; border: 1px solid #22c55e; color: #166534; padding: 1rem; border-radius: 0.75rem; margin-bottom: 1.5rem; text-align: center; }

/* Language switch buttons */
.lang-switch { appearance: none; border: 0; background: transparent; color: #374151; cursor: pointer; }
.lang-switch.is-active { background-color: #92400e !important; color: #ffffff !important; box-shadow: 0 4px 14px rgba(146,64,14,0.18); }
.lang-switch:not(.is-active) { background: transparent !important; color: #374151 !important; }
.lang-switch:not(.is-active):hover { background-color: #f3f4f6 !important; }