/* ===================================
    Crafto - Digital agency
====================================== */
/* font */
@import url("https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&family=Roboto:ital,wght@0,100..900;1,100..900&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Inter:wght@200;300;400;500;600;700;800;900&display=swap");
:root {
  --alt-font: "Lato", sans-serif;
  --primary-font: "Roboto", sans-serif;
}
/* variable */
:root {     
    --base-color: #f7d2ca;
    --medium-gray:#727272;
    --dark-gray:#2d2c2b; 
    --nero-gray:#1e1d1d;  
    --light-red: #c8b2ab;
    --alt-font: 'Lato', sans-serif;
    --primary-font: 'Roboto', sans-serif;
}
/* custom cursor */
@media (hover: hover) and (pointer: fine) {
  .custom-cursor .circle-cursor {
    position: fixed;
    left: 0;
    top: 0;
    pointer-events: none;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    visibility: hidden;
    opacity: 0;
    transition: opacity 0.65s cubic-bezier(0.23, 1, 0.32, 1);
  }
  .custom-cursor .circle-cursor-inner {
    margin-left: -3px;
    margin-top: -3px;
    width: 6px;
    height: 6px;
    z-index: 10000001;
    background-color: var(--base-color);
  }
  .custom-cursor .circle-cursor-inner.cursor-link-hover {
    margin-left: -10px;
    margin-top: -10px;
    width: 20px;
    height: 20px;
    background-color: var(--base-color);
    opacity: 0.8;
  }
  .custom-cursor .circle-cursor-outer {
    margin-left: -15px;
    margin-top: -15px;
    width: 30px;
    height: 30px;
    border: 1px solid var(--base-color);
    z-index: 10000000;
    opacity: 0.8;
    -webkit-transition: 0.1s;
    transition: 0.1s;
  }
  .custom-cursor .cursor-link.circle-cursor-inner .cursor-link-hover {
    opacity: 1;
  }
}
.is-touchable .cursor-page-inner {
  display: none !important;
}
body {
    font-size: 14px;
    line-height: 18px;
	font-weight: 200;
  color: var(--black);
  word-break: break-word;
}
/* bg gradient color */
.bg-gradient-top-very-light-gray { 
    background-image:linear-gradient(to right, #fbf3e9, #f9f4eb, #f4f4f0, #f2f4f2, #eff4f4);
}
.bg-linen {
    background: #f6f4f3;
}
.bg-gradient-orange-transparent {
    background: linear-gradient(to right, rgba(233, 117, 34, 1.0) 10%, rgba(255, 255, 255, 0.0) 95%);
}
.bg-gradient-blue-transparent {
    background: linear-gradient(to right, rgba(30, 163, 177, 1.0) 10%, rgba(255, 255, 255, 0.0) 95%);
}
/* text gradient color */
.text-gradient-base-color {
    background-image: linear-gradient(to right, #e97522 0%, #1ea3b1 100%); 
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
/* header */
header .container-fluid {
    padding-left: 65px;
    padding-right: 65px;
}
.navbar .navbar-nav .nav-link {
  font-weight: 400;
  font-size: .8em;
  letter-spacing: 1px;
}
header .navbar-brand {
    padding: 35px 0;
}
header .navbar-brand img {
    max-height: 24px;
}
header .header-button .btn {
    text-transform: inherit;
    font-weight: 600;
    letter-spacing: 0;
}
header .header-button .btn.btn-switch-text > span {
    padding: 10px 24px;
}
.newsletter-style-02 input {
    padding-right: 50px !important;
    font-size: 14px;
}
/* swiper slider */ 
.banner-slider .swiper-slide .position-absolute {
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
    transition: 1.5s;
    opacity: 0;
}
.banner-slider .swiper-slide.swiper-slide-active .position-absolute {
    -webkit-transform: scale(1.0);
    transform: scale(1.0);
    opacity: 1;
}
.fs-34 {
    font-size: 2.125rem;
    line-height: 2.20rem;
}
/* bg color */
.text-outline-color-very-light {
  -webkit-text-stroke-color: var(--very-light-gray);
}	
/* bg color */
.bg-nero-gray {
    background-color: var(--nero-gray);
}
/* one half screen */
.one-half-screen {
  height: 550px !important;
	}
@media (max-width: 1199px) {
    .left-minus-45 {
        left: -78%;
    }
    .lg-ms-70px {
        margin-left: 70px;
    }
    .lg-bg-transparent {
        background-color: transparent;
    }
    .one-half-screen {
        height: auto !important;
    }
}
/* bg sliding line */ 
.bg-sliding-line { 
    background-image: linear-gradient(135deg, transparent 45%, #d1b9b2 45%, #d1b9b2 55%, transparent 0);
    background-size: 5px 5px;
}
.bg-sliding-line-dark-gray { 
    background-image: linear-gradient(135deg, transparent 45%, #464646 45%, #464646 55%, transparent 0);
    background-size: 5px 5px;
}
/* bg color */ 
.bg-base-color-transparent {
    background-color: rgba(239, 211, 203,.6);
}
.border-color-light-red {
    border-color: var(--light-red) !important; 
}
.border-color-transparent-dark-very-light {
  border-color: rgba(35, 35, 35, 0.15) !important;
}
/* highlight separator */ 
.highlight-separator[data-shadow-animation] span {
    height: 100px;
    z-index: -1;
}
.highlight-separator[data-shadow-animation] span img {
    height: 100px;
    width: auto;
}
.highlight-separator-small .highlight-separator[data-shadow-animation] span {
    height: 45px; 
    bottom: -10px;
}
.highlight-separator-small .highlight-separator[data-shadow-animation] span img {
    height: 45px; 
    width: 100%;
}
/* btn */
.btn.btn-hover-animation-switch {
    text-transform: none;
    font-family: var(--primary-font);
}
/* blog only text */
.blog-only-text .card-body:after {
    display: none;
}
/* margin */
.mb-minus-50px {
    margin-bottom: -50px;
}
/* right */
.right-minus-40 {
    right: -40%;
}
/* page title extra large */
.page-title-extra-large h1 {
    font-size: 4.8rem;
    line-height: 4.8rem;
}
.extra-very-small-screen {
    height: 180px !important;
}
/* team style */ 
.team-style-08 figure figcaption .social-icon a {
    background-color: var(--base-color);
}
.team-style-08 figure figcaption .social-icon a:hover {
    color: var(--dark-gray);
}
.team-style-08.skrollable {
    transition: none !important; 
}
/* footer */
footer .footer-logo img {
    max-height: 48px; 
}
.newsletter-style-02 .btn { 
    padding: 10px 15px 9px 15px;  
}
footer a:hover, .footer-navbar li a:hover {
    color: var(--dark-gray);
}
/* media query responsive */
@media (max-width: 1600px) {
    .fs-140 {
        font-size: 8.125rem; 
    }
}
@media (max-width: 1199px) {
    .fs-140 {
        font-size: 6.875rem;
    }
    .lh-95 {
        line-height: 4.75rem;
    }
}
@media (max-width: 991px) {
    [data-mobile-nav-style=full-screen-menu] .navbar-full-screen-menu-inner .navbar-nav > .nav-item {
        border-bottom: 0;
        text-align: center;
        padding: 0;
    }
    [data-mobile-nav-style=full-screen-menu] .navbar-full-screen-menu-inner .navbar-nav .nav-item .nav-link {
        font-size: 13px;
        line-height: 24px;
    }
     header .navbar-brand {
        padding: 22px 0;
    }
}
@media (max-width: 767px) {
    .fs-140 {
        font-size: 5rem;
    }
    .lh-95 {
        line-height: 3.75rem;
    } 
}
@media screen and (max-width: 1024px) {
[data-mobile-nav-style="modern"] .navbar-modern-inner .navbar-nav .nav-item .nav-link {
    display: inline-block;
    font-size: 13px;
    line-height: 24px;
    font-weight: 400;
    color: var(--black);
    padding: 10px 0 !important;
    text-align: right;
  }
	}
@media (max-width: 575px) {
  [data-mobile-nav-style="modern"] .navbar-modern-inner .navbar-nav > .nav-item {
    padding: 7px 0px;
    letter-spacing: 1px;
  }
}
/* instagram */
.insta-image,
  .insta-video {
    max-height: 220px;
    object-fit: cover;
    width: 100%;
border: none !important;
  border-radius: 0 !important;
  outline: none !important;
  box-shadow: none !important;
 aspect-ratio: 1 / 1; 
  object-fit: cover;
  width: 100%;
  height: auto;
  }
/* HTML video */
.html-video {
  background-color: #ffffff;
  left: 0%;
  position: absolute;
  top: 50%;
  z-index: 0;
  object-fit: cover;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}
/* text encabezado */
 .text-md-start {
text-align: left !important;
  z-index: 1;
  }
@media (min-width: 768px) {
.text-md-start {
text-align: left !important;
  z-index: 1;
}
	 }

/* =========================
   HEADER + LOGO: bloque final (añadido al final del CSS)
   ========================= */

/* Mantener header transparente y en primer plano */
#site-header, header {
  position: fixed !important;
  inset: 0 0 auto 0 !important;
  z-index: 999999 !important;
  background: transparent !important;
  background-color: transparent !important;
  isolation: auto !important;
  transform: none !important;
  -webkit-transform: none !important;
  -webkit-backface-visibility: hidden !important;
}

/* anular pseudo-fondos, glass effects y contenedores internos */
#site-header, #site-header .navbar, header, header .navbar, .header-reverse, .glass-effect .navbar-brand {
  background: transparent !important;
  background-color: transparent !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  box-shadow: none !important;
  transform: none !important;
  isolation: auto !important;
  color: #fff;
  mix-blend-mode: difference;
}
#site-header::before, #site-header::after, header::before, header::after {
  content: none !important;
  display: none !important;
}

/* logo base (restaura tamaño y control por currentColor) */
.brand-logo {
  display: block !important;
  width: 260px !important;
  max-width: 90% !important;
  height: auto !important;
  position: relative !important;
  z-index: 999999 !important;
  fill: currentColor !important;
  color: inherit !important;
  backface-visibility: hidden !important;
  will-change: transform, mix-blend-mode !important;
}
/* mobile centering */
@media (max-width:991px){
  #site-header .container-fluid{display:flex !important;align-items:center !important;justify-content:center !important;padding:.5rem 1rem !important;}
  #site-header .navbar-toggler{position:absolute !important;left:1rem !important;top:50% !important;transform:translateY(-50%) !important;}
  #site-header .navbar-brand{margin:0 auto !important;display:flex !important;align-items:center !important;justify-content:center !important;}
  .brand-logo{width:260px !important;}
}