/* GODIE TATTOOS 2.2 — visual evolution only.
   No copy or portfolio images are replaced. Loaded after the approved base CSS. */

:root {
  --godie-black: #151513;
  --godie-black-soft: #1d1d1a;
  --godie-gold: #c8a15d;
  --godie-cream: #eee1c9;
  --godie-cream-soft: rgba(241, 229, 205, .90);
}

/* Keep the original background artwork, but let it act as texture rather than content. */
body {
  background-color: #efe4bf;
  background-image: url('../images/web/idea-fondo-2.webp');
  background-repeat: no-repeat;
  background-position: center 86px;
  background-size: min(980px, 96vw) auto;
  background-attachment: fixed;
}
body::before {
  display: none !important;
}

/* Minimal brand wordmark: no western display face, no invented graphic. */
.godie-wordmark {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: auto;
  color: var(--godie-gold);
  line-height: 1;
  user-select: none;
}
.godie-wordmark-main {
  font-family: "Montserrat", Arial, sans-serif;
  font-size: 24px;
  font-weight: 500;
  letter-spacing: .28em;
  padding-left: .28em;
}
.godie-wordmark-sub {
  margin-top: 6px;
  font-family: "Montserrat", Arial, sans-serif;
  font-size: 8px;
  font-weight: 500;
  letter-spacing: .48em;
  padding-left: .48em;
}

/* Slightly stronger TATTOOS line in the navbar wordmark. */
.navbar-custom .godie-wordmark-sub {
  font-size: 9.5px;
  letter-spacing: .44em;
  padding-left: .44em;
}

/* Navbar: stronger on mobile, still light and unobtrusive. */
.navbar-custom {
  min-height: 74px;
  padding: .55rem 1rem;
  border-bottom: 1px solid rgba(200,161,93,.14);
}
.navbar-custom.scrolled {
  background: rgba(18,18,16,.94);
  padding: .45rem 1rem;
  box-shadow: 0 8px 26px rgba(0,0,0,.18);
  backdrop-filter: blur(9px);
  -webkit-backdrop-filter: blur(9px);
}
.navbar-custom .navbar-brand { padding: 0; margin-right: 1.4rem; }
.navbar-custom .nav-item .nav-link {
  font-family: "Montserrat", Arial, sans-serif;
  font-size: .78rem;
  font-weight: 500;
  letter-spacing: .075em;
}
.navbar-custom .social-icon { width: 19px; height: 19px; fill: currentColor; }
.navbar-custom .navbar-toggler { border-color: rgba(200,161,93,.34); }

/* Hero: still a full scroll moment, using the approved real background image. */
header.header {
  min-height: 100svh;
  height: 100svh !important;
  background-image:
    linear-gradient(90deg, rgba(8,8,7,.78) 0%, rgba(8,8,7,.49) 42%, rgba(8,8,7,.16) 72%, rgba(8,8,7,.34) 100%),
    url('../images/web/header-background.webp');
  background-position: center center;
  background-size: cover;
  text-align: left;
}
header.header .header-content { width: 100%; }
header.header .header-content .container { max-width: 1180px; }
header.header .header-content .col-lg-12 { text-align: left !important; }
header.header h1 {
  max-width: 920px;
  margin-bottom: 1rem;
  font-size: clamp(2.65rem, 5.2vw, 4.75rem);
  font-weight: 500;
  letter-spacing: -.025em;
  white-space: normal;
}
header.header .p-heading.p-large {
  max-width: 580px;
  margin-left: 0;
  margin-right: 0;
  font-size: 1.12rem;
  line-height: 1.7;
}
header.header .btn-solid-lg {
  border: 1px solid var(--godie-gold);
  border-radius: 2px;
  background: var(--godie-gold);
  color: #151513;
  font-family: "Montserrat", Arial, sans-serif;
  font-size: .76rem;
  font-weight: 700;
  letter-spacing: .09em;
}
header.header .btn-solid-lg:hover {
  border: 1px solid var(--godie-gold);
  background: transparent;
  color: var(--godie-gold);
}

