/* Identidad Shaddai sobre la base corta circular. */
:root {
  --background: #0b2c33;
  --red: #aaa48e;
  --red-light: #d8d1ba;
  --text: #f5f0e5;
  --muted: #bfbfaf;
  --yellow: #d8d1ba;
  --blue-light: #d8d1ba;
}
body {
  background: radial-gradient(ellipse at 50% 5%, #22464b 0, transparent 58%),
    radial-gradient(ellipse at 0 90%, #79695818, transparent 52%), var(--background);
}
body::before {
  background-image: none;
  background: radial-gradient(ellipse at 15% 25%, #aaa48e0b, transparent 55%);
  mask-image: none;
  animation: ambient-drift 14s ease-in-out infinite alternate;
}
body::after { border-color: #aaa48e30; border-radius: 28px; }
.page-top { letter-spacing: 2px; color: #c4c3b3; }
.page-top i { background: #aaa48e; box-shadow: 0 0 12px #aaa48e50; }
.brand-mark { width: 204px; height: 204px; margin: 14px auto 15px; }
.brand-letter-ring text { font-weight: 500; font-size: 11px; fill: #c4bda7; }
.brand-disc {
  width: 158px; height: 158px; background: var(--background);
  border-color: #aaa48e80;
  box-shadow: 0 0 0 5px var(--background), 0 0 0 6px #aaa48e30, 0 12px 32px #0003;
}
.brand-disc::before { border-color: #aaa48e24; border-top-color: #d8d1ba95; }
.brand-disc .logo-panel { width: 126px; transform: translate(-50%, -50%); border-radius: 50%; overflow: hidden; }
.logo-panel img { filter: none; }
.intro h1 {
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: clamp(43px, 12vw, 52px); font-weight: 500; line-height: 1;
  letter-spacing: .6px;
}
.intro h1 span {
  display: block; margin-top: 10px; padding-left: 5px;
  font: 500 10px/1.5 "Manrope", sans-serif;
  letter-spacing: 5px; text-transform: uppercase; color: #d8d1ba;
}
.intro p { margin: 12px 0 22px; font-size: 12px; color: var(--muted); }
.button { border-radius: 16px; }
.button-copy { flex: 1; min-width: 0; line-height: 1.45; }
.button-copy > span, .review-bottom small span { display: block; }
.review-top .button-copy small { display: block; margin-top: 3px; font-size: 10px; font-weight: 500; color: var(--muted); }
.review-bottom small { line-height: 1.6; text-align: right; }
.button::before {
  content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background: radial-gradient(ellipse at 85% 30%, #d8d1ba, transparent 65%);
  opacity: .08;
  animation: card-glow 6s -3s ease-in-out infinite;
}
.button-booking::before { animation-delay: -1.5s; }
.button-review::before { animation-delay: -4.5s; }
.button-booking::after { animation-delay: -5.8s; }
.edge-runner, .review-glow { animation-delay: -2s; }
.button-booking {
  color: #0b2c33; background: linear-gradient(115deg, #ded7c2, #aaa48e);
  box-shadow: inset 0 1px 0 #fff6, 0 8px 28px #0002;
}
.button-booking small { color: #294347; }
.button-waves i { color: #0b2c33; }
.button-web { border-color: #aaa48e4d; background: linear-gradient(115deg, #23444a, #14363d); }
.button-web > svg, .link-corner { color: #d8d1ba; }
.button-review { border-color: #aaa48e38; background: linear-gradient(115deg, #1a3940, #113139); }
.stars svg { fill: #c4bda7; animation: none; }
.review-glow { background: linear-gradient(90deg, transparent, #aaa48e, #e5dfcb, transparent); box-shadow: 0 0 10px #aaa48e35; }
.socials { gap: 35px; padding-top: 22px; }
.social { color: #ccc9b9; }
.social-icon { border-color: #aaa48e38; background: #17383e; color: #d8d1ba; }
footer { color: #b5b6a7; }
footer a { color: #d8d1ba; }
.footer-line { background: #796958; }
@media (hover: hover) {
  .button:hover { border-color: #d8d1ba; box-shadow: 0 8px 25px #0003; }
  .button-booking:hover { background: linear-gradient(115deg, #e8e1cf, #b9b39d); }
  .social:hover .social-icon { color: #eee6d1; border-color: #d8d1ba80; }
}
@media (min-width: 700px) {
  .brand-mark { min-height: 0; margin-top: 16px; }
}
@media (max-width: 359px) {
  .page-top { letter-spacing: 1px; }
  .brand-mark { min-height: 0; width: 190px; height: 190px; }
  .brand-disc { width: 148px; height: 148px; }
  .brand-disc .logo-panel { width: 118px; }
}
@keyframes ambient-drift { to { transform: translate3d(6%, 4%, 0); } }
@keyframes card-glow { 0%, 100% { opacity: .03; } 50% { opacity: .14; } }
