@font-face { font-family: "Avenir Local"; src: local("Avenir Book"), local("Avenir-Book"), local("Avenir Roman"), local("Avenir-Roman"); font-weight: 400; font-style: normal; }
@font-face { font-family: "Avenir Local"; src: local("Avenir Medium"), local("Avenir-Medium"); font-weight: 500; font-style: normal; }
@font-face { font-family: "Avenir Local"; src: local("Avenir Heavy"), local("Avenir-Heavy"); font-weight: 700; font-style: normal; }
@font-face { font-family: "Avenir Local"; src: local("Avenir Black"), local("Avenir-Black"); font-weight: 800; font-style: normal; }

:root {
  color-scheme: light;
  --bg: #f7f2eb;
  --ink: #352229;
  --mute: #68535a;
  --wine: #591b2f;
  --red: #a52640;
  --glass: rgb(255 251 245 / .71);
  --surface: #fffaf5;
  --soft: #f2e4e4;
  --line: #dbcbd0;
  --shadow: 0 14px 42px rgb(81 34 49 / .08);
  --type: "Avenir Local", Avenir, "Avenir Next", Manrope, system-ui, sans-serif;
  --ease: cubic-bezier(.22,.61,.36,1);
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --bg: #201419;
  --ink: #f7e9e2;
  --mute: #d0b6bd;
  --wine: #f6c8d1;
  --red: #ff9dad;
  --glass: rgb(53 32 41 / .77);
  --surface: #301e26;
  --soft: #432631;
  --line: #65434e;
  --shadow: 0 14px 42px rgb(0 0 0 / .22);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 1.5rem; }
body {
  margin: 0;
  background: var(--bg);
  color: var(--ink);
  font: 400 1rem/1.55 var(--type);
  -webkit-font-smoothing: antialiased;
}
body, .nav-shell, .camp, .avail, .bar, .card,
.geral, .sheet, .m, .chip, .search, .btn-big, .ct a, .fab, .back-top, footer {
  transition: background-color 2s var(--ease), color 2s var(--ease), border-color 2s var(--ease);
}
a { color: inherit; }
button, input { font: inherit; }
:focus-visible { outline: 2px solid var(--red); outline-offset: 4px; }
.wrap { width: min(100% - 3rem, 1160px); margin-inline: auto; }
.skip { position: fixed; z-index: 30; top: .5rem; left: .5rem; padding: .7rem 1rem; background: var(--surface); transform: translateY(-150%); }
.skip:focus { transform: none; }

.site-header { position: relative; padding-top: max(22px, env(safe-area-inset-top)); z-index: 8; }
.nav-shell {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 14px;
  min-height: 66px;
  padding: 8px 13px 8px 14px;
  border: 1px solid var(--line);
  border-radius: 34px;
  background: var(--glass);
  -webkit-backdrop-filter: blur(24px) saturate(145%);
  backdrop-filter: blur(24px) saturate(145%);
  box-shadow: inset 0 1px 0 rgb(255 255 255 / .36), var(--shadow);
}
.signature { display: inline-flex; width: fit-content; align-items: center; gap: 11px; text-decoration: none; color: var(--wine); font: 700 1.36rem/1 var(--type); white-space: nowrap; }
.samara-symbol, .samara-wordmark { display: block; flex: none; background: center / contain no-repeat; }
.samara-symbol { width: 82px; height: 58px; background-image: url("assets/samara-ubuntu-simbolo.svg"); }
.samara-wordmark { width: 116px; height: 60px; background-position: left center; background-image: url("assets/samara-ubuntu-nome.svg"); }
[data-theme="dark"] .samara-symbol { background-image: url("assets/samara-ubuntu-simbolo-reversa.svg"); }
[data-theme="dark"] .samara-wordmark { background-image: url("assets/samara-ubuntu-nome-reversa.svg"); }
.signature .samara-symbol { width: 58px; height: 41px; }
.signature .samara-wordmark { width: 91px; height: 47px; }
.site-menu { grid-column: 2; display: flex; flex-wrap: wrap; justify-content: center; gap: 5px; }
.site-menu a { padding: 10px 13px; border-radius: 999px; font-size: .84rem; font-weight: 700; text-decoration: none; }
.site-menu a:hover { background: var(--soft); color: var(--wine); }
.theme {
  position: relative; display: grid; place-items: center; justify-self: end;
  width: 44px; height: 44px; padding: 0; cursor: pointer; border: 1px solid var(--line);
  border-radius: 50%; color: var(--wine); background: var(--glass);
}
.theme svg { grid-area: 1 / 1; width: 24px; height: 24px; transition: transform 2s var(--ease), opacity 2s var(--ease); }
.theme .moon, [data-theme="dark"] .theme .sun { opacity: 0; transform: rotate(-80deg) scale(.45); }
[data-theme="dark"] .theme .moon { opacity: 1; transform: none; }
.theme .auto-indicator { display: none; position: absolute; right: 5px; bottom: 5px; width: 7px; height: 7px; border-radius: 50%; background: var(--red); }
[data-theme-mode="auto"] .auto-indicator { display: block; }

