/*
Theme Name: Wood-Up
Theme URI: https://wood-up.it
Author: Wood-Up Srl
Author URI: https://wood-up.it
Description: Tema WordPress per Wood-Up – Rifugio nel Bosco. Design naturale, elegante, basato su Tailwind CSS.
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: wood-up
Tags: one-page, nature, luxury, tailwind
*/

/* ── Custom styles non coperte da Tailwind ──────────────────────────── */

:root {
  --color-forest:   #1a2e1a;
  --color-moss:     #2d4a2d;
  --color-bark:     #5c3d1e;
  --color-cream:    #f5f0e8;
  --color-gold:     #c9a84c;
  --color-gold-lt:  #e4c97e;
}

html { scroll-behavior: smooth; }

body {
  font-family: 'Cormorant Garamond', Georgia, serif;
  background-color: var(--color-cream);
  color: var(--color-forest);
  overflow-x: hidden;
}

/* ── Scrollbar ─────────────────────────────────────────────────────── */
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: var(--color-cream); }
::-webkit-scrollbar-thumb { background: var(--color-gold); border-radius: 3px; }

/* ── Navigation glass effect ───────────────────────────────────────── */
.nav-glass {
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  background: transparent;                          /* inizia trasparente */
  border-bottom: 1px solid transparent;
  transition: background 0.4s ease, border-color 0.4s ease;
}
.nav-glass.scrolled {
  background: #6C6751;
}

/* ── Nav link hover ────────────────────────────────────────────────── */
.nav-link {
  position: relative;
  letter-spacing: 0.12em;
  font-size: 0.7rem;
  text-transform: uppercase;
  color: rgba(245,240,232,0.75);
  transition: color 0.3s;
}
.nav-link::after {
  content: '';
  position: absolute;
  bottom: -2px; left: 0;
  width: 0; height: 1px;
  background: var(--color-gold);
  transition: width 0.3s ease;
}
.nav-link:hover { color: var(--color-gold-lt); }
.nav-link:hover::after { width: 100%; }

/* ── Gold button ───────────────────────────────────────────────────── */
.btn-gold {
  display: inline-block;
  padding: 0.65rem 2rem;
  background: var(--color-gold);
  color: var(--color-forest);
  font-family: 'Montserrat', sans-serif;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  text-decoration: none;
  border: 2px solid var(--color-gold);
  transition: all 0.3s ease;
}
.btn-gold:hover {
  background: transparent;
  color: var(--color-gold);
}

.btn-outline {
  display: inline-block;
  padding: 0.65rem 2rem;
  background: transparent;
  color: var(--color-cream);
  font-family: 'Montserrat', sans-serif;
  font-size: 0.68rem;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  text-decoration: none;
  border: 1px solid rgba(245,240,232,0.4);
  transition: all 0.3s ease;
}
.btn-outline:hover {
  border-color: var(--color-gold);
  color: var(--color-gold);
}

/* ── Section label ─────────────────────────────────────────────────── */
.section-label {
  font-family: 'Montserrat', sans-serif;
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: var(--color-gold);
}

/* ── Display heading ───────────────────────────────────────────────── */
.display-heading {
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-weight: 300;
  font-style: italic;
  line-height: 1.1;
  letter-spacing: -0.01em;
}

/* ── Gold divider ──────────────────────────────────────────────────── */
.gold-divider {
  width: 48px;
  height: 1px;
  background: var(--color-gold);
  margin: 1.5rem 0;
}

/* ── Feature card ──────────────────────────────────────────────────── */
.feature-card {
  border: 1px solid rgba(201,168,76,0.15);
  padding: 2rem;
  transition: border-color 0.3s, transform 0.3s;
  background: rgba(26,46,26,0.03);
}
.feature-card:hover {
  border-color: rgba(201,168,76,0.5);
  transform: translateY(-4px);
}

/* ── Accommodation card ────────────────────────────────────────────── */
.accom-card {
  background: var(--color-forest);
  color: var(--color-cream);
  overflow: hidden;
  transition: transform 0.4s ease;
}
.accom-card:hover { transform: translateY(-6px); }
.accom-card img {
  width: 100%;
  height: 280px;
  object-fit: cover;
  transition: transform 0.6s ease;
}
.accom-card:hover img { transform: scale(1.05); }

/* ── Parallax hero ─────────────────────────────────────────────────── */
.hero-bg {
  background-attachment: fixed;
  background-size: cover;
  background-position: center;
}

.bg-primary{
  background-color: #6C6751
}

/* ── Quote block ───────────────────────────────────────────────────── */
blockquote {
  border-left: 2px solid var(--color-gold);
  padding-left: 1.5rem;
  font-style: italic;
  font-size: 1.2rem;
  color: var(--color-moss);
  margin: 2rem 0;
}

/* ── Map embed ─────────────────────────────────────────────────────── */
.map-wrapper iframe {
  width: 100%;
  height: 300px;
  border: none;
  filter: grayscale(20%) contrast(1.05);
}

/* ── Tag badge ─────────────────────────────────────────────────────── */
.tag-badge {
  font-family: 'Montserrat', sans-serif;
  font-size: 0.6rem;
  font-weight: 700;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  padding: 0.25rem 0.75rem;
  border: 1px solid var(--color-gold);
  color: var(--color-gold);
  display: inline-block;
}

/* ── Fade-in animation ─────────────────────────────────────────────── */
@keyframes fadeInUp {
  from { opacity: 0; transform: translateY(32px); }
  to   { opacity: 1; transform: translateY(0); }
}
.fade-in-up { animation: fadeInUp 0.9s ease both; }
.delay-1 { animation-delay: 0.15s; }
.delay-2 { animation-delay: 0.3s; }
.delay-3 { animation-delay: 0.45s; }

