/*
Theme Name: Avada Child
Description: Child theme for Avada theme
Author: ThemeFusion
Author URI: https://theme-fusion.com
Template: Avada
Version: 1.0.0
Text Domain:  Avada
*/
/* ===== Heartwood Global Colors (paleta de marca) ===== */
:root, .fusion-body {
  --awb-color1: #EFEAE4; /* Oyster (fondo claro) */
  --awb-color2: #BAC3CB; /* River Stone */
  --awb-color3: #CEC439; /* Saltmarsh Green */
  --awb-color4: #6D7EA0; /* Veranda Blue */
  --awb-color5: #424B0A; /* Boxwood Green */
  --awb-color6: #002942; /* Deepwater Blue */
  --awb-color7: #E54511; /* Town Square (CTA) */
  --awb-color8: #19180C; /* Off Black (texto) */
  --awb-color9: #38251C; /* Heart Pine */
}

/* Ocultar footer nativo de Avada (usamos footer propio en el contenido) */
.fusion-footer { display: none !important; }
/* Contraste del menú del nav sobre Boxwood */
.fusion-menu-element .fusion-menu > li > a,
.fusion-menu-element .fusion-menu > li > a .menu-text { color: #EFEAE4 !important; }

/* Links de menú (nav + footer) en Oyster sobre Boxwood */
.fusion-menu-element a, .fusion-menu-element a .menu-text,
.fusion-menu-element .fusion-menu li a { color: #EFEAE4 !important; }
.fusion-menu-element a:hover, .fusion-menu-element .fusion-menu li a:hover { color: #CEC439 !important; }

/* Selector correcto del menú Avada nuevo (.awb-menu) */
.awb-menu__main-a, .awb-menu__main-a .menu-text, .awb-menu a { color: #EFEAE4 !important; }
.awb-menu__main-a:hover, .awb-menu__main-a:hover .menu-text, .awb-menu a:hover { color: #CEC439 !important; }

/* ===== Home HERO — Avada elements + CSS a medida (editable en builder) ===== */
.hw-hero{min-height:680px !important;}
.hw-hero .hw-script{margin-top:80px !important;}
.hw-hero .hw-sub{margin-top:22px !important;}
.hw-collagewrap{position:relative !important;}
.hw-collage{margin-top:-150px !important; position:relative; z-index:3;}
.hw-badge{position:absolute !important; left:4%; top:-36px; z-index:5; margin:0 !important;}
.hw-introwrap{position:relative !important;}
.hw-welcome{position:absolute !important; right:40px; top:55px; writing-mode:vertical-rl; margin:0 !important;}

/* ===== Home scattered section ===== */
/* FIX #6: antes height fija 1700px mientras las imágenes escalaban con el ancho (%),
   así en pantallas anchas (27") las fotos crecían pero el alto no → se solapaban.
   Con aspect-ratio TODO escala en proporción y el layout se mantiene fiel al Figma. */
.hw-scatter{position:relative !important;aspect-ratio:1440/1700;height:auto !important;overflow:visible}
.hw-scatter .fusion-row{max-width:100% !important;width:100% !important;margin:0 !important;padding:0 !important}
.hw-scatter .fusion-builder-row-1{height:100%}
.s-dining{position:absolute !important;left:29.51%;top:1.65%;width:18.4%;margin:0 !important}
.s-vibe{position:absolute !important;left:53.54%;top:4.76%;width:21.88%;margin:0 !important}
.s-mandrink{position:absolute !important;left:60.83%;top:16.59%;width:14.58%;margin:0 !important}
.s-trees{position:absolute !important;left:5.35%;top:18.76%;width:19.38%;margin:0 !important}
.s-aerial{position:absolute !important;left:23.12%;top:34.35%;width:20.83%;margin:0 !important}
.s-photo3331{position:absolute !important;left:39.58%;top:39.59%;width:20.83%;margin:0 !important}
.s-twowomen{position:absolute !important;left:16.53%;top:41.18%;width:14.58%;margin:0 !important}
.s-sprinkler{position:absolute !important;left:64.44%;top:45.53%;width:18.96%;margin:0 !important}
.s-magnolia{position:absolute !important;left:80.9%;top:35.24%;width:19.1%;margin:0 !important}
.s-flowers{position:absolute !important;left:80.14%;top:52.29%;width:19.86%;margin:0 !important}
.s-photo2033{position:absolute !important;left:64.38%;top:68.88%;width:25.9%;margin:0 !important}
.s-hmark{position:absolute !important;left:49.03%;top:86.18%;width:1.88%;margin:0 !important}
/* FIX #3: la H en tomate (Town Square) vía máscara del PNG.
   La clase s-hmark va sobre el propio span.fusion-imageframe (no un hijo). */
.s-hmark{display:block !important;
  -webkit-mask:url('http://localhost:8080/wp-content/uploads/2026/07/H_mark_outline.png') center/contain no-repeat;
          mask:url('http://localhost:8080/wp-content/uploads/2026/07/H_mark_outline.png') center/contain no-repeat;
  background:var(--awb-color7,#E54511)}
.s-hmark img{opacity:0 !important}
/* FIX #3: foto con marco festoneado amarillo (Saltmarsh) sobre la de dos mujeres */
.s-twowomen{padding:12px;background:var(--awb-color3,#CEC439);
  -webkit-mask:radial-gradient(circle at 9px 9px,transparent 8px,#000 8.5px) -9px -9px/18px 18px;
          mask:radial-gradient(circle at 9px 9px,transparent 8px,#000 8.5px) -9px -9px/18px 18px}
.s-twowomen img{border-radius:2px}
/* FIX: los textos llevan la clase s-* sobre el propio .fusion-text, y Avada le
   aplica width:100% → sin !important se estiraban a todo el ancho. */
.s-drive{position:absolute !important;left:17.01%;top:19.88%;width:26.39% !important}
.s-trails{position:absolute !important;left:50.69%;top:36.82%;width:20.83% !important}
.s-fresh{position:absolute !important;left:38.06%;top:75.65%;width:23.82% !important}
/* FIX: el CTA estaba en 97% (borde inferior, debajo del H-mark y fuera de vista).
   En Figma va entre "And a fresh mix..." y el H-mark. */
.s-cta{position:absolute !important;left:50%;top:81.5%;transform:translateX(-50%);width:auto !important}
/* fix: el ancestro posicionado de los absolutos es la layout-column */
.hw-scatter .fusion-layout-column{height:100% !important;position:relative !important;width:100% !important;margin:0 !important;float:none !important}
.hw-scatter .fusion-column-wrapper{height:100% !important}
/* fix imágenes visibles + ancho de texto en scattered */
.hw-scatter .fusion-imageframe{line-height:0 !important;display:block !important}
.hw-scatter .fusion-imageframe img{width:100% !important;height:auto !important;display:block !important;max-width:100% !important}
/* FIX: antes esta regla también pegaba a .s-drive y le forzaba width:100%,
   anulando su 26.39% → el texto se desbordaba y se veía fuera de lugar. */
.hw-scatter .s-drive .fusion-text{width:100% !important}
/* CTA "Find Your Home": una línea, centrado y SUBRAYADO (es un botón) — #3 */
.s-cta{white-space:nowrap}
.s-cta .fusion-text{width:auto !important}
.s-cta p{display:inline-block;padding-bottom:8px;border-bottom:1.5px solid var(--awb-color7,#E54511)}
.hw-scatter .fusion-text p{margin:0}

/* ===== Scroll-spy: etiqueta vertical ANCLADA por sección (#2) =====
   Aparece al llegar a la sección (no todas a la vez, como en Figma). */
.hw-seclabel{
  position:absolute;right:34px;top:120px;z-index:6;pointer-events:none;
  writing-mode:vertical-rl;text-orientation:mixed;
  text-transform:uppercase;letter-spacing:3px;font-size:11px;
  font-family:'Poppins',sans-serif;color:var(--awb-color6,#002942);
  line-height:1;opacity:0;transform:translateY(-8px);
  transition:opacity .5s ease, transform .5s ease}
.hw-seclabel::after{content:"";display:block;width:1px;height:56px;margin:12px auto 0;background:var(--awb-color6,#002942);opacity:.5}
.hw-seclabel.is-in{opacity:.85;transform:translateY(0)}
@media(max-width:900px){.hw-seclabel{display:none}}
/* ocultar header nativo de Avada en la Home (usamos el nav del hero) */
.page-id-6844 .fusion-header-wrapper, .page-id-6844 .fusion-header{display:none !important}
.fusion-header-wrapper{display:none !important}

/* ==================================================================
   OFF-CANVAS NAV (feature #2) — copiar TODO este bloque a Avada > Custom CSS
   ================================================================== */
html.hw-oc-lock{overflow:hidden !important}

.hw-oc{
  position:fixed;inset:0;z-index:99999;
  background:var(--awb-color5,#424B0A);
  color:var(--awb-color1,#EFEAE4);
  opacity:0;visibility:hidden;pointer-events:none;
  transition:opacity .45s ease, visibility 0s linear .45s;
  overflow-y:auto;
  -webkit-font-smoothing:antialiased;
}
/* textura sutil sobre el verde (usa el canopy a baja opacidad + oscurecido) */
.hw-oc::before{
  content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background:url('http://localhost:8080/wp-content/uploads/2026/07/canopy_clean.jpg') center/cover no-repeat;
  opacity:.10;mix-blend-mode:overlay;
}
.hw-oc.is-open{opacity:1;visibility:visible;pointer-events:auto;transition:opacity .45s ease;}
.hw-oc > *{position:relative;z-index:1}

/* ---- barra superior ---- */
.hw-oc__top{
  display:flex;align-items:center;justify-content:space-between;
  padding:34px 60px;gap:20px;
}
.hw-oc__toplinks{display:flex;gap:34px;flex:1}
.hw-oc__toplinks a,.hw-oc__close span{
  font-family:'Poppins',sans-serif;font-size:12px;letter-spacing:2px;text-transform:uppercase;font-weight:600;
}
.hw-oc__toplinks a{color:var(--awb-color1,#EFEAE4);text-decoration:none;opacity:.9}
.hw-oc__toplinks a:hover{opacity:1;color:var(--awb-color3,#CEC439)}
.hw-oc__brand{
  flex:1;text-align:center;text-decoration:none;
  font-family:'Playfair Display',Georgia,serif;font-size:24px;letter-spacing:8px;
  text-transform:uppercase;color:var(--awb-color1,#EFEAE4);white-space:nowrap;
}
.hw-oc__close{
  flex:1;display:flex;align-items:center;justify-content:flex-end;gap:16px;
  background:none;border:0;cursor:pointer;color:var(--awb-color1,#EFEAE4);padding:0;
}
.hw-oc__close svg{stroke:currentColor;stroke-width:1.5}
.hw-oc__close:hover{color:var(--awb-color3,#CEC439)}

/* ---- cuerpo: imagen + columnas ---- */
.hw-oc__body{
  display:flex;align-items:flex-start;gap:70px;
  padding:44px 60px 40px 75px;max-width:1440px;margin:0 auto;
}
.hw-oc__media{
  position:relative;flex:0 0 auto;width:min(40vw,570px);aspect-ratio:1/1;
  overflow:hidden;background:rgba(0,0,0,.15);
}
.hw-oc__img{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  opacity:0;transition:opacity .5s ease;
}
.hw-oc__img.is-active{opacity:1}

.hw-oc__cols{display:flex;gap:64px;flex:1;padding-top:6px}

/* nav principal (serif) */
.hw-oc__primary{display:flex;flex-direction:column}
.hw-oc__primary a{
  font-family:'Playfair Display',Georgia,serif;
  font-size:34px;line-height:1.42;font-weight:400;letter-spacing:.2px;
  color:var(--awb-color1,#EFEAE4);text-decoration:none;
  transition:color .25s ease, opacity .25s ease;max-width:12ch;
}
.hw-oc__primary a:hover,.hw-oc__primary a:focus{color:var(--awb-color3,#CEC439);outline:none}

/* nav secundaria (uppercase) */
.hw-oc__secondary{display:flex;flex-direction:column;gap:14px;padding-top:8px}
.hw-oc__secondary a{
  font-family:'Poppins',sans-serif;font-size:12px;letter-spacing:1.5px;text-transform:uppercase;font-weight:600;
  color:var(--awb-color1,#EFEAE4);text-decoration:none;line-height:1.35;max-width:16ch;
}
.hw-oc__secondary a:hover{color:var(--awb-color3,#CEC439)}
.hw-oc__social{display:flex;gap:18px;margin-top:16px}
.hw-oc__social a{color:var(--awb-color1,#EFEAE4);display:inline-flex}
.hw-oc__social a:hover{color:var(--awb-color3,#CEC439)}

/* badge STAY IN THE KNOW */
.hw-oc__badge{
  position:absolute;left:40px;bottom:44px;z-index:2;
  width:70px;height:70px;border:1.5px solid var(--awb-color1,#EFEAE4);border-radius:50%;
  display:flex;align-items:center;justify-content:center;text-align:center;text-decoration:none;
  color:var(--awb-color1,#EFEAE4);transform:rotate(-8deg);
  font-family:'Poppins',sans-serif;font-size:9px;letter-spacing:1px;text-transform:uppercase;line-height:1.35;
}
.hw-oc__badge:hover{color:var(--awb-color3,#CEC439);border-color:var(--awb-color3,#CEC439)}

/* ---- responsive ---- */
@media(max-width:900px){
  .hw-oc__top{padding:22px 22px}
  .hw-oc__toplinks{display:none}
  .hw-oc__brand{flex:1;text-align:left;font-size:19px;letter-spacing:5px}
  .hw-oc__close{flex:0}
  .hw-oc__body{flex-direction:column;gap:24px;padding:8px 22px 40px}
  .hw-oc__media{display:none}
  .hw-oc__cols{flex-direction:column;gap:30px}
  .hw-oc__primary a{font-size:28px;line-height:1.5;max-width:none}
  .hw-oc__mobtop{display:flex;gap:0;border:1px solid rgba(239,234,228,.4)}
  .hw-oc__secondary{display:grid;grid-template-columns:1fr 1fr;gap:12px 24px}
  /* en mobile el badge fluye al final (no absolute) para no solaparse con la nav */
  .hw-oc__badge{position:static;margin:34px 0 40px 22px}
}
/* mostrar los toplinks como cajas en mobile (Find a Home / Community Map) */
@media(max-width:900px){
  .hw-oc__toplinks{display:flex;order:5;width:100%;gap:0;margin:6px 22px 0}
  .hw-oc__toplinks a{flex:1;text-align:center;padding:18px 8px;border:1px solid rgba(239,234,228,.4)}
  .hw-oc__toplinks a+a{border-left:0}
  .hw-oc__top{flex-wrap:wrap}
}

/* ==================================================================
   SECCIONES LOCATION / SCHOOLS / LIVE HERE
   Coords del devcode Figma (diseño 1440) convertidas a % / px.
   OJO: las clases van sobre el propio .fusion-text → width necesita !important.
   ================================================================== */
/* base común: contenedor posicionado + la layout-column también (si no, los
   absolutos se anclan mal — mismo fix que en .hw-scatter) */
.hw-location, .hw-schools, .hw-livehere{position:relative !important;overflow:visible}
.hw-location .fusion-row, .hw-schools .fusion-row, .hw-livehere .fusion-row{
  max-width:100% !important;width:100% !important;margin:0 !important;padding:0 !important}
.hw-location .fusion-layout-column,
.hw-schools .fusion-layout-column,
.hw-livehere .fusion-layout-column{
  position:relative !important;width:100% !important;margin:0 !important;float:none !important}
.hw-location .fusion-imageframe,
.hw-schools .fusion-imageframe,
.hw-livehere .fusion-imageframe{line-height:0 !important;display:block !important}
.hw-location .fusion-imageframe img,
.hw-schools .fusion-imageframe img,
.hw-livehere .fusion-imageframe img{width:100% !important;height:auto !important;display:block !important}
/* recortes exactos del Figma (si no, la imagen conserva su ratio nativo) */
.l-map .fusion-imageframe, .s2-girl .fusion-imageframe,
.lh-photo .fusion-imageframe, .s2-checks .fusion-imageframe{overflow:hidden}
.l-map img   {aspect-ratio:570/598 !important;height:100% !important;object-fit:cover !important}
.s2-girl img {aspect-ratio:1/1     !important;height:100% !important;object-fit:cover !important}
.lh-photo img{aspect-ratio:964/569 !important;height:100% !important;object-fit:cover !important}
.s2-checks img{aspect-ratio:570/598 !important;height:100% !important;object-fit:cover !important}
.hw-location .fusion-text p, .hw-schools .fusion-text p, .hw-livehere .fusion-text p{margin:0}

/* tipografías de sección */
.l-title, .s2-title{
  font-family:'Oswald','Poppins',sans-serif !important;
  font-size:44px !important;line-height:1.06 !important;letter-spacing:1px !important;
  text-transform:uppercase !important;color:#19180c !important;font-weight:600 !important}
.l-body, .s2-body, .lh-body{
  font-family:'Lora',Georgia,serif !important;font-size:17px !important;line-height:1.72 !important;color:#19180c !important}
/* fusion_title mete un h2 interno: que herede del wrapper con la clase */
.l-title h1,.l-title h2,.l-title h3,.l-title .fusion-title-heading,
.s2-title h1,.s2-title h2,.s2-title h3,.s2-title .fusion-title-heading,
.lh-title h1,.lh-title h2,.lh-title h3,.lh-title .fusion-title-heading{
  font:inherit !important;color:inherit !important;margin:0 !important;padding:0 !important;
  letter-spacing:inherit !important;text-transform:inherit !important;line-height:inherit !important}
.l-title .fusion-title, .s2-title .fusion-title, .lh-title .fusion-title{margin:0 !important}
.l-cta, .s2-cta, .lh-cta{
  font-family:'Poppins',sans-serif !important;font-size:12px !important;letter-spacing:2px !important;
  text-transform:uppercase !important;color:#e54511 !important;font-weight:600 !important;white-space:nowrap;
  text-decoration:none !important}
.l-cta p, .s2-cta p, .lh-cta p{display:inline-flex;align-items:center;text-decoration:none !important;border-bottom:0 !important}
/* FIX #4/#7: flecha naranja con punta (→) que sale del texto hacia la derecha */
.l-cta p::after, .s2-cta p::after, .lh-cta p::after{
  content:"";display:inline-block;margin-left:16px;width:52px;height:12px;
  background:no-repeat center/contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='52' height='12' viewBox='0 0 52 12'%3E%3Cg fill='none' stroke='%23E54511' stroke-width='1.4'%3E%3Cline x1='0' y1='6' x2='49' y2='6'/%3E%3Cpath d='M44 1.5 50 6 44 10.5'/%3E%3C/g%3E%3C/svg%3E")}

/* FIX #5: secciones con aspect-ratio (escalan con el ancho) y posiciones en %
   → en pantallas anchas (27") ya no se aprietan ni se desbordan a la sección siguiente.
   Alto fijo del diseño reemplazado por proporción; tops en % del diseño. */

/* ---------- LOCATION (frame 12010:334 · h 702) ---------- */
.hw-location{aspect-ratio:1440/702;height:auto !important}
.hw-location .fusion-layout-column{height:100% !important}
.l-title{position:absolute !important;left:9.72%;top:29.2%;width:26% !important}
.l-body {position:absolute !important;left:9.72%;top:45.4%;width:32.78% !important}
.l-cta  {position:absolute !important;left:9.58%;top:81.2%;width:auto !important}
/* FIX #4: mapa ligeramente más chico (39.58%→34%) */
.l-map  {position:absolute !important;left:54%;top:17.1%;width:34% !important;margin:0 !important}

/* ---------- SCHOOLS (frame 12008:310 · h 693) ---------- */
.hw-schools{aspect-ratio:1440/693;height:auto !important;margin-top:min(4vw,60px)}
.hw-schools .fusion-layout-column{height:100% !important}
.s2-checks{position:absolute !important;left:9.72%;top:13.7%;width:39.58% !important;margin:0 !important}
.s2-girl  {position:absolute !important;left:15.83%;top:28.4%;width:27.36% !important;margin:0 !important;z-index:2}
.s2-title {position:absolute !important;left:57.5%;top:37.8%;width:26% !important}
.s2-body  {position:absolute !important;left:57.5%;top:54.1%;width:32.78% !important}
.s2-cta   {position:absolute !important;left:57.5%;top:71.7%;width:auto !important}

/* ---------- LIVE HERE (frame 12010:345 · h 1245) ---------- */
.hw-livehere{aspect-ratio:1440/1245;height:auto !important;margin-top:min(4vw,60px)}
.hw-livehere .fusion-layout-column{height:100% !important}
/* bloque Oyster de fondo (Rectangle 32: 1160x978 desde x140,y+95) */
.hw-livehere::before{
  content:"";position:absolute;left:9.72%;top:7.63%;width:80.56%;height:78.55%;
  background:var(--awb-color1,#EFEAE4);z-index:0}
.hw-livehere > *{position:relative;z-index:1}
.lh-title{position:absolute !important;left:17.71%;top:16.95%;width:30.35% !important;
  font-family:'Playfair Display',Georgia,serif !important;font-size:64px !important;
  line-height:1.12 !important;color:#424b0a !important;font-weight:400 !important}
.lh-body {position:absolute !important;left:48.06%;top:23.3%;width:31.32% !important}
.lh-cta  {position:absolute !important;left:72.01%;top:42.5%;width:auto !important}
.lh-photo{position:absolute !important;left:16.53%;top:54.3%;width:66.94% !important;margin:0 !important;z-index:2}

/* responsive: en mobile las secciones pasan a flujo normal */
@media(max-width:900px){
  .hw-location, .hw-schools, .hw-livehere{height:auto !important;padding:60px 22px !important}
  .hw-location .fusion-layout-column,
  .hw-schools .fusion-layout-column,
  .hw-livehere .fusion-layout-column{height:auto !important}
  .hw-livehere::before{display:none}
  .l-title,.l-body,.l-cta,.l-map,
  .s2-checks,.s2-girl,.s2-title,.s2-body,.s2-cta,
  .lh-title,.lh-body,.lh-cta,.lh-photo{
    position:relative !important;left:auto !important;top:auto !important;
    width:100% !important;margin:0 0 22px !important}
  .s2-checks{display:none !important}
  .l-title,.s2-title{font-size:32px !important}
  .lh-title{font-size:38px !important}
}

/* ==================================================================
   SECCIONES: SLOW AND FAST · BREAKER · COMMERCIAL · EXPLORE THE LIFE · READ ALL ABOUT IT
   (#8, #9, #10, #11, #12)  — mismo método de coords % del Figma
   ================================================================== */
.hw-whatshere, .hw-commercial{position:relative !important;overflow:visible}
.hw-whatshere .fusion-row, .hw-commercial .fusion-row{max-width:100% !important;width:100% !important;margin:0 !important;padding:0 !important}
.hw-whatshere .fusion-layout-column, .hw-commercial .fusion-layout-column{position:relative !important;width:100% !important;margin:0 !important;float:none !important;height:100% !important}
.hw-whatshere .fusion-imageframe, .hw-commercial .fusion-imageframe{line-height:0 !important;display:block !important}
.hw-whatshere .fusion-text p, .hw-commercial .fusion-text p{margin:0}

/* ---- #8 SLOW AND FAST (foto izq + mat + texto der) ---- */
.hw-whatshere{aspect-ratio:1440/693;height:auto !important;margin-top:min(4vw,60px)}
.hw-whatshere .wh-mat, .hw-whatshere .fusion-sep-clear{display:none !important}
.hw-whatshere::before{content:"";position:absolute;left:9.72%;top:13.6%;width:39.58%;height:86.3%;
  background:rgba(206,196,57,.45);z-index:0}
.wh-photo{position:absolute !important;left:15.83%;top:28.4%;width:27.36% !important;margin:0 !important;z-index:2}
.wh-photo img{aspect-ratio:1/1 !important;height:100% !important;width:100% !important;object-fit:cover !important;display:block}
.wh-title{position:absolute !important;left:57.5%;top:27.1%;width:30% !important;z-index:1}
.wh-body {position:absolute !important;left:57.5%;top:52.4%;width:31.9% !important;z-index:1}
.wh-cta  {position:absolute !important;left:57.5%;top:84%;width:auto !important;z-index:1}

/* ---- #9 BREAKER SLIDER (collage sobre "TOWN & LOWCOUNTRY") ---- */
/* padding propio para que el collage tenga aire arriba/abajo y no se monte
   sobre la sección anterior; min-height contiene el collage (640px). */
.hw-breaker{position:relative !important;overflow:hidden;padding:70px 0 !important}
.hw-breaker .fusion-row{max-width:100% !important;width:100% !important;margin:0 !important;padding:0 !important}
.hw-breaker .fusion-layout-column,.hw-breaker .fusion-column-wrapper,.hw-breaker .fusion-text{
  min-height:640px !important;margin:0 !important}
/* el flex de Avada centraba el collage → forzar alineación arriba para que no se monte */
.hw-breaker.fusion-flex-container,.hw-breaker .fusion-builder-row,.hw-breaker .fusion-flex-align-items-center{
  align-items:flex-start !important;justify-content:flex-start !important}
.hw-breaker .fusion-column-wrapper{justify-content:flex-start !important}
.hw-breaker__bg{position:absolute;inset:0;z-index:0;display:flex;flex-direction:column;
  justify-content:center;gap:8px;overflow:hidden;pointer-events:none}
.hw-breaker__bg span{font-family:'Playfair Display',Georgia,serif;font-weight:400;
  font-size:clamp(64px,9.5vw,150px);line-height:1;text-transform:uppercase;white-space:nowrap;
  color:rgba(25,24,12,.055);letter-spacing:2px}
.hw-breaker__bg span:nth-child(2){margin-left:-8%}
.hw-breaker__bg span:nth-child(3){margin-left:6%}
/* el collage ya no va pegado a todo: le damos su espacio dentro del breaker */
.hw-breaker .hw-collage-auto{position:relative;z-index:1}

/* ---- #10 COMMERCIAL (texto izq + foto der) ---- */
.hw-commercial{aspect-ratio:1440/708;height:auto !important;margin-top:min(4vw,60px)}
.cm-title{position:absolute !important;left:9.72%;top:25%;width:29% !important}
.cm-body {position:absolute !important;left:9.72%;top:49.9%;width:32.8% !important}
.cm-cta  {position:absolute !important;left:9.72%;top:85.2%;width:auto !important}
.cm-photo{position:absolute !important;left:50.69%;top:15.5%;width:39.58% !important;margin:0 !important}
.cm-photo img{aspect-ratio:570/598 !important;height:100% !important;width:100% !important;object-fit:cover !important;display:block}

/* ---- #11 EXPLORE THE LIFE (banner bokeh) ---- */
.hw-explorelife .fusion-row{max-width:1160px !important}
.hw-el-banner{position:relative;width:100%;aspect-ratio:1160/560;overflow:hidden;
  display:flex;align-items:center;justify-content:center;text-align:center}
.hw-el-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
.hw-el-banner::after{content:"";position:absolute;inset:0;z-index:1;background:rgba(25,24,12,.42)}
.hw-el-inner{position:relative;z-index:2;color:#EFEAE4;max-width:620px;padding:20px}
.hw-el-kicker{display:block;font-family:'Oswald','Poppins',sans-serif;font-size:34px;line-height:1.1;
  letter-spacing:2px;text-transform:uppercase;font-weight:600}
.hw-el-sub{font-family:'Lora',Georgia,serif;font-size:17px;line-height:1.6;margin:18px 0 26px;color:#EFEAE4}
.hw-el-cta{display:inline-block;font-family:'Poppins',sans-serif;font-size:12px;letter-spacing:2px;
  text-transform:uppercase;font-weight:600;color:#EFEAE4;text-decoration:none;
  padding-bottom:7px;border-bottom:1.5px solid #EFEAE4}
.hw-el-cta:hover{color:var(--awb-color3,#CEC439);border-color:var(--awb-color3,#CEC439)}

/* ---- #12 READ ALL ABOUT IT (blog) ---- */
.hw-happening .hp-left{padding-right:40px}
.hp-title{margin-bottom:22px !important}
.hp-intro{font-family:'Lora',Georgia,serif !important;font-size:16px !important;line-height:1.7 !important;color:#19180c !important}
.hp-cta{margin-top:26px !important}
/* grid de post cards */
.hw-happening .fusion-post-cards{margin:0 !important}
.hw-happening .fusion-post-card{border:0 !important;background:transparent !important}
.hw-happening .fusion-post-card .fusion-image-wrapper img,
.hw-happening .fusion-post-card img{width:100% !important;aspect-ratio:333/220 !important;object-fit:cover !important;display:block}
.hw-happening .fusion-post-card-title, .hw-happening .fusion-post-card-title a{
  font-family:'Lora',Georgia,serif !important;font-size:20px !important;line-height:1.25 !important;color:#19180c !important;font-weight:500 !important}
@media(max-width:900px){
  .hw-whatshere, .hw-commercial{height:auto !important;aspect-ratio:auto !important;padding:60px 22px !important}
  .hw-whatshere::before{display:none}
  .wh-photo,.wh-title,.wh-body,.wh-cta,.cm-title,.cm-body,.cm-cta,.cm-photo{
    position:relative !important;left:auto !important;top:auto !important;width:100% !important;margin:0 0 22px !important}
  .hw-el-kicker{font-size:26px}
  .hw-happening{padding:60px 22px !important}
  .hw-happening .fusion-builder-column{width:100% !important}
}

/* ==================================================================
   STICKY NAV transparente→sólido (feature #1)
   copiar TODO este bloque a Avada > Custom CSS
   ================================================================== */
.hw-nav{
  position:fixed;top:0;left:0;right:0;z-index:9000;
  background:var(--awb-color1,#EFEAE4);
  border-bottom:1px solid rgba(25,24,12,.08);
  box-shadow:0 4px 20px rgba(25,24,12,.06);
  transform:translateY(-100%);
  transition:transform .4s cubic-bezier(.22,.61,.36,1);
  will-change:transform}
.hw-nav.is-visible{transform:translateY(0)}
.hw-nav__in{
  display:flex;align-items:center;justify-content:space-between;gap:20px;
  max-width:1440px;margin:0 auto;padding:16px 60px;min-height:64px;box-sizing:border-box}
.hw-nav__left{display:flex;gap:34px;flex:1}
.hw-nav__left a{
  font-family:'Poppins',sans-serif;font-size:12px;letter-spacing:2px;text-transform:uppercase;font-weight:600;
  color:#19180c;text-decoration:none;opacity:.85}
.hw-nav__left a:hover{opacity:1;color:var(--awb-color7,#E54511)}
.hw-nav__brand{
  flex:1;text-align:center;text-decoration:none;
  font-family:'Playfair Display',Georgia,serif;font-size:22px;letter-spacing:7px;
  text-transform:uppercase;color:#19180c;white-space:nowrap}
.hw-nav__menu{
  flex:1;display:flex;align-items:center;justify-content:flex-end;gap:12px;
  background:none;border:0;cursor:pointer;color:#19180c;padding:0}
.hw-nav__menu span{font-family:'Poppins',sans-serif;font-size:12px;letter-spacing:2px;text-transform:uppercase;font-weight:600}
.hw-nav__menu svg{stroke:currentColor;stroke-width:1.5}
.hw-nav__menu:hover{color:var(--awb-color7,#E54511)}

@media(max-width:900px){
  .hw-nav__in{padding:12px 22px;min-height:56px}
  .hw-nav__left{display:none}
  .hw-nav__brand{flex:1;text-align:left;font-size:18px;letter-spacing:4px}
  .hw-nav__menu{flex:0}
}
@media(prefers-reduced-motion:reduce){.hw-nav{transition:none}}

/* ==================================================================
   STAY IN THE KNOW · widget de contacto persistente (feature #6)
   copiar TODO este bloque a Avada > Custom CSS
   ================================================================== */
.hw-sitk{position:fixed;left:26px;bottom:30px;z-index:9500;display:flex;align-items:flex-end;gap:14px}

/* badge circular */
.hw-sitk__badge{
  position:relative;flex:0 0 auto;width:74px;height:74px;border-radius:50%;
  background:var(--awb-color1,#EFEAE4);border:1.5px solid var(--awb-color5,#424B0A);
  color:var(--awb-color5,#424B0A);cursor:pointer;padding:0;
  display:flex;align-items:center;justify-content:center;text-align:center;
  font-family:'Poppins',sans-serif;font-size:9px;letter-spacing:1px;text-transform:uppercase;
  line-height:1.35;transform:rotate(-8deg);
  transition:background .25s, color .25s, transform .25s;
  box-shadow:0 8px 24px rgba(25,24,12,.18)}
.hw-sitk__badge:hover{background:var(--awb-color5,#424B0A);color:var(--awb-color1,#EFEAE4)}
.hw-sitk__label{transition:opacity .2s}
.hw-sitk__close{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .2s}
.hw-sitk.is-open .hw-sitk__badge{background:var(--awb-color7,#E54511);border-color:var(--awb-color7,#E54511);color:#fff;transform:rotate(0deg)}
.hw-sitk.is-open .hw-sitk__label{opacity:0}
.hw-sitk.is-open .hw-sitk__close{opacity:1}

/* panel de acciones */
.hw-sitk__panel{
  order:-1;display:flex;flex-direction:column;gap:8px;
  opacity:0;visibility:hidden;transform:translateY(10px);
  transition:opacity .28s ease, transform .28s ease, visibility 0s linear .28s;
  position:absolute;left:0;bottom:88px;min-width:238px}
.hw-sitk.is-open .hw-sitk__panel{opacity:1;visibility:visible;transform:translateY(0);transition:opacity .28s ease, transform .28s ease}

.hw-sitk__item{
  display:flex;align-items:center;gap:13px;text-decoration:none;
  background:var(--awb-color1,#EFEAE4);border:1px solid rgba(66,75,10,.18);
  border-radius:44px;padding:11px 20px 11px 14px;
  color:var(--awb-color5,#424B0A);
  box-shadow:0 6px 18px rgba(25,24,12,.14);
  transition:background .2s, color .2s, transform .2s}
.hw-sitk__item:hover{background:var(--awb-color5,#424B0A);color:var(--awb-color1,#EFEAE4);transform:translateX(3px)}
.hw-sitk__ico{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;
  width:34px;height:34px;border-radius:50%;background:rgba(66,75,10,.10);color:inherit}
.hw-sitk__item:hover .hw-sitk__ico{background:rgba(239,234,228,.18)}
.hw-sitk__txt{display:flex;flex-direction:column;line-height:1.25}
.hw-sitk__txt b{font-family:'Poppins',sans-serif;font-size:12px;letter-spacing:1.4px;text-transform:uppercase;font-weight:600}
.hw-sitk__txt i{font-family:'Lora',Georgia,serif;font-style:normal;font-size:12px;opacity:.72;margin-top:2px}

/* aparición escalonada de los items */
.hw-sitk__panel .hw-sitk__item{transition-delay:0s}
.hw-sitk.is-open .hw-sitk__item:nth-child(1){transition-delay:.02s}
.hw-sitk.is-open .hw-sitk__item:nth-child(2){transition-delay:.06s}
.hw-sitk.is-open .hw-sitk__item:nth-child(3){transition-delay:.10s}
.hw-sitk.is-open .hw-sitk__item:nth-child(4){transition-delay:.14s}

/* el badge estático del hero lo reemplaza el widget persistente */
.hw-hero .hw-badge, .hw-collagewrap .hw-badge{display:none !important}

@media(max-width:900px){
  .hw-sitk{left:16px;bottom:18px}
  .hw-sitk__badge{width:62px;height:62px;font-size:8px}
  .hw-sitk__panel{bottom:76px;min-width:210px}
}
@media(prefers-reduced-motion:reduce){
  .hw-sitk__panel,.hw-sitk__item,.hw-sitk__badge{transition:none !important}
}

/* ==================================================================
   SECCIÓN FORMULARIO "PLEASED TO MEET YOU" (destino de #form)
   ================================================================== */
.hw-form{position:relative;background:var(--awb-color2,#BAC3CB) !important}
.hw-form .fusion-row{max-width:1100px !important}
/* ícono circular naranja con el tree mark */
.hw-form-icon{width:74px;height:74px;border-radius:50%;background:var(--awb-color7,#E54511);
  margin:0 auto 34px !important;display:flex;align-items:center;justify-content:center;overflow:hidden}
.hw-form-icon img{width:44px !important;height:auto !important;display:block;filter:brightness(0) invert(1)}
.f-title{font-family:'Oswald','Poppins',sans-serif !important;font-size:46px !important;
  line-height:1.08 !important;letter-spacing:1px !important;text-transform:uppercase !important;
  color:#19180c !important;font-weight:600 !important;text-align:center !important}
.f-title h1,.f-title h2,.f-title h3{font:inherit !important;color:inherit !important;margin:0 !important;
  letter-spacing:inherit !important;text-transform:inherit !important;line-height:inherit !important}
.f-intro{font-family:'Lora',Georgia,serif !important;font-size:17px !important;line-height:1.7 !important;
  color:#19180c !important;text-align:center !important;margin-top:16px !important}
/* placeholder del embed de HubSpot */
.hw-form-embed{margin-top:46px;min-height:220px;border:1px dashed rgba(25,24,12,.35);
  border-radius:6px;display:flex;align-items:center;justify-content:center;text-align:center;
  padding:36px 20px;font-family:'Poppins',sans-serif;font-size:12px;letter-spacing:1.5px;
  text-transform:uppercase;color:rgba(25,24,12,.6);line-height:1.9}

/* ==================================================================
   COLLAGE AUTOPLAY (feature #4) — copiar TODO a Avada > Custom CSS
   ================================================================== */
/* sección contenedora: ventana con overflow oculto sobre el texto estático */
.hw-collage-auto{
  position:relative;overflow:hidden;
  height:640px;width:100%;
  /* deja ver el texto estático detrás: fondo transparente */
  z-index:1;pointer-events:none;
}
/* loop HORIZONTAL: dos sets idénticos lado a lado, se desplaza a la izquierda */
.hw-collage__track{
  position:absolute;left:0;top:0;height:100%;
  width:calc(var(--setW,1700px) * 2);
  animation:hw-collage-scroll var(--dur,40s) linear infinite;
  will-change:transform;
}
.hw-collage__track.is-hover,
.hw-collage__track.is-paused{animation-play-state:paused}
@keyframes hw-collage-scroll{
  from{transform:translateX(0)}
  to{transform:translateX(calc(var(--setW,1700px) * -1))}
}
.hw-collage__set{position:absolute;top:0;left:0;height:100%}
.hw-collage__set + .hw-collage__set{left:var(--setW,1700px)}

.hw-collage__item{
  position:absolute;margin:0;line-height:0;
  aspect-ratio:var(--ar,1.3);
  transform:rotate(var(--rot,0deg));
  box-shadow:0 14px 34px rgba(25,24,12,.16);
  pointer-events:auto;
}
.hw-collage__item img{
  width:100%;height:100%;display:block;object-fit:cover;
}
/* marcos */
.hw-collage__item--shadow{box-shadow:0 22px 48px rgba(25,24,12,.26)}
.hw-collage__item--green{padding:14px;background:var(--awb-color5,#424B0A);box-shadow:0 16px 38px rgba(25,24,12,.20)}
.hw-collage__item--stamp{
  padding:10px;background:var(--awb-color2,#BAC3CB);box-shadow:none;
  -webkit-mask:radial-gradient(circle at 8px 8px,transparent 7px,#000 7.5px) -8px -8px/16px 16px;
          mask:radial-gradient(circle at 8px 8px,transparent 7px,#000 7.5px) -8px -8px/16px 16px;
}

/* badge circular TOWN IN THE TREES */
.hw-collage__badge{
  position:absolute;border-radius:50%;
  background:var(--awb-color9,#38251C);color:var(--awb-color1,#EFEAE4);
  display:flex;align-items:center;justify-content:center;text-align:center;
  font-family:'Poppins',sans-serif;font-size:10px;letter-spacing:1.5px;text-transform:uppercase;line-height:1.5;
  padding:14px;box-shadow:0 12px 30px rgba(25,24,12,.28);pointer-events:auto;
}

/* capa de texto estático detrás del collage (opcional, si se usa .hw-explore) */
.hw-explore{position:relative}
.hw-explore .hw-collage-auto{position:absolute;inset:0}

@media(max-width:900px){
  .hw-collage-auto{height:560px}
}
@media(prefers-reduced-motion:reduce){
  .hw-collage__track{animation:none}
}