/* Long-form sections retain generous scroll space; they are not compressed into banners. */
#intro.basic-1 {
  position: relative;
  padding: 132px 0 126px;
  background: rgba(241, 229, 205, .82) !important;
  border-top: 1px solid rgba(35,29,19,.10);
  border-bottom: 1px solid rgba(35,29,19,.10);
}
#intro .container { max-width: 1180px; }
#intro .row { align-items: center; }
#intro .text-container { padding-right: 34px; }
#intro .section-title,
#galeria .bio-subtitle,
#tienda .bio-subtitle,
#reserva .bio-subtitle {
  color: #8f6a31;
  font-family: "Montserrat", Arial, sans-serif;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .20em;
  text-transform: uppercase;
}
#intro h2,
#galeria .section-title,
#tienda .section-title,
#reserva .section-title {
  font-weight: 500;
  letter-spacing: -.025em;
}
#intro p { font-family: "Open Sans", Arial, sans-serif; font-weight: 400; font-size: 1rem; line-height: 1.82; }
#intro .image-container img { border-radius: 2px; box-shadow: 0 18px 50px rgba(28,22,15,.18); }

/* Gallery becomes a deliberate dark pause while keeping every approved image and the lightbox. */
#galeria.gallery-section {
  padding: 116px 0 124px;
  background: rgba(20,20,18,.96);
  color: #f2e8d6;
}
#galeria .bio-subtitle { color: var(--godie-gold); }
#galeria .section-title { color: #f4ead8; margin-bottom: 54px !important; }
#galeria .gallery-grid { max-width: 1240px; gap: 12px; }
#galeria .gallery-item { border-radius: 1px; background: #0e0e0d; }
#galeria .gallery-item img { filter: saturate(.92) contrast(1.02); }

/* Shop keeps the exact poster already approved and gets breathing room around it. */
#tienda.shop-section {
  padding: 122px 0 130px;
  background: rgba(239,225,198,.74);
}
#tienda .section-title { margin-bottom: 52px !important; }
#tienda .shop-poster-v17 {
  width: min(1060px, calc(100% - 40px));
  border-color: rgba(49,31,48,.28);
  box-shadow: 0 22px 60px rgba(34,25,15,.18);
}

/* Booking remains the approved form, but is framed as a distinct final section rather than a card floating on the background. */
#reserva.reserva-section {
  position: relative;
  padding: 122px 18px 132px;
  background: rgba(25,25,22,.94);
}
#reserva .bio-subtitle { color: var(--godie-gold); }
#reserva .section-title { color: #f4ead8; }
#reserva .booking-intro-v17 p { color: rgba(255,255,255,.68); }
#reserva .form-container {
  border-radius: 3px;
  border-color: rgba(200,161,93,.22);
  background: rgba(62,55,37,.68);
  box-shadow: 0 24px 64px rgba(0,0,0,.22);
}
#reserva .reserva-form button[type="submit"] {
  border-radius: 2px;
  background: #9b9946;
}

/* Footer: same existing copy and destinations, with a clearer professional hierarchy. */
#footer {
  padding: 58px 20px 42px;
  background: #11110f;
  border-top: 1px solid rgba(200,161,93,.22);
}
#footer .godie-wordmark-footer { margin: 0 auto 10px; }
#footer .godie-wordmark-footer .godie-wordmark-main { font-size: 21px; }
#footer .godie-wordmark-footer .godie-wordmark-sub { font-size: 7px; }
#footer .footer-text { margin: 10px auto 20px; color: rgba(255,255,255,.52); font-size: .76rem; }
#footer .footer-links {
  margin: 0 auto 16px;
  gap: 22px;
}
#footer .footer-links li a {
  font-family: "Montserrat", Arial, sans-serif;
  color: rgba(255,255,255,.82);
  font-size: .72rem;
  font-weight: 500;
  letter-spacing: .06em;
  text-transform: uppercase;
}
#footer .footer-legal {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 9px 20px;
}
#footer .footer-legal a,
#footer .footer-policy-trigger {
  appearance: none;
  padding: 0;
  border: 0;
  background: transparent;
  color: rgba(255,255,255,.48);
  font: inherit;
  font-size: .68rem;
  cursor: pointer;
  text-decoration: none;
}
#footer .footer-legal a:hover,
#footer .footer-policy-trigger:hover { color: var(--godie-gold); }
#footer .footer-social { margin-top: 18px; }
#footer .footer-social a { color: rgba(255,255,255,.88); }

@media (min-width: 992px) {
  #galeria .gallery-grid { grid-template-columns: repeat(4, minmax(0,1fr)); }
}

@media (max-width: 991.98px) {
  .navbar-custom { min-height: 68px; background: rgba(17,17,15,.93); }
  .navbar-custom .navbar-collapse {
    background: rgba(17,17,15,.985);
    border-top: 1px solid rgba(200,161,93,.15);
    margin-top: .55rem;
    padding-top: 1rem;
    padding-bottom: 1.15rem;
  }
  .navbar-custom .nav-item .nav-link { padding: .72rem .25rem; font-size: .76rem; }
  header.header { background-position: 61% center; }
  #intro.basic-1 { padding: 104px 0 96px; }
  #intro .text-container { padding-right: 0; }
  #galeria.gallery-section { padding: 92px 0 100px; }
  #tienda.shop-section { padding: 96px 0 104px; }
  #reserva.reserva-section { padding: 96px 14px 106px; }
}

