/* =========================
   RESET
========================= */

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
      scroll-behavior:smooth;
    scroll-padding-top:120px;
		
}

body {
    font-family: 'Segoe UI', sans-serif;
    color: #1b1b1b;
    overflow-x: hidden;
}

/* =========================
   CORES
========================= */

:root {

    --primary: #003B53;
    --gold: #BDAA55;
    --white: #ffffff;
    --light: #f7f7f7;
    --dark: #111111;

}

/* =========================
   HEADER
========================= */

.header{

    position:fixed;

    top:0;

    left:0;

    width:100%;

    z-index:9999;

    padding:20px 0;

    transition:all .35s ease;

}
/* HEADER SCROLL */

.header.scrolled{

    background:#003B53;

    padding:10px 0;

    box-shadow:0 8px 25px rgba(0,0,0,.15);

}

.header.scrolled .navbar-brand img{

   transform:scale(.90);

}
.header.scrolled .nav-link{

    color:white !important;

}

.navbar-brand img{
    height: 70px;
	transition:.3s;
}

.nav-link {
    color: #fff !important;
    font-weight: 500;
	margin:0 8px;
    transition: .3s;
	position:relative;
}

.nav-link:hover {
    color: var(--gold) !important;
	
}

.nav-link::after{
    content:'';
    position:absolute;
    width:0;
    height:2px;
    bottom:-5px;
    left:0;
    background:var(--gold);
    transition:.3s;
}
.nav-link:hover::after{
    width:100%;
}
.btn-reserva {

    background: var(--gold);
    color: white;
    border-radius: 50px;
    padding:14px 28px;
    font-weight: 700;
    text-decoration: none;
    transition: .3s;
}

.btn-reserva:hover {

    background: #d3c16c;
    color: white;

}

/* =========================
   HERO
========================= */

.hero {

    position: relative;
    min-height: 100vh;

    background-image:url('../images/hero.jpg');
    background-size:cover;
    background-position:center center;

    display:flex;
    align-items:center;

    padding-top:80px;
}


.overlay {

    position: absolute;

    top: 0;
    left: 0;

    width: 100%;
    height: 100%;

    background: rgba(0,35,50,.82);

}

.hero .container {

    position:relative;
    z-index:2;

    padding-top:0;
    padding-bottom:0;

}
.hero .col-lg-7{

    padding-top:120px;

}

.badge-top {

    display: inline-block;

    color: var(--gold);

    font-weight: 700;

    letter-spacing: 2px;

    margin-bottom: 20px;

}

.hero h1 {

    color:white;
    font-size:4rem;
    font-weight:900;
    line-height:1;
    margin-bottom:20px;

}
.hero h1 span {

    color: var(--gold);

    display: block;

}

.hero p {

    color:rgba(255,255,255,.9);
    font-size:1.15rem;
    max-width:600px;
    margin-bottom:25px;

}
.hero-buttons {

    margin-top:35px;
    display:flex;
    flex-direction:row;
    gap:15px;
    flex-wrap:wrap;

}

.hero-buttons .btn{

    width:auto;

}
.btn-primary-custom {

    background: var(--gold);

    color: white;

    padding:14px 35px;
    min-width:220px;
    width:auto;

    border-radius: 50px;

    text-decoration: none;

    font-weight: 700;

    transition: .3s;

}

.btn-primary-custom:hover {

    background: #d5c46d;
    color: white;

}

.btn-secondary-custom {

    border: 2px solid white;

    color: white;

    padding:14px 35px;
    min-width:220px;
    width:auto;

    border-radius: 50px;

    text-decoration: none;

    font-weight: 700;

    transition: .3s;

}

.btn-secondary-custom:hover {

    background: white;
    color: var(--primary);

}
@media (max-width:768px){

.hero h1{

    font-size:3rem;
    line-height:1.05;

}
    .hero-buttons{

        flex-direction:column;

    }

    .hero-buttons .btn{

        width:100%;

    }

}

.badge-top{

    display:inline-block;

    color:#d4b24c;

    font-size:15px;

    font-weight:700;

    letter-spacing:3px;

    text-transform:uppercase;

    margin-bottom:20px;

}

/* ========================= */
.section-tag{

    color:#d4b24c;

    font-size:15px;

    font-weight:700;

    letter-spacing:3px;

    text-transform:uppercase;

}

