@import url('https://fonts.googleapis.com/css2?family=Inter:wght@100..900&display=swap');
/* On The Way Travel - Stylesheet */

/* Font Face Declarations */
@font-face {
    font-family: 'Chalkduster';
    src: url('../../fonts/Chalkduster.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

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

/* CSS Variables */
:root {
    /* Primary Colors */
    --primary-brown: #682d00;
    --primary-green: #878c67;
    --primary-dark: #303133;
    
    /* Base Colors */
    --base-cream: #f2e9da;
    --base-tan: #b57e51;
    --base-light-green: #b5c2a3;
    
    /* Contrast Colors */
    --contrast-teal: #2f4b4e;
    --contrast-orange: #c95e2b;
    --contrast-yellow: #c99829;
    
    /* Typography */
    --font-headings: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji";
    --font-body: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji";
    
    /* Transitions */
    --transition-fast: 200ms ease;
    --transition-medium: 250ms ease;
}

/* Reset and Base Styles */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    font-family: var(--font-body);
    line-height: 1.6;
    color: var(--primary-dark);
    background-color: var(--base-cream);
}

img {
    max-width: 100%;
    height: auto;
    display: block;
}

a {
    text-decoration: none;
    color: inherit;
    transition: var(--transition-fast);
}

/* Typography */
h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-headings);
    line-height: 1.2;
    margin-bottom: 1rem;
}

h1 {
    font-size: 3rem;
    color: var(--primary-brown);
}

h2 {
    font-size: 2.5rem;
    color: var(--primary-brown);
}

h3 {
    font-size: 2rem;
    color: var(--primary-green);
}

p {
    margin-bottom: 1rem;
    font-size: 1.1rem;
}

/* Container */
.container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 2rem;
}

/* Header */
.header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1000;
    transition: var(--transition-medium);
    padding: 1rem 0;
}

.header.scrolled {
    background-color: rgba(48, 49, 51, 0.9);
    backdrop-filter: blur(10px);
}

.header-content {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.logo {
    height: 50px;
    width: auto;
}

.nav-menu {
    display: flex;
    list-style: none;
    gap: 2rem;
}

.nav-link {
    color: white;
    font-weight: 500;
    padding: 0.5rem 1rem;
    border-radius: 25px;
    transition: var(--transition-fast);
}

.nav-link:hover,
.nav-link.active {
    background-color: var(--contrast-orange);
    color: white;
}

/* Mobile Menu Toggle */
.menu-toggle {
    display: none;
    background: none;
    border: none;
    color: white;
    font-size: 1.5rem;
    cursor: pointer;
}

/* Buttons */
.btn {
    display: inline-block;
    padding: 0.75rem 2rem;
    border-radius: 25px;
    font-weight: 600;
    text-align: center;
    cursor: pointer;
    transition: var(--transition-fast);
    border: none;
    font-family: var(--font-body);
    font-size: 1rem;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}

.btn:focus {
    outline: 2px solid var(--contrast-orange);
    outline-offset: 2px;
}

.btn-primary {
    background-color: var(--primary-brown);
    color: white;
}

.btn-primary:hover {
    background-color: var(--contrast-orange);
    transform: translateY(-2px);
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
}

.btn-secondary {
    background-color: var(--primary-green);
    color: white;
}

.btn-secondary:hover {
    background-color: var(--contrast-orange);
    transform: translateY(-2px);
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
}

.btn-outline {
    background-color: transparent;
    color: var(--primary-brown);
    border: 2px solid var(--primary-brown);
}

.btn-outline:hover {
    background-color: var(--contrast-orange);
    color: white;
    border-color: var(--contrast-orange);
}

/* Hero Section */
.hero {
    height: 100vh;
    background-image: url('../banner.jpg');
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: white;
    position: relative;
}

.hero::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.4);
}

.hero-content {
    position: relative;
    z-index: 2;
    max-width: 800px;
}

