/* ===========================================================================
   CAEM — folha de estilo (substitui o Tailwind do projeto Next).
   Implementa so as utilidades usadas no markup + tokens de cor.
   =========================================================================== */

:root{
  --verde:#1a1a1a; --verde-claro:#2a2a2a; --musgo:#a6b35a;
  --off-white:#f5f3ee; --cinza:#6b6b6b; --cinza-claro:#e8e5dd;
  --font-sans:'Plus Jakarta Sans', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;}
body{
  margin:0; min-height:100vh; display:flex; flex-direction:column;
  background:#f5f3ee; color:#111; font-family:var(--font-sans);
  -webkit-font-smoothing:antialiased; line-height:1.5;
}
main{flex:1 1 auto;}
img{max-width:100%;}
a{color:inherit;}
h1,h2,h3,h4,p{margin:0;}
button{font-family:inherit;}

@keyframes fadeUp{from{opacity:0;transform:translateY(24px);}to{opacity:1;transform:translateY(0);}}
.animate-fade-up{animation:fadeUp .55s ease forwards;}
.jupiter-credit:hover{opacity:1 !important;}

/* ---- containers ---- */
.max-w-6xl{max-width:72rem;} .max-w-5xl{max-width:64rem;}
.max-w-2xl{max-width:42rem;} .max-w-xl{max-width:36rem;} .max-w-sm{max-width:24rem;}
.mx-auto{margin-left:auto;margin-right:auto;}
.px-6{padding-left:1.5rem;padding-right:1.5rem;}
.px-4{padding-left:1rem;padding-right:1rem;}
.w-full{width:100%;} .h-full{height:100%;}
.min-w-0{min-width:0;} .flex-1{flex:1 1 0%;}
.flex-shrink-0,.shrink-0{flex-shrink:0;}

/* ---- display / position ---- */
.block{display:block;} .inline-block{display:inline-block;} .hidden{display:none;}
.flex{display:flex;} .inline-flex{display:inline-flex;} .grid{display:grid;}
.flex-col{flex-direction:column;} .flex-row{flex-direction:row;}
.flex-wrap{flex-wrap:wrap;}
.items-center{align-items:center;} .items-start{align-items:flex-start;} .items-end{align-items:flex-end;}
.justify-center{justify-content:center;} .justify-between{justify-content:space-between;}
.relative{position:relative;} .absolute{position:absolute;} .fixed{position:fixed;}
.inset-0{inset:0;}
.overflow-hidden{overflow:hidden;} .overflow-x-auto{overflow-x:auto;} .overflow-x-hidden{overflow-x:hidden;}
.overflow-y-auto{overflow-y:auto;} .overflow-auto{overflow:auto;}
.pointer-events-none{pointer-events:none;}
.sticky{position:sticky;} .top-0{top:0;} .top-24{top:6rem;}
.z-40{z-index:40;} .z-50{z-index:50;}
.min-h-screen{min-height:100vh;}

/* ---- grid columns ---- */
.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr));}
.grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr));}

/* ---- gaps ---- */
.gap-1{gap:.25rem;} .gap-2{gap:.5rem;} .gap-3{gap:.75rem;} .gap-4{gap:1rem;}
.gap-5{gap:1.25rem;} .gap-6{gap:1.5rem;} .gap-8{gap:2rem;}

/* ---- margins / padding (subconjunto usado) ---- */
.mb-1{margin-bottom:.25rem;} .mb-2{margin-bottom:.5rem;} .mb-3{margin-bottom:.75rem;}
.mb-4{margin-bottom:1rem;} .mb-5{margin-bottom:1.25rem;} .mb-6{margin-bottom:1.5rem;}
.mb-8{margin-bottom:2rem;} .mb-10{margin-bottom:2.5rem;} .mb-14{margin-bottom:3.5rem;}
.mb-0\.5{margin-bottom:.125rem;} .mb-1\.5{margin-bottom:.375rem;}
.mt-2{margin-top:.5rem;} .mt-4{margin-top:1rem;} .mt-8{margin-top:2rem;} .mt-10{margin-top:2.5rem;}
.ml-1{margin-left:.25rem;} .ml-4{margin-left:1rem;} .mr-1{margin-right:.25rem;}
.p-4{padding:1rem;} .p-6{padding:1.5rem;} .p-8{padding:2rem;} .pt-20{padding-top:5rem;} .pb-1{padding-bottom:.25rem;}
.py-8{padding-top:2rem;padding-bottom:2rem;} .py-20{padding-top:5rem;padding-bottom:5rem;}
.py-3{padding-top:.75rem;padding-bottom:.75rem;} .px-5{padding-left:1.25rem;padding-right:1.25rem;}
.space-y-0\.5>*+*{margin-top:.125rem;} .space-y-4>*+*{margin-top:1rem;} .space-y-6>*+*{margin-top:1.5rem;}
.space-x-3>*+*{margin-left:.75rem;}