/* ── Mobile nav menu ───────────────────────────────────────────────── */
#mobile-menu {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.4s ease;
}
#mobile-menu.open { max-height: 400px; }


/* ============================================================
   WOOD-UP — Contact Form 7 Styles
   Aggiungere in: Aspetto → Personalizza → CSS aggiuntivo
   oppure in style.css del tema figlio
   ============================================================ */

/* Reset struttura CF7 */
.woodup-cf7-wrapper .wpcf7 {
  margin: 0;
  padding: 0;
}

.woodup-cf7-wrapper .wpcf7-form {
  display: flex;
  flex-direction: column;
  gap: 2rem; /* space-y-8 */
}

/* Grid 2 colonne per nome + email */
.woodup-cf7-wrapper .cf7-grid-2col {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2rem;
}

@media (min-width: 768px) {
  .woodup-cf7-wrapper .cf7-grid-2col {
    grid-template-columns: 1fr 1fr;
  }
}

/* Gruppo campo (label + input) */
.woodup-cf7-wrapper .cf7-field-group {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

/* Label */
.woodup-cf7-wrapper .cf7-label {
  font-size: 0.625rem;         /* text-[10px] */
  font-weight: 700;
  letter-spacing: 0.15em;      /* tracking-widest */
  color: rgba(45, 47, 45, 0.5);
  text-transform: uppercase;
  padding: 0 0.25rem;
  display: block;
}

/* Span wrapper CF7 — deve essere block per non rompere il layout */
.woodup-cf7-wrapper .wpcf7-form-control-wrap {
  display: block;
  width: 100%;
}

/* Input e textarea comuni */
.woodup-cf7-wrapper input[type="text"],
.woodup-cf7-wrapper input[type="email"],
.woodup-cf7-wrapper select,
.woodup-cf7-wrapper textarea {
  width: 100%;
  background-color: rgba(251, 246, 236, 0.5); /* bg-[#FBF6EC]/50 */
  border: none;
  border-bottom: 1px solid rgba(45, 47, 45, 0.1);
  padding: 1rem;               /* py-4 px-4 */
  font-weight: 300;            /* font-light */
  font-family: inherit;
  font-size: 1rem;
  color: #2D2F2D;
  border-radius: 0.75rem;      /* rounded-xl */
  outline: none;
  transition: border-color 0.2s ease;
  box-sizing: border-box;
  -webkit-appearance: none;
  appearance: none;
}

.woodup-cf7-wrapper input[type="text"]:focus,
.woodup-cf7-wrapper input[type="email"]:focus,
.woodup-cf7-wrapper select:focus,
.woodup-cf7-wrapper textarea:focus {
  border-bottom-color: #8B5E3C;
}

/* Placeholder */
.woodup-cf7-wrapper input::placeholder,
.woodup-cf7-wrapper textarea::placeholder {
  color: rgba(45, 47, 45, 0.35);
  font-weight: 300;
}

/* Textarea */
.woodup-cf7-wrapper textarea {
  resize: none;
  min-height: 8rem;
}

/* Select — freccia custom */
.woodup-cf7-wrapper select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%238B5E3C' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 1rem center;
  padding-right: 2.5rem;
  cursor: pointer;
}

/* Bottone submit */
.woodup-cf7-wrapper input[type="submit"],
.woodup-cf7-wrapper .wpcf7-submit {
  width: 100%;
  padding: 1.25rem;            /* py-5 */
  background-color: #2D2F2D;
  color: #F4E8D4;
  font-size: 0.875rem;         /* text-sm */
  font-weight: 700;
  letter-spacing: 0.2em;       /* tracking-[0.2em] */
  border-radius: 9999px;       /* rounded-full */
  border: none;
  cursor: pointer;
  transition: background-color 0.3s ease, transform 0.3s ease, box-shadow 0.3s ease;
  box-shadow: 0 10px 25px rgba(139, 94, 60, 0.15);
  font-family: inherit;
  display: block;
}

.woodup-cf7-wrapper input[type="submit"]:hover,
.woodup-cf7-wrapper .wpcf7-submit:hover {
  background-color: #8B5E3C;
  transform: translateY(-2px);  /* -translate-y-1 */
}

/* Nota privacy */
.woodup-cf7-wrapper .cf7-privacy-note {
  font-size: 0.625rem;          /* text-[10px] */
  color: rgba(45, 47, 45, 0.4);
  text-align: center;
  margin: 0;
  line-height: 1.5;
}

/* Messaggi di risposta CF7 */
.woodup-cf7-wrapper .wpcf7-response-output {
  border-radius: 1rem;
  padding: 1rem 1.25rem;
  font-size: 0.875rem;
  font-weight: 300;
  border: none !important;
  margin: 0 !important;
}

/* Successo */
.woodup-cf7-wrapper .wpcf7-mail-sent-ok {
  background-color: rgba(108, 103, 81, 0.08);
  color: #3d5a3e;
}

/* Errore */
.woodup-cf7-wrapper .wpcf7-mail-sent-ng,
.woodup-cf7-wrapper .wpcf7-spam-blocked {
  background-color: rgba(200, 80, 60, 0.08);
  color: #7a2e22;
}

/* Messaggi di validazione inline */
.woodup-cf7-wrapper .wpcf7-not-valid-tip {
  font-size: 0.7rem;
  color: #c84a3a;
  margin-top: 0.25rem;
  font-weight: 400;
  display: block;
}

/* Input non valido */
.woodup-cf7-wrapper .wpcf7-not-valid {
  border-bottom-color: #c84a3a !important;
}

/* Spinner durante invio */
.woodup-cf7-wrapper .wpcf7-spinner {
  display: none; /* opzionale: nasconde lo spinner di default */
}