/* =====================================
   ESTATÍSTICAS MINIMALISTAS
===================================== */

.stats-section{

    background:#003B53;

    padding:50px 0;

}

.stats-grid{

    display:grid;

    grid-template-columns:repeat(4,1fr);

    gap:30px;

    text-align:center;

}

.stat-item{

    position:relative;

}

.stat-item:not(:last-child)::after{

    content:'';

    position:absolute;

    right:-15px;

    top:50%;

    transform:translateY(-50%);

    width:1px;

    height:70px;

    background:rgba(255,255,255,.15);

}

.stat-item h3{

    margin:0;

    font-size:48px;

    font-weight:800;

    color:#D4B24D;

    line-height:1;

}

.stat-item p{

    margin-top:10px;

    color:white;

    font-size:16px;

    letter-spacing:.5px;

    text-transform:uppercase;

}

/* MOBILE */

@media(max-width:991px){

    .stats-grid{

        grid-template-columns:1fr 1fr;

        gap:40px;

    }

    .stat-item::after{

        display:none;

    }

    .btn-header,
    .menu-btn,
    .btn-reservar,
    .header-button{

        display:none;

    }
}

@media(max-width:576px){

    .stats-grid{

        grid-template-columns:1fr;

    }

    .stat-item h3{

        font-size:60px;

    }

}
/* =====================================
   SOBRE
===================================== */

.sobre{

    padding:70px 0;

    background:#ffffff;

}

.sobre-image{

    overflow:hidden;

    border-radius:30px;

}

.sobre-image img{

    width:100%;

    height:auto;

    display:block;

    border-radius:30px;

    box-shadow:0 20px 50px rgba(0,0,0,.15);

    transition:.5s;

}

.sobre-image:hover img{

    transform:scale(1.03);

}

.sobre h2{

    font-size:52px;

    font-weight:800;

    line-height:1.1;

    color:#003B53;

    margin:20px 0 25px;

}

.sobre h2 span{

    color:#D4B24D;

}

.sobre p{

    font-size:18px;

    line-height:1.8;

    color:#666;

}

.sobre-destaques{

    display:flex;

    gap:35px;

    margin:35px 0;

}

.sobre-destaques strong{

    display:block;

    font-size:42px;

    font-weight:800;

    color:#D4B24D;

    line-height:1;

}

.sobre-destaques span{

    font-size:14px;

    color:#666;

}

/* MOBILE */

@media(max-width:768px){

    .sobre{

        padding:70px 0;

    }

    .sobre h2{

        font-size:36px;

    }

    .sobre-destaques{

        flex-direction:column;

        gap:20px;

    }

}

/* ==========================
   MODALIDADES
========================== */

.modalidades{

    padding:60px 0;

    background:#f7f7f7;

}

.titulo-secao{

    color:var(--primary);

    font-size:3rem;

    font-weight:900;

}

.modalidade-link{

    text-decoration:none;

}

.modalidade-box{

    height:500px;

    border-radius:25px;

    overflow:hidden;

    position:relative;

    background-size:cover;

    background-position:center;

    transition:.5s;

}

.modalidade-box:hover{

    transform:translateY(-10px);

}

.beach-box{

    background-image:url('../images/beach.jpg');

}

.padel-box{

    background-image:url('../images/padel.jpg');

}

.modalidade-overlay{

    position:absolute;

    inset:0;

    background:linear-gradient(
        to top,
        rgba(0,0,0,.8),
        rgba(0,0,0,.15)
    );

}

.modalidade-texto{

    position:absolute;

    bottom:40px;

    left:40px;

    color:white;

    z-index:2;

}

.modalidade-texto span{

    color:var(--gold);

    font-weight:700;

    letter-spacing:2px;

}

.modalidade-texto h3{

    font-size:3rem;

    font-weight:900;

    margin:10px 0;

}

.modalidade-texto p{

    margin:0;

    font-size:1.1rem;

}
/* ==========================
   GALERIA
========================== */

.galeria{

    padding:60px 0;

}

.gallery-grid{

    display:grid;

    grid-template-columns:repeat(3,1fr);

    gap:20px;

}

.gallery-grid img{

    width:100%;

    height:380px;

    object-fit:cover;

    border-radius:20px;

    transition:.4s;

    cursor:pointer;

}

