/*
  Boa Cena Studios — Cinematic Dark Theme
  Colors: bg #0e0e0f, surface #161616, accent #d7263d, text #ffffff, muted #aaaaaa
  Typography: Headings Montserrat (700/800), Body Poppins (400/500)
  Radius: 12px; Easing: cubic-bezier(0.22,1,0.36,1)
  Motion: 120ms fast, 220ms base, 380ms slow
*/

:root{
  --bg:#0e0e0f;
  --surface:#161616;
  --text:#ffffff;
  --muted:#aaaaaa;
  --accent:#d7263d;
  --radius:12px;
  --ease:cubic-bezier(0.22,1,0.36,1);
  --fast:120ms;--base:220ms;--slow:380ms;
  --shadow-elev:0 10px 30px rgba(0,0,0,.5), 0 0 0 1px rgba(255,255,255,.03);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto}}
body{
  margin:0; background:var(--bg); color:var(--text);
  font-family:'Poppins',system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,'Helvetica Neue',Arial,sans-serif;
  line-height:1.6;
}
a{color:inherit; text-decoration:none}
img{max-width:100%; display:block}

.container{width:min(1200px, 92%); margin-inline:auto}
.section{padding:72px 0}
.section-header h2, .section-header h1{font-family:'Montserrat',sans-serif; font-weight:800; letter-spacing:.5px}
.section-header h1{font-size:clamp(26.8px,3.7vw,38.6px)}
.section-header h2{font-size:clamp(24px,3vw,32px)}
.muted{color:var(--muted)}