/* ---- sizes (svg / thumbs) ---- */
.w-4{width:1rem;} .h-4{height:1rem;} .w-5{width:1.25rem;} .h-5{height:1.25rem;}
.w-14{width:3.5rem;} .h-11{height:2.75rem;} .w-16{width:4rem;} .h-12{height:3rem;}
.w-24{width:6rem;} .h-20{height:5rem;} .w-56{width:14rem;}
.h-14{height:3.5rem;} .w-auto{width:auto;} .h-64{height:16rem;}

/* ---- object ---- */
.object-cover{object-fit:cover;} .object-contain{object-fit:contain;} .object-center{object-position:center;}
.aspect-\[4\/3\]{aspect-ratio:4/3;}

/* ---- typography ---- */
.text-center{text-align:center;} .text-left{text-align:left;} .text-right{text-align:right;}
.text-xs{font-size:.75rem;line-height:1rem;} .text-sm{font-size:.875rem;line-height:1.25rem;}
.text-base{font-size:1rem;line-height:1.5rem;} .text-lg{font-size:1.125rem;line-height:1.75rem;}
.text-xl{font-size:1.25rem;line-height:1.75rem;} .text-2xl{font-size:1.5rem;line-height:2rem;}
.text-3xl{font-size:1.875rem;line-height:2.25rem;}
.font-medium{font-weight:500;} .font-semibold{font-weight:600;} .font-bold{font-weight:700;} .font-extrabold{font-weight:800;}
.uppercase{text-transform:uppercase;}
.tracking-wide{letter-spacing:.025em;} .tracking-wider{letter-spacing:.05em;} .tracking-widest{letter-spacing:.1em;}
.leading-tight{line-height:1.25;} .leading-snug{line-height:1.375;} .leading-relaxed{line-height:1.625;} .leading-none{line-height:1;}
.no-underline{text-decoration:none;} .whitespace-nowrap{white-space:nowrap;}
.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.line-clamp-2{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.max-w-\[200px\]{max-width:200px;} .max-h-\[420px\]{max-height:420px;}
.min-h-\[72px\]{min-height:72px;} .min-h-\[100px\]{min-height:100px;} .min-h-\[80px\]{min-height:80px;}

/* ---- rounded / shadow ---- */
.rounded-md{border-radius:.375rem;} .rounded-lg{border-radius:.5rem;} .rounded-xl{border-radius:.75rem;}
.rounded-2xl{border-radius:1rem;} .rounded-full{border-radius:9999px;}
.shadow-sm{box-shadow:0 1px 3px rgba(0,0,0,.08);}
.shadow-md{box-shadow:0 4px 12px rgba(0,0,0,.12);}
.shadow-lg{box-shadow:0 10px 30px rgba(0,0,0,.15);}
.shadow-2xl{box-shadow:0 25px 50px rgba(0,0,0,.25);}
.border{border:1px solid var(--cinza-claro);}

/* ---- cursor / misc ---- */
.cursor-pointer{cursor:pointer;} .cursor-zoom-in{cursor:zoom-in;} .cursor-grab{cursor:grab;}
.select-none{user-select:none;} .antialiased{-webkit-font-smoothing:antialiased;}
.backdrop-blur-sm{backdrop-filter:blur(4px);}

/* ---- transitions ---- */
.transition-colors{transition:color .2s,background-color .2s,border-color .2s;}
.transition-transform{transition:transform .3s;}
.transition-shadow{transition:box-shadow .2s;}
.transition-opacity{transition:opacity .2s;}
.duration-500{transition-duration:.5s;}

/* ---- cores (tokens do projeto, escapadas p/ bater com o markup) ---- */
.bg-white{background:#fff;} .text-white{color:#fff;}
.bg-\[\#f5f3ee\]{background:#f5f3ee;} .bg-\[\#1a1a1a\]{background:#1a1a1a;}
.bg-\[\#2a2a2a\]{background:#2a2a2a;} .bg-\[\#e8e5dd\]{background:#e8e5dd;}
.bg-\[\#25D366\]{background:#25D366;} .bg-\[\#111\]{background:#111;}
.bg-\[\#fafaf7\]{background:#fafaf7;} .bg-\[\#f8f8f8\]{background:#f8f8f8;}
.text-\[\#111\]{color:#111;} .text-\[\#6b6b6b\]{color:#6b6b6b;}
.text-\[\#1a1a1a\]{color:#1a1a1a;} .text-\[\#444\]{color:#444;}
.border-\[\#e8e5dd\]{border-color:#e8e5dd;}
.bg-black\/45{background:rgba(0,0,0,.45);} .bg-black\/60{background:rgba(0,0,0,.60);}
.text-red-600{color:#dc2626;} .text-green-700{color:#15803d;}
.bg-green-100{background:#dcfce7;} .bg-yellow-100{background:#fef9c3;}
.text-yellow-700{color:#a16207;} .bg-gray-100{background:#f3f4f6;} .text-gray-600{color:#4b5563;}

/* ---- estados hover/focus ---- */
.hover\:bg-\[\#2a2a2a\]:hover{background:#2a2a2a;}
.hover\:bg-\[\#1ebe5c\]:hover{background:#1ebe5c;}
.hover\:bg-\[\#f5f3ee\]:hover{background:#f5f3ee;}
.hover\:text-\[\#111\]:hover{color:#111;}
.hover\:text-white:hover{color:#fff;}
.hover\:underline:hover{text-decoration:underline;}
.hover\:shadow-md:hover{box-shadow:0 4px 12px rgba(0,0,0,.12);}
.hover\:opacity-80:hover{opacity:.8;} .hover\:opacity-90:hover{opacity:.9;}
.focus\:border-\[\#1a1a1a\]:focus{border-color:#1a1a1a;}
.disabled\:opacity-60:disabled{opacity:.6;}
.outline-none{outline:none;}

/* ---- grupo (hover em filhos) ---- */
.group:hover .group-hover\:scale-105{transform:scale(1.05);}
.group:hover .group-hover\:opacity-100{opacity:1;}
details.group[open] .group-open\:rotate-45{transform:rotate(45deg);}

/* ===========================================================================
   Componentes específicos
   =========================================================================== */

/* Header nav mobile: escondida por padrão, abre com .open; no desktop sempre visível */
.site-nav{
  display:none; flex-direction:column; align-items:flex-start; gap:.25rem;
  position:absolute; top:72px; left:0; right:0; background:#1a1a1a; padding:1rem; z-index:40;
}
.site-nav.open{display:flex;}
.site-nav a, .site-nav .nav-link{
  padding:.5rem 1rem; font-size:1rem; font-weight:500; border-radius:.375rem;
  color:#fff; text-decoration:none; letter-spacing:.025em; transition:background .2s;
}
.site-nav a.active{color:#1a1a1a;background:rgba(166,179,90,.18);}
.nav-search-btn{background:none;border:0;cursor:pointer;padding:.5rem;border-radius:.5rem;color:#fff;}
@media (min-width:768px){
  .site-nav{display:flex;flex-direction:row;align-items:center;position:static;background:transparent;padding:0;}
  .site-nav a,.site-nav .nav-link{color:#111;}
  .site-nav a:hover{background:rgba(0,0,0,.05);}
  .site-nav a.active{color:#1a1a1a;background:rgba(166,179,90,.08);}
  .nav-search-btn{color:#111;}
  .nav-search-btn:hover{background:#f5f3ee;}
  .menu-toggle{display:none;}
}
.menu-toggle{background:none;border:0;font-size:1.5rem;cursor:pointer;line-height:1;}

/* Modal de busca */
.search-modal{
  position:fixed; inset:0; z-index:50; background:rgba(0,0,0,.45); backdrop-filter:blur(4px);
  display:flex; align-items:flex-start; justify-content:center; padding:5rem 1rem 0;
}
.search-modal[hidden]{display:none;}
.search-box{width:100%;max-width:36rem;background:#fff;border-radius:1rem;box-shadow:0 25px 50px rgba(0,0,0,.25);overflow:hidden;}
.search-head{display:flex;align-items:center;gap:.75rem;padding:1rem 1.25rem;border-bottom:1px solid #e8e5dd;}
.search-head input{flex:1;border:0;outline:none;font-size:1rem;background:transparent;}
.search-results{max-height:420px;overflow-y:auto;}
.search-results a{display:flex;align-items:center;gap:.75rem;padding:.75rem 1.25rem;border-bottom:1px solid #e8e5dd;text-decoration:none;color:inherit;transition:background .2s;}
.search-results a:last-child{border-bottom:0;}
.search-results a:hover{background:#f5f3ee;}
.search-results .thumb{width:3.5rem;height:2.75rem;border-radius:.5rem;overflow:hidden;background:#f5f3ee;flex-shrink:0;}
.search-results .thumb img{width:100%;height:100%;object-fit:cover;}
.search-empty{padding:2rem;text-align:center;color:#6b6b6b;font-size:.875rem;}

/* Galeria / lightbox */
.gallery-main{width:100%;aspect-ratio:4/3;border-radius:1rem;overflow:hidden;background:#e8e5dd;margin-bottom:.75rem;cursor:zoom-in;}
.gallery-main img{width:100%;height:100%;object-fit:cover;}
.gallery-thumbs{display:flex;gap:.5rem;overflow-x:auto;padding-bottom:.25rem;}
.gallery-thumb{flex-shrink:0;width:4rem;height:3rem;border-radius:.5rem;overflow:hidden;border:2px solid transparent;opacity:.6;cursor:pointer;background:none;padding:0;transition:all .2s;}
.gallery-thumb img{width:100%;height:100%;object-fit:cover;}
.gallery-thumb.active{border-color:#1a1a1a;opacity:1;}
.gallery-thumb:hover{opacity:1;}
.lightbox{position:fixed;inset:0;z-index:1000;background:rgba(0,0,0,.92);display:flex;align-items:center;justify-content:center;padding:24px;}
.lightbox[hidden]{display:none;}
.lightbox img{max-width:100%;max-height:100%;object-fit:contain;border-radius:8px;}
.lightbox-btn{position:absolute;background:rgba(255,255,255,.1);color:#fff;border:0;border-radius:9999px;cursor:pointer;display:flex;align-items:center;justify-content:center;}
.lightbox-close{top:16px;right:16px;width:44px;height:44px;font-size:22px;}
.lightbox-prev{left:16px;top:50%;transform:translateY(-50%);width:48px;height:48px;font-size:26px;}
.lightbox-next{right:16px;top:50%;transform:translateY(-50%);width:48px;height:48px;font-size:26px;}
.lightbox-count{position:absolute;bottom:16px;left:50%;transform:translateX(-50%);color:rgba(255,255,255,.85);font-size:.85rem;background:rgba(0,0,0,.4);padding:4px 12px;border-radius:9999px;}

/* Carrossel */
.carousel-track{display:flex;overflow-x:hidden;cursor:grab;user-select:none;gap:20px;padding-left:24px;padding-right:24px;scroll-behavior:auto;}

/* Admin */
.admin-shell{min-height:100vh;display:flex;background:#f5f3ee;}
.admin-side{width:14rem;background:#1a1a1a;color:#fff;display:flex;flex-direction:column;flex-shrink:0;}
.admin-side a{display:block;padding:.5rem .75rem;border-radius:.5rem;font-size:.875rem;color:rgba(255,255,255,.8);text-decoration:none;transition:background .2s;}
.admin-side a:hover{color:#fff;background:rgba(255,255,255,.1);}
.admin-main{flex:1;overflow:auto;}
.admin-table{width:100%;border-collapse:collapse;font-size:.875rem;}
.admin-table th{text-align:left;color:#6b6b6b;font-size:.75rem;font-weight:500;padding:.75rem 1.25rem;border-bottom:1px solid #e8e5dd;}
.admin-table td{padding:.75rem 1.25rem;border-bottom:1px solid #e8e5dd;}
.admin-table tr:last-child td{border-bottom:0;}
.admin-table tbody tr:hover{background:#f5f3ee;}
.field{width:100%;padding:.5rem .75rem;border:1px solid #e8e5dd;border-radius:.5rem;font-size:.875rem;outline:none;font-family:inherit;transition:border-color .2s;}
.field:focus{border-color:#1a1a1a;}
.badge{display:inline-block;font-size:.75rem;padding:.125rem .5rem;border-radius:9999px;font-weight:500;}
.btn-dark{background:#1a1a1a;color:#fff;border:0;border-radius:.75rem;padding:.625rem 1.5rem;font-size:.875rem;font-weight:500;cursor:pointer;transition:background .2s;text-decoration:none;display:inline-block;}
.btn-dark:hover{background:#2a2a2a;}
.btn-outline{border:1px solid #e8e5dd;background:none;border-radius:.75rem;padding:.625rem 1.5rem;font-size:.875rem;font-weight:500;cursor:pointer;}
.btn-outline:hover{background:#f5f3ee;}

/* ===========================================================================
   Responsivo
   =========================================================================== */
@media (min-width:640px){
  .sm\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr));}
  .sm\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr));}
}
@media (min-width:768px){
  .md\:flex{display:flex;} .md\:hidden{display:none;} .md\:block{display:block;}
  .md\:flex-row{flex-direction:row;} .md\:static{position:static;}
  .md\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr));}
  .md\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr));}
  .md\:col-span-2{grid-column:span 2/span 2;}
  .md\:bg-transparent{background:transparent;}
  .md\:p-0{padding:0;} .md\:py-0{padding-top:0;padding-bottom:0;}
  .md\:items-center{align-items:center;}
}
@media (min-width:1024px){
  .lg\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr));}
  .lg\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr));}
}