/*
Theme Name: Solstice Lab
Author: ANTNNA
Author URI: http://antnna.com
Description: Tema customizado para o site Solstice Lab.
Tags: art, minimalist, black and white
Version: 2026
Requires at least: 5.0
License: GNU General Public License v3 or Later
License URI: https://www.gnu.org/licenses/gpl.html
*/

/******00) REGRAS GERAIS ******/
body {background-color: var(--site-bg); overscroll-behavior: none;}
* {margin: 0; padding: 0; box-sizing: border-box; position: relative; text-decoration: none; scroll-behavior: smooth; -ms-overflow-style: none; scrollbar-width: none; letter-spacing: -0.01em; color: #fff;}
div {display: block;}
::-webkit-scrollbar {display: none;}
::selection {background-color: #304DB0; color:#fff;}
ul, li, figure {list-style:none; margin: 0; padding: 0;}
img {max-width: 100%;;}
a, span {display: block;}
p {color: var(--site-alted); text-decoration:none; margin:0; padding:0; font-size: 18px; line-height: 1.4; font-weight: 200; font-family: 'Epilogue', arial, sans-serif;}
p strong {font-weight: 600;}
a, span, li {display: block; line-height: 1; font-weight: 500; list-style: none; text-decoration: none;}
a {font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;}
a:hover {transition: all ease .3s;}
p > a {display: initial;}
a, path {transition: all 0.15s linear;}
h1, h2 , h3 , h4 , h5 , h6 {font-weight: normal; letter-spacing: 0; color: var(--site-text); font-family: 'PPMigra', georgia, serif;}
select::-ms-expand {display: none;}
:root {scroll-padding-top: 92px;}
button {font-family: 'Epilogue', arial, sans-serif; font-weight: 300;}
p+p {margin-top: 18px;}

/* pre-sets */
.container {width: 90vw; max-width: 1920px; margin: 0 auto; position: relative;}
.d-flex {display: flex; align-items: center;}
.j-sa {justify-content: space-around;}
.j-sb {justify-content: space-between;}
.d-table {display: table;}
.a-base {align-items: baseline;}
.ovflow {overflow-x: scroll; overflow-y: hidden; flex-wrap: nowrap;}
.ovflow::-webkit-scrollbar {display: none;}
.vh {height: 100vh; height: 100dvh; padding: 0; min-height: 520px;}
.vw {width: 100vw; width: 100dvw; padding: 0;}
.ph {height: 100%;}
.pw {width: 100%;}
.ov-hid {overflow: hidden;}
.txt-c {text-align: center;}
.txt-r {text-align: right;}
.p-fix {position: fixed;}
.p-abs {position: absolute;}
.p-stk {position: sticky; top: 0;}
.bdt {border-top: 1px solid var(--site-muted);}
.bdb {border-bottom: 1px solid var(--site-muted);}
.mw {max-width: 1080px;}

/* padrões de posicionamento */
.c-holder {position: absolute; top: 50%; transform: translateY(-50%); left: 0; right: 0; margin: 0 auto;}
.v-holder {position: absolute; top: 50%; transform: translateY(-50%);}
.m-holder {margin: 0 auto; left: 0; right: 0;}
.r0 {right: 0;}
.l0 {left: 0;}
.b0 {bottom: 0;}
.t0 {top: 0;}
.zdex1 {z-index: 1;}
.zdex3 {z-index: 3;}
.zdex6 {z-index: 6;}
.zdex9 {z-index: 9;}

/* padrões de espaçamento */
.padtop1 {padding-top: 1vh;}
.padbot1 {padding-bottom: 1vh;}
.padtop2 {padding-top: 2vh;}
.padbot2 {padding-bottom: 2vh;}
.padtop3 {padding-top: 3vh;}
.padbot3 {padding-bottom: 3vh;}
.padtop4 {padding-top: 4vh;}
.padbot4 {padding-bottom: 4vh;}
.padtop5 {padding-top: 6vh;}
.padbot5 {padding-bottom: 6vh;}
.padtop6 {padding-top: 8vh;}
.padbot6 {padding-bottom: 8vh;}
.padtop7 {padding-top: 10vh;}
.padbot7 {padding-bottom: 10vh;}
.padtop8 {padding-top: 12vh;}
.padbot8 {padding-bottom: 12vh;}
.padtop9 {padding-top: 16vh;}
.padbot9 {padding-bottom: 16vh;}
.padtop10 {padding-top: 20vh;}
.padbot10 {padding-bottom: 20vh;}

/* padrões de cor */
.bg00 {background-color: #000;}
.bg01 {background-color: #fff;}
.bg02 {background-color: #304DB0;}
.bg03 {background-color: #C4C4C4;}
.bg04 {background-color: #707070;}
.c00, .c00 * {color: #000;}
.c01, .c01 * {color: #fff;}
.c02, .c02 * {color: #304DB0;}
.c03, .c03 * {color: #C4C4C4;}
.c04, .c04 * {color: #707070;}
.gradiente {background: linear-gradient(180deg, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0.1) 23%, rgba(0,0,0,0) 100%); position: absolute; left: 0; top: 0; height: 100%; width: 100%;}
.gradiente-inv {background: linear-gradient(0deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0.4) 30%, rgba(0,0,0,0.05) 40%, rgba(0,0,0,0) 100%); position: absolute; left: 0; top: 0; height: 100%; width: 100%;}

/******01) FONT EMBEDS ******/
@font-face {
    font-family: 'PPMigra';
    src: url('assets/fonts/PPMigra-Regular.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'PPMigra';
    src: url('assets/fonts/PPMigra-Italic.woff2') format('woff2');
    font-weight: 400;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'PPMigra';
    src: url('assets/fonts/PPMigra-Bold.woff2') format('woff2');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'PPMigra';
    src: url('assets/fonts/PPMigra-BoldItalic.woff2') format('woff2');
    font-weight: 700;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Helvetica Neue';
    src: url('assets/fonts/HelveticaNeueRoman.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Epilogue';
    src: url('assets/fonts/Epilogue-Medium.woff2') format('woff2');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Epilogue';
    src: url('assets/fonts/Epilogue-ExtraLight.woff2') format('woff2');
    font-weight: 200;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Epilogue';
    src: url('assets/fonts/Epilogue-Light.woff2') format('woff2');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Epilogue';
    src: url('assets/fonts/Epilogue-LightItalic.woff2') format('woff2');
    font-weight: 300;
    font-style: italic;
    font-display: swap;
}


/* tema */
body.theme-night {--site-bg: #000; --site-text: #fff; --site-muted: #707070; --site-alted: #c4c4c4; --site-blue: #304DB0; --site-border: rgba(112, 112, 112, 0.6); --header-bg: rgba(0, 0, 0, 0.55);}
body.theme-day {--site-bg: #fff; --site-text: #000; --site-muted: #c4c4c4; --site-alted: #707070; --site-blue: #304DB0; --site-border: rgba(112, 112, 112, 0.45); --header-bg: rgba(255, 255, 255, 0.62);}

body {margin: 0; background-color: var(--site-bg); color: var(--site-text); transition: background-color 0.45s ease, color 0.45s ease;}
body.is-menu-open {overflow: hidden;}

body.theme-day img {filter: invert(100);}

img {max-width: 100%; height: auto; display: block;}
button {padding: 0; border: 0; background: transparent; color: inherit; cursor: pointer; font: inherit;}

/* page transition */
.page-transition {position: fixed; z-index: 9999; inset: 0; background-color: var(--site-bg); opacity: 1; visibility: visible; pointer-events: none; transition: opacity 0.7s ease, visibility 0.7s ease;}
.page-transition.is-hidden {opacity: 0; visibility: hidden;}
.page-transition.is-active {opacity: 1; visibility: visible;}

/******02) HEADER & VITRINES ******/
.site-header {position: fixed; z-index: 1000; top: 0; left: 0; width: 100%; background-color: transparent; border-bottom: 1px solid transparent; transition: background-color 0.35s ease, border-color 0.35s ease, backdrop-filter 0.35s ease;}
.site-header.is-active {background-color: transparent; border-bottom-color: var(--site-border); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(24px);}
.site-header__inner {display: flex; align-items: center; justify-content: space-between; gap: 32px; padding: 20px 0;}
.site-header__logo {display: block; transition: all 0.3s ease;}
.site-header__logo:hover {filter: brightness(99); transition: .3s all ease;}
.site-header__logo img {width: 100%; height: 40px;}

/* menu desktop */
.site-header__nav {flex: 1;}
.site-menu {margin: 0; padding: 0; list-style: none; display: flex; justify-content: center; gap: clamp(22px, 2.1vw, 42px);}
.site-menu li {margin: 0; padding: 0;}
.site-menu a {color: var(--site-text); text-decoration: none; text-transform: uppercase; letter-spacing: 0.36em; font-size: 11px; line-height: 1; opacity: 0.46; transition: opacity 0.25s ease, color 0.25s ease;}
.site-menu a:hover {opacity: 1;}

/* switch day/night */
.theme-switch {display: flex; align-items: center; gap: 5px;}
.theme-switch__btn {min-width: 72px; height: 27px; padding: 0 18px; border: 1px solid var(--site-muted); border-radius: 999px; color: var(--site-text); text-transform: uppercase; letter-spacing: 0.28em; font-size: 9px; line-height: 1; opacity: 0.7; transition: all .3s ease; font-family: 'Epilogue', arial, sans-serif; font-weight: 500;}
.theme-switch__btn.is-active {background-color: var(--site-text); border-color: var(--site-text); color: var(--site-bg); opacity: 1;}
.theme-switch__btn:hover {opacity: 1;}

/* hero */
.hero {position: relative; min-height: 580px; height: 100vh; max-height: 940px; overflow: hidden; background-color: var(--site-bg); border-bottom: 1px solid #304DB0;}
.hero__media {position: absolute; z-index: 1; inset: 0; margin: 0; overflow: hidden; pointer-events: none;}
.hero__media img {width: 90%; height: auto; object-fit: contain; object-position: center center; opacity: 1; transition: opacity 0.45s ease, filter 0.45s ease; margin: 0 auto; top: 10%;}
.hero__inner {position: relative; z-index: 2; height: 100%; display: flex; align-items: center;}
.hero__title {margin: 0; max-width: 640px; color: var(--site-text); font-size: clamp(88px, 6.4vw, 64px); font-weight: 400; line-height: 1; letter-spacing: -0.02em;}

/* mobile menu button */
.mobile-menu-btn {width: 36px; height: 28px; position: relative;}
.mobile-menu-btn span {width: 36px; height: 4px; display: block; margin-bottom: 5px; background-color: var(--site-muted); transition: transform 0.25s ease, opacity 0.25s ease;}
.mobile-menu-btn span:last-child {margin-bottom: 0;}

/* mobile overlay */
.mobile-menu {position: fixed; z-index: 2000; inset: 0; background-color: var(--site-bg); color: var(--site-text); opacity: 0; visibility: hidden; pointer-events: none; transition: opacity 0.38s ease, visibility 0.38s ease;}
.mobile-menu::before {content: ""; position: absolute; inset: 38% 0 0 0; background: linear-gradient(180deg, var(--site-bg), #304DB0 100%); pointer-events: none;}
.mobile-menu.is-open {opacity: 1; visibility: visible; pointer-events: auto;}
.mobile-menu__inner {position: relative; z-index: 2; min-height: 100%; padding: 29px 24px 32px; display: flex; flex-direction: column;}
.mobile-menu__top {display: flex; align-items: flex-start; justify-content: space-between;}
.mobile-menu__logo {width: 128px; opacity: 0.7;}
.mobile-menu__close {width: 27px; height: 27px; position: relative; margin-top: 2px;}
.mobile-menu__close span {position: absolute; top: 12px; left: 0; width: 31px; height: 3px; background-color: var(--site-muted); transform-origin: center;}
.mobile-menu__close span:first-child {transform: rotate(45deg);}
.mobile-menu__close span:last-child {transform: rotate(-45deg);}
.mobile-menu__nav {margin-top: 205px;}
.mobile-menu__list {margin: 0; padding: 0; list-style: none;}
.mobile-menu__list li {margin: 0 0 28px; padding: 0; opacity: 0; transform: translateY(14px); transition: opacity 0.45s ease, transform 0.45s ease;}
.mobile-menu.is-open .mobile-menu__list li {opacity: 1; transform: translateY(0);}
.mobile-menu.is-open .mobile-menu__list li:nth-child(1) {transition-delay: 0.08s;}
.mobile-menu.is-open .mobile-menu__list li:nth-child(2) {transition-delay: 0.14s;}
.mobile-menu.is-open .mobile-menu__list li:nth-child(3) {transition-delay: 0.2s;}
.mobile-menu.is-open .mobile-menu__list li:nth-child(4) {transition-delay: 0.26s;}
.mobile-menu.is-open .mobile-menu__list li:nth-child(5) {transition-delay: 0.32s;}
.mobile-menu__list a {color: var(--site-text); text-decoration: none; text-transform: uppercase; font-size: clamp(36px, 10vw, 48px); line-height: 0.95; letter-spacing: -0.045em;}
.mobile-menu__theme {margin-top: 16px; opacity: 0; transform: translateY(14px); transition: opacity 0.45s ease 0.38s, transform 0.45s ease 0.38s;}
.mobile-menu.is-open .mobile-menu__theme {opacity: 1; transform: translateY(0);}
.mobile-menu__email {margin-top: auto; padding-top: 28px; border-top: 1px solid rgba(255, 255, 255, 0.65); color: var(--site-text); text-decoration: none; font-size: 25px; line-height: 1; letter-spacing: -0.035em; opacity: 0; transform: translateY(14px); transition: opacity 0.45s ease 0.44s, transform 0.45s ease 0.44s;}
.mobile-menu.is-open .mobile-menu__email {opacity: 1; transform: translateY(0);}


/* responsivo */
@media (max-width: 1080px) {
  .no-desk1 {display: none;}
  .mobile-only {display: block;}
  .site-header__inner {height: 128px;}
  .site-header__logo {width: 235px;}
  .home-hero {height: auto; min-height: 760px; max-height: none;}
  .home-hero__bg {background-position: center bottom; background-size: cover;}
  .home-hero__inner {min-height: 760px; align-items: flex-start; padding-top: 200px;}
  .home-hero__title {max-width: 460px; font-size: clamp(66px, 16vw, 86px); line-height: 0.96;}
}

@media (max-width: 768px) {
  .no-desk2 {display: none;}
  .site-header__inner {height: 126px;}
  .site-header__logo {width: 232px;}
  .home-hero {min-height: 700px;}
  .home-hero__inner {min-height: 700px; padding-top: 198px;}
  .home-hero__title {font-size: clamp(58px, 15.8vw, 72px);}
  .home-hero__bg {background-position: center bottom;}
}

@media (max-width: 480px) {
  .no-desk3 {display: none;}
  .site-header__inner {height: 126px;}
  .site-header__logo {width: 230px;}
  .mobile-menu__nav {margin-top: 210px;}
  .mobile-menu__list li {margin-bottom: 27px;}
  .mobile-menu__list a {font-size: clamp(37px, 10.5vw, 44px);}
  .home-hero {min-height: 680px;}
  .home-hero__inner {min-height: 680px; padding-top: 198px;}
}


/******03) CONTENT ******/
.side-to-side {display: grid; grid-template-columns: 1fr 480px; gap: 5vw;}
.side-to-side h2 {max-width: 640px;}
.midtext {font-size: 42px; line-height: 1.1;}
.chapeu {font-size: 16px; font-family: 'Epilogue', arial, sans-serif; font-weight: 300; color: var(--site-muted);}

/******04) FOOTER ******/
footer > .no-mob2, footer > .no-desk2 {border-bottom: 1px solid #304DB0; border-top: 1px solid #304DB0; padding-top: clamp(72px, 10vh, 42px); padding-bottom: clamp(72px, 10vh, 42px);}
footer .copyright {justify-content: space-between; padding: 24px 0 48px;}
footer .copyright span {font-family: 'PPMigra', georgia, serif; font-size: 15px; font-weight: 700; color: var(--site-muted); text-transform: uppercase;}
footer .copyright p {font-family: 'Epilogue', arial, sans-serif; font-size: 13px; font-weight: 300; color: var(--site-muted); text-transform: uppercase;}

/******99) RESPONSIVOS ******/

@media screen and (min-width: 1921px) {
}

@media screen and (min-width: 1481px) {
.no-desk0 {display: none;}
}

@media screen and (min-width: 1081px) {
.no-desk1 {display: none;}
}

@media screen and (min-width: 769px) {
.no-desk2 {display: none;}
}

@media screen and (min-width: 481px) {
.no-desk3 {display: none;}
}

@media screen and (max-width: 1080px) {
p {font-size: 16px;}
.padtop3 {padding-top: 3vh;}
.padbot3 {padding-bottom: 3vh;}
.padtop4 {padding-top: 4vh;}
.padbot4 {padding-bottom: 4vh;}
.padtop5 {padding-top: 5vh;}
.padbot5 {padding-bottom: 5vh;}
.padtop6 {padding-top: 6vh;}
.padbot6 {padding-bottom: 6vh;}
.padtop7 {padding-top: 7vh;}
.padbot7 {padding-bottom: 7vh;}
.padtop8 {padding-top: 8vh;}
.padbot8 {padding-bottom: 8vh;}
.padtop9 {padding-top: 10vh;}
.padbot9 {padding-bottom: 10vh;}
.padtop10 {padding-top: 12vh;}
.padbot10 {padding-bottom: 12vh;}
}

@media screen and (max-width: 768px) {
.no-mob2 {display: none !important;}
}

@media screen and (max-width: 480px) {
.no-mob3 {display: none !important;}
}

