@import url('https://fonts.googleapis.com/css2?family=Bodoni+Moda:ital,wght@0,400;0,500;0,600;1,400&family=Manrope:wght@400;500;600;700&display=swap');

/* Public pages only. Load after estilo.css, before page-specific refreshes. */
:root {
  color-scheme: light;
  --brand-font: 'Manrope', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --display-font: 'Bodoni Moda', 'Times New Roman', serif;
  --paper: #f7f6f2;
  --white: #fffefa;
  --ink: #292722;
  --muted: #69655d;
  --olive: #53624d;
  --bg: var(--paper);
  --panel: #efede7;
  --soft: #69655d;
  --faint: #716c63;
  --line: #dedbd2;
  --accent: var(--olive);
  --blue: var(--olive);
  --blue-button: var(--olive);
  --blue-light: var(--olive);
  --foto: none;
  --foto-fondo: none;
}

body, body.home-page, body.music-page, body.trophy-body {
  background: var(--paper);
  color: var(--ink);
  font-family: var(--brand-font);
  font-weight: 400;
  line-height: 1.6;
  font-synthesis: none;
}

/* Legacy component font shorthands must not reintroduce Anton or monospace. */
body :where(h1, h2, h3, h4, p, a, button, input, textarea, select, label,
  legend, span, b, strong, em, i, li, small, blockquote, figcaption, footer, .meta) {
  font-family: var(--brand-font) !important;
  letter-spacing: 0 !important;
}