.theme-hint {
  position: absolute;
  top: calc(100% + 9px);
  right: 0;
  z-index: 1;
  width: max-content;
  max-width: calc(100vw - 40px);
  padding: .5rem .75rem;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--surface);
  color: var(--wine);
  box-shadow: var(--shadow);
  font: 600 .75rem/1.3 var(--type);
  opacity: 0;
  visibility: hidden;
  transform: translateY(-7px) scale(.93);
  transform-origin: top right;
  pointer-events: none;
  transition: opacity .35s ease, transform .35s var(--ease), visibility .35s;
}
.theme-hint span { color: var(--mute); padding-inline: .18rem; }
.theme-intro .theme-hint { opacity: 1; visibility: visible; transform: none; }
.theme-intro { box-shadow: 0 0 0 4px var(--soft); }
@media (prefers-reduced-motion: no-preference) {
  .theme-intro .theme-hint { animation: theme-hint-in .48s var(--ease) both; }
  @keyframes theme-hint-in {
    from { opacity: 0; transform: translateY(-7px) scale(.93); }
    to { opacity: 1; transform: none; }
  }
}

.hero { overflow: hidden; }
.hrow { position: relative; isolation: isolate; padding: clamp(54px, 7vw, 106px) 0 23px; }
.hero-copy { position: relative; max-width: 650px; padding-bottom: clamp(36px, 5vw, 66px); }
.eyebrow { display: flex; align-items: center; gap: 12px; margin: 0 0 24px; color: var(--red); font-size: .78rem; font-weight: 700; text-transform: uppercase; letter-spacing: .22em; }
.eyebrow::before { content: ""; width: 32px; height: 1px; background: currentColor; }
h1, h2, h3, h4 { margin: 0; font-family: var(--type); font-weight: 700; line-height: 1.12; color: var(--wine); }
h1 { font-size: clamp(2.55rem, 6.9vw, 6.65rem); font-weight: 800; letter-spacing: -.045em; line-height: 1; }
h1 span { color: var(--red); }
.hero-signature { display: flex; align-items: center; gap: 15px; margin-top: 34px; }
.name span { display: block; margin-top: 7px; font-size: .88rem; color: var(--mute); }
.tag { display: inline-block; margin-top: 23px; padding: 6px 13px; border: 1px solid var(--line); border-radius: 999px; background: var(--glass); color: var(--red); font-size: .86rem; font-weight: 700; }
.architecture { position: absolute; z-index: -1; overflow: hidden; pointer-events: none; inset: 0 -24px 72px 36%; mask-image: linear-gradient(to bottom,#000 65%,transparent 100%); }
.architecture img { position: absolute; bottom: -11%; max-width: none; object-fit: contain; filter: grayscale(.62) saturate(.84); opacity: .26; }
.architecture .macedo { width: 56%; height: 103%; right: 0; }
.architecture .infinity { width: 65%; height: 78%; right: 22%; opacity: .12; }
.arch-frame { position: absolute; right: 9%; top: 8%; width: 65%; aspect-ratio: 1; border: 1px solid var(--line); border-radius: 50%; opacity: .6; }
[data-theme="dark"] .architecture img { opacity: .17; }
[data-theme="dark"] .architecture .infinity { opacity: .11; }
.ct { display: flex; flex-wrap: wrap; gap: 9px; padding: 12px 0 0; border-top: 1px solid var(--line); }
.ct a, .camp a, .btn-big, .fab, .back-top {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px;
  padding: .55rem .9rem; border: 1px solid var(--line); border-radius: 999px; background: var(--glass);
  color: var(--wine); text-decoration: none; font-size: .86rem; font-weight: 700;
}
.ct svg, .fab svg, .back-top svg { width: 19px; height: 19px; flex: none; }
.ct a:hover, .camp a:hover, .btn-big:hover, .fab:hover, .back-top:hover { border-color: var(--red); background: var(--soft); }

.highlights { display: grid; grid-template-columns: 1fr 1.36fr; align-items: stretch; gap: 15px; margin-bottom: 28px; }
.camp, .avail, .card, .geral { min-width: 0; border: 1px solid var(--line); border-radius: 24px; background: var(--glass); box-shadow: var(--shadow); }
.camp, .avail { padding: clamp(18px, 3vw, 32px); }
.camp { display: flex; flex-direction: column; align-items: flex-start; gap: 15px; background: var(--soft); }
.camp .ic { display: grid; place-items: center; width: 43px; height: 43px; border-radius: 50%; border: 1px solid var(--line); color: var(--red); }
.camp svg { width: 21px; }
.camp a { margin-top: auto; }
.camp h2, .avail h2, .geral h3 { font-size: clamp(1.65rem, 3vw, 2.35rem); }
.camp p, .avail p, .avail ol { margin: 9px 0 0; color: var(--mute); font-size: .9rem; }
.avail ol { padding-left: 1.2rem; margin-bottom: 14px; }
.avail li + li { margin-top: 3px; }

.bar { position: sticky; top: 0; z-index: 5; background: var(--glass); border-block: 1px solid var(--line); -webkit-backdrop-filter: blur(24px) saturate(145%); backdrop-filter: blur(24px) saturate(145%); }
.bar .wrap { display: grid; grid-template-columns: minmax(220px, 1fr) auto; align-items: center; gap: 16px; padding-block: 12px; }
.search { width: 100%; min-height: 46px; padding: 8px 15px; border: 1px solid var(--line); border-radius: 999px; color: var(--ink); background: var(--surface); }
.search::placeholder { color: var(--mute); }
.chips { display: flex; flex-wrap: wrap; gap: 6px; }
.chip { min-height: 44px; padding: .35rem .78rem; color: var(--wine); background: var(--glass); border: 1px solid var(--line); border-radius: 999px; font-size: .8rem; font-weight: 700; cursor: pointer; }
.chip:hover { border-color: var(--red); }
.chip[aria-pressed="true"] { background: var(--soft); border-color: var(--red); }
.count { margin: 22px 0 0; color: var(--wine); font: 700 1.65rem/1.1 var(--type); }
.legend { display: flex; flex-wrap: wrap; gap: 12px; font-size: .78rem; color: var(--mute); margin: 10px 0 17px; }
.legend span::before { content: ""; display: inline-block; width: 10px; height: 10px; margin-right: 6px; border-radius: 3px; border: 1px solid var(--red); background: var(--red); }
.legend .lp::before { background: transparent; border: 1px dashed var(--mute); }
.list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 15px; }
.card, .geral { padding: clamp(15px, 2.3vw, 26px); }
.card-title { display: flex; align-items: center; gap: clamp(8px, 2vw, 15px); }
.card-title h3 { min-width: 0; }
.card h3 { font-size: clamp(1.45rem, 2.5vw, 2.05rem); }
.where { margin: .35rem 0 0; color: var(--mute); font-size: .87rem; }
.m .n { display: inline-block; background: var(--soft); color: var(--wine); border-radius: 999px; padding: .2rem .6rem; font-size: .73rem; font-weight: 700; }
.grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; margin-top: 17px; }
.m { display: flex; flex-direction: column; justify-content: center; text-align: left; min-width: 0; min-height: 62px; padding: 9px 12px; color: var(--ink); border: 1px solid var(--line); border-radius: 12px; background: var(--glass); text-decoration: none; font-size: .85rem; font-weight: 700; line-height: 1.24; overflow-wrap: anywhere; }
.m small { margin-top: 3px; font-size: .77rem; font-weight: 500; color: var(--mute); }
.m .n { padding: 1px 6px; }
.m.ok:hover, .m.disp:hover { border-color: var(--red); background: var(--soft); }
button.m { cursor: pointer; }
.m.pend { border-style: dashed; color: var(--mute); }
.m.info { background: var(--soft); }
.m.disp { grid-column: 1 / -1; flex-direction: row; justify-content: space-between; align-items: center; gap: 10px; color: var(--wine); background: var(--soft); }
.prog { margin: 12px 0 0; color: var(--mute); font-size: .75rem; }
.geral { margin: 24px 0 40px; scroll-margin-top: 68px; }
.geral .grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }

.sheet { width: min(620px, 100% - 2rem); max-height: min(82dvh, 780px); padding: 23px; border: 1px solid var(--line); border-radius: 22px; background: var(--surface); color: var(--ink); box-shadow: var(--shadow); }
.sheet::backdrop { background: rgb(34 14 24 / .54); backdrop-filter: blur(5px); }
body:has(.sheet[open]) { overflow: hidden; }
.sheet h4 { font-size: clamp(1.7rem, 4vw, 2.4rem); }
.sheet .sub { margin: 8px 0 15px; color: var(--mute); font-size: .85rem; }
.sheet a { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 12px 3px; border-top: 1px solid var(--line); font-weight: 700; font-size: .87rem; text-decoration: none; }
.sheet a:hover { color: var(--red); }
.sheet a small { display: block; color: var(--mute); font-weight: 400; }
.sheet .go { flex: none; color: var(--red); }
.close { float: right; margin: 0 0 8px 10px; min-height: 44px; padding: 0 .75rem; color: var(--wine); background: var(--glass); border: 1px solid var(--line); border-radius: 999px; cursor: pointer; }

footer { border-top: 1px solid var(--line); background: var(--surface); color: var(--mute); font-size: .84rem; padding: 26px 0 calc(90px + env(safe-area-inset-bottom)); }
.footer-marks { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 14px; align-items: center; padding-bottom: 16px; border-bottom: 1px solid var(--line); }
.brand-marks { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; }
.brand-logo {
  display: inline-block;
  flex: none;
  width: var(--brand-width, 76px);
  height: 25px;
  background: var(--brand-light) center / contain no-repeat;
}
[data-theme="dark"] .brand-logo { background-image: var(--brand-dark); }
.brand-md {
  --brand-width: 46px;
  --brand-light: url("assets/md.png");
  --brand-dark: url("assets/md-invertida.png");
}
.brand-mood {
  --brand-light: url("assets/mood.png");
  --brand-dark: url("assets/mood-invertida.png");
}
.brand-un1ca {
  --brand-light: url("assets/un1ca-marca.png");
  --brand-dark: url("assets/un1ca-marca-invertida.png");
}
.card-title .brand-logo { width: clamp(40px, 15vw, var(--brand-width, 76px)); height: 20px; }
@media (max-width: 480px) {
  .brand-marks { width: 100%; gap: 12px; }
  .brand-marks .brand-logo { max-width: 23%; }
}
.fab, .back-top { position: fixed; z-index: 6; bottom: max(12px, env(safe-area-inset-bottom)); padding: .65rem 1rem; box-shadow: var(--shadow); background: var(--surface); }
.fab { right: max(12px, env(safe-area-inset-right)); }
.back-top { left: max(12px, env(safe-area-inset-left)); }
.back-top[hidden] { display: none; }
@media (max-width: 380px) {
  .fab, .back-top { gap: 5px; padding-inline: .62rem; font-size: .75rem; }
  .fab svg, .back-top svg { width: 16px; height: 16px; }
}
@media (prefers-reduced-motion: no-preference) {
  .back-top:not([hidden]) { animation: arrive .25s var(--ease) both; }
}