.hero h1 {
    font-size: 4rem;
    color: white;
    margin-bottom: 1rem;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
}

.hero p {
    font-size: 1.3rem;
    margin-bottom: 2rem;
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5);
}

.hero-buttons {
    display: flex;
    gap: 1rem;
    justify-content: center;
    flex-wrap: wrap;
}

/* Sections */
.section {
    padding: 5rem 0;
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.6s ease, transform 0.6s ease;
}

.section.visible {
    opacity: 1;
    transform: translateY(0);
}

.section-alt {
    background-color: white;
}

.section-header {
    text-align: center;
    margin-bottom: 3rem;
}

.section-header h2 {
    margin-bottom: 1rem;
}

.section-header p {
    font-size: 1.2rem;
    color: var(--primary-green);
    max-width: 600px;
    margin: 0 auto;
}

/* Grid Layouts */
.grid {
    display: grid;
    gap: 2rem;
}

.grid-2 {
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
}

.grid-3 {
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
}

/* Cards */
.card {
    background: white;
    border-radius: 15px;
    overflow: hidden;
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.1);
    transition: var(--transition-medium);
    cursor: pointer;
}

.card:hover {
    transform: translateY(-5px) scale(1.02);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);
}

.card img {
    width: 100%;
    height: 200px;
    object-fit: cover;
    transition: var(--transition-medium);
}

.card:hover img {
    transform: scale(1.05);
}

.card-content {
    padding: 1.5rem;
}

.card h3 {
    margin-bottom: 0.5rem;
    color: var(--primary-brown);
}

.card p {
    color: var(--primary-green);
    margin-bottom: 1rem;
}

.card-badge {
    display: inline-block;
    background-color: var(--contrast-yellow);
    color: var(--primary-dark);
    padding: 0.25rem 0.75rem;
    border-radius: 15px;
    font-size: 0.8rem;
    font-weight: 600;
    margin-bottom: 1rem;
}

/* About Section */
.about-content {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 3rem;
    align-items: center;
}

.about-text h2 {
    margin-bottom: 1.5rem;
}

.about-features {
    list-style: none;
    margin: 2rem 0;
}

.about-features li {
    padding: 0.5rem 0;
    padding-left: 2rem;
    position: relative;
}

.about-features li::before {
    content: '✓';
    position: absolute;
    left: 0;
    color: var(--contrast-orange);
    font-weight: bold;
}

.about-image {
    border-radius: 15px;
    overflow: hidden;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}

/* Form Styles */
.form {
    max-width: 600px;
    margin: 0 auto;
}

.form-group {
    margin-bottom: 1.5rem;
}

.form-label {
    display: block;
    margin-bottom: 0.5rem;
    font-weight: 600;
    color: var(--primary-brown);
}

.form-input,
.form-textarea {
    width: 100%;
    padding: 0.75rem;
    border: 2px solid var(--base-light-green);
    border-radius: 10px;
    font-family: var(--font-body);
    font-size: 1rem;
    transition: var(--transition-fast);
}

.form-input:focus,
.form-textarea:focus {
    outline: none;
    border-color: var(--contrast-orange);
    box-shadow: 0 0 0 3px rgba(201, 94, 43, 0.1);
}

.form-textarea {
    resize: vertical;
    min-height: 120px;
}

/* Footer */
.footer {
    background-color: var(--primary-dark);
    color: white;
    padding: 3rem 0 1rem;
}

.footer-content {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 2rem;
    margin-bottom: 2rem;
}

.footer-section h3 {
    color: var(--contrast-orange);
    margin-bottom: 1rem;
}

.footer-section p,
.footer-section a {
    color: #ccc;
    margin-bottom: 0.5rem;
}

.footer-section a:hover {
    color: var(--contrast-orange);
}

.social-links {
    display: flex;
    gap: 1rem;
    margin-top: 1rem;
}

