/* Theme Name: Temp Description: Temp Author: urbsdc.com Version: 999 Author URI: www.urbsdc.com */ /*reset*/ html, body, div, applet, object, iframe, img, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font,ins, kbd, q, s, samp, small, strike, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, textarea, center, i, div, header, section, footer {border:0;outline:0; box-sizing: border-box; line-height: 0;} html {scroll-behavior: smooth; background-color: #f5f4f4;} body{overflow-x: hidden;} *{margin:0;padding:0} :focus{outline:0} ol, ul{list-style:none} table{border-collapse:collapse;border-spacing:0;} blockquote, q{quotes:"" ""} em {font-weight: 400; font-style: normal;} hr{border:0;color:#FFFFFF;} blockquote:before, blockquote:after, q:before, q:after{content:""} .cky-consent-container{visibility: visible!important;} .cky-btn-revisit-wrapper{display: none!important} .grecaptcha-badge{display: none!important} /*tipos*/ strong{font-weight: bold} em{font-style: italic} h1, h2, h3, h4, h5, h6, p, a, li, div{font-family: "Roboto", sans-serif; color: rgba(0,0,0,1); text-decoration:none; font-size: 16px; font-weight: 400; line-height: 1.2em;} h1{color: rgba(0,0,0,1); font-size: 46px; font-weight: bold} h2{color: rgba(0,0,0,1); font-size: 38px; font-weight: bold} h3{color: rgba(0,0,0,1); font-size: 30px;} p{margin-bottom: 20px} p a{text-decoration: underline} ol{padding: 0px 0px 20px 30px; list-style-type: decimal} ul:not(.menu){padding: 0px 0px 20px 30px; list-style-type: disc} ul li, ol li{margin-bottom: 5px} .cky-consent-container{visibility: visible!important;} .cky-btn-revisit-wrapper{display: none!important} .has-text-align-center{text-align: center!important} .sinopacidad{opacity: 0!important} .oculto{display: none!important} .sinscroll{overflow:hidden!important} .altolinea0{line-height: 0!important} .cursiva{font-style: italic!important;} .negrita{font-weight: bold!important} .centrado{margin: 0 auto!important} .textoizquierda{text-align: left!important} .textocentro{text-align: center!important} .textoderecha{text-align: right!important} .wp-block-embed__wrapper{gap: 0!important} .bloque{display: block!important;} .eedee-gutenslider-nav{display: none!important} .cky-btn-revisit-wrapper{display: none!important} .gapcinco{gap: 5em!important} .gapdiez{gap: 10em!important} .ancho50{max-width: 50%} .cky-consent-container{visibility: visible!important;} .cky-btn-revisit-wrapper{display: none!important} .solopc{display: inherit} .solomovil{display: none} .flexat{display: inline-flex; width: 100%; flex-wrap: wrap;} .flexat.dalt{align-items: flex-start} .flexat.abaix{align-items: flex-end} .flexat.centre{align-items: center} .flexat.mismaaltura{align-items: stretch;} .flexat.inici{justify-content: flex-start} .flexat.final{justify-content: flex-end} .flexat.centrat{justify-content: center} .flexat.total{justify-content: space-between} .flexat250{width: 50%} .flexat2{width: 49%} .flexat3{width: 31%} .flexat4{width: 23.7%; margin-right: 1.6%;} .flexat4:nth-child(4n+0){margin-right: 0%;} .flexat5{width: 18%} .flexat8{width: 11%} .flexat23070:nth-child(1){width: 30%} .flexat23070:nth-child(2){width: 70%} .flexat27030:nth-child(1){width: 70%} .flexat27030:nth-child(2){width: 30%} .flexat12:nth-child(1){width: 30%} .flexat12:nth-child(2){width: 70%} .padding5{padding: 5px;} .padding10{padding: 10px;} .padding20{padding: 20px;} .padding80{padding: 80px;} .paddingtop10{padding-top: 10px;} .paddingtop80{padding-top: 80px;} .paddingtop120{padding-top: 120px;} .paddingbottom40{padding-bottom: 40px;} .paddingbottom80{padding-bottom: 80px;} .paddingtop40{padding-top: 40px;} .paddingtop140{padding-top: 140px;} .paddingbottom20{padding-bottom: 20px;} .marginbottom0{margin-bottom: 0px;} .padding200200{padding: 20px 0px 20px 0px;} .padding40{padding: 40px;} .padding80{padding: 50px;} .padding120{padding: 120px;} .margintop20{margin-top: 20px;} .margintop40{margin-top: 40px;} .margintop80{margin-top: 80px;} .margintop120{margin-top: 120px;} .marginbottom20{margin-bottom: 20px;} .marginbottom10{margin-bottom: 10px;} .marginbottom40{margin-bottom: 40px;} .marginbottom80{margin-bottom: 80px;} .marginbottom120{margin-bottom: 120px;} /*ancho y alto*/ .ancho100{width: 100%;} .alto100{height: 100vh;} .estrecho{width: 1200px; margin: 0 auto} .estrecho2{width: 800px; margin: 0 auto} .fijo{position: fixed} .absoluto{position: absolute} .relativo{position: relative} .breadcrumb{margin-top: 20px; font-size: 12px} .breadcrumb a, .breadcrumb span{font-size: 12px} /*rodetamouse*/ .dragbottom{position: fixed; bottom:0px; left: 50%;margin: 0 auto; width: 20px; margin-top: 20px;margin-bottom: 20px; transition:all 1s ease-in-out; -webkit-transition:all 1s ease-in-out; -webkit-transition-delay: 0.5s; transition-delay: 0.5s; z-index: 10000;margin-left: -15px;} .unu{margin-top: 6px;} .unu, .doi, .tre{-webkit-animation: mouse-scroll 1s infinite;-moz-animation: mouse-scroll 1s infinite;display: block;width: 10px;height: 10px;-ms-transform: rotate(45deg); -webkit-transform: rotate(45deg); transform: rotate(45deg); border-right: 2px solid white; border-bottom: 2px solid white; margin: 0 0 3px 6px } .unu{-webkit-animation-delay: .1s;-moz-animation-delay: .1s;-webkit-animation-direction: alternate;} .doi{-webkit-animation-delay: .2s; -moz-animation-delay: .2s;-webkit-animation-direction: alternate;} .tre{-webkit-animation-delay: .2s; -moz-animation-delay: .2s;-webkit-animation-direction: alternate;} @-webkit-keyframes mouse-scroll {0%{ opacity: 0;}50%{ opacity: .5;}100% { opacity: 1;}} @-moz-keyframes mouse-scroll {0%{ opacity: 0 }50%{ opacity: .5 }100% { opacity: 1 }} @-o-keyframes mouse-scroll {0%{ opacity: 0 }50%{ opacity: .5 }100% { opacity: 1 }} @keyframes mouse-scroll {0%{ opacity: 0 }50%{ opacity: .5 }100% { opacity: 1 }} a, .comoboton{-moz-transition:all 0.5s ease-in-out;-webkit-transition:all 0.5s ease-in-out;transition:all 0.5s ease-in-out;} /*menumobil*/ .menumobil {display: none;cursor: pointer; padding: 0; transition: opacity 0.5s ease-in-out; transition: background 0.1s ease-in-out; } .menumobil > .bar1, .menumobil > .bar2 , .menumobil > .bar3 {width: 25px;height: 2px;background-color: #FFF;margin: 0px 0px 6px 0px;transition: 0.4s;} header.actiu .bar1, header.actiu .bar2, header.actiu .bar3{background-color: #FFF;} .change.bar1 { -webkit-transform: rotate(-45deg) translate(-4px, 8px) ;transform: rotate(-45deg) translate(-4px, 8px) ;} .change.bar2 {opacity: 0!important;} .change.bar3 { -webkit-transform: rotate(45deg) translate(-3px, -8px) ;transform: rotate(45deg) translate(-3px, -8px) ;} /*menumobil*/ /*cycle*/ .cycle-slideshow{height: 100vh; width: 100%;position: relative;overflow: hidden;} .cycle-slide {-webkit-background-size: cover;-moz-background-size: cover; -o-background-size: cover; background-size: cover;height: 100%;width: 100%; position: relative;} .cycle-slide > div{position: absolute; display: inline-flex!important; justify-content: center; align-items: center; top: 0; z-index: 800; left: 0; width: 100%; height: 100%; text-align: center; background-color: rgba(0,0,0,0.3)} .cycle-slide .info h2{font-size: 80px!important; font-weight: bold;color: rgba(242,203,5,1); text-transform: uppercase; margin-bottom: 40px} .cycle-slide a{background-color: rgba(242,203,5,1); border: 1px solid rgba(242,203,5,1); padding: 15px 40px 15px 40px; color: white; font-size: 18px} .cycle-slide a:hover{opacity: 1; background-color: white; color: black} .cycle-slideshow .infoslide{position: absolute; bottom: 100px; left: 80px; max-width: 50%;} .cycle-pager {display: block;margin: 0 auto;text-align: center; z-index: 1000; position: relative;margin-top: -40px; width: 100%} .cycle-pager a{display:inline-block;width:15px;height:15px;margin-left:10px;margin-right:10px;background:url(img/noactiva.png) no-repeat;text-indent: -3333px; background-size: cover} .cycle-pager a:last-child{margin-right:0;} .cycle-pager a:first-child{margin-left:0;} a.cycle-pager-active, .cycle-pager a:hover{display:inline-block;width:15px;height:15px;margin-left:10px;margin-right:10px;background:url(img/activa.png) no-repeat;text-indent: -3333px; background-size: cover} .slick-next:before{content: ''!important; background: url(img/right.svg) center center no-repeat; background-size: cover; width: 15px; height: 25px;display: block} .slick-prev:before{content: ''!important; background: url(img/left.svg) center center no-repeat; background-size: cover; width: 15px; height: 25px;display: block} .slick-disabled{opacity: 0!important} /*wpml*/ .otgs-development-site-front-end{display: none!important} .menu-item-type-wpml_ls_menu_item ul{display: none;position: absolute; top: 17px; padding-top: 18px;width: 170px;} .menu-item-type-wpml_ls_menu_item ul li{display: inline-block; padding-right: 20px} .menu-item-type-wpml_ls_menu_item:hover > ul{display: block} .wpml-ls-statics-footer{display: none!important} /*CF7*/ .wpcf7{width: 300px; margin-left: 50px;} .wpcf7 input, .wpcf7 select{padding: 5px; box-sizing: border-box; width: 100%; padding: 0px 8px 4px 0px; line-height: 1.2em; margin-bottom: 10px;font-family: "Roboto", sans-serif; border: 0px solid white; background-color: rgba(0,0,0,0); font-size: 16px;} .wpcf7 textarea{width: 100%; padding: 8px; line-height: 1.2em;font-family: "Roboto", sans-serif; border: 0px solid white; background-color: rgba(0,0,0,0); font-size: 16px} .wpcf7 input[type="checkbox"]{width: 30px!important; font-family: "Roboto", sans-serif;} .wpcf7-list-item{margin-left: 0px!important;} .form1 input, .form1 select, .form1 textarea{color: rgba(23,55,104,1)!important; border-bottom: 1px solid rgba(23,55,104,0.7)!important;} .form1 .wpcf7-list-item-label{color: rgba(23,55,104,1)!important;} .form1 input::placeholder{color: rgba(23,55,104,0.5)!important;} .form1 .wpcf7-submit{cursor: pointer; margin-top: 10px; font-family: "Roboto", sans-serif; text-transform: uppercase; font-size: 16px; color: rgba(23,55,104,1)!important; background-color: rgba(151,131,107,0); border: 1px solid rgba(23,55,104,1)!important; -moz-transition:all 0.5s ease-in-out;-webkit-transition:all 0.5s ease-in-out;transition:all 0.5s ease-in-out; width: 200px;border-radius: 30px; padding: 7px 0px 7px 0px;} .form1 .wpcf7-submit:hover{background-color: rgba(23,55,104,1); color: rgba(255,255,255,1)!important} .form2 input, .form2 select, .form2 textarea{color: rgba(65,43,113,1)!important; border-bottom: 1px solid rgba(65,43,113,0.7)!important;} .form2 .wpcf7-list-item-label{color: rgba(65,43,113,1)!important;} .form2 input::placeholder{color: rgba(65,43,113,0.5)!important;} .form2 .wpcf7-submit{cursor: pointer; margin-top: 10px; font-family: "Roboto", sans-serif; text-transform: uppercase; font-size: 16px; color: rgba(65,43,113,1)!important; background-color: rgba(151,131,107,0); border: 1px solid rgba(23,55,104,1)!important; -moz-transition:all 0.5s ease-in-out;-webkit-transition:all 0.5s ease-in-out;transition:all 0.5s ease-in-out; width: 200px;border-radius: 30px; padding: 7px 0px 7px 0px;} .form2 .wpcf7-submit:hover{background-color: rgba(65,43,113,1); color: rgba(255,255,255,1)!important} .wpcf7-not-valid-tip{position: absolute;top: 10px;right: 0;} /*gutenslider*/ .wp-block-eedee-block-gutenslider.arrow-position-sides .eedee-gutenslider-prev{left: -10%!important;} .wp-block-eedee-block-gutenslider.arrow-position-sides .eedee-gutenslider-next{left: 110%!important;} /*Qtranslate*/ .qtranxs-lang-menu{margin-left: 40px!important;} .qtranxs-lang-menu > a{display: none!important} .qtranxs-lang-menu li{display: inline-block; margin-left: 10px;margin-left: 5px!important;} .qtranxs-lang-menu li:after{margin-left: 10px!important;} .qtranxs-lang-menu li a{font-size: 15px !important;color: rgba(142, 135, 130, 1);text-transform: uppercase;} @media screen and (max-width : 1900px) and (min-width : 1601px) { } @media screen and (max-width : 1600px) and (min-width : 1301px) { } @media screen and (max-width : 1300px) and (min-width : 1024px) { } @media screen and (max-width : 1023px) and (min-width : 782px) { } @media screen and (max-width : 781px) { } /* ============================================= SENDA — TEMA CUSTOM v4 urbsdc.com ============================================= */ :root { --copper: #a5a888; --teal: #c8d4b8; --dark: #1a1a18; --light: #f7f5f0; --font: 'Avenir Next', 'Avenir', 'Nunito', sans-serif; } h1,h2,h3,h4,h5,h6,p,a,li,div,span,em,strong { font-family: var(--font); } /* ---- SCROLL REVEAL ---- */ .reveal { opacity:0; transform:translateY(40px); transition:opacity .85s cubic-bezier(.22,.68,0,1.2), transform .85s cubic-bezier(.22,.68,0,1.2); transition-delay:var(--delay,0s); } .reveal.reveal-left { transform:translateX(-50px); } .reveal.reveal-right { transform:translateX(50px); } .reveal.reveal-up { transform:translateY(50px); } .reveal.visible { opacity:1; transform:translate(0,0); } /* ---- ARROW — efecto brújula ---- */ /* Hero arrow: idle wobble */ .hero-arrow { display:block; width:100%; height:100%; filter: drop-shadow(0 3px 10px rgba(0,0,0,0.25)); } /* Card arrows */ .senda-arrow { display:block; width:100%; height:100%; transform-origin: 68% 62%; transition: transform .6s cubic-bezier(.34,1.56,.64,1), filter .4s ease; } /* ---- HEADER ---- */ #senda-header { position:fixed; top:0; left:0; width:100%; z-index:9000; padding:20px 56px; background:transparent; transition:background .5s ease, padding .4s ease; } #senda-header.scrolled { background:rgba(26,26,24,0.94); backdrop-filter:blur(10px); padding:13px 56px; } .header-inner { display:flex; align-items:center; justify-content:space-between; gap:40px; } .header-logo { text-decoration:none; line-height:0; display:block; } .logo-svg { height:38px; width:auto; display:block; } .header-nav { display:flex; gap:32px; align-items:center; } .header-nav a { font-size:11.5px; letter-spacing:1.5px; color:rgba(255,255,255,0.72); text-decoration:none; text-transform:uppercase; font-weight:600; position:relative; padding-bottom:3px; transition:color .3s; } .header-nav a::after { content:''; position:absolute; bottom:0; left:0; width:0; height:1px; background:var(--copper); transition:width .35s ease; } .header-nav a:hover { color:white; } .header-nav a:hover::after { width:100%; } .header-contact a { opacity:.55; transition:opacity .3s; line-height: 0;} .header-contact a:hover { opacity:1; } /* ---- HERO ---- */ .senda-hero { position:relative; width:100%; height:100vh; min-height:640px; background-image:url('https://images.unsplash.com/photo-1464822759023-fed622ff2c3b?w=1800&q=80&auto=format&fit=crop'); background-size:cover; background-position:center; filter:grayscale(75%); display:flex; align-items:center; justify-content:center; } .hero-overlay { position:absolute; inset:0; background:linear-gradient(160deg, rgba(0,0,0,0.1) 0%, rgba(0,0,0,0.62) 100%); } .hero-content { position:relative; z-index:2; text-align:center; display:flex; flex-direction:column; align-items:center; gap:28px; padding:0 40px; } .hero-arrow-wrap { width:72px; height:94px; cursor:pointer; /*animation: hero-enter 1.1s cubic-bezier(.22,.68,0,1.2) both;*/ } @keyframes hero-enter { 0% { opacity:0; transform:translateY(-30px) scale(.75); } 100% { opacity:1; transform:translateY(0) scale(1); } } .hero-text-wrap { display:flex; flex-direction:column; align-items:center; gap:12px; } .hero-title { font-size:clamp(52px,7.5vw,88px); font-weight:700; color:white; letter-spacing:-1px; line-height:1; margin:0; display:flex; flex-direction:column; align-items:center; gap:4px; } .hero-word { display:block; overflow:hidden; animation: word-rise 1s cubic-bezier(.22,.68,0,1.2) both; animation-delay: calc(0.45s + var(--wi) * 0.2s); } @keyframes word-rise { 0% { opacity:0; transform:translateY(55px) skewY(3deg); } 100% { opacity:1; transform:translateY(0) skewY(0deg); } } .hero-sub { font-size:13px; letter-spacing:2.5px; text-transform:uppercase; color:rgba(255,255,255,0.55); font-weight:400; margin:0; animation: fade-in-up 1s ease both; animation-delay:.9s; } @keyframes fade-in-up { 0% { opacity:0; transform:translateY(16px); } 100% { opacity:1; transform:translateY(0); } } .hero-scroll { position:absolute; bottom:44px; left:50%; transform:translateX(-50%); z-index:2; } /* ---- SECTION LABEL ---- */ .section-label { display:inline-block; font-size:16px; text-transform:uppercase; color:var(--copper); font-weight:400; margin-bottom:40px; line-height:1; } /* ---- PHILOSOPHY ---- */ .senda-philosophy { display:flex; width:100%; gap: 0em!important; } .philosophy-text { width:45%; padding:110px 70px 110px 80px; background:white; display:flex; flex-direction:column; justify-content:center; } .senda-philosophy h2 { font-size:clamp(34px,3.2vw,50px); font-weight:300; color:var(--dark); line-height:1.15; margin-bottom:28px; letter-spacing:-.3px; } .senda-philosophy h2 em { font-style:italic; font-weight:300; color:var(--copper); display:block; line-height: 1em; } .senda-philosophy h2 strong { font-weight:700; display:block; font-size:1.1em; color:var(--dark); } .philosophy-text p { font-size:15px; line-height:1.85; color:#555; margin-bottom:18px; } .philosophy-text .senda-btn { margin-top:18px; align-self:flex-start; } .philosophy-image { width:55%; overflow:hidden; } .philosophy-image img { width:100%; height:100%; object-fit:cover; display:block; transition:transform 8s ease; } .philosophy-image:hover img { transform:scale(1.04); } /* ---- AREAS ---- */ .senda-areas { display:flex; width:100%; align-items:stretch; margin:0; } .area-card { flex:1; position:relative; overflow:hidden; cursor:pointer; display:flex; flex-direction:column; } .area-card:nth-child(1) { background:#8B4A16; } .area-card:nth-child(2) { background:var(--copper); } .area-card:nth-child(3) { background:#A05A20; } .area-card::before { content:''; position:absolute; inset:0; background:rgba(0,0,0,0); transition:background .4s; } .area-card:hover::before { background:rgba(0,0,0,0.07); } .area-card:hover { } .area-card-inner { padding:64px 50px; flex:1; display:flex; flex-direction:column; justify-content:space-between; position:relative; z-index:1; } .area-card-inner h3 { font-size:20px; font-weight:700; color:white; letter-spacing:1.5px; line-height:1.35; text-transform:uppercase; margin-bottom:16px; } .area-card-inner p { font-size:14px; line-height:1.8; color:rgba(255,255,255,0.75); flex-grow:1; margin-bottom:0; opacity:0; transition:opacity .4s ease; } .area-card:hover .area-card-inner p { opacity:1; } .area-card-inner h5 { color:white; margin-top:10px; font-size:14px; font-weight:700; letter-spacing:.5px; } .area-arrow-wrap { width:36px; height:46px; margin-top:44px; } /* ---- FILOSOFIA ---- */ .senda-filosofia-section { background:var(--light); padding:130px 80px; } .filosofia-inner { max-width:820px; margin:0 auto; display:flex; flex-direction:column; align-items:center; gap:20px; text-align:center; } .filosofia-inner h2 { font-size:clamp(42px,4.5vw,64px); font-weight:700; line-height:1.08; color:var(--dark); letter-spacing:-1px; margin:0; } .filosofia-big { font-size:clamp(26px,2.8vw,40px); font-weight:300; color:var(--copper); font-style:italic; letter-spacing:-.3px; margin:0!important; } .filosofia-inner p { font-size:16px; line-height:1.85; color:#666; max-width:640px; margin-bottom:0; } /* ---- BOTÓN ---- */ .senda-btn { display:inline-block; margin-top:32px; color:var(--copper); font-size:11px; letter-spacing:2.5px; text-transform:uppercase; font-weight:600; text-decoration:none; transition:color .35s ease; position:relative; overflow:hidden; z-index:0; } .senda-btn::before { content:''; position:absolute; inset:0; background:var(--copper); transform:scaleX(0); transform-origin:left; transition:transform .35s ease; z-index:-1; } /* ---- INSIGHTS ---- */ .senda-insights { background:white; padding:110px 80px; } .insights-header { margin-bottom:70px; } .insights-header h2 { font-size:clamp(32px,3.2vw,48px); font-weight:700; color:var(--dark); line-height:1.12; letter-spacing:-.3px; margin-top:8px; } .insights-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:56px; } .insight-card { border-top:2px solid var(--teal); padding-top:32px; display:flex; flex-direction:column; gap:14px; transition:transform .35s ease; } .insight-card:hover { transform:translateY(-7px); } .insight-cat { font-size:10px; letter-spacing:3px; text-transform:uppercase; color:var(--copper); font-weight:600; } .insight-card h4 { font-size:19px; font-weight:700; color:var(--dark); line-height:1.35; } .insight-card p { font-size:14px; line-height:1.8; color:#777; flex-grow:1; margin-bottom:0; } .insight-card a { font-size:12px; color:var(--copper); text-decoration:none; font-weight:600; letter-spacing:1px; display:inline-flex; align-items:center; gap:6px; } /* ---- FOOTER ---- */ #senda-footer { background:var(--dark); padding:32px 20px 10px 20px; } #senda-footer .wp-block-image{margin-bottom: 0} #senda-footer .wp-block-columns { display:flex; align-items:center; justify-content:space-between; margin-bottom: 0; } #senda-footer .footer-logo{text-align: center;} #senda-footer .footer-legal{padding: 0px !important} #senda-footer .footer-legal li{display: inline-block;} #senda-footer .footer-legal li:after{content: "|"; margin-left: 10px; font-size:11px; color:rgba(255,255,255,0.35); text-decoration:none; margin:0 8px; transition:color .3s;} #senda-footer .footer-legal li:last-child:after{display: none;} #senda-footer .footer-legal a, #senda-footer .footer-legal span { font-size:11px; color:rgba(255,255,255,0.35); text-decoration:none; margin:0 8px; transition:color .3s; } #senda-footer .footer-legal a:hover { color:rgba(255,255,255,0.75); } #senda-footer .footer-logo-svg { height:22px; width:auto; opacity:.45; } #senda-footer .footer-copy p { font-size:11px; color:rgba(255,255,255,0.35); margin-bottom: 0; } /* ============================================= SENDA — FIXES v4 ============================================= */ /* Flecha hero — brujula buscando el norte */ .hero-arrow-wrap .hero-arrow { /* transform-origin: 68% 55%; animation: compass-seek 7s ease-in-out infinite;*/ } @keyframes compass-seek { 0% { transform: rotate(0deg); } 12% { transform: rotate(42deg); } 30% { transform: rotate(-36deg); } 50% { transform: rotate(30deg); } 68% { transform: rotate(-20deg); } 84% { transform: rotate(10deg); } 100% { transform: rotate(0deg); } } /* Botones Gutenberg — todo sobre __link */ .senda-btn .wp-block-button__link { border-radius: 20px !important; border: 1.5px solid var(--copper) !important; color: var(--copper) !important; background: transparent !important; font-size: 11px !important; letter-spacing: 2.5px !important; text-transform: uppercase !important; font-weight: 700 !important; font-family: var(--font) !important; position: relative !important; overflow: hidden !important; transition: color .35s ease !important; z-index: 0 !important; padding: 15px 52px !important; } .senda-btn .wp-block-button__link::before { content: ''; position: absolute; inset: 0; background: var(--copper); transform: scaleX(0); transform-origin: left; transition: transform .35s ease; z-index: -1; } .senda-btn .wp-block-button__link:hover { color: white !important; background: transparent !important; } .senda-btn .wp-block-button__link:hover::before { transform: scaleX(1); } .senda-btn--dark .wp-block-button__link { border-color: var(--dark) !important; color: var(--dark) !important; background: transparent !important; } .senda-btn--dark .wp-block-button__link::before { background: var(--dark) !important; } .senda-btn--dark .wp-block-button__link:hover { color: white !important; } .senda-areas.wp-block-columns, .senda-areas .wp-block-columns { gap: 0 !important; } .senda-areas > .wp-block-column { margin: 0 !important; } /* Cards — efecto expand en hover via CSS */ .senda-areas.wp-block-columns { align-items: stretch !important; } .senda-areas > .wp-block-column.area-card { flex-grow: 1; cursor: pointer; } .senda-areas > .wp-block-column.area-card p { margin-bottom: 0; } .senda-areas .area-arrow-wrap { margin-top: 44px; width: 55px; height: 60px; } .senda-areas .senda-arrow { transition: transform .65s cubic-bezier(.34,1.56,.64,1), filter .4s ease; transform-origin: 68% 55%; } /* ============================================= SENDA — BLOQUES GUTENBERG ============================================= */ /* --- HERO arrow (wp:html) --- */ .hero-arrow-wrap { width: 72px; height: 94px; margin: 0 auto 8px; cursor: pointer; } .hero-arrow-wrap .hero-arrow { display: block; width: 100%; height: 100%; /*transform-origin: 68% 55%; animation: compass-seek 7s ease-in-out infinite; filter: drop-shadow(0 4px 12px rgba(0,0,0,0.35));*/ } /* --- HERO textos --- */ .hero-title { color: #ffffff !important; font-size: clamp(54px,8vw,92px) !important; font-weight: 700 !important; letter-spacing: -1.5px !important; line-height: 1 !important; display: block !important; } .hero-sub { font-size: 17px !important; letter-spacing: 2.5px !important; text-transform: uppercase !important; color: rgba(255,255,255,0.6) !important; } /* --- PHILOSOPHY: wp:columns --- */ .senda-philosophy.wp-block-columns { gap: 0 !important; margin-bottom: 0 !important; } .senda-philosophy > .wp-block-column.philosophy-text-col { padding: 110px 70px 110px 80px !important; background: #ffffff; display: flex; flex-direction: column; justify-content: center; } .senda-philosophy > .wp-block-column.philosophy-img-col { padding: 0 !important; flex: 0 0 50% !important; max-width: 50% !important; } /* Cover dentro de la columna derecha: 100% alto */ .philosophy-cover.wp-block-cover { min-height: 100% !important; height: 100% !important; } .philosophy-cover .wp-block-cover__image-background { object-fit: cover !important; } /* Textos del bloque quienes somos */ .philosophy-h2 { font-weight: 300 !important; font-size: clamp(36px,3.5vw,54px) !important; color: var(--dark) !important; line-height: 1.15 !important; margin-bottom: 28px !important; } .philosophy-h2 em { font-style:italic; font-weight:300; color:var(--copper); display:block; line-height:1em; } .philosophy-h2 strong { font-weight:700; display:block; font-size:1.1em; color:var(--dark); } .senda-philosophy .section-label { color: var(--copper); } .senda-philosophy p { font-size:15px; line-height:1.85; color:#555; margin-bottom:18px; } /* --- AREAS: wp:html cards --- */ .senda-areas.wp-block-group { display: flex !important; flex-wrap: nowrap !important; align-items: stretch !important; gap: 0 !important; padding: 0 !important; margin: 0 !important; max-width: none !important; width: 100% !important; } /* El wrapper interno de Gutenberg también debe ser flex full-width */ .senda-areas.wp-block-group > .wp-block-group__inner-container { display: flex !important; flex-wrap: nowrap !important; width: 100% !important; gap: 0 !important; } /* wp:html wrappers: flex para que area-card se estire */ .senda-areas > .wp-block-html { flex: 1; display: flex; } .senda-areas .area-card { flex: 1; cursor: pointer; overflow: hidden; display: flex; flex-direction: column; } .senda-areas .area-card:nth-child(1) { background: #8B4A16; } .senda-areas .area-card:nth-child(2) { background: var(--copper); } .senda-areas .area-card:nth-child(3) { background: #A05A20; } .senda-areas .area-card:nth-child(4) { background: #7A3F10; } .senda-areas .area-card:hover { } .area-card-inner { padding: 64px 50px; flex: 1; display: flex; flex-direction: column; justify-content: space-between; } .area-card-inner h3 { font-size: 36px; font-weight: 700; color: white; letter-spacing: 1.5px; line-height: 1.1; text-transform: uppercase; margin-bottom: 16px; font-family: var(--font); } .area-card-inner p { font-size: 22px; line-height: 1.4; color: rgba(255,255,255,0.78); flex-grow: 1; margin-bottom: 0; opacity: 0; transition: opacity .4s ease; } .senda-areas .area-card:hover .area-card-inner p { opacity: 1; } .area-card-inner h5 { color: white; margin-top: 10px; font-size: 14px; font-weight: 700; letter-spacing: .5px; } .area-arrow-wrap { width: 36px; height: 46px; margin-top: 44px; flex-shrink: 0; } .senda-arrow { display: block; width: 100%; height: 100%; transform-origin: 68% 55%; transition: transform .65s cubic-bezier(.34,1.56,.64,1), filter .4s ease; } /* --- FILOSOFIA: wp:group anidado --- */ .senda-filosofia-section.wp-block-group { background: var(--light) !important; padding: 130px 0 !important; } .senda-filosofia-section > .wp-block-group__inner-container { padding: 0 !important; } .filosofia-inner.wp-block-group { max-width: 820px !important; margin: 0 auto !important; text-align: center !important; padding: 0 40px !important; } .filosofia-h2 { font-weight: 700 !important; font-size: clamp(44px,5vw,70px) !important; letter-spacing: -1.5px !important; color: var(--dark) !important; line-height: 1.08 !important; margin-bottom: 20px !important; } .filosofia-big { font-size: clamp(22px,2.5vw,34px) !important; font-weight: 300 !important; color: var(--copper) !important; font-style: italic !important; letter-spacing: -.3px !important; margin-bottom: 28px !important; } .senda-filosofia-section p:not(.section-label):not(.filosofia-big) { font-size: 16px; line-height: 1.85; color: #666; max-width: 640px; margin: 0 auto 16px; } /* --- INSIGHTS --- */ .senda-insights.wp-block-group { background: #ffffff !important; padding: 110px 80px !important; } .insights-h2 { font-weight: 700 !important; font-size: clamp(34px,3.5vw,52px) !important; letter-spacing: -0.5px !important; color: var(--dark) !important; line-height: 1.12 !important; margin-top: 8px !important; } .insights-grid.wp-block-columns { gap: 40px !important; padding-top: 40px; } .insight-card.wp-block-column { border-top: 2px solid var(--teal); padding-top: 32px !important; } .insight-cat { font-size:10px; letter-spacing:3px; text-transform:uppercase; color:var(--copper); font-weight:600; margin-bottom:12px; } .insight-h4 { font-size:19px !important; font-weight:700 !important; color:var(--dark) !important; line-height:1.35 !important; margin-bottom:12px !important; } .insight-card p { font-size:14px; line-height:1.4; color:#777; margin-bottom:16px; } .insight-readmore a { color:var(--copper) !important; font-weight:700 !important; text-decoration:none !important; font-size:13px !important; } /* ============================================= SENDA — PÁGINAS INTERIORES ============================================= */ /* PAGE HERO */ .page-hero.wp-block-cover { position: relative; } .page-hero-inner { padding: 0 20px; } .page-hero-title { color: #ffffff !important; font-size: clamp(38px,6vw,72px) !important; font-weight: 700 !important; letter-spacing: -1px !important; line-height: 1.05 !important; margin-bottom: 20px !important; } .page-hero-sub { color: rgba(255,255,255,0.7) !important; font-size: clamp(14px,1.5vw,18px) !important; max-width: 600px !important; line-height: 1.65 !important; margin: 0 !important; } .page-hero .section-label { color: var(--copper); margin-bottom: 16px; display: block; } /* INNER SECTIONS */ .inner-section { padding: 100px 80px !important; } .bg-light { background: var(--light) !important; } .bg-dark { background: var(--dark) !important; } /* COLUMNS LAYOUT: heading left / body right */ .section-cols.wp-block-columns { gap: 80px !important; align-items: flex-start; } .col-heading.wp-block-column { flex: 0 0 38% !important; max-width: 38% !important; } .col-body.wp-block-column { flex: 1 !important; } .section-h2 { font-size: clamp(26px,3vw,42px) !important; font-weight: 700 !important; color: var(--dark) !important; line-height: 1.15 !important; letter-spacing: -.3px !important; } .col-body p { font-size: 15px; line-height: 1.85; color: #555; margin-bottom: 18px; } /* QUÉ NOS DIFERENCIA */ .diferencia-cols.wp-block-columns { gap: 50px !important; margin-top: 60px; } .diferencia-num { font-size: 11px; letter-spacing: 3px; color: var(--copper); font-weight: 700; text-transform: uppercase; margin-bottom: 16px; } .diferencia-title { font-size: 18px !important; font-weight: 700 !important; color: var(--dark) !important; margin-bottom: 14px !important; } .diferencia-item p { font-size: 14px; line-height: 1.4; color: #666; } /* PROCESO STEPS */ .proceso-steps { display: flex; flex-direction: column; gap: 36px; } .proceso-step { display: flex; gap: 24px; align-items: flex-start; padding-bottom: 36px; border-bottom: 1px solid rgba(0,0,0,0.08); } .proceso-step:last-child { border-bottom: none; padding-bottom: 0; } .paso-num { font-size: 11px; font-weight: 700; color: var(--copper); letter-spacing: 2px; flex-shrink: 0; padding-top: 3px; width: 24px; font-family: var(--font); } .proceso-step strong { display: block; font-size: 16px; font-weight: 700; color: var(--dark); margin-bottom: 8px; line-height: 1.3; font-family: var(--font); } .proceso-step p { font-size: 14px; line-height: 1.4; color: #666; margin: 0; } /* CTA SECTION */ .section-cta.bg-dark { padding: 0 !important; } .cta-inner { padding: 100px 40px !important; text-align: center; } .cta-title { color: #ffffff !important; font-size: clamp(26px,3vw,44px) !important; font-weight: 700 !important; letter-spacing: -.3px !important; margin-bottom: 20px !important; line-height: 1.2 !important; } .cta-sub { color: rgba(255,255,255,0.6) !important; font-size: 16px !important; margin-bottom: 36px !important; } .senda-btn--light .wp-block-button__link { border: 1.5px solid rgba(255,255,255,0.6) !important; color: #ffffff !important; background: transparent !important; } .senda-btn--light .wp-block-button__link:hover { background: rgba(255,255,255,0.12) !important; border-color: #ffffff !important; color: #ffffff !important; } .senda-btn--light .wp-block-button__link::before { background: rgba(255,255,255,0.12) !important; } /* SERVICIOS (áreas interior) */ .servicios-cols.wp-block-columns { gap: 50px !important; margin-top: 70px; border-top: 1px solid rgba(0,0,0,0.08); padding-top: 60px; } .servicio-icon { font-size: 10px; color: var(--copper); margin-bottom: 16px; letter-spacing: 2px; } .servicio-title { font-size: 16px !important; font-weight: 700 !important; color: var(--dark) !important; margin-bottom: 12px !important; } .servicio-item p { font-size: 14px; line-height: 1.4; color: #666; } /* AREAS PAGE cards label + link */ .area-card-label { font-size: 10px; letter-spacing: 3px; color: rgba(255,255,255,0.5); text-transform: uppercase; font-weight: 600; margin-bottom: 16px; font-family: var(--font); } .area-card-link { position: absolute; inset: 0; z-index: 10; text-indent: -9999px; } /* FILOSOFIA PRINCIPIOS */ .filosofia-principios .inner-section { padding: 100px 80px !important; } .principios-cols.wp-block-columns { gap: 50px !important; margin-bottom: 40px; } .principio-num { font-size: 28px; font-weight: 300; color: var(--copper); margin-bottom: 16px; letter-spacing: -1px; font-family: var(--font); } .principio-title { font-size: 17px !important; font-weight: 700 !important; color: var(--dark) !important; margin-bottom: 12px !important; } .principio-item p { font-size: 14px; line-height: 1.4; color: #666; } /* INSIGHTS PAGE */ .insights-page.wp-block-group { padding: 80px !important; } .insights-page .insights-grid { margin-bottom: 60px; } /* CONTACTO */ .contacto-section .inner-section { padding: 100px 80px !important; } .contacto-cols.wp-block-columns { gap: 80px !important; align-items: flex-start; } .contacto-datos { margin-top: 48px; display: flex; flex-direction: column; gap: 28px; } .contacto-dato strong { display: block; font-size: 10px; letter-spacing: 2.5px; text-transform: uppercase; color: var(--copper); font-weight: 700; margin-bottom: 6px; font-family: var(--font); } .contacto-dato a, .contacto-dato p { font-size: 15px; color: var(--dark); text-decoration: none; margin: 0; line-height: 1.5; } .contacto-dato a:hover { color: var(--copper); } /* FORMULARIO */ .contacto-form { display: flex; flex-direction: column; gap: 24px; } .form-group { display: flex; flex-direction: column; gap: 8px; } .form-group label { font-size: 11px; letter-spacing: 1.5px; text-transform: uppercase; font-weight: 600; color: var(--dark); font-family: var(--font); } .form-group input, .form-group textarea { border: none; border-bottom: 1.5px solid rgba(0,0,0,0.15); padding: 10px 0; font-size: 15px; font-family: var(--font); background: transparent; color: var(--dark); outline: none; transition: border-color .3s; } .form-group input:focus, .form-group textarea:focus { border-color: var(--copper); } .form-group input::placeholder, .form-group textarea::placeholder { color: rgba(0,0,0,0.3); } .form-group textarea { resize: vertical; min-height: 120px; } .form-check { flex-direction: row !important; align-items: flex-start; gap: 12px !important; } .form-check input[type="checkbox"] { margin-top: 3px; flex-shrink: 0; width: 16px; height: 16px; accent-color: var(--copper); } .form-check label { font-size: 13px !important; letter-spacing: 0 !important; text-transform: none !important; font-weight: 400 !important; color: #666; line-height: 1.5; } .form-check label a { color: var(--copper); text-decoration: underline; } .form-submit { align-self: flex-start; cursor: pointer; border: 1.5px solid var(--copper); background: transparent; color: var(--copper); font-size: 11px; letter-spacing: 2.5px; text-transform: uppercase; font-weight: 700; font-family: var(--font); padding: 15px 52px; position: relative; overflow: hidden; transition: color .35s ease; z-index: 0; } .form-submit::before { content: ; position: absolute; inset: 0; background: var(--copper); transform: scaleX(0); transform-origin: left; transition: transform .35s ease; z-index: -1; } .form-submit:hover { color: white; } .form-submit:hover::before { transform: scaleX(1); } /* ============================================= SENDA — BLOQUES NATIVOS (sin wp:html) ============================================= */ /* Inner section — contenedor de secciones interiores */ .inner-seccion.wp-block-group { padding: 100px 80px !important; } .inner-seccion.bg-light { background: var(--light) !important; } /* Proceso steps — wp:group anidados */ .proceso-step.wp-block-group { display: flex !important; flex-direction: row !important; gap: 24px !important; align-items: flex-start !important; padding-bottom: 36px !important; border-bottom: 1px solid rgba(0,0,0,0.08) !important; margin-bottom: 0 !important; } .proceso-step--last.wp-block-group { border-bottom: none !important; padding-bottom: 0 !important; } .paso-num { font-size: 11px !important; font-weight: 700 !important; color: var(--copper) !important; letter-spacing: 2px !important; flex-shrink: 0 !important; width: 24px !important; padding-top: 2px !important; margin: 0 !important; } .paso-content.wp-block-group { flex: 1 !important; } .paso-title { font-size: 16px !important; font-weight: 700 !important; color: var(--dark) !important; margin-bottom: 8px !important; line-height: 1.3 !important; } .paso-content p { font-size: 14px; line-height: 1.4; color: #666; margin: 0; } /* Datos de contacto */ .contacto-datos.wp-block-group { margin-top: 48px !important; display: flex !important; flex-direction: column !important; gap: 28px !important; } .contacto-dato.wp-block-group { gap: 4px !important; } .dato-label { font-size: 10px !important; letter-spacing: 2.5px !important; text-transform: uppercase !important; color: var(--copper) !important; font-weight: 700 !important; margin: 0 !important; } .dato-valor { font-size: 15px !important; color: var(--dark) !important; margin: 0 !important; } .dato-valor a { color: var(--dark) !important; text-decoration: none !important; } .dato-valor a:hover { color: var(--copper) !important; } /* CF7 — estilos del formulario de contacto */ .contacto-form-col .wpcf7 { width: 100% !important; margin: 0 !important; } .contacto-form-col .wpcf7 .wpcf7-form { display: flex; flex-direction: column; gap: 28px; } .contacto-form-col .wpcf7 input[type="text"], .contacto-form-col .wpcf7 input[type="email"], .contacto-form-col .wpcf7 input[type="tel"], .contacto-form-col .wpcf7 textarea { width: 100% !important; border: none !important; border-bottom: 1.5px solid rgba(0,0,0,0.15) !important; padding: 10px 0 !important; font-size: 15px !important; font-family: var(--font) !important; background: transparent !important; color: var(--dark) !important; outline: none !important; border-radius: 0 !important; box-shadow: none !important; transition: border-color .3s !important; line-height: 1.5 !important; } .contacto-form-col .wpcf7 input:focus, .contacto-form-col .wpcf7 textarea:focus { border-bottom-color: var(--copper) !important; } .contacto-form-col .wpcf7 input::placeholder, .contacto-form-col .wpcf7 textarea::placeholder { color: rgba(0,0,0,0.3) !important; } .contacto-form-col .wpcf7 textarea { resize: vertical !important; min-height: 130px !important; } .contacto-form-col .wpcf7 .wpcf7-acceptance { font-size: 13px; color: #666; line-height: 1.6; } .contacto-form-col .wpcf7 .wpcf7-acceptance a { color: var(--copper); text-decoration: underline; } .contacto-form-col .wpcf7 .wpcf7-submit { cursor: pointer !important; border: 1.5px solid var(--copper) !important; background: transparent !important; color: var(--copper) !important; font-size: 11px !important; letter-spacing: 2.5px !important; text-transform: uppercase !important; font-weight: 700 !important; font-family: var(--font) !important; padding: 15px 52px !important; position: relative !important; overflow: hidden !important; transition: color .35s ease !important; z-index: 0 !important; border-radius: 20px !important; width: auto !important; display: inline-block !important; margin-top: 20px; } .contacto-form-col .wpcf7 .wpcf7-submit:hover { color: white !important; background: var(--copper) !important; } /* ============================================= SENDA — MENÚ NAVEGACIÓN (wp_nav_menu) ============================================= */ .header-nav .header-nav-list { display: flex; gap: 32px; align-items: center; list-style: none; margin: 0; padding: 0; } .header-nav .header-nav-list > li { position: relative; } .header-nav .header-nav-list a { font-size: 11.5px; letter-spacing: 1.5px; color: rgba(255,255,255,0.72); text-decoration: none; text-transform: uppercase; font-weight: 600; position: relative; padding-bottom: 3px; transition: color .3s; white-space: nowrap; } .header-nav .header-nav-list a::after { content: ; position: absolute; bottom: 0; left: 0; width: 0; height: 1px; background: var(--copper); transition: width .35s ease; } .header-nav .header-nav-list a:hover { color: white; } .header-nav .header-nav-list a:hover::after { width: 100%; } /* Submenú */ .header-nav .header-nav-list .sub-menu { display: none; position: absolute; top: calc(100% + 18px); left: 0; background: rgba(26,26,24,0.97); backdrop-filter: blur(10px); min-width: 240px; padding: 12px 0; list-style: none; z-index: 9999; border-top: 2px solid var(--copper); } .header-nav .header-nav-list li:hover > .sub-menu { display: block; } .header-nav .header-nav-list .sub-menu a { display: block; padding: 10px 24px; font-size: 11px; letter-spacing: 1.2px; color: rgba(255,255,255,0.6); text-transform: uppercase; font-weight: 600; white-space: nowrap; } .header-nav .header-nav-list .sub-menu a::after { display: none; } .header-nav .header-nav-list .sub-menu a:hover { color: white; background: rgba(255,255,255,0.05); } /* Current page highlight */ .header-nav .current-menu-item > a, .header-nav .current-menu-ancestor > a { color: white !important; border-bottom: 1px solid white; } .header-nav .current-menu-item > a::after, .header-nav .current-menu-ancestor > a::after { width: 100% !important; } /* ============================================= SENDA — NAV FIX (sobreescribe reglas antiguas) ============================================= */ /* El nav ahora contiene un