/* ============================================================
   MALTA · QUADROS — Camada Mediterrânea (Dark Mono Edition)
   Ornamentos em off-white/cream sobre fundo preto.
   ============================================================ */

/* ── Padrão grunge sutil (granulação areia/pedra) ────────── */
.bg-sand {
  position: relative;
}
.bg-sand::before {
  content: "";
  position: absolute; inset: 0;
  pointer-events: none;
  z-index: 0;
  opacity: 0.05;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200' viewBox='0 0 200 200'><g fill='%23f5f1ea'><circle cx='30' cy='40' r='1.2'/><circle cx='70' cy='80' r='0.8'/><circle cx='130' cy='30' r='1'/><circle cx='160' cy='90' r='1.2'/><circle cx='50' cy='130' r='0.9'/><circle cx='110' cy='160' r='1.1'/><circle cx='180' cy='180' r='1'/><circle cx='20' cy='180' r='0.7'/><circle cx='90' cy='50' r='0.6'/><circle cx='150' cy='150' r='0.8'/></g></svg>");
  background-size: 200px 200px;
}
.bg-sand > * { position: relative; z-index: 1; }
.bg-sand--dark::before { opacity: 0.07; }

/* ── Ondas grunge (divisor) ──────────────────────────────── */
.waves {
  display: block;
  width: 100%;
  max-width: 320px;
  height: 32px;
  margin: clamp(14px, 2.5vw, 28px) auto;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 380 36' fill='none' stroke='%23d6cebd' stroke-width='1.6' stroke-linecap='round'><path d='M0 18 Q40 8 80 18 Q120 28 160 18 Q200 8 240 18 Q280 28 320 18 Q360 8 380 14'/><path d='M0 26 Q40 16 80 26 Q120 36 160 26 Q200 16 240 26 Q280 36 320 26 Q360 16 380 22' opacity='0.45'/></svg>");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  opacity: 0.6;
  pointer-events: none;
}
.waves--light { opacity: 0.7; }

/* ── Conchinha (vinheta) ─────────────────────────────────── */
.shell {
  display: inline-block;
  width: 42px;
  height: 34px;
  margin-bottom: 14px;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 46 38' fill='none' stroke='%23d6cebd' stroke-width='1.3' stroke-linecap='round'><path d='M23 4 Q12 8 8 18 Q6 24 9 30 Q15 34 23 34 Q31 34 37 30 Q40 24 38 18 Q34 8 23 4 Z'/><path d='M23 4 L23 34' opacity='0.5'/><path d='M16 8 Q14 20 17 32' opacity='0.5'/><path d='M30 8 Q32 20 29 32' opacity='0.5'/><path d='M11 14 Q9 24 14 32' opacity='0.4'/><path d='M35 14 Q37 24 32 32' opacity='0.4'/></svg>");
  background-size: contain;
  background-repeat: no-repeat;
  opacity: 0.7;
}
.shell--light { opacity: 0.85; }

/* ── Numeral I, II, III (process) ────────────────────────── */
.numeral-malta {
  position: relative;
  width: 84px; height: 84px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 12px;
}
.numeral-malta__char {
  font-family: var(--font-display);
  font-style: italic;
  font-weight: 400;
  font-size: 44px;
  line-height: 1;
  color: var(--off-white);
  z-index: 2;
  position: relative;
}
.numeral-malta::before {
  content: "";
  position: absolute; inset: 0;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='84' height='84' viewBox='0 0 90 90' fill='none'><defs><clipPath id='mc'><circle cx='45' cy='45' r='42'/></clipPath></defs><g clip-path='url(%23mc)'><path d='M-5 25 Q15 18 35 25 Q55 32 75 25 Q90 18 100 25 L100 30 Q90 23 75 30 Q55 37 35 30 Q15 23 -5 30 Z' fill='%23d6cebd' opacity='0.25'/><path d='M-5 55 Q15 48 35 55 Q55 62 75 55 Q90 48 100 55 L100 60 Q90 53 75 60 Q55 67 35 60 Q15 53 -5 60 Z' fill='%23d6cebd' opacity='0.25'/><path d='M-5 75 Q15 68 35 75 Q55 82 75 75 Q90 68 100 75 L100 80 Q90 73 75 80 Q55 87 35 80 Q15 73 -5 80 Z' fill='%23d6cebd' opacity='0.25'/></g><circle cx='45' cy='45' r='42' fill='none' stroke='%23d6cebd' stroke-width='1.2' opacity='0.45'/></svg>");
  background-size: contain;
  background-repeat: no-repeat;
  z-index: 1;
}

/* ── Pedras orgânicas (descontinuadas no mono) ──────────── */
.pebble { display: none; }

