/* =====================================================================
   GRACE & GLOW BEAUTY LLC — Estilos globales
   Diseño: premium, responsive, sin frameworks.
   ===================================================================== */

:root {
  --ink: #17221e;
  --muted: #67716d;
  --cream: #fbf8f3;
  --paper: #ffffff;
  --green-950: #07130f;
  --green-900: #0d201a;
  --green-800: #153629;
  --green-700: #246247;
  --green-500: #5f9f6d;
  --gold: #c9a55a;
  --gold-soft: #ead9af;
  --rose: #e8c7c4;
  --line: rgba(16, 43, 33, 0.12);
  --shadow-sm: 0 12px 28px rgba(8, 30, 22, 0.08);
  --shadow-lg: 0 30px 80px rgba(8, 30, 22, 0.18);
  --radius: 22px;
  --radius-sm: 14px;
  --container: 1180px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--ink);
  background: var(--paper);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}
body.no-scroll { overflow: hidden; }
img { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button, input, textarea { font: inherit; }
button { cursor: pointer; }
.container { width: min(calc(100% - 40px), var(--container)); margin-inline: auto; }
.narrow { max-width: 840px; }

/* Barra de contacto */
.topbar { background: var(--green-950); color: #f5f0e7; font-size: .82rem; }
.topbar__inner { min-height: 38px; display: flex; align-items: center; gap: 24px; }
.topbar a { opacity: .9; }
.topbar a:hover { color: var(--gold-soft); }
.topbar span { margin-left: auto; opacity: .7; }

/* Navegación */
.site-header {
  position: sticky; top: 0; z-index: 50;
  background: rgba(255,255,255,.95);
  backdrop-filter: blur(14px);
  border-bottom: 1px solid var(--line);
}
.nav-wrap { min-height: 82px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.brand { display: inline-flex; align-items: center; gap: 12px; min-width: max-content; }
.brand img { width: 58px; height: 58px; border-radius: 50%; object-fit: cover; box-shadow: 0 0 0 1px rgba(201,165,90,.45); }
.brand div { display: flex; flex-direction: column; line-height: 1.12; }
.brand strong { letter-spacing: .12em; font-family: Georgia, "Times New Roman", serif; font-size: 1rem; }
.brand small { letter-spacing: .25em; color: var(--green-700); font-size: .58rem; margin-top: 5px; }
.main-nav { display: flex; align-items: center; gap: 26px; font-weight: 700; font-size: .94rem; }
.main-nav a { position: relative; }
.main-nav a:not(.nav-cta)::after { content:""; position:absolute; left:0; right:100%; bottom:-8px; height:2px; background:var(--gold); transition:.25s ease; }
.main-nav a:hover::after, .main-nav a.active::after { right: 0; }
.nav-cta, .cart-button {
  border: 0; color: white; background: var(--green-900); padding: 11px 18px; border-radius: 999px;
  box-shadow: 0 8px 20px rgba(13,32,26,.16); transition: transform .2s ease, background .2s ease;
}
.nav-cta:hover, .cart-button:hover { background: var(--green-700); transform: translateY(-1px); }
.cart-button span { display: inline-grid; place-items: center; min-width: 24px; height: 24px; margin-left: 7px; padding: 0 6px; border-radius: 999px; background: var(--gold); color: var(--green-950); }
.menu-toggle { display: none; border: 0; background: transparent; font-size: 1.75rem; color: var(--green-900); }

/* Tipografía y botones */
h1,h2,h3 { margin: 0 0 16px; line-height: 1.08; color: var(--green-900); }
h1,h2 { font-family: Georgia, "Times New Roman", serif; font-weight: 600; }
h1 { font-size: clamp(3rem, 6.4vw, 6.2rem); letter-spacing: -.045em; }
h2 { font-size: clamp(2.25rem, 4vw, 4rem); letter-spacing: -.035em; }
h3 { font-size: 1.2rem; }
p { margin: 0 0 18px; color: var(--muted); }
.eyebrow, .section-kicker { display: inline-block; margin-bottom: 14px; color: var(--gold); font-size: .76rem; font-weight: 900; letter-spacing: .18em; text-transform: uppercase; }
.section-kicker.light { color: #f6dfab; }
.btn { display: inline-flex; min-height: 48px; align-items: center; justify-content: center; padding: 0 22px; border-radius: 999px; font-weight: 900; transition: .22s ease; border: 1px solid transparent; }
.btn-primary { color: white; background: var(--green-900); box-shadow: 0 12px 28px rgba(7,19,15,.22); }
.btn-primary:hover { background: var(--green-700); transform: translateY(-2px); }
.btn-ghost { color: white; border-color: rgba(255,255,255,.7); background: rgba(255,255,255,.08); }
.btn-ghost:hover { background: rgba(255,255,255,.16); }
.btn-light { background: white; color: var(--green-900); }
.btn-outline-light { color: white; border-color: rgba(255,255,255,.65); }
.btn-block { width: 100%; border: 0; }
.text-link { color: var(--green-700); font-weight: 900; }
.text-link:hover { color: var(--gold); }

/* Hero */
.hero { position: relative; min-height: min(760px, calc(100vh - 120px)); display: grid; align-items: center; overflow: hidden; background: var(--green-950); }
.hero__media { position: absolute; inset: 0; background-image: url('https://images.unsplash.com/photo-1616394584738-fc6e612e71b9?auto=format&fit=crop&w=2200&q=88'); background-size: cover; background-position: 68% 42%; transform: scale(1.01); }
.hero__overlay { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(4,15,10,.94) 0%, rgba(8,26,18,.80) 35%, rgba(8,26,18,.28) 68%, rgba(8,26,18,.18) 100%), linear-gradient(0deg, rgba(4,15,10,.42), transparent 60%); }
.hero__content { position: relative; z-index: 2; max-width: 720px; padding-block: 110px; color: white; }
.hero h1 { color: white; max-width: 780px; }
.hero h1 em { color: #f2d9a3; font-weight: 500; }
.hero p { color: rgba(255,255,255,.83); max-width: 680px; font-size: 1.12rem; }
.hero__actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }
.hero .btn-primary { background: linear-gradient(135deg, #d4b167, #b4893f); color: #14221d; }
.hero__trust { display: flex; flex-wrap: wrap; gap: 18px; margin-top: 34px; color: rgba(255,255,255,.82); font-size: .86rem; }

/* Secciones */
.section { padding: 100px 0; }
.section-soft { background: linear-gradient(180deg, #fbfaf7, #f7f2ea); }
.section-heading { max-width: 760px; margin-bottom: 48px; }
.section-heading p { max-width: 650px; }
.about-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 72px; align-items: center; }
.about-copy p { font-size: 1.04rem; }
.about-gallery { position: relative; min-height: 570px; }
.about-main { width: 76%; height: 470px; object-fit: cover; border-radius: 150px 150px 28px 28px; margin-left: auto; box-shadow: var(--shadow-lg); }
.about-small { position: absolute; left: 0; bottom: 0; width: 47%; height: 270px; object-fit: cover; border: 10px solid white; border-radius: 26px; box-shadow: var(--shadow-sm); }
.floating-card { position: absolute; right: 3%; bottom: 26px; display:flex; align-items:center; gap:12px; background: rgba(255,255,255,.94); padding: 15px 18px; border-radius: 16px; box-shadow: var(--shadow-sm); }
.floating-card > span { width: 40px; height: 40px; display:grid; place-items:center; border-radius:50%; background:#f3e8d4; color:var(--gold); }
.floating-card div { display:flex; flex-direction:column; }
.floating-card small { color: var(--muted); }
.mini-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin: 30px 0; }
.mini-stats article { background: var(--cream); border: 1px solid var(--line); padding: 18px; border-radius: 16px; }
.mini-stats strong { display:block; font-size: 1.35rem; color: var(--green-800); }
.mini-stats span { color: var(--muted); font-size: .78rem; }
.benefit-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
.benefit-card { padding: 30px 24px; border: 1px solid rgba(20,54,41,.1); border-radius: var(--radius); background: rgba(255,255,255,.75); box-shadow: 0 15px 35px rgba(20,54,41,.05); }
.icon-orb { width: 54px; height: 54px; display:grid; place-items:center; border-radius:50%; margin-bottom:20px; background: linear-gradient(135deg,#f1e5ce,#fff); font-size:1.4rem; border:1px solid rgba(201,165,90,.24); }

.feature-banner { padding: 0 0 100px; background: linear-gradient(180deg, #f7f2ea 0 50%, #fff 50% 100%); }
.feature-banner__grid { display:grid; grid-template-columns:1.05fr .95fr; min-height: 470px; overflow:hidden; background: linear-gradient(135deg, var(--green-900), #1f503b); border-radius: 34px; box-shadow: var(--shadow-lg); }
.feature-banner__grid > div { padding: 62px; align-self:center; }
.feature-banner h2 { color:white; }
.feature-banner p { color:rgba(255,255,255,.77); max-width:560px; }
.feature-banner img { width:100%; height:100%; object-fit:cover; min-height:470px; }

.testimonial-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.quote-card { padding:30px; border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow-sm); background:white; }
.stars { color: var(--gold); letter-spacing:.12em; margin-bottom:16px; }
.quote-card footer { color:var(--green-700); font-weight:800; }
.fineprint { margin-top:18px; font-size:.76rem; color:#858c89; }
.contact-cta { background: radial-gradient(circle at 75% 0%, #44795a, transparent 32%), var(--green-950); color:white; }
.contact-cta__inner { padding: 70px 0; display:flex; align-items:center; justify-content:space-between; gap:30px; }
.contact-cta h2 { color:white; max-width:700px; }
.contact-actions { display:flex; gap:10px; flex-wrap:wrap; }
.privacy { border-top:1px solid var(--line); }

/* Catálogo */
.catalog-hero { position:relative; overflow:hidden; background: linear-gradient(135deg, #0a1d16, #1d503a); color:white; }
.catalog-hero::after { content:""; position:absolute; width:420px; height:420px; border-radius:50%; right:-110px; top:-140px; background:radial-gradient(circle,#c9a55a66,transparent 68%); }
.catalog-hero__inner { position:relative; z-index:2; min-height:330px; padding:70px 0; display:flex; align-items:flex-end; justify-content:space-between; gap:40px; }
.catalog-hero h1 { color:white; font-size:clamp(2.7rem,5vw,5rem); max-width:760px; }
.catalog-hero p { color:rgba(255,255,255,.78); max-width:730px; }
.catalog-badge { min-width:280px; display:flex; gap:14px; align-items:center; padding:18px; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.15); border-radius:18px; backdrop-filter:blur(8px); }
.catalog-badge > span { font-size:1.5rem; color:#f5dda5; }
.catalog-badge div { display:flex; flex-direction:column; }
.catalog-badge small { color:rgba(255,255,255,.7); }
.catalog-section { padding-top:72px; }
.catalog-toolbar { display:flex; justify-content:space-between; align-items:end; gap:30px; margin-bottom:34px; }
.catalog-toolbar h2 { font-size:clamp(2rem,3.2vw,3.2rem); margin-bottom:0; }
.search-box { width:min(100%, 330px); display:flex; flex-direction:column; gap:7px; font-size:.78rem; font-weight:800; color:var(--green-800); }
.search-box input { width:100%; border:1px solid var(--line); background:#fbfbfa; border-radius:999px; padding:12px 16px; outline:none; }
.search-box input:focus { border-color:var(--gold); box-shadow:0 0 0 3px rgba(201,165,90,.12); }
.product-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.product-card { overflow:hidden; border:1px solid var(--line); background:white; border-radius:var(--radius); box-shadow:0 15px 40px rgba(8,30,22,.07); transition:transform .25s ease, box-shadow .25s ease; }
.product-card:hover { transform:translateY(-5px); box-shadow:0 24px 55px rgba(8,30,22,.13); }
.product-card__media { position:relative; height:310px; overflow:hidden; background:#f4f0e9; }
.product-card__media img { width:100%; height:100%; object-fit:cover; transition:transform .45s ease; }
.product-card:hover .product-card__media img { transform:scale(1.035); }
.product-tag { position:absolute; left:16px; top:16px; padding:7px 11px; border-radius:999px; background:rgba(8,29,22,.9); color:white; font-size:.68rem; font-weight:900; letter-spacing:.08em; text-transform:uppercase; }
.product-card__body { padding:24px; }
.product-card__body h3 { font-family:Georgia,"Times New Roman",serif; font-size:1.55rem; }
.product-card__body p { min-height:72px; font-size:.92rem; }
.product-meta { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-top:20px; }
.product-price { font-size:1.35rem; font-weight:900; color:var(--green-800); }
.add-btn { border:0; border-radius:999px; padding:10px 15px; background:#efe3cc; color:var(--green-900); font-weight:900; }
.add-btn:hover { background:var(--gold); }
.no-results { grid-column:1/-1; padding:50px; text-align:center; background:var(--cream); border-radius:var(--radius); color:var(--muted); }
.shopping-info__grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.shopping-info article { padding:28px; background:white; border-radius:var(--radius); border:1px solid var(--line); }
.shopping-info article > span { color:var(--gold); font-weight:900; letter-spacing:.15em; }

/* Carrito lateral */
.drawer-backdrop { position:fixed; inset:0; z-index:80; background:rgba(3,13,9,.5); backdrop-filter:blur(2px); }
.cart-drawer { position:fixed; z-index:90; top:0; right:0; width:min(470px,100%); height:100dvh; display:flex; flex-direction:column; background:white; box-shadow:-20px 0 60px rgba(3,13,9,.2); transform:translateX(105%); transition:transform .3s ease; }
.cart-drawer.open { transform:translateX(0); }
.cart-drawer__header { padding:24px; border-bottom:1px solid var(--line); display:flex; align-items:center; justify-content:space-between; }
.cart-drawer__header h2 { font-size:2rem; margin-bottom:0; }
.icon-btn { width:42px; height:42px; border:1px solid var(--line); background:white; border-radius:50%; font-size:1.5rem; color:var(--green-900); }
.cart-items { flex:1; overflow:auto; padding:18px 24px; }
.empty-cart { padding:50px 20px; text-align:center; color:var(--muted); }
.cart-item { display:grid; grid-template-columns:76px 1fr auto; gap:14px; padding:16px 0; border-bottom:1px solid var(--line); }
.cart-item img { width:76px; height:84px; object-fit:cover; border-radius:12px; }
.cart-item h4 { margin:0 0 5px; font-family:Georgia,"Times New Roman",serif; font-size:1rem; }
.cart-item p { margin:0 0 10px; font-size:.8rem; }
.qty-control { display:inline-flex; align-items:center; gap:10px; padding:4px 7px; background:var(--cream); border-radius:999px; }
.qty-control button { width:26px; height:26px; border:0; border-radius:50%; background:white; }
.remove-item { border:0; background:transparent; color:#a14a4a; font-size:.78rem; padding:0; }
.cart-summary { border-top:1px solid var(--line); padding:20px 24px 28px; background:#fcfbf8; }
.cart-summary > div { display:flex; justify-content:space-between; gap:20px; margin-bottom:10px; }
.cart-summary strong { color:var(--green-900); }
.cart-total { font-size:1.12rem; padding-top:8px; border-top:1px dashed var(--line); }
.link-button { display:block; margin:12px auto 0; border:0; background:transparent; color:var(--muted); text-decoration:underline; }

/* Checkout */
.modal { position:fixed; inset:0; z-index:100; padding:24px; overflow:auto; background:rgba(3,13,9,.68); backdrop-filter:blur(4px); }
.modal__panel { width:min(1040px,100%); margin:24px auto; background:white; border-radius:28px; box-shadow:var(--shadow-lg); overflow:hidden; }
.modal__header { display:flex; justify-content:space-between; align-items:center; gap:20px; padding:24px 28px; border-bottom:1px solid var(--line); }
.modal__header h2 { font-size:2.1rem; margin:0; }
.checkout-layout { display:grid; grid-template-columns:1.45fr .75fr; }
.checkout-form { padding:28px; }
.field-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.field { display:flex; flex-direction:column; gap:7px; font-size:.82rem; font-weight:800; color:var(--green-900); }
.field-full { grid-column:1/-1; }
.field input, .field textarea { width:100%; border:1px solid var(--line); border-radius:12px; padding:12px 13px; outline:none; background:#fbfbfa; color:var(--ink); }
.field input:focus, .field textarea:focus { border-color:var(--gold); box-shadow:0 0 0 3px rgba(201,165,90,.12); }
.field.invalid input, .field.invalid textarea { border-color:#c85a5a; }
.error-text { min-height:15px; color:#b14343; font-weight:600; }
.consent { display:flex; gap:10px; align-items:flex-start; margin:18px 0; font-size:.84rem; color:var(--muted); }
.payment-placeholder { margin:18px 0; padding:16px; border-radius:14px; background:#f7f1e6; border:1px dashed #d5b97f; }
.payment-placeholder p { margin:6px 0 0; font-size:.82rem; }
.payment-method { margin-top:10px; padding-top:10px; border-top:1px solid #e6d6b3; font-size:.86rem; }
.payment-method:first-of-type { margin-top:12px; border-top:1px solid #e6d6b3; }
.payment-method p { margin:2px 0 0; font-size:.8rem; color:var(--muted); }
.order-review { padding:28px; background:var(--green-950); color:white; }
.order-review h3 { color:white; font-size:1.4rem; }
.review-item { display:flex; justify-content:space-between; gap:16px; padding:11px 0; border-bottom:1px solid rgba(255,255,255,.1); font-size:.85rem; }
.review-item span { color:rgba(255,255,255,.72); }
.order-review__total { display:flex; justify-content:space-between; margin-top:20px; font-size:1.08rem; }
.toast { position:fixed; left:50%; bottom:24px; z-index:120; transform:translate(-50%,140%); min-width:min(560px,calc(100% - 32px)); padding:15px 18px; border-radius:999px; background:var(--green-950); color:white; text-align:center; box-shadow:var(--shadow-lg); transition:transform .3s ease; }
.toast.show { transform:translate(-50%,0); }

/* Footer */
.site-footer { padding:70px 0 24px; background:#08140f; color:white; }
.footer-grid { display:grid; grid-template-columns:1.4fr 1fr .7fr .7fr; gap:40px; }
.brand-footer { color:white; margin-bottom:18px; }
.brand-footer small { color:#d9c28c; }
.site-footer p { color:rgba(255,255,255,.6); max-width:350px; font-size:.88rem; }
.site-footer h3 { color:#e8d5aa; font-size:.9rem; text-transform:uppercase; letter-spacing:.12em; }
.site-footer a:not(.brand) { display:block; margin:8px 0; color:rgba(255,255,255,.72); font-size:.9rem; }
.site-footer a:hover { color:white; }
.footer-bottom { margin-top:46px; padding-top:20px; border-top:1px solid rgba(255,255,255,.1); display:flex; justify-content:space-between; gap:25px; }
.footer-bottom p { margin:0; }

/* Animación de entrada */
.reveal { opacity:0; transform:translateY(20px); transition:opacity .7s ease, transform .7s ease; }
.reveal.visible { opacity:1; transform:none; }

/* Responsive */
@media (max-width: 980px) {
  .topbar span { display:none; }
  .menu-toggle { display:block; }
  .main-nav {
    position:absolute; top:82px; left:20px; right:20px; display:none; flex-direction:column; align-items:stretch; gap:6px;
    padding:18px; background:white; border:1px solid var(--line); border-radius:18px; box-shadow:var(--shadow-lg);
  }
  .main-nav.open { display:flex; }
  .main-nav a, .main-nav button { padding:12px; text-align:left; border-radius:12px; }
  .nav-cta, .cart-button { text-align:center !important; }
  .about-grid { grid-template-columns:1fr; gap:45px; }
  .about-gallery { max-width:720px; width:100%; margin:auto; }
  .benefit-grid { grid-template-columns:repeat(2,1fr); }
  .feature-banner__grid { grid-template-columns:1fr; }
  .feature-banner img { height:390px; min-height:0; }
  .testimonial-grid { grid-template-columns:1fr; }
  .catalog-hero__inner { flex-direction:column; align-items:flex-start; }
  .catalog-badge { min-width:0; }
  .product-grid { grid-template-columns:repeat(2,1fr); }
  .footer-grid { grid-template-columns:repeat(2,1fr); }
  .checkout-layout { grid-template-columns:1fr; }
  .order-review { order:-1; }
}

@media (max-width: 680px) {
  .container { width:min(calc(100% - 26px), var(--container)); }
  .topbar__inner { min-height:44px; gap:10px; flex-wrap:wrap; padding:7px 0; font-size:.7rem; }
  .nav-wrap { min-height:72px; }
  .brand img { width:48px; height:48px; }
  .brand strong { font-size:.82rem; }
  .main-nav { top:72px; left:13px; right:13px; }
  .hero { min-height:720px; align-items:end; }
  .hero__media { background-position:62% center; }
  .hero__overlay { background:linear-gradient(0deg, rgba(4,15,10,.95) 0%, rgba(4,15,10,.82) 45%, rgba(4,15,10,.18) 100%); }
  .hero__content { padding:280px 0 62px; }
  .hero h1 { font-size:clamp(2.75rem,13vw,4.7rem); }
  .section { padding:72px 0; }
  .about-gallery { min-height:455px; }
  .about-main { width:82%; height:370px; }
  .about-small { width:52%; height:210px; border-width:7px; }
  .floating-card { right:0; bottom:2px; transform:scale(.9); transform-origin:right bottom; }
  .mini-stats { grid-template-columns:1fr; }
  .benefit-grid { grid-template-columns:1fr; }
  .feature-banner { padding-bottom:72px; }
  .feature-banner__grid > div { padding:38px 28px; }
  .feature-banner img { height:300px; }
  .contact-cta__inner { flex-direction:column; align-items:flex-start; padding:55px 0; }
  .catalog-hero__inner { padding:54px 0; }
  .catalog-toolbar { flex-direction:column; align-items:stretch; }
  .search-box { width:100%; }
  .product-grid { grid-template-columns:1fr; }
  .product-card__media { height:340px; }
  .shopping-info__grid { grid-template-columns:1fr; }
  .field-grid { grid-template-columns:1fr; }
  .field-full { grid-column:auto; }
  .checkout-form, .order-review { padding:22px; }
  .modal { padding:10px; }
  .modal__header { padding:20px; }
  .modal__header h2 { font-size:1.6rem; }
  .footer-grid { grid-template-columns:1fr; gap:28px; }
  .footer-bottom { flex-direction:column; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }
  *, *::before, *::after { animation-duration:.01ms !important; transition-duration:.01ms !important; }
  .reveal { opacity:1; transform:none; }
}
:root{--cms-radius:18px}

.cms-announcement{background:var(--cms-dark,#171717);color:#fff;text-align:center;padding:10px 16px;font-size:14px;letter-spacing:.02em}.cms-announcement a{color:inherit;text-decoration:none}
/* CMS Hero Slider - funcional y visible */
.hero__media{background-image:none!important;}
.hero-slides{position:absolute;inset:0;overflow:hidden;}
.hero-slide{position:absolute;inset:0;background-size:cover;background-position:center;opacity:0;visibility:hidden;transition:opacity .7s ease;transform:scale(1.01);}
.hero-slide.is-active{opacity:1;visibility:visible;}
.hero-slider-controls{position:absolute;z-index:3;right:28px;bottom:28px;display:flex;gap:8px;}
.hero-dot{width:38px;height:38px;border:1px solid rgba(255,255,255,.7);border-radius:50%;background:rgba(0,0,0,.35);color:#fff;font-weight:700;cursor:pointer;display:grid;place-items:center;}
.hero-dot.is-active{background:#d4b167;color:#14221d;border-color:#d4b167;}