/* ------------------------------------------------
 * Marias: Semijoias
 * Sobrescrita de paleta e tipografia do template base.
 * Paleta: off-white / areia / grafite + acento dourado e terracota.
 * ------------------------------------------------ */

:root {
  --_font-default: "Jost", "Urbanist", sans-serif;
  --_font-accent: "Cormorant Garamond", Georgia, serif;

  --gold: #b08d47;
  --terracotta: #b5643f;
  --sand: #e9dfd0;
  --offwhite: #faf7f2;
  --graphite: #2a2724;

  /* Light */
  --base--light: #faf7f2;
  --base-rgb--light: 250,247,242;
  --base-shade--light: #efe8dd;
  --base-tint--light: #ffffff;
  --stroke-controls--light: #2a2724;
  --stroke-elements--light: #cfc3b1;
  --t-bright--light: #2a2724;
  --t-medium--light: #5b544c;
  --t-muted--light: #9b9083;
  --t-opp-bright--light: #faf7f2;
  --t-opp-medium--light: #e3d9c9;
  --t-opp-muted--light: #4a443d;
  --neutral-bright--light: #2a2724;

  /* Dark */
  --base--dark: #201d1b;
  --base-rgb--dark: 32,29,27;
  --base-shade--dark: #171514;
  --base-tint--dark: #2c2825;
  --stroke-controls--dark: #f5efe6;
  --stroke-elements--dark: #514a42;
  --t-bright--dark: #f5efe6;
  --t-medium--dark: #d3c8b8;
  --t-muted--dark: #7d7469;
  --t-opp-bright--dark: #201d1b;
  --t-opp-medium--dark: #35302c;
  --t-opp-muted--dark: #9b9083;
  --neutral-bright--dark: #f5efe6;

  --per-base: #2a2724;
  --neutral-gray: #9b9083;
  --neutral-gray-dark: #5b544c;
}

h1, h2, h3, h4, h5, h6,
.headline__title,
blockquote {
  font-family: var(--_font-accent);
  letter-spacing: -0.01em;
}

