@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,300;0,400;0,500;0,600;0,700;0,900;1,400;1,500;1,600;1,700;1,900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:wght@300');

:root{ 

    font-family: 'Roboto', sans-serif;

    /* cores padrões */
    --color-primary: #DD5928;
    --color-secondary: #000;
    --color-tertiary: #2E1834;
    --color-text: #333;
    --color-title: #000;
    --color-back: #FFF;
    --color-dark: #000;
    --color-light: #FBF9F9; /*#EFF3F5*/

    /* botões */
    --btn-back: #DD5928;
    --btn-back-hover: #E14D1C;
    --btn-color: #FFF;
    --btn-color-hover: var(--btn-color);

    /* top bar */
    --bar-back: var(--color-secondary);
    --bar-color: rgba(255,255,255,0.8);
    --bar-icon-color: var(--color-primary);
    --bar-icon-redes-color: var(--color-primary);
    --bar-icon-redes-color-hover: var(--color-primary);

    /* top */
    --top-logo-padding: 15px;
    --top-logo-padding-responsive: 10px;
    --top-logo-width-responsive: 160px;
    --top-logo-height-responsive: 60px;
    --top-back: var(--bar-back);    
    --top-nav-back: transparent;
    --top-nav-color: #FFF;    
    --top-nav-hover-back: transparent;
    --top-nav-hover-color: #FFF;
    --top-drop-back: #FFF;
    --top-drop-color: var(--color-text);
    --top-drop-hover-back: rgba(0,0,0,0.05);
    --top-drop-hover-color: var(--color-text);

    /* footer */
    --footer-back: var(--color-secondary);
    --footer-color: #FFF;
    --footer-copy-back: transparent;
    --footer-copy-color: #FFF;
    --footer-icon-color: var(--bar-icon-color);
    --footer-icon-redes-color: var(--bar-icon-redes-color);
    --footer-icon-redes-color-hover: var(--bar-icon-redes-color-hover);

    /* title */
    --title-color: var(--color-primary);
    --title-line-color: var(--color-secondary);
    --title-line-size: 150px;
    --title-post-color: var(--color-text);

    --title-internal-color: var(--title-post-color);
    --title-internal-back: var(--color-light);

}