.social-link {
    display: inline-block;
    padding: 0.5rem;
    background-color: var(--contrast-orange);
    color: white;
    border-radius: 50%;
    transition: var(--transition-fast);
    width: 40px;
    height: 40px;
    text-align: center;
    line-height: 30px;
}

.social-link:hover {
    background-color: var(--contrast-yellow);
    transform: translateY(-2px);
}

.footer-bottom {
    text-align: center;
    padding-top: 2rem;
    border-top: 1px solid #555;
    color: #999;
}

/* Responsive Design */
@media (max-width: 768px) {
    .menu-toggle {
        display: block;
    }
    
    .nav-menu {
        display: none;
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        background-color: var(--primary-dark);
        flex-direction: column;
        padding: 1rem;
        gap: 0;
    }
    
    .nav-menu.active {
        display: flex;
    }
    
    .nav-link {
        padding: 1rem;
        border-radius: 0;
        border-bottom: 1px solid #555;
    }
    
    .hero h1 {
        font-size: 2.5rem;
    }
    
    .hero p {
        font-size: 1.1rem;
    }
    
    .hero-buttons {
        flex-direction: column;
        align-items: center;
    }
    
    .about-content {
        grid-template-columns: 1fr;
        text-align: center;
    }
    
    .container {
        padding: 0 1rem;
    }
    
    h1 {
        font-size: 2rem;
    }
    
    h2 {
        font-size: 1.8rem;
    }
    
    h3 {
        font-size: 1.5rem;
    }
}

@media (max-width: 480px) {
    .hero h1 {
        font-size: 2rem;
    }
    
    .section {
        padding: 3rem 0;
    }
    
    .card-content {
        padding: 1rem;
    }
}

/* Utility Classes */
.text-center {
    text-align: center;
}

.text-left {
    text-align: left;
}

.text-right {
    text-align: right;
}

.mb-1 { margin-bottom: 1rem; }
.mb-2 { margin-bottom: 2rem; }
.mb-3 { margin-bottom: 3rem; }

.mt-1 { margin-top: 1rem; }
.mt-2 { margin-top: 2rem; }
.mt-3 { margin-top: 3rem; }

.hidden {
    display: none;
}

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

