/* ===================================
    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: -1;
  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;}
}
/* Heading */
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
  margin-bottom: 30px;
  letter-spacing: -0.5px;
  font-weight: inherit;
}
h1, .h1 {
  font-size: 1.625em;
  line-height: 1.925em;
  text-transform: uppercase;
  letter-spacing: 1px;
}
h2, .h2 {
  font-size: 1.375em;
  line-height: 1.675em;
 text-transform: uppercase;
	letter-spacing: 1px;
}
h3, .h3 {
  font-size: 1.125rem;
  line-height: 1.425rem;
  text-transform: uppercase;
	letter-spacing: 1px;
}
h4 {
  font-size: 0.937rem;
  line-height: 1.237rem;
  text-transform: uppercase;
	letter-spacing: 1px;
}
h5 {
  font-size: 0.75rem;
  line-height: 1.05rem;
  text-transform: uppercase;
	letter-spacing: 1px;
}
h6 {
  font-size: 0.60rem;
  line-height: 0.90rem;
  text-transform: uppercase;
	letter-spacing: 1px;
}
/* Font custom */
.font-style-italic {
  font-style: italic;
}
.hover-text {
  display: none;
}
b, strong {
  font-weight: 700;
}
.text-white-space-nowrap {
  white-space: nowrap;
}
.text-white-space-normal {
  white-space: normal;
}
.text-transform-none {
  text-transform: none !important;
}
.text-uppercase-inherit {
  text-transform: inherit !important;
}
.word-break-normal {
  word-break: normal;
}
.vertical-align-top {
  vertical-align: top;
}
/* Font custom */
.font-style-italic {
  font-style: italic;
}
.hover-text {
  display: none;
}
b, strong {
  font-weight: 700;
}
.text-white-space-nowrap {
  white-space: nowrap;
}
.text-white-space-normal {
  white-space: normal;
}
.text-transform-none {
  text-transform: none !important;
}
.text-uppercase-inherit {
  text-transform: inherit !important;
}
.word-break-normal {
  word-break: normal;
}
.vertical-align-top {
  vertical-align: top;
}
/* Font size */
.fs-0 {
  font-size: 0;
}
.fs-9 {
  font-size: 9px;
}
.fs-10 {
  font-size: 10px;
}
.fs-11 {
  font-size: 11px;
}
.fs-12 {
  font-size: 12px;
}
.fs-13 {
  font-size: 13px;
}
.fs-14 {
  font-size: 14px;
}
.fs-15 {
  font-size: 15px;
}
.fs-16 {
  font-size: 16px;
}
.fs-17 {
  font-size: 17px;
}
.fs-18 {
  font-size: 18px;
}
.fs-19 {
  font-size: 19px;
}
.fs-20 {
  font-size: 20px;
}
.fs-22 {
  font-size: 22px;
}
.fs-24 {
  font-size: 24px;
  line-height: 32px;
}
.fs-26 {
  font-size: 26px;
  line-height: 38px;
}
.fs-28 {
  font-size: 1.75rem;
  line-height: 2.6rem;
}
.fs-30 {
  font-size: 1.875rem;
  line-height: 2.8rem;
}
.fs-32 {
  font-size: 2rem;
  line-height: 2.5rem;
}
.fs-40 {
  font-size: 2.5rem;
  line-height: 2.5rem;
}
.fs-45 {
  font-size: 2.813rem;
  line-height: 3rem;
}
.fs-50 {
  font-size: 3.125rem;
  line-height: 3.25rem;
}
.fs-55 {
  font-size: 3.438rem;
  line-height: 3.5rem;
}
.fs-60 {
  font-size: 3.75rem;
  line-height: 3.75rem;
}
.fs-65 {
  font-size: 4.063rem;
  line-height: 4.688rem;
}
.fs-70 {
  font-size: 4.375rem;
  line-height: 4.375rem;
}
.fs-75 {
  font-size: 4.668rem;
  line-height: 4.668rem;
}
.fs-80 {
  font-size: 5rem;
  line-height: 5rem;
}
.fs-85 {
  font-size: 5.313rem;
  line-height: 5.313rem;
}
.fs-90 {
  font-size: 5.625rem;
  line-height: 5.625rem;
}
.fs-95 {
  font-size: 5.938rem;
  line-height: 5.938rem;
}
.fs-100 {
  font-size: 6.25rem;
  line-height: 6.25rem;
}
.fs-110 {
  font-size: 6.875rem;
  line-height: 6.875rem;
}
.fs-120 {
  font-size: 7.5rem;
  line-height: 7.5rem;
}
.fs-130 {
  font-size: 8.125rem;
  line-height: 8.125rem;
}
.fs-140 {
  font-size: 8.75rem;
  line-height: 8.75rem;
}
.fs-150 {
  font-size: 9.375rem;
  line-height: 9.375rem;
}
.fs-160 {
  font-size: 10rem;
  line-height: 10rem;
}
.fs-170 {
  font-size: 10.625rem;
  line-height: 10.625rem;
}
.fs-180 {
  font-size: 11.25rem;
  line-height: 11.25rem;
}
.fs-190 {
  font-size: 11.875rem;
  line-height: 11.875rem;
}
.fs-200 {
  font-size: 12.5rem;
  line-height: 12.5rem;
}
.fs-225 {
  font-size: 14.063rem;
  line-height: 14.063rem;
}
.fs-250 {
  font-size: 15.625rem;
  line-height: 15.625rem;
}
.fs-275 {
  font-size: 17.188rem;
  line-height: 17.188rem;
}
.fs-300 {
  font-size: 18.75rem;
  line-height: 18.75rem;
}
.fs-350 {
  font-size: 21.875rem;
  line-height: 21.875rem;
}
.fs-400 {
  font-size: 25rem;
  line-height: 25rem;
}
/* Line height */
.lh-0px {
  line-height: 0px;
}
.lh-10 {
  line-height: 10px;
}
.lh-11 {
  line-height: 11px;
}
.lh-12 {
  line-height: 12px;
}
.lh-13 {
  line-height: 13px;
}
.lh-14 {
  line-height: 14px;
}
.lh-15 {
  line-height: 15px;
}
.lh-16 {
  line-height: 16px;
}
.lh-18 {
  line-height: 18px;
}
.lh-19 {
  line-height: 19px;
}
.lh-20 {
  line-height: 20px;
}
.lh-22 {
  line-height: 22px;
}
.lh-24 {
  line-height: 24px;
}
.lh-26 {
  line-height: 26px;
}
.lh-28 {
  line-height: 28px;
}
.lh-30 {
  line-height: 30px;
}
.lh-32 {
  line-height: 2rem;
}
.lh-34 {
  line-height: 2.125rem;
}
.lh-36 {
  line-height: 2.25rem;
}
.lh-38 {
  line-height: 2.375rem;
}
.lh-40 {
  line-height: 2.5rem;
}
.lh-42 {
  line-height: 2.625rem;
}
.lh-44 {
  line-height: 2.75rem;
}
.lh-46 {
  line-height: 2.875rem;
}
.lh-48 {
  line-height: 3rem;
}
.lh-50 {
  line-height: 3.125rem;
}
.lh-55 {
  line-height: 3.438rem;
}
.lh-60 {
  line-height: 3.75rem;
}
.lh-65 {
  line-height: 4.063rem;
}
.lh-70 {
  line-height: 4.375rem;
}
.lh-75 {
  line-height: 4.688rem;
}
.lh-80 {
  line-height: 5rem;
}
.lh-85 {
  line-height: 5.313rem;
}
.lh-90 {
  line-height: 5.625rem;
}
.lh-95 {
  line-height: 5.938rem;
}
.lh-100 {
  line-height: 6.25rem;
}
.lh-105 {
  line-height: 6.563rem;
}
.lh-110 {
  line-height: 6.875rem;
}
.lh-115 {
  line-height: 7.188rem;
}
.lh-120 {
  line-height: 7.5rem;
}
.lh-0 {
  line-height: 0;
}
.lh-normal {
  line-height: normal;
}
.lh-initial {
  line-height: initial;
}
.lh-inherit {
  line-height: inherit;
}
/* Cookieye */
.cky-btn-revisit-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--dark-gray);
    background-color: rgb(0, 86, 167);
  width: 45px;
  height: 45px;
  border-radius: 50%;
  position: fixed;
  z-index: 999999;
  cursor: pointer;
}
.cky-btn cky-btn-reject
{
  color: #FFFFFF;
  border-color: var(--dark-gray);
  background-color: var(--dark-gray);
}
.cky-btn cky-btn-accept
{
  color: #FFFFFF;
  border-color: var(--dark-gray);
  background-color: var(--dark-gray);
}
.cky-btn cky-btn-preferences
{
  color: #FFFFFF;
  border-color: var(--dark-gray);
  background-color: var(--dark-gray);
}
.cky-show-desc-btn
{
  color: var(--dark-gray);
}
.cky-policy
{
  color: var(--dark-gray);
  border-color: transparent;
  background-color: transparent;
}
.ckySwitchanalytics
 {
  background-color: black;
}