@media (max-width: 767.98px) {
  .godie-wordmark-main { font-size: 18px; letter-spacing: .24em; padding-left: .24em; }
  .godie-wordmark-sub { margin-top: 5px; font-size: 6.5px; letter-spacing: .42em; padding-left: .42em; }
  .navbar-custom .godie-wordmark-sub { font-size: 7.5px; letter-spacing: .40em; padding-left: .40em; }

  header.header {
    min-height: 100svh;
    height: 100svh !important;
    padding: 92px 20px 52px !important;
    background-image:
      linear-gradient(180deg, rgba(7,7,6,.22) 0%, rgba(7,7,6,.34) 38%, rgba(7,7,6,.84) 100%),
      url('../images/web/header-background.webp');
    background-position: 63% center;
    align-items: flex-end;
  }
  header.header .header-content { padding-bottom: 7vh; }
  header.header h1 {
    max-width: 92%;
    margin-bottom: .9rem;
    font-size: clamp(2.15rem, 10vw, 3.15rem);
    line-height: 1.04;
  }
  header.header .p-heading.p-large { max-width: 88%; font-size: .96rem; line-height: 1.55; }

  #intro.basic-1 { padding: 82px 0 84px; }
  #intro .text-container { padding: 0 4px 30px; }
  #intro .image-container { margin-top: 8px; }
  #intro .testimonial-text { font-size: 1.3rem; }

  #galeria.gallery-section { padding: 82px 0 88px; }
  #galeria .section-title { margin-bottom: 34px !important; }
  #galeria .gallery-grid {
    grid-template-columns: repeat(2, minmax(0,1fr)) !important;
    gap: 8px !important;
    padding: 0 9px !important;
  }

  #tienda.shop-section { padding: 84px 0 90px; }
  #tienda .section-title { margin-bottom: 34px !important; }
  #tienda .shop-poster-v17 { width: calc(100% - 18px); }

  #reserva.reserva-section { padding: 84px 12px 92px; }
  #reserva .form-container { margin-top: 8px; }

  #footer { padding: 48px 18px 38px; }
  #footer .footer-links { flex-direction: row; gap: 10px 18px; }
  #footer .footer-legal { gap: 8px 14px; }
}


/* ==========================================================
   GODIE 2.2 — fixes: booking policy + approved Shop artwork
   Self-contained production overrides so the site does not depend on
   an older cached site-custom.css for these two components.
   ========================================================== */
#reserva .booking-policy-inline-v17 {
  display: block !important;
  margin: 7px 0 12px !important;
  text-align: left !important;
}
#reserva button.booking-policy-trigger {
  -webkit-appearance: none !important;
  appearance: none !important;
  display: inline-block !important;
  width: auto !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 2px 0 4px !important;
  border: 0 !important;
  border-radius: 0 !important;
  border-bottom: 1px solid rgba(196,153,82,.72) !important;
  background: transparent !important;
  box-shadow: none !important;
  color: #c49952 !important;
  font-family: 'Montserrat', sans-serif !important;
  font-size: 12px !important;
  line-height: 1.35 !important;
  font-weight: 600 !important;
  letter-spacing: .075em !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
  cursor: pointer !important;
}
#reserva button.booking-policy-trigger:hover,
#reserva button.booking-policy-trigger:focus,
#reserva button.booking-policy-trigger:active {
  border-bottom-color: rgba(255,255,255,.8) !important;
  background: transparent !important;
  color: #fff !important;
  box-shadow: none !important;
  outline: none !important;
}

#tienda .shop-poster-v17,
#tienda .shop-poster-art {
  overflow: visible !important;
  height: auto !important;
  max-height: none !important;
}
#tienda .shop-poster-art img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  aspect-ratio: auto !important;
  object-fit: contain !important;
  object-position: center !important;
  transform: none !important;
}

/* GODIE 2.2 v4 — recover the original skull mark as subtle page texture. */
@media (max-width: 767.98px) {
  body {
    background-attachment: scroll;
    background-position: center 90px;
    background-size: 118vw auto;
  }
  #intro.basic-1 { background: rgba(241,229,205,.84) !important; }
  #tienda.shop-section { background: rgba(239,225,198,.78) !important; }
}