/* === OTW Global Arrows (hero + sliders + gallery viewer) === */
.arrows{ position:absolute; inset:0; display:flex; align-items:center; justify-content:space-between; padding:0 10px; z-index:5; pointer-events:none; }
.arrows .arrow{
  pointer-events:auto;
  width:48px; height:48px; border-radius:999px;
  display:grid; place-items:center;
  background: rgba(0,0,0,.36);
  border: 1px solid rgba(255,255,255,.55);
  backdrop-filter: saturate(160%) blur(6px);
  box-shadow: 0 2px 10px rgba(0,0,0,.18);
  transition: transform .15s ease, background .15s ease, opacity .15s ease;
  cursor: pointer;
  position: relative;
  overflow: hidden;
  font-size: 0;
}
.arrows .arrow:hover{ transform: scale(1.05); background: rgba(0,0,0,.44); }
.arrows .arrow:active{ transform: scale(.98); }
.arrows .arrow:focus-visible{ outline:2px solid #fff; outline-offset:2px; }
.arrows .arrow::before{
  content:"";
  width:22px; height:22px;
  background-repeat:no-repeat; background-position:center; background-size:22px 22px;
}
/* left */
.arrows .arrow[aria-label*="Anterior" i]::before,
.arrows .arrow.prev::before{
  background-image:url('data:image/svg+xml;utf8,<svg viewBox="0 0 24 24" fill="none" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" xmlns="http://www.w3.org/2000/svg"><polyline points="15 18 9 12 15 6"/></svg>');
}
/* right */
.arrows .arrow[aria-label*="Próxima" i]::before,
.arrows .arrow[aria-label*="Próximo" i]::before,
.arrows .arrow.next::before{
  background-image:url('data:image/svg+xml;utf8,<svg viewBox="0 0 24 24" fill="none" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" xmlns="http://www.w3.org/2000/svg"><polyline points="9 18 15 12 9 6"/></svg>');
}

/* Hero-specific: não cobrir o texto no mobile */
@media (max-width:640px){
  .hero .arrows{ inset:auto 0 22vh 0; align-items:center; }
  .arrows .arrow{ width:44px; height:44px; }
  .arrows .arrow::before{ width:20px; height:20px; background-size:20px 20px; }
}

/* Gallery Viewer (classe interna do viewer) — aplicar mesmo visual */
.gv-arrows{ position:absolute; inset:0; display:flex; align-items:center; justify-content:space-between; padding:0 10px; z-index:5; pointer-events:none; }
.gv-arrow{
  pointer-events:auto;
  width:48px; height:48px; border-radius:999px;
  display:grid; place-items:center;
  background: rgba(0,0,0,.36);
  border: 1px solid rgba(255,255,255,.55);
  backdrop-filter: saturate(160%) blur(6px);
  box-shadow: 0 2px 10px rgba(0,0,0,.18);
  transition: transform .15s ease, background .15s ease, opacity .15s ease;
  cursor: pointer;
  position: relative;
  overflow: hidden;
  font-size: 0;
}
.gv-arrow:hover{ transform: scale(1.05); background: rgba(0,0,0,.44); }
.gv-arrow:active{ transform: scale(.98); }
.gv-arrow:focus-visible{ outline:2px solid #fff; outline-offset:2px; }
.gv-arrow::before{
  content:"";
  width:22px; height:22px;
  background-repeat:no-repeat; background-position:center; background-size:22px 22px;
}
.gv-prev::before{
  background-image:url('data:image/svg+xml;utf8,<svg viewBox="0 0 24 24" fill="none" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" xmlns="http://www.w3.org/2000/svg"><polyline points="15 18 9 12 15 6"/></svg>');
}
.gv-next::before{
  background-image:url('data:image/svg+xml;utf8,<svg viewBox="0 0 24 24" fill="none" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" xmlns="http://www.w3.org/2000/svg"><polyline points="9 18 15 12 9 6"/></svg>');
}
@media (max-width:640px){
  .gv-arrows{ inset:auto 0 16vh 0; }
  .gv-arrow{ width:44px; height:44px; }
  .gv-arrow::before{ width:20px; height:20px; background-size:20px 20px; }
}

/* === Android-only font normalization (global) === */
html.android{
  font-family: Roboto, system-ui, -apple-system, "Segoe UI", Helvetica, Arial,
               "Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji";
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
html.android body{ font-family: inherit; }
html.android h1, html.android h2, html.android h3, html.android h4, html.android h5, html.android h6,
html.android p, html.android a, html.android li, html.android button, html.android input, html.android textarea,
html.android label, html.android small, html.android strong, html.android em, html.android span{
  font-family: inherit;
}
html.android *{ font-synthesis-weight: none; }

/* === Arrow rendering hard-fix (avoid double icons / deform on iOS/Android) === */
.arrows .arrow,
.gv-arrow{ font-size:0; line-height:0; }
.arrows .arrow > svg, .arrows .arrow > span,
.gv-arrow > svg, .gv-arrow > span{ display:none !important; }
.arrows .arrow::after, .gv-arrow::after{ content:none !important; }


/* === OTW Arrow alignment override (precise center on all devices) === */
.arrows .arrow, .gv-arrow{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  line-height:0 !important;
  font-size:0 !important;
  box-sizing:border-box;
  transform: translateZ(0);
}
.arrows .arrow::before, .gv-arrow::before{
  position:absolute !important;
  left:50% !important; top:50% !important;
  transform: translate(-50%, -50%) !important;
  width:22px !important; height:22px !important;
  background-repeat:no-repeat !important;
  background-position:center center !important;
  background-size:22px 22px !important;
  pointer-events:none !important;
}
@media (max-width:640px){
  .arrows .arrow::before, .gv-arrow::before{
    width:20px !important; height:20px !important;
    background-size:20px 20px !important;
  }
}


/* === Parcerias: coluna direita centralizada + botões do MESMO tamanho (desktop e mobile) === */
#parcerias .grid-2 > :nth-child(2){
  display: grid;
  grid-template-columns: 1fr;
  justify-items: center;
  align-content: start;
  gap: 14px;
  text-align: center;
}

#parcerias .grid-2 > :nth-child(2) h3,
#parcerias .grid-2 > :nth-child(2) p{
  margin-left: auto;
  margin-right: auto;
  text-align: center;
  max-width: 60ch;
}

#parcerias .grid-2 > :nth-child(2) img.studio-logo{
  display: block;
  margin: 8px auto 6px;
  width: clamp(150px, 28vw, 260px);
  height: auto;
  object-fit: contain;
}