@media (max-width: 900px) {
  .bar .wrap { grid-template-columns: 1fr; gap: 7px; }
  .geral { scroll-margin-top: 118px; }
}
@media (max-width: 660px) {
  .wrap { width: calc(100% - 1.5rem); }
  .site-header { padding-top: max(10px, env(safe-area-inset-top)); }
  .nav-shell { grid-template-columns: 1fr auto; border-radius: 22px; gap: 3px 8px; padding: 8px 10px; }
  .site-menu { grid-column: 1; grid-row: 1; justify-content: flex-start; gap: 0; }
  .site-menu a { font-size: clamp(.65rem, 2.9vw, .78rem); padding-inline: clamp(3px, 1.25vw, 9px); min-height: 44px; display: grid; place-items: center; }
  .theme { grid-column: 2; grid-row: 1; }
  .hrow { padding-top: 45px; }
  .architecture { inset: 0 -18px 110px 17%; opacity: .63; }
  .architecture .macedo { width: 70%; right: -16%; }
  .architecture .infinity { width: 75%; right: 2%; }
  .hero-signature { margin-top: 29px; }
  .hero-signature .samara-symbol { width: 64px; height: 46px; }
  .ct { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ct a { justify-content: flex-start; font-size: .72rem; padding: .55rem .55rem; overflow-wrap: anywhere; }
  .highlights, .list, .geral .grid { grid-template-columns: 1fr; }
  .bar .wrap { padding-block: 8px; }
  .chips { flex-wrap: nowrap; overflow-x: auto; padding: 3px 4px 5px; margin-inline: -4px; }
  .chip { flex: none; }
  .sheet { width: 100%; max-width: 100%; margin: auto 0 0; border-radius: 22px 22px 0 0; padding-bottom: calc(22px + env(safe-area-inset-bottom)); }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition-duration: 0s !important; scroll-behavior: auto !important; }
}