.gallery-grid img:hover{

    transform:scale(1.05);

    filter:brightness(1.1);

}

@media(max-width:768px){

    .gallery-grid{

        grid-template-columns:1fr;

    }

}


/* ==========================================================
   EVENTOS
========================================================== */

.eventos{

    background:#003B53;

    padding:80px 0;

}

.eventos .titulo-secao{

    color:#fff;

    font-size:3.2rem;

    font-weight:900;

}

/* GRID */

.eventos .row{

    justify-content:center;

}

/* CARD */

.evento-card{

    position:relative;

    min-height:420px;

    border-radius:25px;

    overflow:hidden;

    padding:35px;

    display:flex;

    flex-direction:column;

    justify-content:flex-end;

    transition:.35s ease;

    box-shadow:0 15px 40px rgba(0,0,0,.15);

}

.evento-card:hover{

    transform:translateY(-8px);

}

.evento-card::before{

    content:"";

    position:absolute;

    inset:0;

    background:linear-gradient(
        to top,
        rgba(0,0,0,.82),
        rgba(0,59,83,.45)
    );

}

.evento-card>*{

    position:relative;

    z-index:2;

}

/* DATA */

.evento-numero{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    width:92px;

    height:52px;

    background:#d4b24c;

    color:#fff;

    border-radius:14px;

    font-size:15px;

    font-weight:800;

    line-height:1.1;

    margin-bottom:22px;

}

/* TEXTO */

.evento-card h3{

    color:#fff;

    font-size:2rem;

    font-weight:800;

    margin-bottom:15px;

    line-height:1.2;

}

.evento-card p{

    color:rgba(255,255,255,.92);

    line-height:1.8;

    margin:0;

}

/* IMAGENS */

.evento-fpt{

    background:url("../images/evento-fpt.jpg") center/cover no-repeat;

}

.evento-itf{

    background:url("../images/evento-itf.jpg") center/cover no-repeat;

}

.evento-interclubes{

    background:url("../images/evento-interclubes.jpg") center/cover no-repeat;

}

/* ==========================================================
   EVENTO REALIZADO
========================================================== */

.evento-selo{

    position:absolute;

    top:18px;

    right:18px;

    display:flex;

    align-items:center;

    gap:8px;

    padding:8px 16px;

    border-radius:50px;

    background:#28a745;

    color:#fff;

    font-size:11px;

    font-weight:700;

    letter-spacing:.6px;

    text-transform:uppercase;

    box-shadow:0 10px 25px rgba(0,0,0,.20);

    opacity:0;

    visibility:hidden;

    transform:translateY(-10px);

    transition:.35s ease;

    z-index:10;

}

.evento-selo i{

    font-size:13px;

}

/* ==========================================================
   BOTÃO FOTOS
========================================================== */

.btn-evento-fotos{

    display:inline-flex;

    align-items:center;

    gap:8px;

    width:max-content;

    margin-top:20px;

    color:#d4b24c;

    font-size:15px;

    font-weight:700;

    text-decoration:none;

    transition:.35s ease;

    opacity:0;

    visibility:hidden;

    transform:translateY(10px);

}

.btn-evento-fotos:hover{

    color:#fff;

    transform:translateX(6px);

    text-decoration:none;

}

.btn-evento-fotos i{

    font-size:17px;

}

/* ==========================================================
   EVENTO ENCERRADO
========================================================== */

.evento-card.evento-realizado .evento-selo{

    opacity:1;

    visibility:visible;

    transform:translateY(0);

}

.evento-card.evento-realizado .btn-evento-fotos{

    opacity:1;

    visibility:visible;

    transform:translateY(0);

}

/* ==========================================================
   MOBILE
========================================================== */

@media(max-width:768px){

    .eventos{

        padding:60px 0;

    }

    .eventos .titulo-secao{

        font-size:2.2rem;

    }

    .evento-card{

        min-height:340px;

        padding:25px;

    }

    .evento-card h3{

        font-size:1.55rem;

    }

    .evento-card p{

        font-size:15px;

    }

}


/* ========================================
MOBILE 
===========================================*/

