/* ---- fh-fuentes ---- */ /* * Tipografia de marca, servida desde nuestro servidor. * * El manual fija Helvetica Neue Condensed Bold para titulares y designa * Barlow Condensed 700 como sustituta web libre. Barlow no se estaba * cargando: en un movil, donde Helvetica Neue Condensed no existe, los * titulares caian en Impact. Montserrat va en version variable, asi que un * solo fichero cubre del peso 300 al 700. * * swap: se lee el texto desde el primer pintado, con la tipografia del * sistema, y cambia sola al llegar la nuestra. Nunca texto invisible. */ @font-face { font-family: 'Barlow Condensed'; font-style: normal; font-weight: 700; font-display: swap; src: url(https://www.filmhouses.com/wp-content/mu-plugins/fh-assets/fuentes/barlow-condensed-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } @font-face { font-family: 'Barlow Condensed'; font-style: normal; font-weight: 700; font-display: swap; src: url(https://www.filmhouses.com/wp-content/mu-plugins/fh-assets/fuentes/barlow-condensed-latin-ext.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } @font-face { font-family: 'Montserrat'; font-style: normal; font-weight: 300 700; font-display: swap; src: url(https://www.filmhouses.com/wp-content/mu-plugins/fh-assets/fuentes/montserrat-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } @font-face { font-family: 'Montserrat'; font-style: normal; font-weight: 300 700; font-display: swap; src: url(https://www.filmhouses.com/wp-content/mu-plugins/fh-assets/fuentes/montserrat-latin-ext.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } /* * El respaldo de Barlow Condensed, a su medida (punto 93). * * Barlow llega con font-display: swap, asi que durante un instante el * titular se pinta con la letra del sistema, que es mas estrecha, y al * llegar Barlow todo se mueve. Con size-adjust el respaldo ocupa lo * mismo que la definitiva y el salto desaparece. */ @font-face { font-family: 'Barlow Condensed respaldo'; src: local('Arial Narrow'), local('Helvetica Neue Condensed'), local('Liberation Sans Narrow'); size-adjust: 115%; } /* ---- fh-tokens ---- */ /* Film Houses · Property Advisers — tokens de marca (v1, sept. 2026) Fuente de verdad para la web. Derivado del dossier de captación 2026. */ :root{ /* Color */ --fh-marino:#273743; /* principal: fondos, titulares sobre claro */ --fh-arena:#c09d75; /* acento: titulares sobre marino, líneas, iconos */ --fh-blanco:#ffffff; --fh-hueso:#f4ede4; /* fondos claros, mapa */ --fh-piedra:#d9cbb9; /* fondos claros secundarios */ --fh-grafito:#4a5560; /* texto secundario sobre claro */ --fh-bruma:#6e98ac; /* solo gráficos y datos, nunca texto */ --fh-arena-55:rgba(192,157,117,.55); /* separadores */ /* Tipografía */ --fh-font-display:"Helvetica Neue Condensed Bold","HelveticaNeue-CondensedBold","Barlow Condensed",Impact,sans-serif; /* titulares, siempre en mayúsculas */ --fh-font-text:"Montserrat",Helvetica,Arial,sans-serif; --fh-display-lh:.94; --fh-display-ls:-.005em; --fh-text-lh:1.35; /* Escala (desktop → móvil con clamp) */ --fh-h1:clamp(44px,6.2vw,118px); --fh-h2:clamp(34px,4.6vw,86px); --fh-h3:clamp(24px,2.4vw,46px); --fh-lead:clamp(18px,1.6vw,30px); --fh-body:clamp(16px,1.25vw,22px); --fh-small:14px; --fh-eyebrow:13px; /* mayúsculas, letter-spacing .2em, peso 500, color arena */ /* Forma */ --fh-radius-card:32px; /* tarjetas y bloques (40px en el dossier a 1920) */ --fh-radius-tile:18px; --fh-radius-pill:999px; --fh-border-tile:2px solid var(--fh-arena); --fh-rule:1.5px solid var(--fh-arena-55); --fh-gutter:clamp(16px,3.3vw,64px); --fh-outline-stroke:2px; /* texto contorneado */ } /* Titular con segunda línea contorneada (recurso principal de la marca) */ .fh-display{font-family:var(--fh-font-display);text-transform:uppercase;line-height:var(--fh-display-lh);letter-spacing:var(--fh-display-ls);font-weight:700} .fh-outline{color:transparent;-webkit-text-stroke:var(--fh-outline-stroke) currentColor} .fh-on-marino .fh-outline{-webkit-text-stroke-color:var(--fh-arena)} .fh-on-claro .fh-outline{-webkit-text-stroke-color:var(--fh-marino)} .fh-eyebrow{font-family:var(--fh-font-text);font-size:var(--fh-eyebrow);font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:var(--fh-arena)} /* Botones */ .fh-btn{font-family:var(--fh-font-text);font-weight:600;font-size:15px;letter-spacing:.06em;text-transform:uppercase;padding:16px 28px;border-radius:var(--fh-radius-pill);text-decoration:none;display:inline-block} .fh-btn-primary{background:var(--fh-arena);color:var(--fh-marino)} .fh-btn-secondary{background:transparent;color:currentColor;border:2px solid currentColor} .fh-btn-dark{background:var(--fh-marino);color:#fff} /* ---- fh-waf ---- */ /* * El WhatsApp flotante del movil. Pep, 22-10-2026. * * Solo se ve en el movil. En el ordenador el enlace SI va en el HTML * -no hay forma de saber el ancho en el servidor con la pagina * cacheada- y lo esconde esta hoja: el boton de la cabecera y el * bloque de contacto ya estan a la vista alli. * * Lo que si se decide en PHP es la pagina: donde hay barra fija el * enlace no se imprime siquiera, porque eso no depende del ancho. */ .fh-waf { display: none; } @media (max-width: 760px) { .fh-waf { display: flex; align-items: center; justify-content: center; position: fixed; right: 16px; /* Por encima del area segura de los moviles con barra inferior. */ bottom: calc(16px + env(safe-area-inset-bottom, 0px)); width: 52px; height: 52px; border-radius: 999px; /* * Marino con el icono en arena, y un aro de arena alrededor. * * En arena sobre arena no se veia: el boton cae encima de lo * que haya, y en Casos de exito las tarjetas son arena, con lo * que el contraste bajaba a 1. Marino contrasta 11 sobre hueso * y 4,9 sobre arena; y donde el fondo es marino, lo que marca * el borde es el aro. */ background: var(--fh-marino); color: var(--fh-arena); box-shadow: 0 0 0 2px var(--fh-arena), 0 6px 20px rgba(39, 55, 67, .28); text-decoration: none; /* * Debajo del aviso de cookies y del menu, encima del contenido. * La barra fija de Vender y las landings no compite: ahi este * boton no se pinta. */ z-index: 90; } .fh-waf:focus-visible { outline: 3px solid var(--fh-marino); outline-offset: 3px; } } /* ---- hello-elementor ---- */ html{line-height:1.15;-webkit-text-size-adjust:100%}*,:after,:before{box-sizing:border-box}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;font-size:1rem;font-weight:400;line-height:1.5;color:#333;background-color:#fff;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}h1,h2,h3,h4,h5,h6{margin-block-start:.5rem;margin-block-end:1rem;font-family:inherit;font-weight:500;line-height:1.2;color:inherit}h1{font-size:2.5rem}h2{font-size:2rem}h3{font-size:1.75rem}h4{font-size:1.5rem}h5{font-size:1.25rem}h6{font-size:1rem}p{margin-block-start:0;margin-block-end:.9rem}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em;white-space:pre-wrap}a{background-color:transparent;text-decoration:none;color:#c36}a:active,a:hover{color:#336}a:not([href]):not([tabindex]),a:not([href]):not([tabindex]):focus,a:not([href]):not([tabindex]):hover{color:inherit;text-decoration:none}a:not([href]):not([tabindex]):focus{outline:0}abbr[title]{border-block-end:none;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none;height:auto;max-width:100%}details{display:block}summary{display:list-item}figcaption{font-size:16px;color:#333;line-height:1.4;font-style:italic;font-weight:400}[hidden],template{display:none}@media print{*,:after,:before{background:transparent!important;color:#000!important;box-shadow:none!important;text-shadow:none!important}a,a:visited{text-decoration:underline}a[href]:after{content:" (" attr(href) ")"}abbr[title]:after{content:" (" attr(title) ")"}a[href^="#"]:after,a[href^="javascript:"]:after{content:""}pre{white-space:pre-wrap!important}blockquote,pre{-moz-column-break-inside:avoid;break-inside:avoid;border:1px solid #ccc}thead{display:table-header-group}img,tr{-moz-column-break-inside:avoid;break-inside:avoid}h2,h3,p{orphans:3;widows:3}h2,h3{-moz-column-break-after:avoid;break-after:avoid}}label{display:inline-block;line-height:1;vertical-align:middle}button,input,optgroup,select,textarea{font-family:inherit;font-size:1rem;line-height:1.5;margin:0}input[type=date],input[type=email],input[type=number],input[type=password],input[type=search],input[type=tel],input[type=text],input[type=url],select,textarea{width:100%;border:1px solid #666;border-radius:3px;padding:.5rem 1rem;transition:all .3s}input[type=date]:focus,input[type=email]:focus,input[type=number]:focus,input[type=password]:focus,input[type=search]:focus,input[type=tel]:focus,input[type=text]:focus,input[type=url]:focus,select:focus,textarea:focus{border-color:#333}button,input{overflow:visible}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{width:auto;-webkit-appearance:button}[type=button],[type=submit],button{display:inline-block;font-weight:400;color:#c36;text-align:center;white-space:nowrap;-webkit-user-select:none;-moz-user-select:none;user-select:none;background-color:transparent;border:1px solid #c36;padding:.5rem 1rem;font-size:1rem;border-radius:3px;transition:all .3s}[type=button]:focus:not(:focus-visible),[type=submit]:focus:not(:focus-visible),button:focus:not(:focus-visible){outline:none}[type=button]:focus,[type=button]:hover,[type=submit]:focus,[type=submit]:hover,button:focus,button:hover{color:#fff;background-color:#c36;text-decoration:none}[type=button]:not(:disabled),[type=submit]:not(:disabled),button:not(:disabled){cursor:pointer}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto;resize:vertical}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}select{display:block}table{background-color:transparent;width:100%;margin-block-end:15px;font-size:.9em;border-spacing:0;border-collapse:collapse}table td,table th{padding:15px;line-height:1.5;vertical-align:top;border:1px solid hsla(0,0%,50.2%,.5019607843)}table th{font-weight:700}table tfoot th,table thead th{font-size:1em}table caption+thead tr:first-child td,table caption+thead tr:first-child th,table colgroup+thead tr:first-child td,table colgroup+thead tr:first-child th,table thead:first-child tr:first-child td,table thead:first-child tr:first-child th{border-block-start:1px solid hsla(0,0%,50.2%,.5019607843)}table tbody>tr:nth-child(odd)>td,table tbody>tr:nth-child(odd)>th{background-color:hsla(0,0%,50.2%,.0705882353)}table tbody tr:hover>td,table tbody tr:hover>th{background-color:hsla(0,0%,50.2%,.1019607843)}table tbody+tbody{border-block-start:2px solid hsla(0,0%,50.2%,.5019607843)}@media (max-width:767px){table table{font-size:.8em}table table td,table table th{padding:7px;line-height:1.3}table table th{font-weight:400}}dd,dl,dt,li,ol,ul{margin-block-start:0;margin-block-end:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent} /* ---- hello-elementor-theme-style ---- */ @charset "UTF-8";.comments-area a,.page-content a{text-decoration:underline}.alignright{float:right;margin-left:1rem}.alignleft{float:left;margin-right:1rem}.aligncenter{clear:both;display:block;margin-inline:auto}.alignwide{margin-inline:-80px}.alignfull{margin-inline:calc(50% - 50vw);max-width:100vw}.alignfull,.alignfull img{width:100vw}.wp-caption{margin-block-end:1.25rem;max-width:100%}.wp-caption.alignleft{margin:5px 20px 20px 0}.wp-caption.alignright{margin:5px 0 20px 20px}.wp-caption img{display:block;margin-inline:auto}.wp-caption-text{margin:0}.gallery-caption{display:block;font-size:.8125rem;line-height:1.5;margin:0;padding:.75rem}.pagination{display:flex;justify-content:space-between;margin:20px auto}.sticky{position:relative;display:block}.bypostauthor{font-size:inherit}.hide{display:none!important}.post-password-form{max-width:500px;margin:50px auto}.post-password-form p{width:100%;display:flex;align-items:flex-end}.post-password-form [type=submit]{margin-inline-start:3px}.screen-reader-text{clip:rect(1px,1px,1px,1px);height:1px;overflow:hidden;position:absolute!important;width:1px;word-wrap:normal!important}.screen-reader-text:focus{background-color:rgb(238.425,238.425,238.425);clip:auto!important;clip-path:none;color:#333;display:block;font-size:1rem;height:auto;left:5px;line-height:normal;padding:12px 24px;text-decoration:none;top:5px;width:auto;z-index:100000}.post .entry-title a{text-decoration:none}.post .wp-post-image{width:100%;max-height:500px;-o-object-fit:cover;object-fit:cover}@media (max-width:991px){.post .wp-post-image{max-height:400px}}@media (max-width:575px){.post .wp-post-image{max-height:300px}}#comments .comment-list{margin:0;padding:0;list-style:none;font-size:.9em}#comments .comment,#comments .pingback{position:relative}#comments .comment .comment-body,#comments .pingback .comment-body{display:flex;flex-direction:column;padding-block-start:30px;padding-block-end:30px;padding-inline-start:60px;padding-inline-end:0;border-block-end:1px solid #ccc}#comments .comment .avatar,#comments .pingback .avatar{position:absolute;left:0;border-radius:50%;margin-inline-end:10px}body.rtl #comments .comment .avatar,body.rtl #comments .pingback .avatar,html[dir=rtl] #comments .comment .avatar,html[dir=rtl] #comments .pingback .avatar{left:auto;right:0}#comments .comment-meta{display:flex;justify-content:space-between;margin-block-end:.9rem}#comments .comment-metadata,#comments .reply{font-size:11px;line-height:1}#comments .children{position:relative;list-style:none;margin:0;padding-inline-start:30px}#comments .children li:last-child{padding-block-end:0}#comments ol.comment-list .children:before{display:inline-block;font-size:1em;font-weight:400;line-height:100%;content:"↪";position:absolute;top:45px;left:0;width:auto}body.rtl #comments ol.comment-list .children:before,html[dir=rtl] #comments ol.comment-list .children:before{content:"↩";left:auto;right:0}@media (min-width:768px){#comments .comment-author,#comments .comment-metadata{line-height:1}}@media (max-width:767px){#comments .comment .comment-body{padding:30px 0}#comments .children{padding-inline-start:20px}#comments .comment .avatar{position:inherit;float:left}body.rtl #comments .comment .avatar,html[dir=rtl] #comments .comment .avatar{float:right}}.page-header .entry-title,.site-footer .footer-inner,.site-footer:not(.dynamic-footer),.site-header .header-inner,.site-header:not(.dynamic-header),body:not([class*=elementor-page-]) .site-main{margin-inline-start:auto;margin-inline-end:auto;width:100%}@media (max-width:575px){.page-header .entry-title,.site-footer .footer-inner,.site-footer:not(.dynamic-footer),.site-header .header-inner,.site-header:not(.dynamic-header),body:not([class*=elementor-page-]) .site-main{padding-inline-start:10px;padding-inline-end:10px}}@media (min-width:576px){.page-header .entry-title,.site-footer .footer-inner,.site-footer:not(.dynamic-footer),.site-header .header-inner,.site-header:not(.dynamic-header),body:not([class*=elementor-page-]) .site-main{max-width:500px}.site-footer.footer-full-width .footer-inner,.site-header.header-full-width .header-inner{max-width:100%}}@media (min-width:768px){.page-header .entry-title,.site-footer .footer-inner,.site-footer:not(.dynamic-footer),.site-header .header-inner,.site-header:not(.dynamic-header),body:not([class*=elementor-page-]) .site-main{max-width:600px}.site-footer.footer-full-width,.site-header.header-full-width{max-width:100%}}@media (min-width:992px){.page-header .entry-title,.site-footer .footer-inner,.site-footer:not(.dynamic-footer),.site-header .header-inner,.site-header:not(.dynamic-header),body:not([class*=elementor-page-]) .site-main{max-width:800px}.site-footer.footer-full-width,.site-header.header-full-width{max-width:100%}}@media (min-width:1200px){.page-header .entry-title,.site-footer .footer-inner,.site-footer:not(.dynamic-footer),.site-header .header-inner,.site-header:not(.dynamic-header),body:not([class*=elementor-page-]) .site-main{max-width:1140px}.site-footer.footer-full-width,.site-header.header-full-width{max-width:100%}}.site-header+.elementor{min-height:calc(100vh - 320px)} /* ---- hello-elementor-header-footer ---- */ @charset "UTF-8";.site-header{display:flex;flex-wrap:wrap;justify-content:space-between;padding-block-start:1rem;padding-block-end:1rem;position:relative}.site-header .site-title{font-size:2.5rem;font-weight:500;line-height:1.2}.site-header .site-branding{display:flex;flex-direction:column;justify-content:center;gap:.5rem}.site-header .header-inner{display:flex;flex-wrap:wrap;justify-content:space-between}.site-header .header-inner .custom-logo-link{display:block}.site-header .header-inner .site-branding .site-description,.site-header .header-inner .site-branding .site-title{margin:0}.site-header .header-inner .site-branding .site-logo img{display:block}.site-header .header-inner .site-branding.show-logo .site-title,.site-header .header-inner .site-branding.show-title .site-logo{display:none!important}.site-header.header-inverted .header-inner{flex-direction:row-reverse}.site-header.header-inverted .header-inner .site-branding{text-align:end}.site-header.header-stacked .header-inner{align-items:center;flex-direction:column;text-align:center}.site-footer{padding-block-start:1rem;padding-block-end:1rem;position:relative}.site-footer .site-title{font-size:1.5rem;font-weight:500;line-height:1.2}.site-footer .site-branding{display:flex;flex-direction:column;justify-content:center;gap:.5rem}.site-footer .footer-inner{display:flex;flex-wrap:wrap;justify-content:space-between}.site-footer .footer-inner .custom-logo-link{display:block}.site-footer .footer-inner .site-branding .site-description,.site-footer .footer-inner .site-branding .site-title{margin:0}.site-footer .footer-inner .site-branding .site-logo img{display:block}.site-footer .footer-inner .site-branding.show-logo .site-title,.site-footer .footer-inner .site-branding.show-title .site-logo{display:none!important}.site-footer .footer-inner .copyright{align-items:center;display:flex;justify-content:flex-end}.site-footer .footer-inner .copyright p{margin:0}.site-footer.footer-inverted .footer-inner{flex-direction:row-reverse}.site-footer.footer-inverted .footer-inner .site-branding{text-align:end}.site-footer.footer-stacked .footer-inner{align-items:center;flex-direction:column;text-align:center}.site-footer.footer-stacked .footer-inner .site-branding .site-title{text-align:center}.site-footer.footer-stacked .footer-inner .site-navigation .menu{padding:0}@media (max-width:576px){.site-footer:not(.footer-stacked) .footer-inner .copyright,.site-footer:not(.footer-stacked) .footer-inner .site-branding,.site-footer:not(.footer-stacked) .footer-inner .site-navigation{display:block;text-align:center;width:100%;max-width:none}.site-footer .footer-inner .site-navigation ul.menu{justify-content:center}.site-footer .footer-inner .site-navigation ul.menu li{display:inline-block}}.site-header.header-stacked .site-navigation-toggle-holder{justify-content:center;max-width:100%}.site-header.menu-layout-dropdown .site-navigation{display:none}.site-navigation-toggle-holder{display:flex;align-items:center;padding:8px 15px}.site-navigation-toggle-holder .site-navigation-toggle{display:flex;align-items:center;justify-content:center;padding:.5rem;cursor:pointer;border:0 solid;border-radius:3px;background-color:rgba(0,0,0,.05);color:#494c4f}.site-navigation-toggle-holder .site-navigation-toggle-icon{display:block;width:1.25rem}.site-navigation-toggle-holder .site-navigation-toggle-icon:after,.site-navigation-toggle-holder .site-navigation-toggle-icon:before{content:"";background-color:currentColor;display:block;height:3px;transition:all .2s ease-in-out;border-radius:3px}.site-navigation-toggle-holder .site-navigation-toggle-icon:before{box-shadow:0 .35rem 0 currentColor;margin-block-end:.5rem}.site-navigation-toggle-holder .site-navigation-toggle[aria-expanded=true] .site-navigation-toggle-icon:before{box-shadow:none;transform:translateY(.35rem) rotate(45deg)}.site-navigation-toggle-holder .site-navigation-toggle[aria-expanded=true] .site-navigation-toggle-icon:after{transform:translateY(-.35rem) rotate(-45deg)}.site-navigation{display:flex;align-items:center}.site-navigation ul.menu,.site-navigation ul.menu ul{list-style-type:none;padding:0}.site-navigation ul.menu{display:flex;flex-wrap:wrap}.site-navigation ul.menu li{position:relative;display:flex}.site-navigation ul.menu li a{display:block;padding:8px 15px}.site-navigation ul.menu li.menu-item-has-children{padding-inline-end:15px}.site-navigation ul.menu li.menu-item-has-children:after{display:flex;content:"▾";font-size:1.5em;justify-content:center;align-items:center;color:#666;text-decoration:none}.site-navigation ul.menu li.menu-item-has-children:focus-within>ul{display:block}.site-navigation ul.menu li ul{background:#fff;display:none;min-width:150px;position:absolute;z-index:2;left:0;top:100%}.site-navigation ul.menu li ul li{border-block-end:rgb(238.425,238.425,238.425) 1px solid}.site-navigation ul.menu li ul li:last-child{border-block-end:none}.site-navigation ul.menu li ul li.menu-item-has-children a{flex-grow:1}.site-navigation ul.menu li ul li.menu-item-has-children:after{transform:translateY(-50%) rotate(-90deg)}.site-navigation ul.menu li ul ul{left:100%;top:0}.site-navigation ul.menu li:hover>ul{display:block}footer .site-navigation ul.menu li ul{top:auto;bottom:100%}footer .site-navigation ul.menu li ul ul{bottom:0}footer .site-navigation ul.menu a{padding:5px 15px}.site-navigation-dropdown{margin-block-start:10px;transition:max-height .3s,transform .3s;transform-origin:top;position:absolute;bottom:0;left:0;z-index:10000;width:100%}.site-navigation-toggle-holder:not(.elementor-active)+.site-navigation-dropdown{transform:scaleY(0);max-height:0}.site-navigation-toggle-holder.elementor-active+.site-navigation-dropdown{transform:scaleY(1);max-height:100vh}.site-navigation-dropdown ul{padding:0}.site-navigation-dropdown ul.menu{position:absolute;width:100%;padding:0;margin:0;background:#fff}.site-navigation-dropdown ul.menu li{display:block;width:100%;position:relative}.site-navigation-dropdown ul.menu li a{display:block;padding:20px;background:#fff;color:#55595c;box-shadow:inset 0 -1px 0 rgba(0,0,0,.1019607843)}.site-navigation-dropdown ul.menu li.current-menu-item a{color:#fff;background:#55595c}.site-navigation-dropdown ul.menu>li li{transition:max-height .3s,transform .3s;transform-origin:top;transform:scaleY(0);max-height:0}.site-navigation-dropdown ul.menu li.elementor-active>ul>li{transform:scaleY(1);max-height:100vh}@media (max-width:576px){.site-header.menu-dropdown-mobile:not(.menu-layout-dropdown) .site-navigation{display:none!important}}@media (min-width:768px){.site-header.menu-dropdown-mobile:not(.menu-layout-dropdown) .site-navigation-toggle-holder{display:none!important}}@media (min-width:576px) and (max-width:767px){.site-header.menu-dropdown-mobile:not(.menu-layout-dropdown) .site-navigation{display:none!important}}@media (min-width:992px){.site-header.menu-dropdown-tablet:not(.menu-layout-dropdown) .site-navigation-toggle-holder{display:none!important}}@media (max-width:992px){.site-header.menu-dropdown-tablet:not(.menu-layout-dropdown) .site-navigation{display:none!important}}.site-header.menu-dropdown-none:not(.menu-layout-dropdown) .site-navigation-toggle-holder{display:none!important} /* ---- fh-portada ---- */ /* Film Houses - portada. Construida sobre filmhouses-brand-tokens.css. Secciones a pagina completa, alternando marino y hueso; nunca dos marinos seguidos. */ .fh-portada { font-family: var(--fh-font-text); font-weight: 300; line-height: var(--fh-text-lh); } .fh-portada *, .fh-portada *::before, .fh-portada *::after { box-sizing: border-box; } .fh-ancho { width: 100%; max-width: 1440px; margin: 0 auto; padding: 0 var(--fh-gutter); } .fh-seccion { padding: clamp(56px, 7vw, 128px) 0; } .fh-seccion--marino { background: var(--fh-marino); color: var(--fh-blanco); } .fh-seccion--hueso { background: var(--fh-hueso); color: var(--fh-grafito); } .fh-portada .fh-display { font-family: var(--fh-font-display); text-transform: uppercase; line-height: var(--fh-display-lh); letter-spacing: var(--fh-display-ls); font-weight: 700; margin: 0; } .fh-portada .fh-eyebrow { font-family: var(--fh-font-text); font-size: var(--fh-eyebrow); font-weight: 500; letter-spacing: .2em; text-transform: uppercase; margin: 0 0 12px; } /* El color lo pone fh-custom.css: arena sobre marino, grafito sobre claro. Aqui se fijaba arena para todos y sobre hueso daba 2,17 de contraste. */ /* --- hero --- */ .fh-hero { padding-top: clamp(64px, 9vw, 152px); } .fh-hero__titulo { font-size: var(--fh-h1); color: var(--fh-arena); margin-bottom: 20px; } .fh-hero__lead { font-size: var(--fh-lead); font-weight: 300; color: rgba(255,255,255,.82); max-width: 44ch; margin: 0 0 clamp(28px, 3.5vw, 48px); } .fh-hero .fh-buscador { background: transparent; padding: 0; border-radius: 0; max-width: none; } .fh-hero .fh-buscador__lista { left: 0; right: 0; } /* --- cifras --- */ .fh-cifras { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(24px, 4vw, 72px); } .fh-cifra__num { font-size: clamp(44px, 5.4vw, 92px); color: var(--fh-marino); margin-bottom: 4px; } .fh-cifra__pie { font-size: var(--fh-small); color: var(--fh-grafito); margin: 0; } /* --- cabecera de seccion --- */ .fh-seccion__cabecera { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; flex-wrap: wrap; padding-bottom: 18px; margin-bottom: clamp(28px, 3.5vw, 48px); border-bottom: var(--fh-rule); } .fh-seccion__titulo { font-size: var(--fh-h2); } .fh-seccion--marino .fh-seccion__titulo { color: var(--fh-blanco); } .fh-seccion--hueso .fh-seccion__titulo { color: var(--fh-marino); } .fh-enlace { font-family: var(--fh-font-text); font-size: var(--fh-small); font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--fh-arena); text-decoration: none; white-space: nowrap; display: inline-flex; gap: 8px; align-items: center; } .fh-enlace span { transition: transform .18s ease; } .fh-enlace:hover span { transform: translateX(4px); } /* --- tarjetas de propiedad: foto a la izquierda (manual, seccion 14) --- */ .fh-rejilla { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; } .fh-ficha { display: grid; grid-template-columns: 42% 1fr; background: var(--fh-blanco); border-radius: var(--fh-radius-card); overflow: hidden; text-decoration: none; transition: transform .2s ease, box-shadow .2s ease; min-height: 232px; } .fh-ficha:hover { transform: translateY(-4px); box-shadow: 0 18px 40px rgba(39,55,67,.18); } /* La foto llena su celda y no manda sobre el alto de la tarjeta. Con la imagen en el flujo, la primera de cada rejilla -que se carga con prioridad y sin lazy- estiraba su fila: en las landings la primera fila media 437 px y las demas 232. Fuera del flujo, todas miden igual. */ .fh-ficha__foto { position: relative; background: var(--fh-piedra); overflow: hidden; } .fh-ficha__foto img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; } .fh-ficha__marcas { position: absolute; top: 14px; left: 14px; display: flex; flex-wrap: wrap; gap: 6px; } /* Tamano, relleno y forma: fh-marco.css. Aqui solo el color. */ .fh-ficha__marca { background: var(--fh-marino); color: var(--fh-hueso); } .fh-ficha__cuerpo { padding: clamp(20px, 2vw, 30px); display: flex; flex-direction: column; } .fh-ficha__sitio { margin-bottom: 8px; } .fh-ficha__titulo { font-size: clamp(20px, 1.5vw, 27px); color: var(--fh-marino); margin-bottom: 10px; } .fh-ficha__datos { font-size: var(--fh-small); color: var(--fh-grafito); margin: 0 0 auto; } .fh-ficha__precio { font-size: clamp(22px, 1.7vw, 30px); color: var(--fh-marino); margin-top: 18px; } /* --- llamada a la accion --- */ .fh-cta { display: flex; align-items: center; justify-content: space-between; gap: clamp(24px, 4vw, 64px); flex-wrap: wrap; } .fh-cta__titulo { font-size: var(--fh-h2); color: var(--fh-arena); margin-bottom: 14px; } .fh-cta__texto { font-size: var(--fh-body); font-weight: 300; color: rgba(255,255,255,.82); max-width: 52ch; margin: 0; } .fh-portada .fh-btn { font-family: var(--fh-font-text); font-weight: 600; font-size: 15px; letter-spacing: .06em; text-transform: uppercase; padding: 18px 34px; border-radius: var(--fh-radius-pill); text-decoration: none; display: inline-block; white-space: nowrap; transition: opacity .18s ease; } .fh-portada .fh-btn-primary { background: var(--fh-arena); color: var(--fh-marino); } .fh-portada .fh-btn-primary:hover { opacity: .88; } /* --- noticias y mapa --- */ .fh-noticias { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; } .fh-noticia, .fh-mapa { background: var(--fh-blanco); border-radius: var(--fh-radius-card); overflow: hidden; text-decoration: none; display: flex; flex-direction: column; transition: transform .2s ease, box-shadow .2s ease; } .fh-noticia:hover, .fh-mapa:hover { transform: translateY(-4px); box-shadow: 0 18px 40px rgba(39,55,67,.14); } .fh-noticia__foto { aspect-ratio: 16 / 10; background: var(--fh-piedra); } .fh-noticia__foto img { width: 100%; height: 100%; object-fit: cover; display: block; } .fh-noticia .fh-eyebrow { padding: 20px 22px 0; margin-bottom: 8px; } .fh-noticia__titulo { font-family: var(--fh-font-text); font-weight: 500; font-size: 17px; line-height: 1.35; color: var(--fh-marino); margin: 0; padding: 0 22px; } /* * La tarjeta no tiene relleno propio: lo pone cada pieza. * * El resumen y el pie se anadieron sin el, asi que llegaban al borde * mientras la fecha y el titulo se quedaban a 22 px. Madison lo vio en * la captura del 5-10-2026. Aqui van los tres con el mismo margen, y el * ultimo con el aire de abajo. */ .fh-noticia__resumen { padding: 0 22px; } .fh-noticia__pie { padding: 0 22px; } .fh-noticia > *:last-child { padding-bottom: 22px; } .fh-noticia__titulo:last-child { padding-bottom: 24px; } .fh-mapa { background: var(--fh-marino); padding: 24px 22px; justify-content: space-between; } .fh-mapa__titulo { font-size: clamp(22px, 1.7vw, 30px); color: var(--fh-blanco); margin: 0 0 18px; } /* --- movil --- */ @media (max-width: 900px) { .fh-rejilla { grid-template-columns: 1fr; } .fh-noticias { grid-template-columns: repeat(2, minmax(0, 1fr)); } } @media (max-width: 600px) { .fh-cifras { grid-template-columns: 1fr; gap: 28px; text-align: left; } .fh-noticias { grid-template-columns: 1fr; } .fh-ficha { grid-template-columns: 1fr; min-height: 0; } .fh-ficha__foto { aspect-ratio: 16 / 10; } .fh-seccion__cabecera { align-items: flex-start; } .fh-cta { flex-direction: column; align-items: flex-start; } /* * En movil el boton ocupa toda la fila, pero .fh-btn lleva * white-space: nowrap y el texto seguia en una sola linea: "Ver los * 19 inmuebles de Miguel Gonzalez" medía 436 px y sacaba la pagina * 92 px por la derecha a 360. Aqui se deja partir. */ .fh-portada .fh-btn { width: 100%; max-width: 100%; text-align: center; white-space: normal; } } /* ------------------------------------------------------------------ Elementor aplica su tipografia global a h1-h4, p y a, y gana en especificidad. Dentro de la portada reponemos lo nuestro. ------------------------------------------------------------------ */ .fh-portada h1, .fh-portada h2, .fh-portada h3, .fh-portada h4, .fh-portada p, .fh-portada a { font-family: var(--fh-font-text); color: inherit; } /* El buscador trae su propia paleta: el reset de arriba no debe tocarlo. */ .fh-portada .fh-buscador__icono { color: var(--fh-arena) !important; } .fh-portada .fh-buscador__input { color: var(--fh-marino) !important; } .fh-portada .fh-buscador__nombre { color: var(--fh-marino) !important; } .fh-portada .fh-buscador__num, .fh-portada .fh-buscador__madre { color: #8B96A1 !important; } .fh-portada .fh-buscador__nombre mark { color: var(--fh-arena) !important; } .fh-portada .fh-display { font-family: var(--fh-font-display) !important; text-transform: uppercase !important; line-height: var(--fh-display-lh) !important; letter-spacing: var(--fh-display-ls) !important; font-weight: 700 !important; } .fh-portada .fh-eyebrow { font-size: var(--fh-eyebrow) !important; letter-spacing: .2em !important; font-weight: 500 !important; text-transform: uppercase !important; line-height: 1.4 !important; } .fh-portada .fh-hero__titulo { font-size: var(--fh-h1) !important; color: var(--fh-arena) !important; } .fh-portada .fh-hero__lead { font-size: var(--fh-lead) !important; color: rgba(255,255,255,.82) !important; } .fh-portada .fh-seccion__titulo{ font-size: var(--fh-h2) !important; } .fh-seccion--marino .fh-seccion__titulo { color: var(--fh-blanco) !important; } .fh-seccion--hueso .fh-seccion__titulo { color: var(--fh-marino) !important; } .fh-portada .fh-cifra__num { font-size: clamp(44px, 5.4vw, 92px) !important; color: var(--fh-marino) !important; } .fh-portada .fh-cifra__pie { font-size: var(--fh-small) !important; color: var(--fh-grafito) !important; } .fh-portada .fh-ficha__titulo { font-size: clamp(20px, 1.5vw, 27px) !important; color: var(--fh-marino) !important; } .fh-portada .fh-ficha__datos { color: var(--fh-grafito) !important; font-size: var(--fh-small) !important; } .fh-portada .fh-ficha__precio { font-size: clamp(22px, 1.7vw, 30px) !important; color: var(--fh-marino) !important; } .fh-portada .fh-cta__titulo { font-size: var(--fh-h2) !important; color: var(--fh-arena) !important; } .fh-portada .fh-cta__texto { color: rgba(255,255,255,.82) !important; font-size: var(--fh-body) !important; } .fh-portada .fh-mapa__titulo { font-size: clamp(22px, 1.7vw, 30px) !important; color: var(--fh-blanco) !important; } .fh-portada .fh-noticia__titulo{ font-size: 17px !important; color: var(--fh-marino) !important; font-weight: 500 !important; text-transform: none !important; line-height: 1.35 !important; } .fh-portada .fh-enlace { color: var(--fh-arena) !important; font-size: var(--fh-small) !important; } .fh-portada .fh-ficha__marca { color: var(--fh-hueso) !important; } .fh-portada .fh-outline { -webkit-text-fill-color: transparent !important; color: transparent !important; } .fh-on-marino .fh-outline { -webkit-text-stroke-color: var(--fh-arena) !important; } .fh-portada h1, .fh-portada h2, .fh-portada h3, .fh-portada p { margin-top: 0; } /* Los titulos que llegan de Inmovilla son descripciones largas; en condensada y mayusculas ocupan cinco lineas. Se limitan a dos y se cortan con puntos. */ .fh-portada .fh-ficha__titulo { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } .fh-portada .fh-noticia__titulo { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; } /* Con pocas noticias, auto-fit reparte el ancho entre las que haya en vez de dejar media fila vacia. */ .fh-noticias { grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); } /* Las cifras, centradas entre si. */ .fh-cifra { text-align: center; } @media (max-width: 600px) { .fh-cifra { text-align: left; } } /* ------------------------------------------------------------------ Safari: red de seguridad. 1. Si el navegador no entiende -webkit-text-stroke, el titular contorneado se quedaria invisible (color transparente sin trazo). Se repinta en solido. 2. aspect-ratio no existe antes de Safari 15: se sustituye por la proporcion clasica con padding. ------------------------------------------------------------------ */ @supports not ((-webkit-text-stroke: 1px currentColor) or (text-stroke: 1px currentColor)) { .fh-portada .fh-outline { color: var(--fh-arena) !important; -webkit-text-fill-color: var(--fh-arena) !important; } } @supports not (aspect-ratio: 16 / 10) { .fh-noticia__foto { position: relative; height: 0; padding-top: 62.5%; } .fh-noticia__foto img { position: absolute; inset: 0; } @media (max-width: 600px) { .fh-ficha__foto { position: relative; height: 0; padding-top: 62.5%; } .fh-ficha__foto img { position: absolute; inset: 0; } .fh-ficha__marcas { z-index: 2; } } } /* Safari necesita el prefijo para el recorte de lineas. */ .fh-portada .fh-ficha__titulo, .fh-portada .fh-noticia__titulo { display: -webkit-box; -webkit-box-orient: vertical; } /* El lead del bloque de valoracion se pegaba al titular condensado, que tiene interlineado 0,94 y deja poco aire debajo. */ .fh-portada .fh-cta__titulo { margin-bottom: 20px !important; } .fh-portada .fh-cta__texto { line-height: 1.6 !important; } .fh-portada .fh-cta > div { max-width: 62ch; } /* --- tarjeta del mapa con la silueta de Mallorca --- */ .fh-mapa { position: relative; overflow: hidden; padding: 26px 24px; min-height: 340px; } .fh-mapa__texto { position: relative; z-index: 2; } .fh-mapa .fh-enlace { position: relative; z-index: 2; } .fh-isla { position: absolute; right: -14%; bottom: -6%; width: 118%; height: auto; opacity: .95; pointer-events: none; } .fh-isla__linea { fill: none; stroke: var(--fh-arena); stroke-width: 5; stroke-linejoin: round; opacity: .55; } .fh-isla__pins circle { fill: var(--fh-arena); opacity: .9; } .fh-isla__pins circle:first-child { fill: var(--fh-blanco); } .fh-mapa:hover .fh-isla__linea { opacity: .8; } /* Los titulares condensados llevan interlineado 0,94: dejan muy poco aire por debajo y el texto siguiente parece pegado. Se separa a mano. */ .fh-portada .fh-hero__titulo { margin-bottom: 26px !important; } .fh-portada .fh-hero__lead { line-height: 1.55 !important; } .fh-portada .fh-seccion__titulo { padding-bottom: 2px; } /* --- tarjeta de zonas de la portada (antes era un contorno dibujado) --- */ .fh-mapa { display: flex; flex-direction: column; } .fh-mapa__zonas { list-style: none; margin: clamp(18px, 2vw, 26px) 0 auto; padding: 0; display: grid; gap: 1px; background: rgba(192, 157, 117, .28); border-top: 1px solid rgba(192, 157, 117, .28); border-bottom: 1px solid rgba(192, 157, 117, .28); } .fh-mapa__zonas li { background: var(--fh-marino); } .fh-mapa__zonas a { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; padding: 13px 4px; text-decoration: none; transition: padding-left .18s ease; } .fh-mapa__zonas a:hover { padding-left: 12px; } .fh-mapa__zona { font-family: var(--fh-font-text); font-size: 16px; font-weight: 400; color: var(--fh-blanco); min-width: 0; } .fh-mapa__zonas a:hover .fh-mapa__zona { color: var(--fh-arena); } .fh-mapa__num { font-family: var(--fh-font-display); font-size: 21px; line-height: 1; color: var(--fh-arena); flex: 0 0 auto; } .fh-mapa .fh-enlace { margin-top: clamp(18px, 2vw, 26px); } /* --- la segunda foto asoma al pasar por encima (idea de Balearic Properties) --- */ .fh-ficha__foto { overflow: hidden; } .fh-ficha__img, .fh-ficha__img2 { width: 100%; height: 100%; object-fit: cover; display: block; } .fh-ficha__img2 { position: absolute; inset: 0; opacity: 0; transition: opacity .45s ease; } .fh-ficha:hover .fh-ficha__img2, .fh-ficha:focus-visible .fh-ficha__img2 { opacity: 1; } /* Con el dedo no hay "pasar por encima": en tactil no se enseña. */ @media (hover: none) { .fh-ficha__img2 { display: none; } } /* Movil: las cifras de la portada, centradas como en el ordenador. */ @media (max-width: 600px) { .fh-portada .fh-cifra { text-align: center; } } /* ========================================================= Las cifras sobre marino La regla de la portada las fija en marino porque alli van sobre hueso. En Nosotros el bloque es marino y el numero quedaba invisible: mismo color que el fondo. ========================================================= */ .fh-seccion--marino .fh-cifra__num { color: var(--fh-arena) !important; } .fh-seccion--marino .fh-cifra__pie { color: rgba(255, 255, 255, .75) !important; } .fh-cifra__num { opacity: 1 !important; } /* --- dos secciones seguidas del mismo fondo --- Los casos de exito van debajo de las recien incorporadas y las dos son de hueso: sin nada en medio se leian como un solo bloque largo de tarjetas. Se separan con el mismo filete de las cabeceras (--fh-rule), metido en el ancho de la pagina, y sin cambiar el aire: el relleno de arriba pasa de la seccion al interior. Madison, 15-10-2026. */ .fh-seccion--tras-igual { padding-top: 0; } .fh-seccion--tras-igual > .fh-ancho { border-top: var(--fh-rule); padding-top: clamp(56px, 7vw, 128px); } /* ---- fh-resultados ---- */ /* Film Houses - pagina de resultados de busqueda. */ /* ========================================================= Cabecera El antetitulo y el titular arrancan en la misma vertical. Las mayusculas de la tipografia de display llevan algo de aire a su izquierda, asi que sin corregirlo el titular se ve metido hacia dentro respecto al antetitulo. ========================================================= */ .fh-res-cab { padding-top: clamp(30px, 3.4vw, 58px); padding-bottom: 0; } .fh-resultados .fh-res-cab .fh-eyebrow { margin: 0; } .fh-resultados .fh-res-cab .fh-res-cab__titulo { font-size: clamp(34px, 4.4vw, 76px); text-transform: uppercase; color: var(--fh-blanco); /* Elementor pinta los h1 con .elementor-kit-9 h1 */ margin: 8px 0 0; margin-left: -0.035em; } /* ========================================================= Barra de afinado Una rejilla, no una fila elastica: todos los filtros miden exactamente lo mismo y los huecos entre ellos son iguales. El numero de columnas lo pone el PHP en --fh-res-cols, que cuenta un filtro de mas porque la zona ocupa el doble. ========================================================= */ .fh-res-cuerpo { padding-top: clamp(26px, 3vw, 46px); } .fh-res-filtros { display: grid; grid-template-columns: repeat(var(--fh-res-cols, 7), minmax(0, 1fr)); gap: clamp(14px, 1.2vw, 20px); align-items: end; margin: 0 0 clamp(30px, 3.2vw, 48px); padding-bottom: clamp(26px, 2.8vw, 40px); border-bottom: 1px solid var(--fh-arena-30, rgba(192, 157, 117, .3)); } .fh-filtro { grid-column: span 1; display: grid; gap: 9px; min-width: 0; align-content: start; } .fh-filtro--zona { grid-column: span 2; } /* * Tres columnas y dos filas, a cualquier ancho (punto 93). * * Por encima de 1441 la rejilla abria los siete filtros en una sola fila * y cada columna se quedaba en 128 px: en aleman no cabe ni la etiqueta * -"Sortieren nach" pide 148 y se partia en dos lineas- ni el valor * -"Kein Minimum" pide 158-. Con tres columnas, a 1920 cada una mide 424 * y cabe todo en los tres idiomas, con las etiquetas en una linea. */ .fh-resultados .fh-res-filtros { grid-template-columns: repeat(3, minmax(0, 1fr)); } .fh-resultados .fh-res-filtros .fh-filtro--zona { grid-column: span 3; } /* La etiqueta arranca donde arranca el texto de su campo, no donde arranca la pastilla, que va 20 px mas afuera. */ .fh-res-filtros .fh-filtro__et { font-family: var(--fh-font-text); font-size: 11px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--fh-arena); padding-left: 20px; /* La de Zona heredaba el interlineado del buscador y salia el doble de alta, asi que su filtro quedaba 12 px mas bajo que los demas. */ line-height: 1; display: block; } /* Aplicar: siempre en su propia linea, alineado con el primer filtro. */ .fh-res-filtros__ok { grid-column: 1 / -1; justify-self: start; height: 46px; padding: 0 34px !important; margin-top: 4px; } /* --- la pastilla del precio y la de superficie: dos campos dentro --- */ .fh-res-precio { display: flex; align-items: center; justify-content: center; background: #fff; border: 1px solid var(--fh-piedra); border-radius: var(--fh-radius-pill); padding: 0 10px; height: 46px; } .fh-resultados .fh-res-precio input[type="text"] { width: 100% !important; min-width: 0; background: transparent !important; border: 0 !important; box-shadow: none !important; padding: 0 10px !important; height: 44px !important; font-family: var(--fh-font-text) !important; font-size: 15px !important; font-weight: 400 !important; color: var(--fh-marino) !important; letter-spacing: 0 !important; text-align: center; } .fh-resultados .fh-res-precio input[type="text"]::placeholder { color: var(--fh-grafito) !important; font-weight: 300 !important; opacity: .7; } .fh-resultados .fh-res-precio input[type="text"]:focus { outline: 0 !important; } .fh-res-precio:focus-within { border-color: var(--fh-arena); box-shadow: 0 0 0 1px var(--fh-arena); } .fh-res-precio__raya { width: 12px; height: 1px; background: var(--fh-piedra); flex: 0 0 auto; } /* --- desplegables y caja de zona: el mismo alto y el mismo borde --- */ .fh-resultados .fh-desp__boton { background: #fff !important; border: 1px solid var(--fh-piedra) !important; border-radius: var(--fh-radius-pill) !important; height: 46px; padding: 0 20px !important; font-size: 15px !important; font-weight: 400 !important; } .fh-resultados .fh-desp__lista { border-radius: 20px; } .fh-resultados .fh-desp__lista li { white-space: nowrap; } /* Nada de texto cortado: ni puntos suspensivos ni recorte. Si algo no cabe, se acorta el texto en el PHP, no aqui. */ .fh-resultados .fh-desp__boton > span { overflow: visible; text-overflow: clip; white-space: nowrap; } /* --- buscador reducido, para la fila de filtros --- */ .fh-buscador--compacto { background: transparent !important; padding: 0 !important; max-width: none; } .fh-buscador--compacto .fh-buscador__pestanas, .fh-buscador--compacto .fh-buscador__tipos, .fh-buscador--compacto .fh-buscador__boton, .fh-buscador--compacto .fh-buscador__titular { display: none !important; } .fh-resultados .fh-buscador--compacto .fh-buscador__campo { background: #fff !important; border: 1px solid var(--fh-piedra) !important; border-radius: var(--fh-radius-pill) !important; height: 46px; padding: 0 18px !important; min-height: 0; } .fh-resultados .fh-buscador--compacto .fh-buscador__input { padding: 0 8px !important; font-size: 15px !important; min-width: 0; } .fh-buscador--compacto .fh-buscador__icono svg { width: 17px; height: 17px; } .fh-buscador--compacto .fh-buscador__lista { border-radius: 20px; } /* --- la rejilla se parte antes de estrechar de mas --- */ @media (max-width: 900px) { .fh-resultados .fh-res-filtros { grid-template-columns: repeat(2, minmax(0, 1fr)); } .fh-resultados .fh-res-filtros .fh-filtro--zona, .fh-resultados .fh-res-filtros .fh-filtro--precio { grid-column: 1 / -1; } .fh-resultados .fh-res-filtros__ok { width: 100%; justify-self: stretch; } } @media (max-width: 560px) { .fh-resultados .fh-res-filtros { grid-template-columns: minmax(0, 1fr); } .fh-resultados .fh-res-filtros .fh-filtro { grid-column: 1 / -1; } } /* ========================================================= Los inmuebles: la misma tarjeta de la portada, sin recortes ========================================================= */ .fh-res-rejilla { gap: clamp(20px, 2.2vw, 28px); } .fh-resultados .fh-ficha__titulo { font-size: clamp(20px, 1.5vw, 27px) !important; color: var(--fh-marino) !important; line-height: .96 !important; margin-bottom: 10px !important; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } /* La zona y la referencia se cortaban en una linea. Caben en dos. */ .fh-resultados .fh-ficha__sitio { color: var(--fh-arena) !important; font-size: 12px !important; letter-spacing: .14em !important; line-height: 1.5 !important; white-space: normal !important; overflow: visible !important; text-overflow: clip !important; margin-bottom: 8px !important; } .fh-resultados .fh-ficha__datos { color: var(--fh-grafito) !important; font-size: var(--fh-small) !important; } .fh-resultados .fh-ficha__precio { font-size: clamp(22px, 1.7vw, 30px) !important; color: var(--fh-marino) !important; margin-top: 18px !important; } .fh-resultados .fh-ficha__marca { color: var(--fh-hueso) !important; } .fh-resultados .fh-ficha__foto { min-height: 0; } .fh-resultados .fh-ficha { min-height: 268px; } @media (max-width: 1024px) { .fh-res-rejilla { grid-template-columns: minmax(0, 1fr); } } /* ========================================================= Cuerpo sobre marino: las tarjetas blancas necesitan el azul de la casa detras para tener fuerza. ========================================================= */ .fh-resultados .fh-paginas__n { color: var(--fh-blanco); } .fh-resultados .fh-paginas__n.is-actual { background: var(--fh-arena); color: var(--fh-marino); } .fh-resultados .fh-paginas__salto { color: var(--fh-blanco); } .fh-resultados .fh-res-vacio h2 { color: var(--fh-blanco) !important; } .fh-resultados .fh-res-vacio .fh-nota { color: rgba(255, 255, 255, .78); } /* --- paginacion --- */ .fh-paginas { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 8px; margin-top: clamp(36px, 4vw, 64px); } .fh-paginas__n, .fh-paginas__salto { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; height: 44px; padding: 0 16px; border-radius: var(--fh-radius-pill); text-decoration: none; font-family: var(--fh-font-text); font-size: 14px; font-weight: 500; color: var(--fh-marino); border: 1.5px solid transparent; transition: background .18s ease, border-color .18s ease, color .18s ease; } .fh-paginas__n:hover, .fh-paginas__salto:hover { border-color: var(--fh-arena); color: var(--fh-marino); } .fh-paginas__n.is-actual { background: var(--fh-marino); color: var(--fh-blanco); } .fh-paginas__salto { letter-spacing: .06em; border-color: var(--fh-arena-55); } .fh-paginas__hueco { color: var(--fh-grafito); padding: 0 4px; } /* --- sin resultados --- */ .fh-res-vacio { text-align: center; padding: clamp(40px, 6vw, 96px) 0; max-width: 56ch; margin: 0 auto; } .fh-resultados .fh-res-vacio h2 { font-size: clamp(28px, 3.4vw, 52px); text-transform: uppercase; color: var(--fh-marino); margin: 0 0 14px; } .fh-res-vacio__botones { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; margin-top: 26px; } /* --- movil --- */ @media (max-width: 680px) { .fh-res-cab { padding-top: 26px; } .fh-res-cuerpo { padding-top: 24px; } .fh-paginas__salto { display: none; } } /* El valor elegido, con la misma letra que "Cualquiera" (punto 93). Iba en versales y los otros dos filtros no: "SIN MINIMO" y "DESTACADAS" al lado de "Cualquiera". La etiqueta de encima si va en versales; el valor es contenido, no etiqueta. */ .fh-resultados .fh-desp__boton { text-transform: none; letter-spacing: normal; } /* El boton, con el mismo radio que los campos (punto 93). .fh-btn pone la pastilla, pero .elementor-kit-9 button la pisa con 4px y gana por especificidad: una clase mas y un elemento. Con la clase de la plantilla delante, gana la nuestra. */ .fh-resultados .fh-res-filtros__ok, .fh-nuevo button.fh-btn { border-radius: var(--fh-radius-pill) !important; } /* El desplegable de tipos. Va con
, no con y .elementor-button de la web, no solo al que vio Pep: «Apúntame» sale en el pie de todas las páginas. El primer intento invertía el botón según si la sección era clara u oscura, y eso obligaba a ir enumerando contenedores: la franja del boletín, la tarjeta del precio, la portada de las promociones… Cada uno que se olvidaba dejaba un botón del color de su fondo. Este no pregunta de qué color es la sección: - El botón relleno conserva su arena con la letra marino (4,86) y se aclara un poco al pasar el ratón. Nunca se confunde con la sección, porque el arena no es ni el marino ni el hueso. - El botón de línea conserva su color y su borde, y se le echa un velo gris translúcido por dentro: sobre fondo oscuro aclara y sobre fondo claro oscurece, y la letra no se toca. */ /* * Una sola pareja para todos los botones, sea cual sea la seccion. * * Lo intente de dos maneras antes y las dos se rompieron: primero * invirtiendo el boton segun si la seccion era clara u oscura, que * obligaba a ir enumerando contenedores; y luego dejando el boton de * linea transparente con su propio color, que en la portada de las * promociones destapaba el marino de detras con la letra marino encima. * * Esta no pregunta nada: al pasar el raton, todo boton se queda arena * con la letra marino y se aclara un 18%. El arena no es ni el marino * ni el hueso, asi que el boton nunca se confunde con su seccion, y la * letra marino sobre el arena aclarado da 6,72. */ body.fh-nuevo .fh-btn:hover, body.fh-nuevo .fh-btn:focus-visible, body.fh-nuevo .fh-btn-primary:hover, body.fh-nuevo .fh-btn-primary:focus-visible, body.fh-nuevo .fh-btn-secondary:hover, body.fh-nuevo .fh-btn-secondary:focus-visible, body.fh-nuevo .fh-btn-linea:hover, body.fh-nuevo .fh-btn-linea:focus-visible, body.fh-nuevo .fh-btn-dossier:hover, body.fh-nuevo .fh-btn-dossier:focus-visible, body.fh-nuevo .fh-cookies__boton:hover, body.fh-nuevo .fh-cookies__boton:focus-visible, body.fh-nuevo .fh-form button[type="submit"]:hover, body.fh-nuevo .fh-form button[type="submit"]:focus-visible { background-color: var(--fh-arena) !important; color: var(--fh-marino) !important; border-color: var(--fh-arena) !important; box-shadow: none; filter: brightness(1.18); opacity: 1 !important; } /* El teclado necesita ver dónde está, no solo el ratón. */ body.fh-nuevo .fh-btn:focus-visible, body.fh-nuevo button:focus-visible, body.fh-nuevo input[type="submit"]:focus-visible { outline: 3px solid var(--fh-arena); outline-offset: 3px; } /* ------------------------------------------------------------------ El botón fantasma, que no era fantasma (punto 16b) ------------------------------------------------------------------ .fh-btn-secondary se definió en los tokens como fondo transparente con borde de 2 px, pero el tema le ganaba por especificidad y le ponía fondo arena. Con la letra en currentColor, hueso sobre arena da 2,17 y no se lee: «Ver todas las fotos (7)» salía así en las promociones y en las fichas, sin hacer nada, antes de pasar el ratón. Ahora es un fantasma de verdad: la letra hereda el color de su sección, que ya está elegido para leerse sobre ella (10,5 sobre marino). */ body.fh-nuevo .fh-btn-secondary { background-color: transparent !important; border: 2px solid currentColor !important; } /* * Botones que no son botones: «Dossier» es un