body :is(h1, h2, h3), body :is(h1, h2, h3) :is(span, em, strong),
body .stats b, body .timeline b, body .google-rating strong, body .card-cta b {
  font-family: var(--display-font) !important;
  font-optical-sizing: auto;
}
h1, h2, h3 { font-weight: 400; text-transform: none; text-wrap: balance; }
h1, h2, h3, p, a, button, label, legend { overflow-wrap: anywhere; }
strong, b { font-weight: 600; }
::selection { background: #dce3d6; color: var(--ink); }
:focus-visible { outline: 3px solid var(--olive); outline-offset: 4px; }
:where(input, textarea, select):focus-visible { outline-offset: 2px; }
.lab, .home-page .lab:not(.lab-dim) { color: var(--olive); font-size: 11px; line-height: 1.5; font-weight: 650; }
.lab-dim { color: var(--muted); }
.page { padding-top: 72px; }
.page h1 { font-size: 80px; line-height: 1.08; }
.sec-head h2, .band h3, .google-copy h2, .social-copy h2,
.payment-heading h2 { font-size: 56px; line-height: 1.08; }
.home-page .sec-head h2 { padding-left: 0; border-left: 0; }
.home-page .hero + .sec { padding-top: 48px; }
.sec-head, .card-cta, .music-section-head { align-items: center; }
:where(.sec-head, .row, .card-cta, .google-band, .social-band, .payment-heading,
  .music-story, .music-section-head, .music-single, .music-platforms, .bio-header) > * { min-width: 0; }

/* Navigation retains the existing menu and language-switch behavior. */
body > header {
  background: rgba(247, 246, 242, .97);
  border-bottom: 1px solid var(--line);
  box-shadow: none;
}
body > header img { filter: none; }
header nav a { color: var(--muted); font-size: 11px; line-height: 1.4; border-radius: 0; }
header nav a:hover { color: var(--ink); background: #e9e7df; }
header nav a[aria-current=page], .home-page nav a[aria-current=page],
.music-page nav a[aria-current=page] { background: transparent; color: #3c4b36; box-shadow: inset 0 -1px var(--olive); }
header nav a[aria-current=page]:hover { color: #3c4b36; opacity: 1; }
.lang, .lang.lang-open, .lang:focus-within { background: var(--white); border-color: var(--line); }
.lang button, .lang button[aria-pressed=false] { color: var(--muted); font-size: 11px; }
.lang button[aria-pressed=true], .home-page .lang button[aria-pressed=true],
.music-page .lang button[aria-pressed=true], .lang.lang-open button[aria-pressed=true],
.lang:focus-within button[aria-pressed=true] { background: var(--olive); color: var(--white); }
header .wa-btn { background: var(--olive); color: var(--white); }
header .wa-btn:hover { background: #414e3c; color: var(--white); }
.menu-toggle { border-color: var(--line); border-radius: 2px; }
.menu-toggle[aria-expanded=true] { background: var(--olive); color: var(--white); }

.btn, .pay-option, .product-action, .music-release-actions a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 46px;
  gap: 8px;
  border-radius: 2px;
  font-size: 12px;
  line-height: 1.5;
  font-weight: 600;
  white-space: normal;
  text-align: center;
}
.btn-solid, .btn-accent, .home-page .btn-solid, .home-page .btn-accent,
.music-btn-primary, .product-action { background: var(--olive); color: var(--white); }
.btn-solid:hover, .btn-accent:hover, .home-page .btn-solid:hover,
.home-page .btn-accent:hover, .music-btn-primary:hover { background: #414e3c; color: var(--white); }
.btn-ghost, .home-page .btn-ghost { background: transparent; border: 1px solid #b5b5a9; color: var(--ink); }
.btn-ghost:hover, .home-page .btn-ghost:hover { background: #e9e7df; border-color: var(--olive); color: var(--ink); }
.more, .home-page .more { color: var(--olive); font-size: 12px; line-height: 1.5; }
.more:hover { color: var(--ink); text-decoration: underline; text-underline-offset: 4px; }

/* Photo-backed areas are deliberately explicit: never recolor every .inner. */
.hero, .home-page .hero {
  display: flex;
  align-items: flex-end;
  height: auto;
  min-height: min(650px, calc(100svh - 160px));
  padding: 48px 40px 36px;
  background: #292722;
  color: var(--white);
}
.hero > img, .home-page .hero > img { height: 100%; filter: none; object-position: 74% 32%; }
.hero .veil, .home-page .hero .veil {
  background: linear-gradient(90deg, #171914c7 0%, #17191470 38%, #17191400 68%),
    linear-gradient(0deg, #171914bf 0%, #17191400 48%);
}
.hero .inner, .home-page .hero .inner { position: relative; left: auto; right: auto; bottom: auto; width: 100%; }
.hero h1, .home-page .hero h1 { font-size: 136px; line-height: .98; font-weight: 400; max-width: 720px; text-wrap: nowrap; overflow-wrap: normal; }
.home-page .hero h1 span { color: #e4e9dc; font-family: var(--display-font) !important; font-style: normal; font-weight: 400; }
.home-page .hero .hero-brand { font-size: 12px; font-weight: 500; margin: 20px 0 16px; }
.home-page .hero-copy > p { font-size: 14px; line-height: 1.75; max-width: 460px; }
.hero .lab, .home-page .hero .lab, .cover .lab, .home-page .cover .lab,
.music-hero .lab, .trophy-hero .lab { color: #eeefe7; }
.hero p:not(.lab), .home-page .hero p:not(.lab):not(.hero-brand),
.cover p:not(.lab), .music-hero-copy, .trophy-hero p { color: #eeeee8; }
.hero .row { align-items: flex-end; }
.hero-reasons li { background: transparent; border: 0; border-top: 1px solid #dce3d66b; padding: 8px 0; font-size: 10px; line-height: 1.5; }
.hero-reasons { gap: 18px; }
.hero .btn-ghost, .home-page .hero .btn-ghost, .cover .btn-ghost,
.music-btn-ghost { color: var(--white); background: #29272266; border: 1px solid #d4d7c6; }
.hero .btn-ghost:hover, .home-page .hero .btn-ghost:hover,
.cover .btn-ghost:hover, .music-btn-ghost:hover { background: #292722b3; border-color: var(--white); color: var(--white); }
.hero :focus-visible, .cover :focus-visible, .music-hero :focus-visible { outline-color: #e5eadb; }
.cover { background: #292722; color: var(--white); }
.cover > img { filter: none; }
.cover .veil { background: #20251dcc; }
.cover h3 { font-size: 76px; line-height: 1.08; max-width: 950px; margin-inline: auto; }

/* Gallery and biography keep original photography and image orientations. */
.rail { scrollbar-color: #a4ac9a var(--paper); gap: 20px; padding-bottom: 24px; }
.rail .pieza { width: 304px; }
.grid { gap: 30px 20px; }
.pieza .ph, .pieza.pieza-compacta .ph { background: #e6e4dd; border-radius: 0; }
.pieza .cap { color: var(--ink); gap: 8px; align-items: flex-start; line-height: 1.5; }
.pieza .cap span:last-child { color: var(--muted); font-size: 10px; line-height: 1.5; text-align: right; }
.filters button { min-height: 44px; color: var(--muted); border-color: #c8c8bb; border-radius: 2px; font-size: 12px; line-height: 1.4; }
.filters button:hover { border-color: var(--olive); background: #eeefe8; }
.filters button[aria-pressed=true] { background: var(--olive); color: var(--white); border-color: var(--olive); }
.meta { color: var(--muted); font-size: 12px; }
.bio-title h1 { font-size: 88px; line-height: 1.04; }
.bio-copy > div:first-child > p:first-child { color: var(--ink); }
.bio a { color: var(--olive); border-color: #b5bcae; }
.timeline b, .stats b { font-size: 56px; line-height: 1.2; font-weight: 400; color: var(--olive); }
.home-page .stats b { color: var(--olive); }
.timeline em, .stats i { color: var(--muted); line-height: 1.65; }
.stats i { font-size: 11px; }

.band, .home-page .band { border-block: 1px solid var(--line); background: #eeeee7; padding-block: 90px; }
.band h3 { font-size: 68px; max-width: 650px; }
.stats { grid-template-columns: repeat(2, minmax(0, 1fr)); background: transparent; gap: 0; }
.stats div { min-width: 0; background: transparent; border-top: 1px solid #c9cdbf; padding: 28px 16px 32px 0; }
.stats b { font-size: 64px; }
.google-band, .social-band, .home-page .social-band, .payment-band {
  background: var(--paper);
  border-color: var(--line);
}
.social-band::before { display: none; }
.google-rating strong { font-size: 54px; line-height: 1.2; font-weight: 400; }
.google-rating > span:last-child { color: var(--muted); font-size: 11px; }
.google-stars, .review-stars { color: #806321; }
.review-grid { gap: 24px; }
.review-card { background: transparent; border: 0; border-top: 1px solid var(--line); border-radius: 0; padding: 22px 0 0; }
.review-card blockquote { font-family: var(--display-font) !important; font-size: 21px; line-height: 1.5; color: var(--ink); }
.review-card p { color: var(--ink); font-size: 11px; }
.review-card p span { color: var(--olive); }
.map-panel { background: transparent; border: 0; }
.map-frame { filter: none; }
.location-strip { border-color: var(--line); padding-inline: 0; }
.location-strip div > span { color: var(--muted); font-size: 11px; }
.social-links { grid-template-columns: minmax(0, 1fr); gap: 0; }
.social-card { flex-direction: row; justify-content: flex-start; min-height: 108px; gap: 24px; padding: 24px 0; background: transparent; border: 0; border-bottom: 1px solid var(--line); border-radius: 0; text-align: left; }
.social-card:first-child { border-top: 1px solid var(--line); }
.social-card b { font-size: 21px; font-weight: 500; }
.social-icon { width: 46px; height: 46px; flex: none; border-radius: 8px; }
.social-card em { color: var(--muted); font-size: 11px; line-height: 1.5; }
.social-card:hover, .home-page .social-card:hover { border-color: #a4af9a; background: transparent; }
.payment-brand { background: transparent; border: 0; border-radius: 0; }
.payment-methods { border-block: 1px solid var(--line); padding-block: 18px; }
.payment-brand > span:last-child { color: var(--muted); font-size: 10px; line-height: 1.5; }
.payment-disclaimer { color: var(--muted); font-size: 12px; }
.pay-option { background: var(--white); border-color: var(--line); color: var(--ink); }
.pay-option:hover { background: #e9eee3; }
.pay-logo-whatsapp { color: var(--olive); }

/* Booking and care: quiet surfaces with clear input and status contrast. */
#consulta { background: transparent; border: 0; border-top: 2px solid var(--olive); border-radius: 0; padding: 32px 0 0; }
label, legend { color: var(--ink); font-size: 12px; line-height: 1.5; font-weight: 550; }
input, select, textarea {
  background: var(--white);
  border: 1px solid #c9c6bb;
  border-radius: 6px;
  color: var(--ink);
  font-size: 16px;
  line-height: 1.5;
  min-height: 48px;
}
input::placeholder, textarea::placeholder { color: #777166; opacity: 1; }
input:focus, select:focus, textarea:focus { border-color: var(--olive); }
input[type=checkbox], input[type=radio] { min-height: 0; accent-color: var(--olive); }
.err { background: #f7e8e5; color: #8c3732; border-color: #d9aaa3; }
.success { background: #eaf0e3; color: #3b5731; border-color: #b6c5a8; }
.note, .field-note { color: var(--muted); font-size: 12px; }
.steps > div > div { display: block; min-width: 0; }
.steps b { font-size: 22px; line-height: 1.4; color: var(--olive); }
.steps em, .ticks li { color: var(--muted); }
.ticks li { border-color: var(--line); }
.policy-box { padding: 24px 0; background: transparent; border: 0; border-top: 1px solid var(--line); }
.policy-box h2 { font-size: 28px; line-height: 1.2; }
.policy-box p:not(.lab) { color: var(--muted); }
.card-cta { border-inline: 0; padding-inline: 0; }
.card-cta b { font-size: 36px; line-height: 1.2; font-weight: 400; }
.card-cta span { color: var(--muted); }
.care-panel, .products-panel { background: transparent; border: 0; padding: 0; }
.care-layout { gap: 40px; }
.care-panel h2, .care-panel .care-selection-title { font-size: 36px; line-height: 1.18; color: var(--ink); max-width: none; }
.care-panel h3, .care-selection-label { color: var(--olive); font-size: 12px; line-height: 1.5; }
.care-list li { color: var(--muted); border-color: var(--line); grid-template-columns: 34px minmax(0, 1fr); }
.care-list strong, .product-copy strong { color: var(--ink); }
.care-list b { background: #e9eee3; border-color: #cbd3c2; color: var(--olive); }
.care-card { background: transparent; border: 0; border-top: 1px solid var(--line); border-radius: 0; padding: 22px 0; }
.product-item { background: transparent; border: 0; border-radius: 0; padding: 0 0 24px; }
.care-card p, .product-copy em, .care-note { color: var(--muted); }
.care-panel .legal-text { color: var(--muted); }
.care-note { font-size: 12px; }
.product-item:hover { background: transparent; border-color: #a4af9a; }
.product-stage { left: 14px; top: 14px; background: var(--olive); border-color: #ffffff80; box-shadow: none; font-size: 10px; line-height: 1.4; max-width: calc(100% - 28px); }
.product-photo { background: #eeede8; border-color: var(--line); }

/* Music retains artwork and platform marks while sharing the public brand. */
.music-page { --music-blue: var(--olive); --music-blue-deep: var(--olive); --music-ice: var(--ink); }
.music-hero {
  display: flex;
  align-items: flex-end;
  height: auto;
  min-height: 620px;
  padding: 72px 40px 44px;
  background: #292722;
  color: var(--white);
  border-color: var(--line);
}
.music-hero > img { filter: none; }
.music-hero-veil { background: linear-gradient(90deg, #171914e0, #1719148c 45%, #17191408 80%), linear-gradient(0deg, #171914b3, transparent 65%); }
.music-hero-inner { position: relative; left: auto; right: auto; bottom: auto; width: 100%; }
.music-hero h1 { font-size: 100px; line-height: 1.05; font-weight: 450; text-shadow: none; }
.music-artist { color: #e2e7da; font-size: 13px; line-height: 1.5; }
.music-status { color: #e2e7da; font-size: 11px; line-height: 1.5; }
.music-story, .music-single, .music-platforms { background: var(--panel); border-color: var(--line); }
.music-story h2, .music-section-head h2, .music-single h2, .music-platforms h2 { font-size: 42px; line-height: 1.15; }
.music-story-copy > p, .music-origin span { color: var(--muted); }
.music-origin { border-color: var(--line); border-left-color: var(--olive); }
.music-origin span { font-size: 11px; line-height: 1.5; }
.music-origin strong { color: var(--ink); }
.music-release { background: transparent; border: 0; border-radius: 0; overflow: hidden; }
.music-release-copy { padding: 24px 0; }
.music-release-new { border-color: #a4af9a; }
.music-release-art > span { background: var(--olive); font-size: 11px; line-height: 1.5; }
.music-release-copy .lab { font-size: 11px; }
.music-release-copy h3 { font-size: 30px; line-height: 1.18; }
.music-release-copy > p:not(.lab) { color: var(--muted); }
.music-release-actions a { color: var(--ink); border-color: #c8c8bb; padding: 10px 14px; }
.music-release-actions a:hover { background: #eef0e8; border-color: var(--olive); }
.music-release-new .music-release-actions a { background: var(--olive); border-color: var(--olive); color: var(--white); }
.music-single .music-btn-ghost { background: transparent; border-color: #b5b5a9; color: var(--ink); }
.music-single .music-btn-ghost:hover { background: #e4e7dd; }
.music-platform-grid > a { background: transparent; border: 0; border-top: 1px solid var(--line); border-radius: 0; grid-template-columns: 54px minmax(0, 1fr); padding-inline: 0; }
.music-platform-grid > a:hover { background: #eef0e8; border-color: #a4af9a; }
.music-platform-grid em { color: var(--muted); font-size: 11px; line-height: 1.5; }

/* The public passion gallery, not the independent G63 sales pages. */
.trophy-hero { min-height: 620px; color: var(--white); }
.trophy-hero > img { filter: none; }
.trophy-hero .veil { background: linear-gradient(180deg, #17191408 20%, #1719149e 52%, #171914ed); }
.trophy-hero h1 { font-size: 64px; line-height: 1.12; }
.trophy-hero p { max-width: 660px; }
.trophy-card { min-height: 0; justify-content: flex-start; background: transparent; border: 0; border-radius: 0; }
.trophy-card::before { display: none; }
.trophy-media { min-height: 0; aspect-ratio: 4 / 3; background: #e6e4dd; }
.trophy-media img, .trophy-card:hover .trophy-media img { filter: none; }
.trophy-media span { background: #292722bd; color: var(--white); font-size: 11px; line-height: 1.5; }
.trophy-info { padding: 24px 0; }
.trophy-info b { color: var(--olive); font-size: 12px; line-height: 1.5; }
.trophy-info h2 { font-size: 28px; line-height: 1.2; }
.trophy-info p { color: var(--muted); font-size: 12px; }

body > footer { background: var(--paper); border-color: var(--line); color: var(--muted); font-size: 12px; line-height: 1.8; }
footer a:hover { color: var(--olive); text-decoration: underline; text-underline-offset: 4px; }
.float, .home-page .float, .music-page .float { background: var(--olive); color: var(--white); box-shadow: 0 5px 20px #29272226; }
.float:hover, .home-page .float:hover { background: #414e3c; color: var(--white); }
.float::before, .home-page .float::before, .music-page .float::before { background: var(--white); }

@media (min-width: 1101px) {
  header nav { gap: 2px; }
  header nav a { padding-inline: 10px; }
  .hero .row { gap: 28px; }
}

@media (max-width: 1100px) {
  .lang, .lang.lang-open, .lang:focus-within { background: var(--white); }
  .lang button, .lang button[aria-pressed=false] { color: var(--muted); }
  .hero, .home-page .hero { min-height: min(660px, calc(100svh - 160px)); height: auto; }
  .hero h1, .home-page .hero h1 { font-size: 104px; }
  .music-story, .music-platforms { grid-template-columns: minmax(0, 1fr); gap: 32px; }
  .music-single { grid-template-columns: minmax(0, 1fr); gap: 28px; }
  .music-single-actions { justify-content: flex-start; }
  .music-release-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .music-section-head { flex-wrap: wrap; }
}

@media (max-width: 700px) {
  .page h1 { font-size: 52px; }
  .bio-header { grid-template-columns: minmax(0, 1fr) 150px; gap: 20px; }
  .bio-title h1 { font-size: 42px; line-height: 1.12; overflow-wrap: normal; }
  .bio-copy { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .hero, .home-page .hero { min-height: 0; padding: 220px 20px 32px; }
  .hero h1, .home-page .hero h1 { font-size: 88px; line-height: 1; }
  .hero > img, .home-page .hero > img { height: 490px; object-position: 68% 26%; }
  .hero .veil, .home-page .hero .veil { background: linear-gradient(180deg, #29272200 0, #29272214 170px, #2927228c 300px, #292722f2 460px, #292722 490px); }
  .hero .inner, .home-page .hero .inner { bottom: auto; left: auto; right: auto; }
  .home-page .hero .row { gap: 20px; }
  .home-page .hero .cta { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .home-page .hero .cta .btn { min-height: 48px; font-size: 11px; line-height: 1.5; }
  .hero-reasons { gap: 8px 16px; }
  .hero-reasons li { font-size: 9px; line-height: 1.5; padding: 7px 0; }
  .home-page .hero .hero-brand { font-size: 11px; margin: 12px 0; }
  .rail .pieza { width: 248px; }
  .rail { gap: 14px; }
  .sec-head h2, .band h3, .google-copy h2, .social-copy h2,
  .payment-heading h2, .cover h3 { font-size: 44px; line-height: 1.12; }
  .band, .home-page .band { padding-block: 56px; }
  .stats b { font-size: 52px; }
  .social-card { min-height: 96px; padding-block: 18px; }
  .care-panel, .products-panel { padding: 0; }
  .care-panel h2, .care-panel .care-selection-title { font-size: 30px; }
  .music-hero { min-height: 660px; height: auto; padding: 220px 20px 32px; }
  .music-hero-inner { left: auto; right: auto; bottom: auto; }
  .music-hero h1 { font-size: 64px; line-height: 1.05; }
  .music-hero > img { filter: none; }
  .music-hero-veil { background: linear-gradient(180deg, #1719140d 5%, #17191459 32%, #171914eb 76%); }
  .music-story h2, .music-section-head h2, .music-single h2, .music-platforms h2 { font-size: 34px; line-height: 1.2; }
  .music-release-grid { grid-template-columns: minmax(0, 1fr); }
  .music-release-copy h3 { font-size: 30px; }
  .music-artist { font-size: 12px; }
  .music-status { font-size: 11px; }
  .trophy-hero { min-height: 620px; padding-top: 220px; }
  .trophy-hero h1 { font-size: 42px; line-height: 1.12; }
  .trophy-info h2 { font-size: 28px; }
}

@media (max-width: 420px) {
  .bio-header { grid-template-columns: minmax(0, 1fr); gap: 28px; align-items: start; }
  .bio-title h1 { font-size: 48px; }
  .bio-portrait { width: 200px; max-width: 100%; justify-self: start; }
  .page h1 { font-size: 44px; }
  .hero h1, .home-page .hero h1 { font-size: 76px; }
  .music-hero h1 { font-size: 56px; }
  .music-platform-grid { grid-template-columns: minmax(0, 1fr); }
  .grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pieza .cap { flex-wrap: wrap; gap: 3px; }
  .pieza .cap span:last-child { text-align: left; }
  .stats div { padding: 24px 16px; }
  .stats b { font-size: 44px; }
}

@media (max-width: 360px) {
  .hero, .home-page .hero { padding-top: 175px; }
  .hero h1, .home-page .hero h1 { font-size: 64px; }
  .stats b { font-size: 36px; }
  .sec-head h2, .band h3, .google-copy h2, .social-copy h2,
  .payment-heading h2, .cover h3 { font-size: 38px; }
}