.headline__subtitle,
.section-name-caption,
.btn-caption {
  font-family: var(--_font-default);
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.logo-text {
  font-family: var(--_font-accent);
  letter-spacing: 0.12em;
}

/* Acentos */
.section-name i,
.headline__btn .btn i,
.gallery__descr h5::after {
  color: var(--gold);
}

.gallery__descr h5 {
  font-family: var(--_font-accent);
  font-size: 2rem;
  line-height: 1.25;
  margin-bottom: 0.6rem;
}

.gallery__descr p.small {
  font-family: var(--_font-default);
  color: var(--t-muted);
  font-size: 1.4rem;
  line-height: 1.6;
}

.gallery__item {
  padding-bottom: 4rem;
}

.gallery__image {
  border-radius: var(--_radius-s);
  background: var(--sand);
}

::selection {
  background: var(--terracotta);
  color: var(--offwhite);
}

/* Imagens de apoio neutras */
.main-image-1 {
  background-image: url("/img/placeholder-wide.svg");
  background-size: cover;
  background-position: center;
}

.about-image-1 {
  background-image: url("/__l5e/assets-v1/c7d2e4a3-f967-4d5a-aa7e-4be485aca70f/sobre-marias.jpg");
  background-size: cover;
  background-position: center 30%;
}

/* Legendas de produto sempre visíveis (catálogo) */
.gallery__descr {
  position: static !important;
  left: auto !important;
  width: 100% !important;
  padding: 1.6rem 0.4rem 0 !important;
}
.gallery__descr h5,
.gallery__descr p {
  display: block !important;
  color: var(--t-bright);
}
.gallery__descr p.small {
  color: var(--t-muted);
}

/* Logo da marca */
.logo__link--brand {
  display: flex;
  align-items: center;
}
.logo-mark {
  height: 4.6rem;
  width: auto;
  display: block;
}
@media (max-width: 767px) {
  .logo-mark { height: 3.6rem; }
}

/* Hero: fotos da campanha de Barretos em rotacao */
.hero-slideshow {
  position: relative;
  overflow: hidden;
  background-image: url("/__l5e/assets-v1/cf37ee6b-b27e-4b6f-8c9b-4be1ec8f16d8/campanha-hero-1.jpg");
}
.hero-slide {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center 35%;
  background-repeat: no-repeat;
  opacity: 0;
  animation: heroFade 40s infinite;
}
.hero-slide--1 {
  background-image: url("/__l5e/assets-v1/cf37ee6b-b27e-4b6f-8c9b-4be1ec8f16d8/campanha-hero-1.jpg");
  animation-delay: 0s;
}
.hero-slide--2 {
  background-image: url("/__l5e/assets-v1/00f44e6b-8e75-4dfe-aadd-f020660eed03/campanha-hero-2.jpg");
  animation-delay: 5s;
}
.hero-slide--3 {
  background-image: url("/__l5e/assets-v1/3bf3cd7c-15fd-4e70-bf93-f7bafdc4971a/campanha-hero-3.jpg");
  animation-delay: 10s;
}
.hero-slide--4 {
  background-image: url("/__l5e/assets-v1/f05ab5f1-fb41-44c2-86c8-642a34619d01/campanha-lookbook-08.jpg");
  animation-delay: 15s;
}
.hero-slide--5 {
  background-image: url("/__l5e/assets-v1/580015dd-d98b-4a4f-9b8b-c68adebe278f/campanha-lookbook-14.jpg");
  animation-delay: 20s;
}
.hero-slide--6 {
  background-image: url("/__l5e/assets-v1/32af690b-f884-4f8d-a218-d961f4ee510a/campanha-lookbook-19.jpg");
  animation-delay: 25s;
}
.hero-slide--7 {
  background-image: url("/__l5e/assets-v1/35884097-36fa-4115-b754-e9b186668116/campanha-lookbook-24.jpg");
  animation-delay: 30s;
}
.hero-slide--8 {
  background-image: url("/__l5e/assets-v1/7aaa20d0-288e-45f5-94bd-baba52619ebc/campanha-lookbook-26.jpg");
  animation-delay: 35s;
}
@keyframes heroFade {
  0% { opacity: 0; }
  2% { opacity: 1; }
  11% { opacity: 1; }
  13% { opacity: 0; }
  100% { opacity: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .hero-slide { animation: none; }
  .hero-slide--1 { opacity: 1; }
}

/* Lookbook: Campanha Barretos (mosaico editorial) */
.lookbook {
  column-count: 3;
  column-gap: 1.6rem;
  padding: 0.8rem 0 2rem;
}
@media (max-width: 991px) {
  .lookbook { column-count: 2; }
}
@media (max-width: 575px) {
  .lookbook { column-count: 1; }
}
.lookbook__item {
  break-inside: avoid;
  margin: 0 0 1.6rem;
  display: block;
}
.lookbook__link {
  display: block;
  overflow: hidden;
  border-radius: var(--_radius-s);
  background: var(--sand);
  position: relative;
}
.lookbook__link::after {
  content: "";
  position: absolute;
  inset: 0;
  border: 1px solid transparent;
  border-radius: var(--_radius-s);
  transition: border-color 0.4s ease;
  pointer-events: none;
}
.lookbook__link:hover::after {
  border-color: var(--gold);
}
.lookbook__image {
  display: block;
  width: 100%;
  height: auto;
  transform: scale(1);
  transition: transform 0.7s cubic-bezier(0.2, 0.7, 0.2, 1), filter 0.5s ease;
}
.lookbook__link:hover .lookbook__image {
  transform: scale(1.045);
  filter: saturate(1.05);
}
@media (prefers-reduced-motion: reduce) {
  .lookbook__image { transition: none; }
  .lookbook__link:hover .lookbook__image { transform: none; }
}

/* Header legibility over hero/campaign photos */
@media only screen and (min-width: 1200px) {
  .header {
    background-color: rgba(250, 247, 242, 0.72);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    border-radius: var(--_radius-s);
    padding: 0 1.4rem;
  }
  :root[color-scheme="dark"] .header {
    background-color: rgba(24, 22, 20, 0.6);
  }
}

/* Catálogo: colunas alinhadas (mesma proporção de imagem e altura de legenda) */
.my-gallery {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
}
.gallery__item {
  display: flex;
  flex-direction: column;
}
.gallery__link {
  aspect-ratio: 4 / 5;
  width: 100%;
}
.gallery__link .picture,
.gallery__image {
  border-radius: var(--_radius);
}
.gallery__descr {
  min-height: 12rem;
}
@media (max-width: 767px) {
  .gallery__descr { min-height: 0; }
}

/* Hero: blocos de fundo em carrossel */
.intro-bg-slideshow { overflow: hidden; }
.intro-bg-slideshow > img { visibility: hidden; }
.intro-bg-slide {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center 35%;
  background-repeat: no-repeat;
  opacity: 0;
  animation: introBgFade 25s infinite;
}
.intro-bg__shadow { position: relative; z-index: 2; }
.intro-bg-slide--a1 { background-image: url("/__l5e/assets-v1/2d4be7b8-6702-4fbf-b93d-16c08104feac/campanha-sq-2.jpg"); animation-delay: 0s; }
.intro-bg-slide--a2 { background-image: url("/__l5e/assets-v1/1678b287-9b31-43cb-a659-7fc349336a3e/campanha-lookbook-01.jpg"); animation-delay: 5s; }
.intro-bg-slide--a3 { background-image: url("/__l5e/assets-v1/7931832c-1788-4ad1-b6bf-5663cc7331a2/campanha-lookbook-03.jpg"); animation-delay: 10s; }
.intro-bg-slide--a4 { background-image: url("/__l5e/assets-v1/a170db5c-1f3c-4518-9da1-8bc9e5519386/campanha-lookbook-09.jpg"); animation-delay: 15s; }
.intro-bg-slide--a5 { background-image: url("/__l5e/assets-v1/8862a3f5-ff39-4ff8-961d-14853dc45f19/campanha-lookbook-11.jpg"); animation-delay: 20s; }
.intro-bg-slide--b1 { background-image: url("/__l5e/assets-v1/1593e1d4-f1f5-4dca-afa5-5b9e87401b7e/campanha-sq-3.jpg"); animation-delay: 0s; }
.intro-bg-slide--b2 { background-image: url("/__l5e/assets-v1/7a28bcff-402f-436d-8ffd-946a3ac1ce9a/campanha-lookbook-13.jpg"); animation-delay: 5s; }
.intro-bg-slide--b3 { background-image: url("/__l5e/assets-v1/99c5493c-e280-4f06-aa92-3a50af4a4d10/campanha-lookbook-16.jpg"); animation-delay: 10s; }
.intro-bg-slide--b4 { background-image: url("/__l5e/assets-v1/8f2a3474-44b0-4cd1-956c-507a6e87d288/campanha-lookbook-21.jpg"); animation-delay: 15s; }
.intro-bg-slide--b5 { background-image: url("/__l5e/assets-v1/09bb3a1e-83d4-4fa8-81d1-a8dacafb9745/campanha-lookbook-23.jpg"); animation-delay: 20s; }
@keyframes introBgFade {
  0% { opacity: 0; }
  3% { opacity: 1; }
  18% { opacity: 1; }
  21% { opacity: 0; }
  100% { opacity: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .intro-bg-slide { animation: none; }
  .intro-bg-slide--a1, .intro-bg-slide--b1 { opacity: 1; }
}

/* Hero: primeiro carrossel em faixa cinematografica */
.hero-slideshow.divider-image {
  position: relative;
  width: 100vw;
  max-width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  height: 68vh;
  min-height: 420px;
  max-height: 720px;
  aspect-ratio: auto;
  border-radius: 0;
  overflow: hidden;
}
.hero-slideshow.divider-image .hero-slide {
  background-position: center 30%;
}
.hero-slideshow.divider-image::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(to bottom, rgba(20, 16, 12, 0.42) 0%, rgba(20, 16, 12, 0) 32%),
    linear-gradient(to top, rgba(20, 16, 12, 0.45) 0%, rgba(20, 16, 12, 0) 40%);
}
@media (max-width: 767px) {
  .hero-slideshow.divider-image {
    height: 62vh;
    min-height: 340px;
  }
}


/* Hero: colagem de fotos com proporcao editorial */
.intro-bg-01__01,
.intro-bg-01__02 {
  border-radius: 4px;
  box-shadow: 0 30px 60px -30px rgba(20, 16, 12, 0.45);
  /* cover garante enquadramento sem distorcao, independente da proporcao original */
  background-size: cover !important;
  background-repeat: no-repeat;
  overflow: hidden;
}
/* a <img> interna existe apenas para preload; o visual vem dos slides */
.intro-bg-01__01 > img,
.intro-bg-01__02 > img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 30%;
  visibility: hidden;
}
@media (min-width: 1200px) {
  .intro-bg-01__01 {
    position: absolute !important;
    width: clamp(300px, 32vw, 560px) !important;
    height: auto !important;
    aspect-ratio: 4 / 5;
    top: 6% !important;
    bottom: auto !important;
    right: 3vw !important;
    left: auto !important;
  }
  .intro-bg-01__02 {
    position: absolute !important;
    margin: 0 !important;
    width: clamp(160px, 17vw, 300px) !important;
    height: auto !important;
    aspect-ratio: 4 / 5;
    top: auto !important;
    bottom: 4% !important;
    right: calc(3vw + clamp(300px, 32vw, 560px) - clamp(160px, 17vw, 300px) - 2vw) !important;
    left: auto !important;
  }
}
/* Mobile/tablet: empilhamento limpo em coluna unica, sem sobreposicao */
@media (max-width: 1199px) {
  .main__intro {
    display: flex;
    flex-direction: column;
  }
  .main__intro > .container-fluid {
    order: 1;
  }
  .intro__background.intro-bg-01 {
    order: 2;
    position: static !important;
    width: 100%;
    height: auto !important;
    margin-top: 3.2rem;
  }
  .intro-bg-01__01 {
    position: relative !important;
    top: auto !important;
    right: auto !important;
    left: auto !important;
    bottom: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    aspect-ratio: 4 / 5;
    margin: 0 0 2rem !important;
    transform: none !important;
  }
  .intro-bg-01__02 {
    display: none !important;
  }
  .intro-bg-01__01 .intro-bg__shadow {
    display: none;
  }
}

.intro-bg-01__01 .intro-bg-slide,
.intro-bg-01__02 .intro-bg-slide {
  background-position: center 30%;
  background-size: cover;
}

/* Hero: carrossel em faixa, enquadramento adaptavel a qualquer proporcao */
.hero-slideshow .hero-slide {
  background-size: cover;
  background-position: center 32%;
}


/* Contato */
.contact-grid { row-gap: 3.2rem; }
.contact-item { padding-right: 2.4rem; }
.contact-item__label {
  font-family: var(--_font-default);
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--t-muted);
  font-size: 1.2rem;
  margin-bottom: 0.8rem;
}
.contact-item__link {
  display: inline-block;
  font-family: var(--_font-accent);
  font-size: 2.2rem;
  line-height: 1.25;
  color: var(--t-bright);
  border-bottom: 1px solid var(--stroke-elements);
  padding-bottom: 0.3rem;
  transition: color 0.3s ease, border-color 0.3s ease;
  word-break: break-word;
}
.contact-item__link:hover {
  color: var(--gold);
  border-color: var(--gold);
}
.contact-item p.small {
  margin-top: 1rem;
  color: var(--t-muted);
}