@media(max-width:768px){


.eventos{

    padding:60px 0;

}

.eventos .titulo-secao{

    font-size:2.2rem;

}

.evento-card{

    min-height:320px;

    padding:25px;

}

.evento-card h3{

    font-size:1.6rem;

}


}

.evento-numero{

    width:90px;

    background:#d4b24c;

    color:#fff;

    border-radius:12px;

    padding:12px 8px;

    text-align:center;

    font-size:16px;

    font-weight:800;

    line-height:1.1;

    margin-bottom:25px;

}
/* =====================================
   HOTEL
===================================== */

.hotel-section{

    padding:60px 0;

    background:#ffffff;

    border-top:1px solid #ececec;

}

.hotel-logo{

    max-width:180px;

    width:auto;

    height:auto;

    display:block;

    margin:0 auto 20px;

}

.hotel-section h2{

    color:#003B53;

    font-size:2.5rem;

    font-weight:800;

    margin-bottom:20px;

    line-height:1.2;

}
/* ==========================================================
   BOTÕES HOTEL
========================================================== */

.btn-hotel-conheca,
.btn-hotel-whatsapp{

    display:inline-flex;

	min-width:200px;
	   
    align-items:center;

    justify-content:center;

    gap:10px;

    padding:14px 30px;

    border-radius:50px;

    font-weight:700;

    text-decoration:none;

    transition:all .3s ease;

}

.btn-hotel-conheca{

    background:var(--gold);

    color:#fff;

}

.btn-hotel-conheca:hover{

    background:#d5c46d;

    color:#fff;

    transform:translateY(-3px);

    box-shadow:0 10px 25px rgba(212,178,76,.30);

}

.btn-hotel-whatsapp{

    background:#25D366;

    color:#fff;

}

.btn-hotel-whatsapp:hover{

    background:#20ba5a;

    color:#fff;

    transform:translateY(-3px);

    box-shadow:0 10px 25px rgba(37,211,102,.30);

}

/* Ícones */

.btn-hotel-conheca i,
.btn-hotel-whatsapp i{

    font-size:17px;

}


.hotel-section p{

    font-size:18px;

    line-height:1.8;

    color:#666;

}

/* =================
CTA FINAL 
==================== */

.cta-final{

    padding:60px 0 60px;

    background:#00293A;

    color:white;


}

.cta-final h2{

    font-size:3.2rem;

    font-weight:900;

   max-width:900px;
    margin:auto auto 30px;

}

.cta-final p{

    max-width:700px;

    margin:auto auto 40px;

}
.footer{

    background:#001E2B;

    color:white;

    padding:80px 0 30px;

}

.footer h5{

    margin-bottom:20px;

    color:#BDAA55;

}

.footer hr{

    margin:40px 0;

    border-color:rgba(255,255,255,.15);

}
/* ==========================
   FOOTER
========================== */

.footer{

    background:#001B27;
	border-top:1px solid rgba(255,255,255,.08);

    color:white;

    padding:90px 0 30px;

}

.footer-logo{

    max-width:160px;

    margin-bottom:20px;

}

.footer-text{

    color:rgba(255,255,255,.75);

    line-height:1.8;

}

.footer h4{

    color:#BDAA55;

    font-size:1.1rem;

    margin-bottom:25px;

    font-weight:700;

}

.footer-list{

    list-style:none;

    padding:0;

    margin:0;

}

.footer-list li{

    margin-bottom:12px;

    color:rgba(255,255,255,.75);

}

.footer-list a{

    color:rgba(255,255,255,.75);

    text-decoration:none;

    transition:.3s;

}

.footer-list a:hover{

    color:#BDAA55;

}

.footer-btn{

    display:inline-block;

    background:#BDAA55;

    color:white;

    text-decoration:none;

    padding:14px 30px;

    border-radius:40px;

    font-weight:700;

    margin-top:15px;

}

.footer-btn:hover{

    color:white;

    transform:translateY(-2px);

}

.footer-divider{

    height:1px;

    background:rgba(255,255,255,.1);

    margin:50px 0 25px;

}

.footer-bottom{

    display:flex;

    justify-content:space-between;

    align-items:center;

    color:rgba(255,255,255,.5);

    font-size:.9rem;

}

.footer-social a{

    color:#BDAA55;

    text-decoration:none;

}