@keyframes arrive {
  from { opacity: .78; transform: translateY(5px); }
  to { opacity: 1; transform: translateY(0); }
}
@media (prefers-reduced-motion: no-preference) {
  .arriving { animation: arrive .48s cubic-bezier(.2,.65,.3,1) both; }
}

.site-menu a[aria-current="page"] { background: var(--soft); color: var(--wine); }
.page-body { padding-block: clamp(24px, 5vw, 64px); }
.page-heading { margin-bottom: 26px; }
.page-heading h1, .page-heading h2 { font-size: clamp(2.3rem, 6vw, 4.5rem); }
.page-heading p { color: var(--mute); margin: 12px 0 0; }
.campaign-page { padding-block: clamp(16px, 3vw, 36px); }
.campaign-image { display: block; width: 100%; max-width: 752px; height: auto; margin-inline: auto; }
.catalog-results { padding-bottom: 55px; }

.landing-section { scroll-margin-top: 14px; }
.landing-section .page-body { padding-bottom: 24px; }
.landing-section + .landing-section { border-top: 1px solid var(--line); }
.campaign-art { display: block; width: min(100%, 752px); margin-inline: auto; }
.material-page { max-width: 1120px; }
.material-page h1 { font-size: clamp(1.65rem, 4vw, 3.2rem); overflow-wrap: anywhere; }
.material-preview img, .material-preview video { display: block; max-width: 100%; max-height: 80vh; margin-inline: auto; }
.material-preview img { max-height: none; }
.material-preview iframe { display: block; width: 100%; height: clamp(450px, 75vh, 1050px); border: 1px solid var(--line); border-radius: 10px; background: var(--surface); }
.material-actions { margin-top: 22px; }
.material-actions .btn-big { width: fit-content; }
@media (prefers-reduced-motion: no-preference) {
  .reveal-pending { opacity: .78; transform: translateY(5px); }
  .reveal-pending:focus-within { opacity: 1; transform: none; }
}