/* Navbar */
.navbar{position:fixed; top:0; z-index:9999; background:transparent; backdrop-filter:none; border-bottom:none; transform:translateY(0); transition:transform var(--base) var(--ease); width:100%}
.navbar.hide{transform:translateY(-100%)}
.nav-inner{display:flex; align-items:center; justify-content:space-between; height:64px}
.logo img{border-radius:8px; width:159px; height:99px; object-fit:contain; transition:transform var(--fast) var(--ease); filter:drop-shadow(0 0 15px rgba(0,0,0,0.8)) drop-shadow(0 0 30px rgba(0,0,0,0.6)) drop-shadow(0 0 45px rgba(0,0,0,0.4))}
.logo:hover img{transform:scale(1.04); filter:drop-shadow(0 0 20px rgba(0,0,0,0.9)) drop-shadow(0 0 40px rgba(0,0,0,0.7)) drop-shadow(0 0 60px rgba(0,0,0,0.5))}
.nav-links{display:flex; gap:28px}
.nav-link{position:relative; padding:8px 2px; color:#fff; text-shadow:0 0 15px rgba(0,0,0,0.8), 0 0 30px rgba(0,0,0,0.6), 0 0 45px rgba(0,0,0,0.4); transition:color var(--fast) var(--ease), text-shadow var(--fast) var(--ease)}
.nav-link::after{content:""; position:absolute; left:0; bottom:0; height:2px; width:0; background:var(--accent); transition:width var(--fast) var(--ease); box-shadow:0 0 8px var(--accent), 0 0 16px rgba(215,38,61,0.5)}
.nav-link:hover{color:#fff; text-shadow:0 0 20px rgba(0,0,0,0.9), 0 0 40px rgba(0,0,0,0.7), 0 0 60px rgba(0,0,0,0.5)}
.nav-link:hover::after{width:100%}
.nav-link:focus-visible::after{width:100%}
.nav-link.active::after{width:100%; background:var(--accent)}
.nav-link.active{color:var(--accent); text-shadow:0 0 15px rgba(215,38,61,0.8), 0 0 30px rgba(215,38,61,0.6), 0 0 45px rgba(215,38,61,0.4)}
.nav-link.active::after{width:100%; background:var(--accent); box-shadow:0 0 8px var(--accent), 0 0 16px rgba(215,38,61,0.5)}

/* Dropdown */
.nav-dropdown{position:relative}
.dropdown-trigger{display:flex; align-items:center; gap:8px; position:relative; color:#fff; text-shadow:0 0 15px rgba(0,0,0,0.8), 0 0 30px rgba(0,0,0,0.6), 0 0 45px rgba(0,0,0,0.4); transition:color var(--fast) var(--ease), text-shadow var(--fast) var(--ease)}
.dropdown-trigger::before{content:"▲"; font-size:12px; transition:transform var(--base) var(--ease), color var(--fast) var(--ease), text-shadow var(--fast) var(--ease); text-shadow:0 0 8px rgba(255,255,255,0.3), 0 0 16px rgba(255,255,255,0.2); order:-1}
.dropdown-menu{position:absolute; top:calc(100% + 12px); left:50%; transform:translateX(-50%) translateY(-15px) scale(0.95); background:linear-gradient(145deg, rgba(22,22,22,0.98) 0%, rgba(14,14,15,0.98) 100%); border:1px solid rgba(215,38,61,0.15); border-radius:var(--radius); box-shadow:0 20px 60px rgba(0,0,0,0.9), 0 0 0 1px rgba(255,255,255,0.05), 0 0 40px rgba(215,38,61,0.1); opacity:0; visibility:hidden; transition:opacity var(--base) var(--ease), visibility var(--base) var(--ease), transform var(--base) var(--ease); min-width:240px; z-index:99999; backdrop-filter:blur(20px) saturate(180%); padding:8px 0; overflow:hidden}
.dropdown-menu::before{content:""; position:absolute; top:0; left:0; right:0; height:2px; background:linear-gradient(90deg, transparent, var(--accent), transparent); opacity:0.6}
.dropdown-menu::after{content:""; position:absolute; top:-8px; left:50%; transform:translateX(-50%); width:0; height:0; border-left:8px solid transparent; border-right:8px solid transparent; border-bottom:8px solid rgba(215,38,61,0.2)}
.nav-dropdown:hover .dropdown-menu,
.dropdown-menu:hover{opacity:1; visibility:visible; transform:translateX(-50%) translateY(0) scale(1)}
.nav-dropdown:hover .dropdown-trigger{color:#fff; text-shadow:0 0 20px rgba(0,0,0,0.9), 0 0 40px rgba(0,0,0,0.7), 0 0 60px rgba(0,0,0,0.5)}
.nav-dropdown:hover .dropdown-trigger::before{transform:rotate(180deg); color:var(--accent); text-shadow:0 0 12px rgba(215,38,61,0.9), 0 0 24px rgba(215,38,61,0.7), 0 0 36px rgba(215,38,61,0.5)}
.nav-dropdown .dropdown-trigger.active{color:var(--accent); text-shadow:0 0 15px rgba(215,38,61,0.8), 0 0 30px rgba(215,38,61,0.6), 0 0 45px rgba(215,38,61,0.4)}
.nav-dropdown:hover .dropdown-trigger.active{color:var(--accent); text-shadow:0 0 20px rgba(215,38,61,0.9), 0 0 40px rgba(215,38,61,0.7), 0 0 60px rgba(215,38,61,0.5)}
.dropdown-link{display:block; padding:14px 24px; color:#fff; font-weight:500; text-shadow:none; transition:all var(--base) var(--ease); position:relative; border-left:0; background:transparent}
.dropdown-link::before{content:""; position:absolute; left:0; top:50%; transform:translateY(-50%); width:3px; height:0; background:var(--accent); transition:height var(--base) var(--ease); border-radius:0 2px 2px 0}
.dropdown-link::after{content:"→"; position:absolute; right:20px; top:50%; transform:translateY(-50%); opacity:0; transition:all var(--base) var(--ease); color:var(--accent)}
.dropdown-link:hover{background:linear-gradient(90deg, rgba(215,38,61,.12) 0%, transparent 100%); color:var(--accent); padding-left:32px}
.dropdown-link:hover::before{height:60%}
.dropdown-link:hover::after{opacity:1; transform:translateY(-50%) translateX(4px)}
.dropdown-link:focus-visible{background:linear-gradient(90deg, rgba(215,38,61,.15) 0%, transparent 100%); color:var(--accent); outline:2px solid var(--accent); outline-offset:-2px; padding-left:32px}
.dropdown-link:focus-visible::before{height:60%}
.nav-toggle{display:none; background:transparent; border:0; padding:8px; cursor:pointer}
.nav-toggle span{display:block; width:24px; height:2px; background:#fff; margin:5px 0; transition:transform var(--base) var(--ease)}
.mobile-overlay{position:fixed; inset:0; background:rgba(14,14,15,.5); backdrop-filter:blur(8px); opacity:0; visibility:hidden; transition:opacity var(--base) var(--ease), visibility var(--base) var(--ease)}
.mobile-open .mobile-overlay{opacity:1; visibility:visible}
.mobile-open .nav-links{transform:translateY(0); opacity:1; visibility:visible; pointer-events:auto}

@media (max-width: 860px){
  .nav-links{position:fixed; top:64px; right:0; left:0; background:var(--surface); display:flex; flex-direction:column; gap:0; transform:translateY(-10px); opacity:0; visibility:hidden; pointer-events:none; transition:transform var(--base) var(--ease), opacity var(--base) var(--ease), visibility var(--base) var(--ease); padding:8px 0; border-bottom:1px solid rgba(255,255,255,.06)}
  .nav-link{padding:16px 24px}
  .nav-toggle{display:block}
  .nav-dropdown{position:static}
  .dropdown-menu{position:static; opacity:1; visibility:visible; transform:none; box-shadow:none; border:none; background:transparent; min-width:auto; padding:0}
  .dropdown-menu::before, .dropdown-menu::after{display:none}
  .dropdown-link{padding:10px 32px; color:var(--muted)}
  .dropdown-link::after{display:none}
  .dropdown-link:hover{background:rgba(215,38,61,.1); color:var(--accent); padding-left:40px}
  .category-nav{gap:12px; margin:24px 0}
  .category-btn{padding:10px 16px; font-size:14px}
}

/* Hero */
.hero{position:relative; height:100vh; display:flex; align-items:center; justify-content:center; overflow:hidden; z-index:1}
.hero-video-bg{position:absolute; inset:0; background:black; z-index:1; overflow:hidden}
.hero-video{width:100%; height:100%; object-fit:cover; object-position:center}
.hero-content{position:relative; z-index:10; text-align:center; color:#fff}
.hero-logo{margin-bottom:48px}
.hero-logo img{filter:drop-shadow(0 10px 30px rgba(0,0,0,.8)); width:clamp(400px, 40vw, 1240px); height:auto}
.cta-row{display:flex; gap:20px; flex-wrap:wrap; justify-content:center}

/* About Hero & Contact Hero */
.about-hero, .contact-hero{position:relative; height:50vh; min-height:400px; display:flex; align-items:center; justify-content:center; overflow:hidden; z-index:1}
.about-hero-bg, .contact-hero-bg{position:absolute; inset:0; z-index:1}
.about-hero-video, .contact-hero-video{width:100%; height:100%; object-fit:cover}
.about-hero-overlay, .contact-hero-overlay{position:absolute; inset:0; background:linear-gradient(180deg, rgba(14,14,15,.3) 0%, rgba(14,14,15,.85) 100%); z-index:2}
.about-hero .container, .contact-hero .container{position:relative; z-index:10}
.section-header-centered{text-align:center; color:#fff; padding:24px 0}
.section-header-centered h1{font-family:'Montserrat',sans-serif; font-size:clamp(32px, 5vw, 54px); font-weight:800; margin:0 0 16px; text-shadow:0 4px 20px rgba(0,0,0,.8)}
.hero-tagline{font-size:clamp(18px, 2.5vw, 24px); color:var(--accent); font-weight:600; margin:0; text-shadow:0 2px 12px rgba(0,0,0,.6)}
.hero-subtitle{font-size:clamp(16px, 2vw, 20px); color:var(--muted); margin:0}

/* Buttons */
.btn{display:inline-flex; align-items:center; justify-content:center; padding:12px 18px; border-radius:var(--radius); border:1px solid transparent; transition:transform var(--fast) var(--ease), box-shadow var(--fast) var(--ease), background var(--fast) var(--ease); will-change:transform}
.btn:focus-visible{outline:2px solid var(--accent); outline-offset:2px}
.btn-ghost{border-color:#fff; color:#fff; background:transparent}
.btn-ghost:hover{box-shadow:0 0 0 3px rgba(255,255,255,.15)}
.btn-accent{background:var(--accent); color:#fff; border-color:var(--accent)}
.btn-accent:hover{box-shadow:0 0 0 6px rgba(215,38,61,.25); transform:scale(1.03)}

/* Cards */
.cards{display:grid; grid-template-columns:repeat(3,1fr); gap:20px}
.card{background:var(--surface); border:1px solid rgba(255,255,255,.06); border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow-elev); transform:translateZ(0); transition:transform var(--base) var(--ease), box-shadow var(--base) var(--ease)}
.card:hover{transform:translateY(-6px); box-shadow:0 20px 50px rgba(215,38,61,.15), var(--shadow-elev)}
.card picture{display:block; aspect-ratio:16/9; overflow:hidden}
.card img{width:100%; height:100%; object-fit:cover}
.card-body{padding:14px 14px 16px}
.card .tag{display:inline-block; font-size:12px; color:var(--muted)}
@media (max-width: 980px){.cards{grid-template-columns:repeat(2,1fr)}}
@media (max-width: 640px){.cards{grid-template-columns:1fr}}

/* 3D tilt */
.tilt{transform-style:preserve-3d}

/* Category Navigation */
.category-nav{display:flex; gap:16px; margin:32px 0; flex-wrap:wrap; justify-content:center}
.category-btn{display:inline-flex; align-items:center; justify-content:center; padding:14px 24px; border-radius:var(--radius); border:1px solid var(--accent); color:var(--accent); background:transparent; transition:all var(--base) var(--ease); text-decoration:none; font-weight:500; position:relative; overflow:hidden}
.category-btn::before{content:""; position:absolute; top:0; left:-100%; width:100%; height:100%; background:linear-gradient(90deg, transparent, rgba(215,38,61,.1), transparent); transition:left var(--base) var(--ease)}
.category-btn:hover::before{left:100%}
.category-btn:hover{transform:translateY(-2px) scale(1.02); box-shadow:0 8px 25px rgba(215,38,61,.3), 0 0 0 1px var(--accent); background:var(--accent); color:#fff}
.category-btn:focus-visible{outline:2px solid var(--accent); outline-offset:2px; transform:translateY(-1px)}
.category-btn.active{background:var(--accent); color:#fff; box-shadow:0 4px 15px rgba(215,38,61,.2)}
.category-btn.active:hover{transform:translateY(-2px) scale(1.02); box-shadow:0 8px 25px rgba(215,38,61,.4), 0 0 0 1px var(--accent)}

/* Video cards grid */
.video-cards-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin:32px 0}
.video-card{background:var(--surface); border:1px solid rgba(255,255,255,.08); border-radius:var(--radius); overflow:hidden; cursor:pointer; transition:transform var(--base) var(--ease), box-shadow var(--base) var(--ease), border-color var(--base) var(--ease)}
.video-card:hover{transform:translateY(-8px); box-shadow:0 20px 50px rgba(215,38,61,.2), var(--shadow-elev); border-color:var(--accent)}
.video-thumbnail{position:relative; aspect-ratio:16/9; overflow:hidden}
.video-thumbnail img{width:100%; height:100%; object-fit:cover; transition:transform var(--base) var(--ease)}
.video-card:hover .video-thumbnail img{transform:scale(1.05)}
.play-overlay{position:absolute; inset:0; background:rgba(0,0,0,.4); display:flex; align-items:center; justify-content:center; opacity:0; transition:opacity var(--base) var(--ease)}
.video-card:hover .play-overlay{opacity:1}
.play-button{width:60px; height:60px; background:rgba(215,38,61,.9); border-radius:50%; display:flex; align-items:center; justify-content:center; color:#fff; font-size:20px; transition:transform var(--fast) var(--ease)}
.video-card:hover .play-button{transform:scale(1.1)}
.video-info{padding:20px}
.video-info h3{font-family:'Montserrat',sans-serif; font-weight:700; font-size:18px; margin:0 0 8px; color:#fff}
.video-info p{color:var(--muted); margin:0; font-size:14px; line-height:1.5}
@media (max-width: 980px){.video-cards-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width: 640px){.video-cards-grid{grid-template-columns:1fr}}

/* Index titles and demos button centering */
#demonstracoes .section-header h2,
#sobre-nos .section-header h2,
#contacte-nos .section-header h2{ text-align:center; margin-inline:auto }
#demonstracoes .section-actions{ text-align:center }

/* Filters */
.filters{display:flex; gap:10px; flex-wrap:wrap; margin:10px 0 22px}
.chip{border:1px solid rgba(255,255,255,.18); background:transparent; color:#fff; padding:8px 12px; border-radius:999px; cursor:pointer; transition:background var(--fast) var(--ease), transform var(--fast) var(--ease)}
.chip:hover{transform:translateY(-2px)}
.chip.active{background:rgba(215,38,61,.2); border-color:var(--accent)}

/* About content */
.about-content{text-align:center; max-width:800px; margin:0 auto}
.about-text{font-size:18px; line-height:1.7; margin-bottom:48px; color:var(--muted)}

/* Premium About Section (index.html) */
.section-header-premium{text-align:center; margin-bottom:48px}
.section-header-premium h2{font-family:'Montserrat',sans-serif; font-size:clamp(28px, 4vw, 42px); font-weight:800; margin:0 0 16px}
.section-deck{font-size:clamp(18px, 2.5vw, 22px); color:var(--muted); max-width:700px; margin:0 auto; line-height:1.6}
.about-premium{max-width:1100px; margin:0 auto}
.about-intro{text-align:center; font-size:clamp(16px, 2vw, 19px); line-height:1.8; margin-bottom:56px; color:#fff; max-width:900px; margin-left:auto; margin-right:auto}
.about-intro strong{color:var(--accent)}
.premium-highlight{background:linear-gradient(135deg, rgba(215,38,61,.08) 0%, rgba(22,22,22,.6) 100%); border:1px solid rgba(215,38,61,.2); border-radius:var(--radius); padding:48px 32px; margin:56px 0; text-align:center; position:relative; overflow:hidden}
.premium-highlight::before{content:""; position:absolute; top:-50%; left:-50%; width:200%; height:200%; background:radial-gradient(circle, rgba(215,38,61,.1) 0%, transparent 70%); animation:pulse 8s ease-in-out infinite}
.highlight-inner{position:relative; z-index:2}
.highlight-text{font-size:clamp(20px, 3vw, 28px); font-weight:600; color:#fff; margin:0 0 12px; line-height:1.4}
.highlight-accent{font-family:'Montserrat',sans-serif; font-size:clamp(24px, 3.5vw, 36px); font-weight:800; color:var(--accent); margin:0; text-transform:uppercase; letter-spacing:1px}
@keyframes pulse{0%, 100%{transform:scale(1); opacity:.5} 50%{transform:scale(1.1); opacity:.8}}

/* Feature Cards Grid */
.feature-cards-grid{display:grid; grid-template-columns:repeat(3, 1fr); gap:28px; margin:56px 0}
.feature-card{background:var(--surface); border:1px solid rgba(255,255,255,.08); border-radius:var(--radius); padding:32px 24px; text-align:center; transition:all var(--base) var(--ease); position:relative; overflow:hidden}
.feature-card::before{content:""; position:absolute; top:0; left:0; right:0; height:3px; background:linear-gradient(90deg, var(--accent), #ff6b85); transform:scaleX(0); transform-origin:left; transition:transform var(--base) var(--ease)}
.feature-card:hover{transform:translateY(-8px); box-shadow:0 20px 50px rgba(215,38,61,.15), var(--shadow-elev); border-color:var(--accent)}
.feature-card:hover::before{transform:scaleX(1)}
.feature-icon{font-size:48px; margin-bottom:20px; filter:grayscale(1) brightness(1.2); transition:filter var(--base) var(--ease)}
.feature-card:hover .feature-icon{filter:grayscale(0) brightness(1)}
.feature-card h3{font-family:'Montserrat',sans-serif; font-size:22px; font-weight:700; margin:0 0 12px; color:#fff}
.feature-card p{font-size:15px; line-height:1.6; color:var(--muted); margin:0}
.about-values{text-align:center; font-size:clamp(16px, 2vw, 18px); line-height:1.8; margin:56px 0; color:var(--muted); max-width:900px; margin-left:auto; margin-right:auto}
.about-values strong{color:#fff}
@media (max-width: 980px){.feature-cards-grid{grid-template-columns:repeat(2, 1fr)}}
@media (max-width: 640px){.feature-cards-grid{grid-template-columns:1fr}}

/* Stats Grid */
.stats-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin-top:56px}
.stat-card{background:var(--surface); border:1px solid rgba(255,255,255,.06); border-radius:var(--radius); padding:32px 24px; text-align:center; transition:transform var(--base) var(--ease), box-shadow var(--base) var(--ease)}
.stat-card:hover{transform:translateY(-4px); box-shadow:0 10px 30px rgba(215,38,61,.1)}
.stat-card .count{font-family:'Montserrat',sans-serif; font-size:42px; font-weight:800; color:#fff; display:block; margin-bottom:12px}
.stat-card .label{color:var(--muted); font-size:14px; text-transform:uppercase; letter-spacing:.5px}
@media (max-width: 980px){.stats-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width: 640px){.stats-grid{grid-template-columns:1fr}}

/* About split (for about.html) - OLD */
.about-split{display:grid; grid-template-columns:1.1fr .9fr; gap:32px; align-items:center}
.about-media picture{display:block; border-radius:var(--radius); overflow:hidden; border:1px solid rgba(255,255,255,.06)}
.about-content p{font-size:18px}
.stats{display:flex; gap:24px; flex-wrap:wrap; margin-top:16px}
.stat{background:var(--surface); border:1px solid rgba(255,255,255,.06); border-radius:var(--radius); padding:16px 18px; min-width:180px}
.stat .count{font-family:'Montserrat',sans-serif; font-size:32px; font-weight:800}
.stat .label{color:var(--muted)}

/* About Premium Box - Vertical Centered Layout */
.about-premium-box{background:var(--surface); border:1px solid rgba(255,255,255,.06); border-radius:var(--radius); padding:56px 48px; box-shadow:var(--shadow-elev); max-width:1100px; margin:0 auto}
.about-content-wrapper{display:flex; flex-direction:column; gap:48px}

/* Text Section */
.about-text-section{text-align:center}
.lead-text-centered{font-size:clamp(20px, 3vw, 28px); line-height:1.6; color:#fff; margin:0 0 48px; font-weight:700; max-width:900px; margin-left:auto; margin-right:auto}
.lead-text-centered strong{color:var(--accent)}

/* Two Column Text */
.text-columns{display:grid; grid-template-columns:1fr 1fr; gap:40px; margin-bottom:48px; text-align:left}
.text-col p{font-size:clamp(15px, 1.8vw, 17px); line-height:1.8; margin-bottom:20px; color:var(--muted)}
.text-col p strong{color:#fff}

/* Signature Section */
.about-signature{display:flex; flex-direction:column; align-items:center; gap:16px; padding:32px 0; position:relative}
.signature-line{width:80px; height:2px; background:linear-gradient(90deg, transparent, var(--accent), transparent)}
.signature-text{font-size:clamp(16px, 2vw, 18px); color:var(--muted); margin:0; font-style:italic}
.signature-accent{font-family:'Montserrat',sans-serif; font-size:clamp(22px, 3vw, 32px); font-weight:800; color:var(--accent); margin:0; text-transform:uppercase; letter-spacing:2px}

/* Image Section */
.about-image-section{display:flex; justify-content:center; padding-top:24px; border-top:1px solid rgba(255,255,255,.06)}
.about-image-frame{width:100%; max-width:900px; border-radius:var(--radius); overflow:hidden; border:1px solid rgba(255,255,255,.08); box-shadow:0 20px 60px rgba(0,0,0,.5), 0 0 0 1px rgba(215,38,61,.05); transition:all var(--base) var(--ease)}
.about-image-frame:hover{transform:translateY(-4px); box-shadow:0 30px 80px rgba(215,38,61,.15), 0 20px 60px rgba(0,0,0,.5), 0 0 0 2px rgba(215,38,61,.2)}
.about-image-frame img{width:100%; height:auto; display:block; object-fit:cover}

@media (max-width: 980px){
  .about-premium-box{padding:32px 24px}
  .text-columns{grid-template-columns:1fr; gap:24px; text-align:center}
  .about-content-wrapper{gap:32px}
}
@media (max-width: 980px){.about-split{grid-template-columns:1fr;}}

/* Contact split - OLD */
.contact-split{display:grid; grid-template-columns:1fr 1fr; gap:32px}
.contact-form{background:var(--surface); border:1px solid rgba(255,255,255,.06); border-radius:var(--radius); padding:18px}
.field{display:flex; flex-direction:column; gap:6px; margin-bottom:12px}
.field label{font-weight:500}
.field input,.field textarea{background:#111; color:#fff; border:1px solid rgba(255,255,255,.1); border-radius:10px; padding:12px}
.field input:focus,.field textarea:focus{outline:2px solid var(--accent); outline-offset:2px}
.error{color:#ff8080; font-size:12px; min-height:16px}
.actions{display:flex; gap:10px; justify-content:flex-end}
.contact-info{padding:6px}
.contact-list{list-style:none; padding:0; margin:12px 0}
.contact-list a{color:#fff; text-decoration:underline}
.socials{display:flex; gap:10px}
.social{display:inline-flex; align-items:center; justify-content:center; width:38px; height:38px; border-radius:50%; border:1px solid rgba(255,255,255,.18); transition:background var(--base) var(--ease), box-shadow var(--base) var(--ease)}
.social:hover{background:rgba(215,38,61,.15); box-shadow:0 0 0 4px rgba(215,38,61,.25)}

/* Contact Split Enhanced */
.contact-split-enhanced{display:grid; grid-template-columns:1fr 1fr; gap:32px; align-items:stretch}
.contact-form-card, .contact-info-card{background:var(--surface); border:1px solid rgba(255,255,255,.08); border-radius:var(--radius); padding:28px; box-shadow:0 10px 40px rgba(0,0,0,.3), 0 0 0 1px rgba(255,255,255,.03); transition:transform var(--base) var(--ease), box-shadow var(--base) var(--ease); display:flex; flex-direction:column; min-height:540px}
.contact-form-card:hover, .contact-info-card:hover{transform:translateY(-4px); box-shadow:0 20px 60px rgba(215,38,61,.1), 0 10px 40px rgba(0,0,0,.3)}
.contact-info-card{position:relative}
.contact-form-enhanced{flex:1}
.card-header, .info-card-header{margin-bottom:28px}
.card-header h2, .info-card-header h2{font-family:'Montserrat',sans-serif; font-size:clamp(22px, 3vw, 28px); font-weight:700; margin:0 0 8px; color:#fff}
.card-header p, .info-card-header p{color:var(--muted); margin:0; font-size:15px}

/* Enhanced Form Fields */
.contact-form-enhanced{display:flex; flex-direction:column; gap:20px}
.field-enhanced{display:flex; flex-direction:column; gap:8px}
.field-enhanced label{font-weight:600; font-size:14px; color:#fff; letter-spacing:.3px}
.field-enhanced input, .field-enhanced textarea{background:#0a0a0b; color:#fff; border:1px solid rgba(255,255,255,.12); border-radius:10px; padding:14px 16px; font-family:inherit; font-size:15px; transition:all var(--base) var(--ease)}
.field-enhanced input:focus, .field-enhanced textarea:focus{outline:none; border-color:var(--accent); box-shadow:0 0 0 3px rgba(215,38,61,.15); background:#111}
.field-enhanced input:hover, .field-enhanced textarea:hover{border-color:rgba(255,255,255,.2)}
.field-enhanced textarea{resize:vertical; min-height:140px}
.field-enhanced .error{color:#ff8080; font-size:13px; min-height:18px; margin-top:4px}
.actions-enhanced{display:flex; gap:12px; justify-content:flex-end; margin-top:8px}

/* Enhanced Button with Glow */
.btn-glow{position:relative; overflow:hidden}
.btn-glow::after{content:""; position:absolute; inset:0; border-radius:inherit; background:linear-gradient(45deg, transparent, rgba(255,255,255,.1), transparent); transform:translateX(-100%); transition:transform var(--slow) var(--ease)}
.btn-glow:hover::after{transform:translateX(100%)}

/* Contact Details */
.contact-details{display:flex; flex-direction:column; gap:24px; margin-bottom:32px}
.contact-item{display:flex; gap:16px; align-items:start; padding:16px; background:rgba(255,255,255,.02); border-radius:10px; border:1px solid rgba(255,255,255,.05); transition:all var(--base) var(--ease)}
.contact-item:hover{background:rgba(215,38,61,.05); border-color:rgba(215,38,61,.2); transform:translateX(4px)}
.contact-icon{font-size:28px; line-height:1; flex-shrink:0}
.contact-text{display:flex; flex-direction:column; gap:4px}
.contact-text strong{color:#fff; font-size:14px; font-weight:600}
.contact-text a, .contact-text span{color:var(--muted); font-size:15px; transition:color var(--fast) var(--ease)}
.contact-text a:hover{color:var(--accent)}

/* Social Section Enhanced */
.social-section{margin:32px 0}
.social-section h3{font-family:'Montserrat',sans-serif; font-size:18px; font-weight:700; margin:0 0 16px; color:#fff}
.socials-enhanced{display:grid; grid-template-columns:repeat(4, 1fr); gap:12px}
.social-enhanced{display:flex; align-items:center; justify-content:center; aspect-ratio:1; background:rgba(255,255,255,.03); border:1px solid rgba(255,255,255,.1); border-radius:var(--radius); transition:all var(--base) var(--ease); position:relative; overflow:hidden}
.social-enhanced::before{content:""; position:absolute; inset:0; background:radial-gradient(circle at center, rgba(215,38,61,.2), transparent); opacity:0; transition:opacity var(--base) var(--ease)}
.social-enhanced:hover{transform:translateY(-4px); border-color:var(--accent); box-shadow:0 8px 24px rgba(215,38,61,.3), 0 0 0 1px var(--accent)}
.social-enhanced:hover::before{opacity:1}
.social-label{font-weight:700; font-size:16px; color:#fff; position:relative; z-index:2; text-shadow:0 2px 8px rgba(0,0,0,.5)}

/* Contact Page Social Buttons - Same style as index */
.socials-contact{display:flex; gap:10px; justify-content:flex-start}
.socials-contact .social{width:38px; height:38px}

/* Location Visual */
.location-visual{margin-top:32px}
.location-placeholder{border-radius:var(--radius); overflow:hidden; border:1px solid rgba(255,255,255,.08); box-shadow:0 10px 30px rgba(0,0,0,.4)}
.location-placeholder img{width:100%; height:auto; display:block; object-fit:cover; aspect-ratio:16/9; transition:transform var(--slow) var(--ease)}
.location-placeholder:hover img{transform:scale(1.05)}

/* Contact Corner Image (floating, positionable) */
.contact-corner-image{position:absolute; width:clamp(140px, 28vw, 320px); height:auto; z-index:2; pointer-events:none; filter:drop-shadow(0 10px 24px rgba(0,0,0,.45)); transform:translate(var(--contact-img-shift-x, 0), var(--contact-img-shift-y, 0)) scale(var(--contact-img-scale, 1)); transform-origin:bottom right}
.contact-corner-image[data-position="top-left"]{transform-origin:top left}
.contact-corner-image[data-position="top-right"]{transform-origin:top right}
.contact-corner-image[data-position="bottom-left"]{transform-origin:bottom left}
.contact-corner-image[data-position="bottom-right"]{transform-origin:bottom right}
.contact-corner-image[data-position="top-left"]{top:var(--contact-img-offset-y,16px); left:var(--contact-img-offset-x,16px)}
.contact-corner-image[data-position="top-right"]{top:var(--contact-img-offset-y,16px); right:var(--contact-img-offset-x,16px)}
.contact-corner-image[data-position="bottom-left"]{bottom:var(--contact-img-offset-y,16px); left:var(--contact-img-offset-x,16px)}
.contact-corner-image[data-position="bottom-right"]{bottom:var(--contact-img-offset-y,16px); right:var(--contact-img-offset-x,16px)}
@media (max-width: 980px){.contact-corner-image{width:clamp(120px, 32vw, 260px)}}
@media (max-width: 640px){.contact-corner-image{width:clamp(100px, 36vw, 220px); opacity:.95}}

@media (max-width: 980px){
  .contact-split{grid-template-columns:1fr}
  .contact-split-enhanced{grid-template-columns:1fr; gap:32px}
  .socials-enhanced{grid-template-columns:repeat(2, 1fr)}
  .socials-contact{flex-wrap:wrap}
  .contact-form-card, .contact-info-card{min-height:auto}
}

/* Footer */
.footer{background:#0d0d0e; border-top:1px solid rgba(255,255,255,.06); margin-top:48px}
.footer-grid{display:grid; grid-template-columns:1.2fr .8fr .8fr 1fr; gap:20px; padding:36px 0}
.footer-logo{display:flex; flex-direction:column; align-items:center; gap:8px}
.footer-logo img{width:320px; height:auto}
.footer-col, .footer-brand{display:flex; flex-direction:column; gap:8px}
.footer-brand{align-items:center; text-align:center}
.footer-brand .muted{margin-top:0.875rem}
.newsletter{display:flex; gap:8px}
.newsletter input{flex:1; background:#111; color:#fff; border:1px solid rgba(255,255,255,.1); border-radius:10px; padding:10px}
.footer-bottom{border-top:1px solid rgba(255,255,255,.06); padding:14px 0; color:var(--muted); text-align:center}
@media (max-width: 980px){.footer-grid{grid-template-columns:1fr 1fr}}
@media (max-width: 640px){.footer-grid{grid-template-columns:1fr}}

/* Back to top */
.back-to-top{position:fixed; right:16px; bottom:16px; width:44px; height:44px; border-radius:50%; border:1px solid rgba(255,255,255,.2); background:rgba(22,22,22,.9); color:#fff; display:grid; place-items:center; opacity:0; visibility:hidden; transition:opacity var(--base) var(--ease), visibility var(--base) var(--ease)}
.back-to-top.show{opacity:1; visibility:visible}

/* Reveal on scroll */
[data-reveal]{opacity:0; transform:translateY(18px); transition:opacity var(--slow) var(--ease), transform var(--slow) var(--ease)}
[data-reveal].is-visible{opacity:1; transform:translateY(0)}

/* Ripple */
.ripple{position:relative; overflow:hidden}
.ripple::after{content:""; position:absolute; inset:0; border-radius:inherit; transform:scale(0); background:radial-gradient(circle, rgba(255,255,255,.25) 10%, rgba(255,255,255,0) 70%); opacity:0; transition:transform var(--base) var(--ease), opacity var(--base) var(--ease)}
.ripple.active::after{transform:scale(4); opacity:1}

/* Magnetic */
.magnetic{transition:transform var(--fast) var(--ease)}

/* Focus */
:focus-visible{outline-offset:3px}

/* Brands Section */
.brands{background:#0e0e0f; color:#fff; padding:80px 0; overflow:hidden; border-top:1px solid #222; border-bottom:1px solid #222}
.brands__title{text-align:center; margin-bottom:2rem}
.brands__title h2{font-size:1.6rem; color:#d7263d; font-weight:600; letter-spacing:.05em}
.brands__slider{overflow:hidden; position:relative; height:120px; display:flex; align-items:center}
.brands__track{display:flex; animation:scroll 45s linear infinite; align-items:center; will-change:transform}
.brands__track img{height:60px; width:auto; max-width:120px; object-fit:contain; filter:grayscale(100%) brightness(.8); opacity:.7; transition:all .3s ease; flex-shrink:0; display:block; margin:0 60px}

/* Logos com tamanho dobrado (exceto FBI, RE/MAX, Tapete, Keller Williams) */
.brands__track img[alt="Alberto Oculista"]{transform:scale(2.0)}
.brands__track img[alt="Emotion"]{transform:scale(2.0)}
.brands__track img[alt="Pink"]{transform:scale(2.0)}
.brands__track img[alt="Teleférico"]{transform:scale(2.0)}
.brands__track img[alt="Bioforma"]{transform:scale(2.0)}
.brands__track img[alt="Play"]{transform:scale(2.0)}
.brands__track img[alt="Century 21"]{transform:scale(2.0)}
.brands__track img[alt="OBrien"]{transform:scale(2.0)}

/* Espaçamento personalizado para logos menores */
.brands__track img[alt="FBI"]{margin:0 15px}
.brands__track img[alt="RE/MAX"]{margin:0 15px}
.brands__track img[alt="Tapete"]{margin:0 15px}
.brands__track img[alt="Keller Williams"]{margin:0 15px}

/* Hover effects corrigidos */
.brands__track img[alt="Alberto Oculista"]:hover{filter:grayscale(0%) brightness(1); opacity:1; transform:scale(2.1)}
.brands__track img[alt="Emotion"]:hover{filter:grayscale(0%) brightness(1); opacity:1; transform:scale(2.1)}
.brands__track img[alt="Pink"]:hover{filter:grayscale(0%) brightness(1); opacity:1; transform:scale(2.1)}
.brands__track img[alt="Teleférico"]:hover{filter:grayscale(0%) brightness(1); opacity:1; transform:scale(2.1)}
.brands__track img[alt="Bioforma"]:hover{filter:grayscale(0%) brightness(1); opacity:1; transform:scale(2.1)}
.brands__track img[alt="Play"]:hover{filter:grayscale(0%) brightness(1); opacity:1; transform:scale(2.1)}
.brands__track img[alt="Century 21"]:hover{filter:grayscale(0%) brightness(1); opacity:1; transform:scale(2.1)}
.brands__track img[alt="OBrien"]:hover{filter:grayscale(0%) brightness(1); opacity:1; transform:scale(2.1)}

.brands__track img[alt="FBI"]:hover{filter:grayscale(0%) brightness(1); opacity:1; transform:scale(1.05)}
.brands__track img[alt="RE/MAX"]:hover{filter:grayscale(0%) brightness(1); opacity:1; transform:scale(1.05)}
.brands__track img[alt="Tapete"]:hover{filter:grayscale(0%) brightness(1); opacity:1; transform:scale(1.05)}
.brands__track img[alt="Keller Williams"]:hover{filter:grayscale(0%) brightness(1); opacity:1; transform:scale(1.05)}

/* Animação infinitamente suave - 3 sets para transição perfeita */
@keyframes scroll{
  0%{transform:translateX(0)}
  100%{transform:translateX(-33.333%)}
}

/* Gallery Modal - Instagram Carousel Style with Pan Effect */
.gallery-modal{position:fixed; inset:0; background:rgba(0,0,0,.95); display:flex; align-items:center; justify-content:center; opacity:0; visibility:hidden; transition:opacity var(--base) var(--ease), visibility var(--base) var(--ease); z-index:100; padding:20px}
.gallery-modal.open{opacity:1; visibility:visible}
.gallery-modal-content{position:relative; width:min(90vw,800px); max-height:90vh; background:var(--surface); border:1px solid rgba(255,255,255,.1); border-radius:var(--radius); overflow:hidden; transform:scale(.9); transition:transform var(--base) var(--ease); display:flex; flex-direction:column}
.gallery-modal.open .gallery-modal-content{transform:scale(1)}
.gallery-modal-close{position:absolute; top:16px; right:16px; width:44px; height:44px; background:rgba(0,0,0,.85); color:#fff; border:1px solid rgba(255,255,255,.2); border-radius:50%; display:flex; align-items:center; justify-content:center; cursor:pointer; z-index:10; transition:all var(--base) var(--ease); font-size:28px; font-weight:300; line-height:1}
.gallery-modal-close:hover{background:var(--accent); border-color:var(--accent); transform:rotate(90deg); box-shadow:0 0 20px rgba(215,38,61,.6)}
.gallery-nav{position:absolute; top:50%; transform:translateY(-50%); width:100%; display:flex; justify-content:space-between; padding:0 20px; z-index:5; pointer-events:none}
.gallery-nav-btn{width:50px; height:50px; background:rgba(0,0,0,.7); color:#fff; border:1px solid rgba(255,255,255,.2); border-radius:50%; display:flex; align-items:center; justify-content:center; cursor:pointer; font-size:24px; font-weight:bold; transition:all var(--fast) var(--ease); pointer-events:auto; opacity:0}
.gallery-nav-btn:hover{background:rgba(215,38,61,.85); transform:translateY(-50%) scale(1.05)}
.gallery-prev{left:20px}
.gallery-next{right:20px}
.gallery-image-container{width:100%; height:70vh; display:flex; align-items:center; justify-content:center; background:#000; position:relative; overflow:hidden}
.gallery-image{max-width:100%; max-height:100%; object-fit:contain; border-radius:var(--radius); transition:transform .3s ease}
.gallery-info{padding:20px; text-align:center; border-top:1px solid rgba(255,255,255,.1); background:var(--surface)}
.gallery-title{font-size:1.5rem; font-weight:600; margin-bottom:8px; color:#fff}
.gallery-description{color:var(--muted); margin-bottom:16px}
.gallery-counter{color:var(--muted); font-size:.9rem}

/* Pan Slider Styles */
.pan-viewport{overflow:hidden; width:100%; height:100%; position:relative}
.pan-strip{display:flex; will-change:transform; transition:transform 600ms cubic-bezier(0.22,1,0.36,1); height:100%}
.pan-strip img{width:100%; height:100%; object-fit:contain; flex:0 0 100%; user-select:none; pointer-events:none}
.pan-strip.is-moving img{filter:saturate(1.05) contrast(1.02)}

/* Instagram-style carousel indicators */
.gallery-indicators{position:absolute; bottom:20px; left:50%; transform:translateX(-50%); display:flex; gap:8px; z-index:5}
.gallery-indicator{width:8px; height:8px; border-radius:50%; background:rgba(255,255,255,.3); cursor:pointer; transition:background var(--fast) var(--ease)}
.gallery-indicator.active{background:#fff}

/* Show navigation on hover */
.gallery-modal-content:hover .gallery-nav-btn{opacity:1}

/* Reduced motion */
@media (prefers-reduced-motion: reduce){
  .pan-strip{transition:transform 0.01ms linear}
  *{animation-duration:0.01ms !important; animation-iteration-count:1 !important; transition-duration:0.01ms !important}
  .premium-highlight::before{animation:none}
  .hero-video, .about-hero-video, .contact-hero-video{animation:none}
  .feature-card, .stat-card, .contact-item, .social-enhanced, .media-frame{transition:none !important}
}

/* Video Modal */
.video-modal{position:fixed; inset:0; background:rgba(0,0,0,.9); display:flex; align-items:center; justify-content:center; opacity:0; visibility:hidden; transition:opacity var(--base) var(--ease), visibility var(--base) var(--ease); z-index:100; padding:20px}
.video-modal.open{opacity:1; visibility:visible}
.video-modal-content{position:relative; width:min(1200px,95%); max-height:90vh; background:var(--surface); border:1px solid rgba(255,255,255,.1); border-radius:var(--radius); overflow:hidden; transform:scale(.9); transition:transform var(--base) var(--ease)}
.video-modal.open .video-modal-content{transform:scale(1)}
.video-modal-close{position:absolute; top:16px; right:16px; width:44px; height:44px; background:rgba(0,0,0,.85); color:#fff; border:1px solid rgba(255,255,255,.2); border-radius:50%; display:flex; align-items:center; justify-content:center; cursor:pointer; z-index:10; transition:all var(--base) var(--ease); font-size:24px; font-weight:300; line-height:1}
.video-modal-close::before{content:"×"}
.video-modal-close:hover{background:var(--accent); border-color:var(--accent); transform:rotate(90deg); box-shadow:0 0 20px rgba(215,38,61,.6)}
.video-modal-player{position:relative; width:100%; aspect-ratio:16/9}
.video-modal-player iframe{width:100%; height:100%; border:0}
.video-modal-info{padding:24px; background:var(--surface)}
.video-modal-info h3{font-family:'Montserrat',sans-serif; font-weight:700; font-size:24px; margin:0 0 12px; color:#fff}
.video-modal-info p{color:var(--muted); margin:0; font-size:16px; line-height:1.6}

/* Social button icons */
:root {
  --social-icon-size-yt: 150%;
  --social-icon-size-ig: 110%;
  --social-icon-size-wp: 100%;
  --social-icon-size-vm: 100%;
}
.social[aria-label="YouTube"], .social.youtube, .social.yt {
  background-image: url("../icons/social/youtube.png");
  background-size: var(--social-icon-size-yt) var(--social-icon-size-yt);
}
.social[aria-label="Instagram"], .social.instagram, .social.ig {
  background-image: url("../icons/social/instagram.png");
  background-size: var(--social-icon-size-ig) var(--social-icon-size-ig);
}
.social[aria-label="WhatsApp"], .social.whatsapp, .social.wp {
  background-image: url("../icons/social/whatsapp.svg");
  background-size: var(--social-icon-size-wp) var(--social-icon-size-wp);
}
.social[aria-label="Vimeo"], .social.vimeo, .social.vm {
  background-image: url("../icons/social/vimeo.png");
  background-size: var(--social-icon-size-vm) var(--social-icon-size-vm);
}
.social[aria-label], .social {
  background-color: transparent;
  background-repeat: no-repeat;
  background-position: center;
  position: relative;
  color: #fff;
  z-index: 1;
  /* ensure the icon is visually present but button text stays */
}
.social[aria-label]::before, .social::before {
  content: "";
  display: block;
  position: absolute;
  inset: 0;
  background: inherit;
  background-image: inherit;
  background-repeat: inherit;
  background-position: inherit;
  background-size: inherit;
  opacity: 1;
  z-index: 0;
  pointer-events: none;
  border-radius: 50%;
}
.social {
  color: #fff;
  font-weight: bold;
  font-size: 1.12em;
  text-shadow: 0 0 11px #0008;
}
.social[aria-label], .social {
  /* shift text above icon unless icon-only */
  display: flex;
  align-items: center;
  justify-content: center;
}
.social span, .social-text {
  position: relative;
  z-index: 2;
  /* to stay above the pseudo background */
}
.social:hover, .social:focus-visible {
  box-shadow: 0 0 0 4px #d7263d55, 0 0 16px #d7263d;
}
.social:hover::before, .social:focus-visible::before {
  filter: drop-shadow(0 0 12px #d7263d) drop-shadow(0 0 18px #d7263d);
}
@media (max-width: 640px) {
  :root {
    --social-icon-size-yt: 54%;
    --social-icon-size-ig: 54%;
    --social-icon-size-wp: 54%;
    --social-icon-size-vm: 54%;
  }
  .social[aria-label="YouTube"], .social.youtube, .social.yt,
  .social[aria-label="Instagram"], .social.instagram, .social.ig,
  .social[aria-label="WhatsApp"], .social.whatsapp, .social.wp,
  .social[aria-label="Vimeo"], .social.vimeo, .social.vm{
    background-size: cover;
  }
}

@media (max-width: 980px){
  /* Preencher o botão em tablets e ecrãs médios */
  .social[aria-label="YouTube"], .social.youtube, .social.yt,
  .social[aria-label="Instagram"], .social.instagram, .social.ig,
  .social[aria-label="WhatsApp"], .social.whatsapp, .social.wp,
  .social[aria-label="Vimeo"], .social.vimeo, .social.vm{
    background-size: cover;
  }
  /* Compensação para YouTube não parecer menor em alguns ecrãs */
  .social[aria-label="YouTube"], .social.youtube, .social.yt{
    background-size: 130%;
  }
}