/* Com Mel, por favor! — Brand Guide v1.0 (2026).
   Supplied logos keep their original colors, proportions and clear space. */
:root {
  color-scheme:light;
  --mel:#D99A20; --creme:#FAF4E5; --ameixa:#682F3F;
  --mel-claro:#EBCB83; --rose:#C9867B; --grafite:#2B2428;
  --font-sans:"Inter",Arial,sans-serif;
  --color-white:var(--creme);
  --color-amber-50:var(--creme); --color-amber-100:#F4E6BF;
  --color-amber-200:var(--mel-claro); --color-amber-300:var(--mel-claro);
  --color-amber-400:var(--mel); --color-amber-500:var(--mel); --color-amber-600:var(--mel);
  --color-amber-700:var(--ameixa); --color-amber-800:var(--ameixa); --color-amber-900:var(--grafite);
  --color-stone-50:var(--creme); --color-stone-100:#F3E8CF; --color-stone-200:#E4D4B6;
  --color-stone-300:#E3D4C2; --color-stone-400:#816F76; --color-stone-500:#75626A;
  --color-stone-600:#60505A; --color-stone-700:#50343F;
  --color-stone-800:var(--ameixa); --color-stone-900:var(--grafite);
  --color-blue-50:var(--creme); --color-blue-100:#F4E6BF; --color-blue-200:var(--mel-claro);
  --color-blue-300:var(--mel-claro); --color-blue-500:var(--mel);
  --color-blue-600:var(--ameixa); --color-blue-700:var(--ameixa); --color-blue-800:var(--ameixa);
  --color-indigo-50:var(--creme); --color-indigo-100:#F4E6BF;
  --color-indigo-600:var(--ameixa); --color-indigo-700:var(--ameixa);
  --color-purple-100:#F3E8CF; --color-purple-500:var(--ameixa); --color-purple-800:var(--ameixa);
  --color-slate-50:var(--creme); --color-slate-100:#F3E8CF;
  --color-slate-600:#60505A; --color-slate-700:var(--ameixa); --color-slate-900:var(--grafite);
  --primary:var(--ameixa); --primary-foreground:var(--creme);
  --background:var(--creme); --foreground:var(--grafite);
  --card:var(--creme); --card-foreground:var(--grafite);
  --popover:var(--creme); --popover-foreground:var(--grafite);
  --secondary:#F3E8CF; --secondary-foreground:var(--ameixa);
  --muted:#F3E8CF; --muted-foreground:#60505A;
  --accent:#F4E6BF; --accent-foreground:var(--ameixa);
  --border:#E4D4B6; --input:#BDA38A; --ring:var(--ameixa); --radius:.875rem;
  --chart-1:var(--mel); --chart-2:var(--ameixa); --chart-3:var(--mel-claro);
  --chart-4:var(--rose); --chart-5:var(--grafite);
}
html { scroll-padding-top:7rem; }
body { margin:0; font-family:var(--font-sans); color:var(--grafite); background:var(--creme); }
button,a,input,textarea { touch-action:manipulation; }
button,input,select,textarea { font-family:var(--font-sans); }
button,a { -webkit-tap-highlight-color:transparent; }
button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible {
  outline:3px solid var(--ameixa); outline-offset:4px;
}
::selection { background:var(--mel); color:var(--grafite); }
h1,h2 { font-family:"Anton",Impact,sans-serif; font-weight:400 !important; text-transform:uppercase; letter-spacing:.005em; line-height:1.12; text-wrap:balance; }
h1 { font-size:clamp(2.5rem,5vw,4.5rem); }
h2 { font-size:clamp(2rem,3.2vw,3rem); }
h3,h4 { font-family:var(--font-sans); font-weight:600; line-height:1.35; }
p { line-height:1.7; }
p.text-sm { font-size:1rem; }
button.text-xs,[role="tab"].text-xs { font-size:.875rem; }
img { max-width:100%; }
[data-slot="button"] { min-height:2.75rem; font-weight:600; border-radius:.5rem; }
[data-slot="button"]:hover { box-shadow:none; }
[data-slot="button"][class*="bg-amber-600"] { color:var(--grafite); }
[data-slot="button"][class*="bg-amber-600"]:hover { background:var(--mel-claro); }
[data-slot="card"] { box-shadow:none; border:1px solid var(--border); border-radius:1rem; }
[data-slot="card"].cursor-pointer:hover { border-color:var(--ameixa); box-shadow:0 6px 20px #682f3f0b; }
[data-slot="tabs-list"] { padding:.375rem; border-radius:.75rem; }
[data-slot="tabs-trigger"][data-state="active"] { background:var(--ameixa); color:var(--creme); box-shadow:none; }
[data-slot="badge"][class*="bg-"] { background:#F3E8CF; color:var(--ameixa); border-color:transparent; }
[data-slot="input"],[data-slot="textarea"],[data-slot="select-trigger"] { min-height:2.75rem; background-color:var(--creme); }
.bg-gradient-to-r,.bg-gradient-to-br,.bg-gradient-to-b { background-image:none; background-color:var(--ameixa); }
.bg-gradient-to-br.from-amber-50,.bg-gradient-to-br.from-slate-50 { background-color:var(--creme); }
.bg-gradient-to-br.from-amber-100,.bg-gradient-to-r.from-blue-50 { background-color:#F4E6BF; }
section.bg-white { background-color:var(--creme); }
section.bg-white.border-b { border-bottom:3px solid var(--mel); }
section.bg-white.border-b h1 { color:var(--ameixa); }
.max-w-7xl { padding-inline:clamp(1.25rem,3.6vw,3rem); }

/* Navigation: the official horizontal signature with breathing room. */
[data-loc="client/src/components/Navbar.tsx:31"] { background:var(--creme); border-bottom:1px solid var(--border); box-shadow:none; backdrop-filter:none; }
[data-loc="client/src/components/Navbar.tsx:33"] { height:auto; min-height:6.25rem; gap:.75rem; }
[data-loc="client/src/components/Navbar.tsx:35"] { flex-shrink:0; }
[data-loc="client/src/components/Navbar.tsx:36"] { width:16.5rem; height:auto; max-width:100%; object-fit:contain; }
[data-loc="client/src/components/Navbar.tsx:40"] { gap:0; }
[data-loc="client/src/components/Navbar.tsx:42"] { padding:.625rem; font-size:.875rem; white-space:nowrap; }
[data-loc="client/src/components/Navbar.tsx:42"].bg-amber-50,
[data-loc="client/src/components/Navbar.tsx:106"].bg-amber-50 { background:#F4E6BF; color:var(--ameixa); box-shadow:inset 0 -2px var(--mel); }
[data-loc="client/src/components/Navbar.tsx:93"] { width:2.75rem; height:2.75rem; color:var(--ameixa); }

/* Owner-supplied cream photograph, with a clear reading area on the left. */
.brand-hero { background-color:var(--creme); background-image:linear-gradient(90deg,#faf4e5e6 0%,#faf4e5b3 33%,#faf4e533 52%,#faf4e500 67%),url("/assets/brand/banner-mel.png"); background-size:cover; background-position:center; background-repeat:no-repeat; color:var(--grafite); border-bottom:1px solid var(--border); }
.brand-hero-layout { display:flex; align-items:center; min-height:clamp(36rem,46vw,46rem); max-width:80rem; margin-inline:auto; padding:clamp(3rem,5vw,4.5rem) clamp(1.25rem,3.6vw,3rem); }
.brand-hero-copy { min-width:0; width:49%; }
.brand-eyebrow { margin:0 0 1.375rem; color:var(--ameixa); font-size:.875rem; font-weight:600; letter-spacing:.1em; text-transform:uppercase; }
.brand-eyebrow::before { content:""; display:inline-block; width:2.25rem; height:3px; background:var(--mel); vertical-align:middle; margin-right:.75rem; }
.brand-hero h1 { font-size:clamp(2.65rem,4.2vw,4rem); line-height:1.1; margin:0 0 1.5rem; letter-spacing:0; color:var(--ameixa); max-width:16ch; text-wrap:initial; }
.brand-hero h1 span { display:block; color:var(--grafite); text-decoration:underline; text-decoration-color:var(--mel); text-decoration-thickness:.09em; text-underline-offset:.14em; }
.brand-hero-description { font-size:1.0625rem; line-height:1.8; max-width:36rem; margin:0 0 1.75rem; color:#60505A; }
.brand-hero-actions { display:flex; flex-wrap:wrap; gap:.75rem; }
.brand-button-primary,.brand-button-outline { min-height:3rem; padding:.875rem 1.125rem; height:auto; white-space:normal; font-size:.9375rem; line-height:1.4; }
.brand-button-primary { color:var(--creme); background:var(--ameixa); border:1px solid var(--ameixa); }
.brand-button-primary:hover { background:var(--grafite); }
.brand-button-outline { color:var(--ameixa); border:1px solid var(--ameixa); background:#faf4e5cc; }
.brand-button-outline:hover { background:#F4E6BF; }

/* Original routes and content share the new brand hierarchy. */
[data-loc="client/src/pages/Home.tsx:71"] { background:var(--mel); padding-block:2rem; border:0; }
[data-loc="client/src/pages/Home.tsx:73"] { gap:1.5rem; }
[data-loc="client/src/pages/Home.tsx:73"] > div:not(:last-child) { border-right:1px solid #682f3f33; }
[data-loc="client/src/pages/Home.tsx:73"] .font-bold { font-family:"Anton",Impact,sans-serif; font-size:2.75rem; font-weight:400; color:var(--grafite); }
[data-loc="client/src/pages/Home.tsx:73"] p { color:var(--grafite); font-size:.875rem; }
[data-loc="client/src/pages/Home.tsx:95"],[data-loc="client/src/pages/Home.tsx:135"] { padding-block:clamp(3rem,6vw,5rem); }
[data-loc="client/src/pages/Home.tsx:99"],[data-loc="client/src/pages/Home.tsx:138"] { color:var(--ameixa); }
[data-loc="client/src/pages/Home.tsx:108"] { border:1px solid var(--border); box-shadow:none; }
[data-loc="client/src/pages/Home.tsx:109"] { background:var(--mel-claro); }
[data-loc="client/src/pages/Home.tsx:110"] { background:transparent; }
[data-loc="client/src/pages/Home.tsx:111"] { background:var(--ameixa); box-shadow:none; }
[data-loc="client/src/pages/Home.tsx:112"] { color:var(--creme); }
[data-loc="client/src/pages/Home.tsx:119"] { padding:1.5rem; }
[data-loc="client/src/pages/Home.tsx:143"] [data-slot="card"] { padding:1.75rem; border-top:4px solid var(--mel); }
[data-loc="client/src/pages/Home.tsx:143"] h3 { font-size:1.1875rem; }
[data-loc="client/src/pages/Home.tsx:143"] svg { width:2rem; height:2rem; color:var(--ameixa); }
[data-loc="client/src/pages/Home.tsx:197"] { background:var(--ameixa); color:var(--creme); }
[data-loc="client/src/pages/Home.tsx:199"],[data-loc="client/src/pages/Home.tsx:202"] { color:var(--creme); }
[data-loc="client/src/pages/Home.tsx:206"] { background:var(--mel); color:var(--grafite); border:1px solid var(--mel); height:auto; min-height:3rem; white-space:normal; }
[data-loc="client/src/pages/Home.tsx:206"]:hover { background:var(--mel-claro); }
[data-loc="client/src/pages/Home.tsx:213"] { background:transparent; color:var(--creme); border-color:var(--creme); }
[data-loc="client/src/pages/Home.tsx:213"]:hover { background:#faf4e512; }
[data-loc="client/src/pages/Home.tsx:197"] :focus-visible { outline-color:var(--creme); }

/* Footer logo sits on its supplied cream background, without color filters. */
[data-loc="client/src/components/Footer.tsx:7"] { background:var(--grafite); color:var(--creme); border:0; }
[data-loc="client/src/components/Footer.tsx:9"] { gap:2rem; }
[data-loc="client/src/components/Footer.tsx:11"] { width:100%; max-width:16rem; height:auto; filter:none; border-radius:.25rem; }
[data-loc="client/src/components/Footer.tsx:12"] { color:#E3D4C2; font-size:.9375rem; }
[data-loc="client/src/components/Footer.tsx:7"] h4 { color:var(--mel-claro); }
[data-loc="client/src/components/Footer.tsx:7"] a { overflow-wrap:anywhere; }
[data-loc="client/src/components/Footer.tsx:7"] :is(button,a):hover { color:var(--mel-claro); }
[data-loc="client/src/components/Footer.tsx:7"] :focus-visible { outline-color:var(--mel); }
[data-loc="client/src/components/Footer.tsx:43"] { border-color:#faf4e533; color:#E3D4C2; }
@media (min-width:1024px) and (max-width:1199px) {
  [data-loc="client/src/components/Navbar.tsx:40"],[data-loc="client/src/components/Navbar.tsx:57"] { display:none; }
  [data-loc="client/src/components/Navbar.tsx:93"],[data-loc="client/src/components/Navbar.tsx:103"] { display:block; }
}
@media (max-width:1023px) {
  .brand-hero { --hero-photo-height:clamp(18rem,49vw,28rem); background-image:linear-gradient(to bottom,var(--creme) 0%,var(--creme) calc(100% - var(--hero-photo-height)),#faf4e500 calc(100% - var(--hero-photo-height) + 5rem)),url("/assets/brand/banner-mel.png"); background-size:100% 100%,auto var(--hero-photo-height); background-position:center,right bottom; }
  .brand-hero-layout { min-height:0; padding-top:2.5rem; padding-bottom:calc(var(--hero-photo-height) + 1.5rem); }
  .brand-hero-copy { width:100%; max-width:38rem; }
  .brand-hero h1 { font-size:clamp(2.6rem,6.5vw,4rem); }
}
@media (max-width:767px) {
  [data-loc="client/src/components/Navbar.tsx:33"] { min-height:5rem; }
  [data-loc="client/src/components/Navbar.tsx:36"] { width:14rem; }
  .brand-hero h1 { font-size:clamp(2.6rem,9.5vw,4.1rem); max-width:16ch; }
  .brand-hero-description { font-size:1rem; }
  .brand-hero-actions { flex-direction:column; align-items:stretch; }
  [data-loc="client/src/pages/Home.tsx:73"] > div:nth-child(2) { border-right:0; }
  [data-loc="client/src/pages/Home.tsx:73"] p { max-width:11rem; margin-inline:auto; }
  [data-loc="client/src/pages/Home.tsx:197"] { padding-block:3rem; }
}
@media (max-width:360px) {
  .brand-hero h1 { font-size:2.5rem; }
  [data-loc="client/src/components/Navbar.tsx:36"] { width:12rem; }
}
@media (prefers-reduced-motion:reduce) {
  *,*::before,*::after { animation-duration:.01ms !important; transition-duration:.01ms !important; }
}