/* Botões com MESMA largura e alinhados entre si.
   width: min(260px, 92vw) garante 260px em desktop e reduz em telas muito estreitas sem quebrar layout. */
#parcerias .grid-2 > :nth-child(2) .btn{
  width: min(260px, 92vw);
  justify-content: center;
  margin-left: auto;
  margin-right: auto;
}

/* Espaçamento harmônico entre blocos */
#parcerias .grid-2 > :nth-child(2) h3{ margin-top: 8px; }
#parcerias .grid-2 > :nth-child(2) .btn + h3{ margin-top: 26px; }


/* === Parcerias: centralizar LOGO do OTW Studio com seletores robustos === */
/* cobre casos com e sem classe 'studio-logo' */
#parcerias .grid-2 > :nth-child(2) img.studio-logo,
#parcerias .grid-2 > :nth-child(2) img[alt*="studio" i],
#parcerias .grid-2 > :nth-child(2) img[src*="studio" i]{
  display:block !important;
  margin-left:auto !important;
  margin-right:auto !important;
  margin-top:8px;
  margin-bottom:6px;
  float:none !important;
  transform:none !important;
  max-width: clamp(150px, 28vw, 260px);
  height:auto;
  object-fit:contain;
}


/* =======================
   OTW — Parcerias: centragem fina (sem mexer nas colunas)
   ======================= */

/* Coluna direita como stack central */
#parcerias .grid-2 > :nth-child(2){
  display: grid !important;
  grid-auto-rows: max-content;
  justify-items: center !important;
  align-items: start;
  text-align: center !important;
  padding-inline: 0 !important;
  margin-inline: 0 !important;
}

/* Elementos internos centralizados e com largura controlada */
#parcerias .grid-2 > :nth-child(2) > *{
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center !important;
  max-width: 62ch;
}

/* Títulos (sem width:max-content) */
#parcerias .grid-2 > :nth-child(2) h3{
  width: auto !important;
  letter-spacing: -0.01em;
  margin-top: 8px;
}

/* Logo do Studio central (casos com/sem classe) */
#parcerias .grid-2 > :nth-child(2) img.studio-logo,
#parcerias .grid-2 > :nth-child(2) img[alt*="studio" i],
#parcerias .grid-2 > :nth-child(2) img[src*="studio" i]{
  display:block !important;
  margin-left:auto !important;
  margin-right:auto !important;
  float:none !important;
  transform:none !important;
  max-width: clamp(150px, 28vw, 260px);
  height:auto;
  object-fit: contain;
}

/* Botões com mesma largura e mesmo centro */
#parcerias .grid-2 > :nth-child(2) .btn{
  width: 260px !important;
  max-width: 92vw;
  display:inline-flex;
  justify-content:center;
  margin-left:auto !important;
  margin-right:auto !important;
}

/* Mobile: reduz um pouco se necessário */
@media (max-width: 640px){
  #parcerias .grid-2 > :nth-child(2) .btn{ width: 240px !important; }
}