/* ── Title-frame (floreios laterais) ─────────────────────── */
.title-frame {
  display: inline-flex;
  align-items: center;
  gap: 16px;
  justify-content: center;
  margin-bottom: 6px;
  flex-wrap: wrap;
}
.title-frame::before,
.title-frame::after {
  content: "";
  width: 42px; height: 12px;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 50 14' fill='none' stroke='%23d6cebd' stroke-width='1.4' stroke-linecap='round'><path d='M2 7 Q12 1 22 7 Q32 13 42 7 Q47 5 48 7'/><circle cx='25' cy='7' r='1.4' fill='%23d6cebd' stroke='none'/></svg>");
  background-size: contain;
  background-repeat: no-repeat;
  opacity: 0.55;
  flex-shrink: 0;
}
.title-frame::after { transform: scaleX(-1); }
@media (max-width: 880px) {
  .title-frame { gap: 12px; }
  .title-frame::before,
  .title-frame::after { width: 32px; height: 10px; }
}
@media (max-width: 560px) {
  /* Em mobile, esconde os floreios — title sozinho fica mais limpo */
  .title-frame { gap: 0; }
  .title-frame::before,
  .title-frame::after { display: none; }
}

/* ── Selo de garantia 30 dias (mono) ─────────────────────── */
.guarantee-seal {
  position: relative;
  width: 128px; height: 128px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  text-align: center;
  font-family: var(--font-sans);
}
.guarantee-seal__bg {
  position: absolute; inset: 0;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 138 138' fill='none'><defs><clipPath id='gc'><circle cx='69' cy='69' r='66'/></clipPath></defs><g clip-path='url(%23gc)'><path d='M-5 20 Q20 12 40 20 Q60 28 80 20 Q100 12 120 20 Q140 28 150 24 L150 30 Q140 34 120 26 Q100 18 80 26 Q60 34 40 26 Q20 18 -5 26 Z' fill='%23d6cebd' opacity='0.3'/><path d='M-5 50 Q20 42 40 50 Q60 58 80 50 Q100 42 120 50 Q140 58 150 54 L150 60 Q140 64 120 56 Q100 48 80 56 Q60 64 40 56 Q20 48 -5 56 Z' fill='%23d6cebd' opacity='0.3'/><path d='M-5 90 Q20 82 40 90 Q60 98 80 90 Q100 82 120 90 Q140 98 150 94 L150 100 Q140 104 120 96 Q100 88 80 96 Q60 104 40 96 Q20 88 -5 96 Z' fill='%23d6cebd' opacity='0.3'/><path d='M-5 120 Q20 112 40 120 Q60 128 80 120 Q100 112 120 120 Q140 128 150 124 L150 130 Q140 134 120 126 Q100 118 80 126 Q60 134 40 126 Q20 118 -5 126 Z' fill='%23d6cebd' opacity='0.3'/></g><circle cx='69' cy='69' r='66' fill='none' stroke='%23d6cebd' stroke-width='1.3' opacity='0.65'/><circle cx='69' cy='69' r='52' fill='%230a0a0a' opacity='0.85'/><circle cx='69' cy='69' r='52' fill='none' stroke='%23d6cebd' stroke-width='1' stroke-dasharray='1 4' opacity='0.55'/></svg>");
  background-size: contain;
  background-repeat: no-repeat;
}
.guarantee-seal__top {
  position: relative;
  z-index: 2;
  font-size: 8.5px;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--off-white);
  margin-top: 32px;
}
.guarantee-seal__num {
  position: relative;
  z-index: 2;
  font-family: var(--font-display);
  font-weight: 500;
  font-style: italic;
  font-size: 36px;
  line-height: 1;
  color: var(--off-white);
  margin: 2px 0;
}
.guarantee-seal__sub {
  position: relative;
  z-index: 2;
  font-size: 8.5px;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--off-white);
  margin-bottom: 32px;
}

/* ── Timbrado ─────────────────────────────────────────────── */
.timbrado {
  font-family: var(--font-sans);
  font-size: 9.5px;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  color: var(--cream);
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-weight: 600;
}
.timbrado::before,
.timbrado::after {
  content: "";
  width: 24px; height: 1px;
  background: var(--cream);
  opacity: 0.45;
}

/* Variant Dia dos Namorados */
.timbrado--vday { color: #f3aaa0; }
.timbrado--vday::before,
.timbrado--vday::after {
  background: #f3aaa0;
  opacity: 0.55;
}

/* ── Mobile refinements ──────────────────────────────────── */
@media (max-width: 880px) {
  .waves { max-width: 220px; height: 24px; }
  .numeral-malta { width: 72px; height: 72px; }
  .numeral-malta__char { font-size: 38px; }
  .shell { width: 38px; height: 32px; margin-bottom: 12px; }
}

@media (max-width: 560px) {
  .guarantee-seal { width: 108px; height: 108px; margin: 4px 0; }
  .guarantee-seal__num { font-size: 30px; }
  .guarantee-seal__top, .guarantee-seal__sub { font-size: 7.5px; }
  .guarantee-seal__top { margin-top: 26px; }
  .guarantee-seal__sub { margin-bottom: 26px; }
  .shell { width: 34px; height: 28px; margin-bottom: 10px; }
  .numeral-malta { width: 64px; height: 64px; margin-bottom: 10px; }
  .numeral-malta__char { font-size: 34px; }
}

@media (max-width: 380px) {
  .shell { display: none; } /* econ vertical space */
  .waves { max-width: 160px; height: 20px; margin: 12px auto; }
}