@media(max-width:768px){

    .footer-bottom{

        flex-direction:column;

        gap:10px;

        text-align:center;

    }

}
.whatsapp-float{

    position:fixed;

    width:58px;
    height:58px;

    right:20px;
    bottom:20px;

    z-index:999;

}

.whatsapp-float img{

    width:100%;

    transition:.3s;

}

.whatsapp-float:hover img{

    transform:scale(1.1);

}
/* ==========================
   LIGHTBOX
========================== */

.lightbox{

    position:fixed;

    inset:0;

    background:rgba(0,0,0,.92);

    display:flex;

    justify-content:center;

    align-items:center;

    opacity:0;

    visibility:hidden;

    transition:.35s;

    z-index:99999;

}

.lightbox.active{

    opacity:1;

    visibility:visible;

}

.lightbox-image{

    max-width:90%;

    max-height:90vh;

    border-radius:15px;

    transform:scale(.8);

    transition:.35s;

    box-shadow:0 20px 60px rgba(0,0,0,.4);

}

.lightbox.active .lightbox-image{

    transform:scale(1);

}

.lightbox-close{

    position:absolute;

    top:25px;

    right:35px;

    color:white;

    font-size:50px;

    cursor:pointer;

}

.gallery-item{

    cursor:pointer;

}
/* =====================================
   MENU MOBILE
===================================== */

@media (max-width:991px){

    .navbar-collapse{

        position:absolute;
        top:100%;
        left:0;

        width:100%;

        background:transparent !important;

        backdrop-filter:none;

        -webkit-backdrop-filter:none;

        padding:15px;

        box-shadow:none;

        border:none;

        z-index:9999;

    }

    .navbar-nav{

        width:100%;

background:rgba(0,59,83,.30);
backdrop-filter:blur(20px);

        -webkit-backdrop-filter:blur(15px);

        border-radius:20px;

        padding:10px 20px;

    }

    .navbar-nav .nav-item{

        width:100%;

    }

    .navbar-nav .nav-link{

        display:block;

        padding:14px 0;

        color:#fff !important;

        border-bottom:1px solid rgba(255,255,255,.05);

        font-size:18px;

    }

}
/* NOTEBOOKS 1366x768 */

@media (max-height:800px){

    .header{
        padding:10px 0;
    }

    .navbar-brand img{
        height:55px;
    }

    .hero{
        padding-top:60px;
    }

    .badge-top{
        margin-bottom:10px;
        font-size:.9rem;
    }

    .hero h1{
        font-size:3rem;
        line-height:1;
        margin-bottom:15px;
    }

    .hero p{
        font-size:1rem;
        margin-bottom:20px;
    }

    .btn-primary-custom,
    .btn-secondary-custom{
        padding:12px 28px;
        min-width:220px;
    }

}

/* ==========================================
   FAQ
========================================== */

.faq-section{

    padding:80px 0;

    background:#f8f9fa;

}

.faq-section h2{

    color:#003B53;

    font-size:3rem;

    font-weight:900;

}

.accordion-item{

    border:none;

    margin-bottom:15px;

    border-radius:15px !important;

    overflow:hidden;

    box-shadow:0 5px 20px rgba(0,0,0,.05);

}

.accordion-button{

    background:#fff;

    color:#003B53;

    font-weight:700;

    font-size:18px;

    padding:22px 25px;

}

.accordion-button:not(.collapsed){

    background:#003B53;

    color:#fff;

}

.accordion-button:focus{

    box-shadow:none;

    border:none;

}

.accordion-body{

    padding:25px;

    color:#555;

    line-height:1.8;

    background:#fff;

}

.accordion-button::after{

    filter:brightness(0.4);

}

.accordion-button:not(.collapsed)::after{

    filter:brightness(10);

}

@media(max-width:768px){

    .faq-section{

        padding:60px 0;

    }

    .faq-section h2{

        font-size:2.2rem;

    }

    .accordion-button{

        font-size:16px;

    }

}

/* ==========================================
   ANIMAÇÃO PREMIUM
========================================== */

.fade-up{

    opacity:0;

    transform:translateY(50px);

    transition:
    opacity .8s ease,
    transform .8s ease;

}

.fade-up.show{

    opacity:1;

    transform:translateY(0);

}

/* DELAYS */

.delay-1{
    transition-delay:.1s;
}