/* === Parcerias: ajuste fino SOMENTE na logo do OTW Studio (leve à esquerda) === */
@media (min-width: 901px){
  #parcerias .grid-2 > :nth-child(2) img.studio-logo,
  #parcerias .grid-2 > :nth-child(2) img[alt*="studio" i],
  #parcerias .grid-2 > :nth-child(2) img[src*="studio" i]{
    transform: translateX(-6px) !important;
  }
}
@media (min-width: 641px) and (max-width: 900px){
  #parcerias .grid-2 > :nth-child(2) img.studio-logo,
  #parcerias .grid-2 > :nth-child(2) img[alt*="studio" i],
  #parcerias .grid-2 > :nth-child(2) img[src*="studio" i]{
    transform: translateX(-4px) !important;
  }
}
@media (max-width: 640px){
  #parcerias .grid-2 > :nth-child(2) img.studio-logo,
  #parcerias .grid-2 > :nth-child(2) img[alt*="studio" i],
  #parcerias .grid-2 > :nth-child(2) img[src*="studio" i]{
    transform: translateX(-2px) !important;
  }
}


/* === OTW — Arrows idle fix (force non-white by default) ===
   Motivo: em alguns estados/classes do slider, um estilo anterior definia
   fundo branco no idle. Este bloco garante cinza translúcido SEMPRE,
   com !important e maior especificidade. */
.hero .arrows .arrow,
.hero .arrows .arrow:not(:hover),
.arrows .arrow,
.arrows .arrow:not(:hover),
.gv-arrow,
.gv-arrow:not(:hover){
  background: rgba(0,0,0,.36) !important;
  border: 1px solid rgba(255,255,255,.55) !important;
  box-shadow: 0 2px 10px rgba(0,0,0,.18) !important;
  backdrop-filter: saturate(160%) blur(6px) !important;
}

/* Hover e active suaves */
.hero .arrows .arrow:hover,
.arrows .arrow:hover,
.gv-arrow:hover{ background: rgba(0,0,0,.44) !important; }
.hero .arrows .arrow:active,
.arrows .arrow:active,
.gv-arrow:active{ background: rgba(0,0,0,.34) !important; }

/* Garante que nenhum ícone interno branco apareça por cima */
.hero .arrows .arrow > *,
.arrows .arrow > *,
.gv-arrow > *{ display:none !important; }


/* === Flair de giz SÓ em iOS/macOS para títulos principais ===
   Mantém Android/Windows com Inter (sem frufru)
   Aplica em: hero h1 e .section-header h2 (Quem Somos, Nossas Viagens, Feito pra você, Vídeos mais assistidos, Parcerias) */
@supports (font: -apple-system-body) {
  .hero h1,
  .section-header h2{
    font-family: "Chalkduster", "Marker Felt", "Noteworthy", "Bradley Hand", cursive !important;
    font-weight: 400;
    letter-spacing: 0.4px;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
  }
}


/* === Flair de giz APENAS em iOS/macOS (Android/Windows continuam Inter) === */
@supports (font: -apple-system-body) {
  /* Hero */
  .hero h1,
  .hero .title,
  .hero .content h1,
  .slide .content h1{
    font-family: "Chalkduster","Marker Felt","Noteworthy","Bradley Hand", cursive !important;
    font-weight: 400 !important;
    letter-spacing: .4px;
  }
  /* Títulos principais (inclui Quem Somos) */
  .section-header h2,
  #quem-somos h2, .quem-somos h2,
  #nossas-viagens h2, #viagens h2, .viagens h2,
  #feito-pra-voce h2, .feito-pra-voce h2,
  #videos h2, #videos-mais-assistidos h2, .videos h2,
  #parcerias h2, .parcerias h2{
    font-family: "Chalkduster","Marker Felt","Noteworthy","Bradley Hand", cursive !important;
    font-weight: 400 !important;
    letter-spacing: .3px;
  }
}