body { font-size: 14px; font-weight: 400; letter-spacing: 0.03em; }
header .navbar-nav a { font-weight:300; font-size: 1.1em; padding: 5px 0; margin: 0 18px; letter-spacing: 0.2em; position: relative; transition: transform .1s ease-in-out; }
header .navbar-nav a::before, header .navbar-nav a::after{ content: ""; position: absolute; background-color: #FFF; transition: transform .5s; }
header .navbar-nav a::after{ left: 0; width: 100%; height: 2px; bottom: -5px; transform: scaleX(0); transform-origin: left; }
header .navbar-nav a:hover::after{ transform: scaleX(1); }

header .navbar-nav a.whats { background: var(--btn-back); padding:15px 18px; transition: .5s; font-size: 1.1em; }
header .navbar-nav a.whats:hover { background: var(--btn-back-hover); }
header .navbar-nav a.whats:hover::after{ transform: scaleX(0); }

header .navbar-brand img { max-width: var(--top-logo-width-responsive); }

.btn {font-size:0.9em;padding: 15px 40px;font-weight: 300;letter-spacing:0.2em;text-transform:uppercase;border-radius:0; transition: all .5s; }
.btn-secondary,.btn-secondary:active,.btn-secondary:visited{background:transparent;color:var(--color-primary);border:1px solid var(--color-primary);}
.btn-secondary:hover,.btn-secondary:focus{color:#FFF;background:var(--color-primary); border-color:var(--color-primary);}

.bg-primary { background: var(--color-primary) !important; }
.bg-secondary { background: var(--color-secondary) !important; }
.bg-dark { background: var(--color-dark) !important; }
.bg-tertiary { background: var(--color-tertiary) !important; }

.icon {font-family: 'Material Symbols Outlined';font-weight: normal;font-style: normal;font-size: 24px; display: inline-block;line-height: 1;text-transform: none;letter-spacing: normal;word-wrap: normal;white-space: nowrap;direction: ltr;padding: 0;margin: 0; }
.list-icon span {  display: flex; align-items: center; gap: 5px; margin: 5px 0; font-size: 0.9em; font-weight: 400; text-align: left; line-height: 1.2em; }
.list-icon span i { font-size: 30px; color: var(--color-primary); }

.text-primary { color: var(--color-primary) !important; }

.title { font-weight: 700; font-family: 'Montserrat', sans-serif;  }
.title-text { font-weight: 500;  }

h1, h2, h3, h4, h5 { font-family: 'Montserrat', sans-serif; font-weight: 700; }

.titulo h2 { font-size: 3em; letter-spacing: 0.2em; font-weight: 400; font-style: normal; font-family: 'Roboto', sans-serif; text-transform: uppercase; padding:80px 0; }

#box-welcome { font-size:1.1em; }
#box-welcome .title { font-size: 2.5em; font-weight: 400; }

.box-chamada { font-size: 1.2em; line-height: 1.7em; font-weight:300; }
.box-chamada h2 { font-size: 2.8em; line-height: 1.1em; color: var(--color-title); }
.box-chamada h3 { font-size: 2.2em; line-height: 1.1em; color: var(--color-title); }
.box-chamada h5 { font-size: 1.3em; line-height: 1.1em; color: var(--color-title); font-weight: 300; line-height: 1.4em; letter-spacing: 0.05em; font-family: 'Roboto', sans-serif; }
.box-chamada p { margin-bottom: 15px; }
.box-chamada .btn { margin-top: 20px; }
.box-chamada strong { font-weight: 700; } 
/*.box-chamada .img-fluid { border-radius: 20px; }*/
.box-chamada .fadeInLeft .w-100 { -webkit-border-top-left-radius: 30px; -webkit-border-bottom-left-radius: 30px; -moz-border-radius-topleft: 30px; -moz-border-radius-bottomleft: 30px; border-top-left-radius: 30px; border-bottom-left-radius: 30px; }
.box-chamada .fadeInRight .w-100 { -webkit-border-top-right-radius: 30px; -webkit-border-bottom-right-radius: 30px; -moz-border-radius-topright: 30px; -moz-border-radius-bottomright: 30px; border-top-right-radius: 30px; border-bottom-right-radius: 30px; }
.box-chamada .badge-primary { background: transparent; color: var(--color-primary); font-weight:300; font-size: 1.2em; border-radius: 0; padding: 0; border: 0; line-height: 1em; letter-spacing: 0.2em; text-transform: uppercase; }
.box-chamada.text-2x { font-size: 1.3em; font-weight: 400; line-height: 1.6em; }

.post-text{font-size:1.2em; font-weight: 300; }
.post-text strong, .post-text b{ font-size: 1.1em; font-weight:900}

.rounded-lg { border-radius: 30px !important; }

.slick-prev,.slick-next{ background:transparent; }

.widget-header{background:var(--color-light); color: var(--color-text); border: 1px solid rgb(221,221,221); border-bottom: 0; }

/*#reserva { position: relative; padding: 30px; background: rgba(255,255,255,1); margin-top: -250px; margin-bottom: 110px; z-index: 999; }*/
#reserva { position: relative; padding: 30px; background: var(--color-secondary); /*margin-top: -250px; margin-bottom: 110px; z-index: 999;*/ }
#reserva form { display: flex; flex-wrap: wrap; gap: 10px; padding: 0; margin: 0; }
#reserva form .form-group { flex: 1; padding: 0; margin: 0; }
#reserva form .btn { padding: 25px 0; /*padding: 24.5px 0;*/ font-size: 1.1em; /*border-radius: 0.5rem;*/ }
#reserva label { font-size: 0.75rem; font-weight: 400; display: block; color: #9DAEB7/*#B0BEC5*/; border: 1px solid #ECEFF1; padding: 0.5rem 0.75rem; margin: 0; /*border-radius: 0.5rem;*/ background: #FFF; }
#reserva input, #reserva select { font-family: 'Roboto', sans-serif; height: 35px; display: block; border: none; border-radius: 0.25rem; border: 1px solid transparent; line-height: 1.5rem; padding: 0; font-size: 1rem; color: #56707C; width: 100%; margin: 0; background: #FFF; }
#reserva select { /*margin-left: -4px;*/ }
#reserva input:focus, #reserva select:focus { outline: none; }
#ui-datepicker-div { display: none; background-color: #fff; box-shadow: 0 0.125rem 0.5rem rgba(0, 0, 0, 0.1); margin-top: 0.25rem; border-radius: 0.5rem; padding: 0.5rem; }
#reserva table { border-collapse: collapse; border-spacing: 0; }
.ui-datepicker-calendar thead th { padding: 0.25rem 0; text-align: center; font-size: 0.75rem; font-weight: 400; color: #78909C; }
.ui-datepicker-calendar tbody td { width: 2.5rem; text-align: center; padding: 0; }
.ui-datepicker-calendar tbody td a { display: block; border-radius: 0.25rem; line-height: 2rem; transition: 0.3s all; color: #546E7A; font-size: 0.875rem; text-decoration: none; }
.ui-datepicker-calendar tbody td a:hover { background-color: #E0F2F1; }
.ui-datepicker-calendar tbody td a.ui-state-active { background-color: #009688; color: white; }
.ui-datepicker-header a.ui-corner-all { cursor: pointer; position: absolute; top: 0; width: 2rem; height: 2rem; margin: 0.5rem; border-radius: 0.25rem; transition: 0.3s all; }
.ui-datepicker-header a.ui-corner-all:hover { background-color: #ECEFF1; }
.ui-datepicker-header a.ui-datepicker-prev { left: 0; background: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMyIgaGVpZ2h0PSIxMyIgdmlld0JveD0iMCAwIDEzIDEzIj48cGF0aCBmaWxsPSIjNDI0NzcwIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik03LjI4OCA2LjI5NkwzLjIwMiAyLjIxYS43MS43MSAwIDAgMSAuMDA3LS45OTljLjI4LS4yOC43MjUtLjI4Ljk5OS0uMDA3TDguODAzIDUuOGEuNjk1LjY5NSAwIDAgMSAuMjAyLjQ5Ni42OTUuNjk1IDAgMCAxLS4yMDIuNDk3bC00LjU5NSA0LjU5NWEuNzA0LjcwNCAwIDAgMS0xLS4wMDcuNzEuNzEgMCAwIDEtLjAwNi0uOTk5bDQuMDg2LTQuMDg2eiIvPjwvc3ZnPg=="); background-repeat: no-repeat; background-size: 0.5rem; background-position: 50%; transform: rotate(180deg); }
.ui-datepicker-header a.ui-datepicker-next { right: 0; background: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMyIgaGVpZ2h0PSIxMyIgdmlld0JveD0iMCAwIDEzIDEzIj48cGF0aCBmaWxsPSIjNDI0NzcwIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik03LjI4OCA2LjI5NkwzLjIwMiAyLjIxYS43MS43MSAwIDAgMSAuMDA3LS45OTljLjI4LS4yOC43MjUtLjI4Ljk5OS0uMDA3TDguODAzIDUuOGEuNjk1LjY5NSAwIDAgMSAuMjAyLjQ5Ni42OTUuNjk1IDAgMCAxLS4yMDIuNDk3bC00LjU5NSA0LjU5NWEuNzA0LjcwNCAwIDAgMS0xLS4wMDcuNzEuNzEgMCAwIDEtLjAwNi0uOTk5bDQuMDg2LTQuMDg2eiIvPjwvc3ZnPg=='); background-repeat: no-repeat; background-size: 10px; background-position: 50%; }
.ui-datepicker-header a>span { display: none; }
.ui-datepicker-title { text-align: center; line-height: 2rem; margin-bottom: 0.25rem; font-size: 0.875rem; font-weight: 500; padding-bottom: 0.25rem; }
.ui-datepicker-week-col { color: #78909C; font-weight: 400; font-size: 0.75rem; }

.slider-service .slider-item a { overflow: hidden; -webkit-border-top-left-radius: 20px;-webkit-border-top-right-radius: 20px;-moz-border-radius-topleft: 20px;-moz-border-radius-topright: 20px;border-top-left-radius: 20px; border-top-right-radius: 20px; }
.slider-service .slider-item a img { transition: 0.5s; }
.slider-service .slider-item a img:hover { transform: scale(1.1); }

.photo-gallery figure { overflow: hidden;  }
.photo-gallery figure img { transition: 0.5s; }
.photo-gallery figure img:hover { transform: scale(1.2); }

footer { background-image: url('https://sitescriar.com.br/oihrddcf2h/images/banner/1.jpg'); background-size: cover; background-repeat: no-repeat; background-position: 50% 0; background-attachment: fixed; } 
footer .overlay { background: #000000; background: linear-gradient(180deg, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 1) 100%); }
footer .redes .d-flex i { font-size: 1.3em; width: 25px; }
footer .redes .d-flex i.fa-whatsapp { font-size: 1.4em; }
footer .redes .icon { font-size: 2em; }
footer .copy { padding:40px 0; border-top: 1px solid rgba(255,255,255,0.05); }

@media (max-width:991.99px){ 
    header .navbar-nav a { padding: 15px 0; }
    footer .redes i { margin: 0 5px !important;  }
    /*#reserva { margin-top: -600px; margin-bottom: 55px; }*/
    #reserva { padding: 30px 0; }
    #reserva form .form-group { flex: 0 1 100%; }
    
    #reserva form .btn { padding: 10px 0; }
    #reserva label { padding: 0.2rem 0.75rem; }
    #reserva input, #reserva select { height: 25px; line-height: 1.2rem; }
    
    .box-chamada h2 { font-size: 1.8em; }
    .box-chamada h3 { font-size: 1.6em; }    
    .box-chamada .badge-primary { font-size: 1.1em; letter-spacing: 0.1em; }
    .titulo h2 { font-size: 2em; padding:40px 0; letter-spacing: 0.1em; }
}


.video-wrapper {
  position: relative;
  width: 100%;
  padding-top: 133.33%; /* Nova proporção */
  overflow: hidden;
  border-radius: 8px;
}

.video-bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  pointer-events: none;
}