.delay-2{
    transition-delay:.2s;
}

.delay-3{
    transition-delay:.3s;
}

.delay-4{
    transition-delay:.4s;
}

.delay-5{
    transition-delay:.5s;
}
/* ==========================================
LOCALIZAÇÃO
========================================== */

.localizacao-section{


padding:90px 0;

background:#ffffff;


}

.localizacao-section h2{


color:#003B53;

font-size:3rem;

font-weight:900;

margin-bottom:25px;


}

.localizacao-section p{


color:#666;

line-height:1.8;

margin-bottom:20px;


}

.mapa-wrapper{


border-radius:25px;

overflow:hidden;

box-shadow:0 15px 40px rgba(0,0,0,.10);


}

.mapa-wrapper iframe{


width:100%;

height:420px;

border:none;

display:block;


}

@media(max-width:768px){


.localizacao-section{

    padding:60px 0;

}

.localizacao-section h2{

    font-size:2.2rem;

}

.mapa-wrapper iframe{

    height:320px;

}

}

/* ==========================================
RESERVAS
========================================== */

.reservas-section{


padding:90px 0;

background:#f7f8fa;


}

.reserva-card{


background:#fff;

border-radius:25px;

padding:40px;

text-align:center;

box-shadow:0 10px 30px rgba(0,0,0,.08);

transition:.3s;

height:100%;


}

.reserva-card:hover{


transform:translateY(-5px);


}

.reserva-card i{


font-size:50px;

color:#d4b24c;

margin-bottom:20px;


}

.reserva-card h3{


color:#003B53;

font-size:2rem;

font-weight:800;

margin-bottom:15px;


}

.reserva-card p{


color:#666;

margin-bottom:25px;


}

.btn-reserva-card{


background:#d4b24c;

color:#fff;

border-radius:50px;

padding:14px 30px;

font-weight:700;

text-decoration:none;

display:inline-block;


}

.btn-reserva-card:hover{


background:#c3a13d;

color:#fff;

}


/* ==========================================
   WHATSAPP FLOAT
========================================== */

.floating-actions{

    position:fixed;

    right:25px;

    bottom:25px;

    z-index:9999;

}

.btn-float-whatsapp{

    width:62px;

    height:62px;

    border-radius:50%;

    background:#25D366;

    color:#fff;

    display:flex;

    align-items:center;

    justify-content:center;

    text-decoration:none;

    font-size:32px;

    box-shadow:0 10px 30px rgba(0,0,0,.25);

    transition:.3s;

}

.btn-float-whatsapp:hover{

    transform:translateY(-3px);

    color:#fff;

}

/* ==========================================
   SELO EVENTO REALIZADO
========================================== */

.evento-card{
    position:relative;
    overflow:hidden;
}

.evento-selo{

    position:absolute;

    top:18px;
    right:18px;

    background:#28a745;

    color:#fff;

    padding:8px 16px;

    border-radius:50px;

    font-size:11px;

    font-weight:700;

    letter-spacing:.6px;

    text-transform:uppercase;

    display:flex;

    align-items:center;

    gap:8px;

    box-shadow:0 8px 20px rgba(0,0,0,.25);

    z-index:20;

    opacity:0;
    visibility:hidden;
    transform:translateY(-10px);

    transition:.35s ease;

}

.evento-card.evento-realizado .evento-selo{

    opacity:1;
    visibility:visible;
    transform:translateY(0);

}

.evento-selo i{

    font-size:13px;

}

/* ======================== */


@media(max-width:768px){

    .floating-actions{

        right:15px;

        bottom:15px;

    }

    .btn-float-whatsapp{

        width:56px;

        height:56px;

        font-size:28px;

    }

}


/* ==========================================
   BOTÃO RESERVAR
========================================== */

.btn-reserva{

    transition:.3s;

    animation:pulse 2s 1;

}

.btn-reserva:hover{

    transform:translateY(-3px);

    box-shadow:0 10px 25px rgba(0,0,0,.20);

}

@keyframes pulse{

    0%{
        box-shadow:0 0 0 0 rgba(212,178,76,.50);
    }

    70%{
        box-shadow:0 0 0 15px rgba(212,178,76,0);
    }

    100%{
        box-shadow:0 0 0 0 rgba(212,178,76,0);
    }

}