/* Botao flutuante de WhatsApp */
.wa-float {
  position: fixed;
  right: 2rem;
  bottom: 2.4rem;
  z-index: 1200;
  width: 5.6rem;
  height: 5.6rem;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background-color: #25d366;
  color: #fff;
  box-shadow: 0 14px 30px -12px rgba(20, 16, 12, 0.55);
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.wa-float:hover,
.wa-float:focus-visible {
  color: #fff;
  transform: translateY(-3px) scale(1.04);
  box-shadow: 0 20px 36px -14px rgba(20, 16, 12, 0.6);
}
.wa-float svg {
  width: 3.2rem;
  height: 3.2rem;
}
@media (max-width: 991px) {
  .wa-float {
    right: 1.6rem;
    bottom: calc(var(--header-height, 6rem) + 1.6rem);
    width: 5rem;
    height: 5rem;
  }
  .wa-float svg { width: 2.8rem; height: 2.8rem; }
}

/* Ajuste fino do hero no mobile */
@media (max-width: 767px) {
  .logo { top: 2.4rem; left: 2.4rem; }
  .color { top: 2.4rem; right: 2.4rem; }
  .header { padding-left: 2.4rem; padding-right: 2.4rem; }

  #headline.headline {
    padding: 0 2.4rem;
    margin-top: 12.8rem;
    align-items: center !important;
    text-align: center;
  }
  #headline .headline__subtitle {
    margin-bottom: 2.4rem;
    letter-spacing: 0.14em;
  }
  #headline .headline__title {
    margin-bottom: 3.2rem;
  }
  #headline .headline__btn {
    margin-top: 0;
  }
  .intro__background.intro-bg-01 { margin-top: 4rem; }
}

/* Contato: evitar quebra do link da loja */
.contact-item { padding-right: 1.6rem; }
.contact-item__link {
  font-size: clamp(1.7rem, 1.6vw, 2.1rem);
  white-space: nowrap;
}
@media (max-width: 575px) {
  .contact-item__link { white-space: normal; }
}
