/* =====================================================================
   GORI BLOOMS · Firma Floral de Autor
   Sistema de diseño boutique · editable por secciones
   ---------------------------------------------------------------------
   1. Variables / paleta        6. Hero              11. Fúnebres
   2. Reset & base              7. Bienvenida        12. Eventos
   3. Tipografía & utilidades   8. Colecciones       13. Personalizados
   4. Botones                   9. Editorial         14. Galería
   5. Header / navegación      10. Buchones          15. CTA/Footer/UI
   ===================================================================== */

/* ============ 1. VARIABLES / PALETA ============ */
:root{
  /* neutros cálidos */
  --ivory:      #FAF4EC;
  --ivory-2:    #F4EBDE;
  --cream:      #F7EFE4;
  --paper:      #FFFDF9;

  /* rosas */
  --blush:      #EAD3CE;
  --blush-soft: #F6E7E2;
  --rose:       #C98A82;
  --rose-deep:  #AF6A61;

  /* azules profundos */
  --navy:       #111B33;
  --navy-2:     #17233F;
  --navy-3:     #0B1122;
  --petrol:     #274F67;

  /* verdes */
  --sage:       #8C9A7B;
  --sage-soft:  #E4E8DC;

  /* dorados champagne */
  --gold:       #C9A563;
  --gold-lt:    #E6CB92;
  --gold-dp:    #A9823F;
  --gold-grad:  linear-gradient(105deg,#A9823F 0%,#E6CB92 38%,#C29A54 62%,#F1DDB0 100%);

  /* texto */
  --ink:        #2A2A2E;
  --ink-soft:   #5D574F;
  --ink-mute:   #8A8378;
  --on-dark:    #EDE6DA;
  --on-dark-mut:#A9B0C0;

  /* hairlines & sombras */
  --line:       rgba(42,42,46,.14);
  --line-gold:  rgba(169,130,63,.38);
  --line-dark:  rgba(230,203,146,.22);
  --shadow-sm:  0 10px 30px -18px rgba(40,30,25,.35);
  --shadow-md:  0 26px 60px -30px rgba(40,30,25,.42);
  --shadow-lg:  0 40px 90px -40px rgba(15,12,25,.55);

  /* fondos con color (rosa / lila / champán) */
  --rosa-1:     #F8ECE8;
  --rosa-2:     #F3DDD6;
  --lila-1:     #EFE8F4;
  --lila-2:     #E6DAEF;
  --champan:    #F5E7DB;

  --serif: "Playfair Display", Georgia, serif;
  --sans:  "Montserrat", system-ui, -apple-system, sans-serif;

  --maxw: 1240px;
  --pad:  clamp(1.25rem, 5vw, 4rem);
  --sect: clamp(3.6rem, 7vw, 6.2rem);
  --radius: 22px;
  --ease: cubic-bezier(.22,.61,.36,1);
}

/* ============ 2. RESET & BASE ============ */
*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body{
  font-family:var(--sans);
  font-weight:400;
  color:var(--ink);
  background:var(--rosa-1);
  line-height:1.75;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
img{ display:block; max-width:100%; height:auto; }
a{ color:inherit; text-decoration:none; }
button{ font-family:inherit; cursor:pointer; border:none; background:none; color:inherit; }
::selection{ background:var(--blush); color:var(--navy); }

/* grano de película sutil (look editorial moderno) */
body::after{
  content:""; position:fixed; inset:0; pointer-events:none; z-index:95; opacity:.05;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.5'/%3E%3C/svg%3E");
}
/* barra de progreso de lectura */
.scroll-progress{ position:fixed; top:0; left:0; right:0; height:3px; z-index:200;
  background:var(--gold-grad); transform-origin:left; transform:scaleX(0); }

/* scrollbar fino y elegante */
::-webkit-scrollbar{ width:10px; }
::-webkit-scrollbar-track{ background:var(--rosa-1); }
::-webkit-scrollbar-thumb{ background:linear-gradient(var(--gold-dp),var(--gold)); border-radius:8px; border:2px solid var(--rosa-1); }
html{ scrollbar-width:thin; scrollbar-color:var(--gold-dp) var(--rosa-1); }

/* ============ 3. TIPOGRAFÍA & UTILIDADES ============ */
section[id]{ scroll-margin-top:86px; }
.section{ padding:var(--sect) var(--pad); }
.section-dark{ padding:var(--sect) var(--pad); background:var(--navy); color:var(--on-dark); position:relative; }
.section.alt{ background:linear-gradient(180deg,var(--champan),var(--rosa-1)); }

h1,h2,h3,h4{ font-family:var(--serif); font-weight:600; line-height:1.12; letter-spacing:.004em; }

.hero-title{
  font-size:clamp(2.5rem,5.6vw,4.6rem);
  font-weight:600; line-height:1.08; letter-spacing:.004em; color:var(--navy);
}
/* palabra en contorno dorado (acento display moderno) */
.stroke{ color:transparent; -webkit-text-stroke:1.3px rgba(230,203,146,.9); text-stroke:1.3px rgba(230,203,146,.9); }
.hero-title em{ font-style:italic; color:var(--rose-deep); }

.section-title{
  font-size:clamp(1.8rem,3.8vw,2.9rem);
  color:var(--navy); font-weight:600; letter-spacing:.004em;
}
.section-dark .section-title, .on-dark .section-title{ color:var(--paper); }
.section-title.big{ font-size:clamp(2.1rem,4.8vw,3.7rem); }
.section-title.serene{ color:#3f4a3c; }
/* acento itálico romántico dentro de los títulos */
.section-title em{ font-style:italic; color:var(--rose-deep); }
.section-dark .section-title em, .on-dark .section-title em{ color:var(--gold-lt); }
.section-title.serene em{ color:var(--sage); }

.eyebrow{
  font-family:var(--sans); font-weight:600;
  font-size:.7rem; letter-spacing:.32em; text-transform:uppercase;
  color:var(--gold-dp); margin-bottom:1.15rem;
  display:inline-flex; align-items:center; gap:.9rem;
}
/* filetes editoriales a ambos lados de la etiqueta */
.eyebrow::before,.eyebrow::after{ content:""; width:32px; height:1px; background:currentColor; opacity:.45; flex:0 0 auto; }
.eyebrow.gold{ color:var(--gold-lt); }
.eyebrow.sage{ color:var(--sage); }

.lead{ font-size:clamp(1rem,1.4vw,1.12rem); color:var(--ink-soft); line-height:1.85; font-weight:400; }
.section-dark .lead, .on-dark .lead{ color:var(--on-dark-mut); }
.center-lead{ max-width:none; }
p{ font-size:.98rem; color:var(--ink-soft); font-weight:400; }
p + p{ margin-top:1rem; }

.gold-text{
  background:var(--gold-grad); -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent; color:var(--gold-dp);
}

.center{ text-align:center; }
.section-head{ max-width:760px; margin-inline:auto; }
.section-head.center{ text-align:center; }
.section-head .lead{ margin-top:1.1rem; }

.rule{ width:74px; height:1px; background:var(--line-gold); margin:1.8rem auto 0; position:relative; }
.rule::before,.rule::after{ content:""; position:absolute; top:50%; width:5px; height:5px; border-radius:50%; background:var(--gold); transform:translateY(-50%); }
.rule::before{ left:-11px; } .rule::after{ right:-11px; }

.eyebrow, .lead, p, .btn{ font-family:var(--sans); }

.note{ font-style:italic; font-family:var(--serif); font-size:1.16rem; color:var(--rose-deep); margin-top:1.25rem; }
.section-dark .note{ color:var(--gold-lt); }
.price-tag{ margin-top:1.4rem; font-size:.82rem; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-mute); }
.price-tag strong{ color:var(--navy); font-weight:500; }
.price-tag.on-dark{ color:var(--on-dark-mut); } .price-tag.on-dark strong{ color:var(--gold-lt); }
.muted{ color:var(--ink-mute); font-size:.9rem; }
.section-dark .muted{ color:var(--on-dark-mut); }

.link-underline{
  display:inline-block; margin-top:1.9rem; font-size:.78rem; letter-spacing:.22em;
  text-transform:uppercase; color:var(--navy); position:relative; padding-bottom:6px;
}
.link-underline::after{ content:""; position:absolute; left:0; bottom:0; width:100%; height:1px; background:var(--gold); transform:scaleX(.4); transform-origin:left; transition:transform .5s var(--ease); }
.link-underline:hover::after{ transform:scaleX(1); }

/* reveal animation */
.reveal{ opacity:0; transform:translateY(30px); transition:opacity 1s var(--ease), transform 1s var(--ease); }
.reveal.is-visible{ opacity:1; transform:none; }
.reveal.d1{ transition-delay:.1s } .reveal.d2{ transition-delay:.2s } .reveal.d3{ transition-delay:.3s }

/* movimientos base */
@keyframes riseIn{ from{ opacity:0; transform:translateY(26px) } to{ opacity:1; transform:none } }
@keyframes frameIn{ from{ opacity:0; transform:translateY(34px) scale(.965) } to{ opacity:1; transform:none } }
@keyframes slowZoom{ from{ transform:scale(1.1) } to{ transform:scale(1.02) } }

/* cascada escalonada: los hijos aparecen uno tras otro cuando el bloque entra en pantalla */
.stagger.reveal{ transform:none; }
.stagger > *{ opacity:0; }
.stagger.is-visible > *{ animation:riseIn .85s var(--ease) both; }
.stagger.is-visible > *:nth-child(1){ animation-delay:.05s }
.stagger.is-visible > *:nth-child(2){ animation-delay:.14s }
.stagger.is-visible > *:nth-child(3){ animation-delay:.23s }
.stagger.is-visible > *:nth-child(4){ animation-delay:.32s }
.stagger.is-visible > *:nth-child(5){ animation-delay:.41s }
.stagger.is-visible > *:nth-child(6){ animation-delay:.5s }
.stagger.is-visible > *:nth-child(7){ animation-delay:.59s }
.stagger.is-visible > *:nth-child(8){ animation-delay:.68s }

/* cascada de las tarjetas de colección */
.collection-grid .col-card:nth-child(2){ transition-delay:.08s }
.collection-grid .col-card:nth-child(3){ transition-delay:.16s }
.collection-grid .col-card:nth-child(4){ transition-delay:.08s }
.collection-grid .col-card:nth-child(5){ transition-delay:.16s }
.collection-grid .col-card:nth-child(6){ transition-delay:.24s }

/* ============ 4. BOTONES ============ */
.btn{
  --b: var(--navy);
  display:inline-flex; align-items:center; justify-content:center; gap:.55rem;
  font-size:.74rem; letter-spacing:.18em; text-transform:uppercase; font-weight:600;
  padding:1.05rem 2.1rem; border-radius:60px; position:relative; overflow:hidden;
  transition:transform .5s var(--ease), box-shadow .5s var(--ease), color .45s var(--ease), background .45s var(--ease), border-color .45s var(--ease);
  white-space:nowrap;
}
.btn:hover{ transform:translateY(-3px); }
.btn-lg{ padding:1.2rem 2.6rem; font-size:.8rem; }

.btn-gold{ background:var(--gold-grad); color:#3a2b12; box-shadow:0 14px 34px -16px rgba(169,130,63,.7); }
.btn-gold:hover{ box-shadow:0 20px 42px -14px rgba(169,130,63,.85); }
/* destello satinado que recorre el botón al pasar el cursor */
.btn-gold::before{ content:""; position:absolute; top:0; bottom:0; left:-70%; width:45%;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.55),transparent);
  transform:skewX(-18deg); transition:left .85s var(--ease); }
.btn-gold:hover::before{ left:130%; }
/* flecha que acompaña a todos los botones */
.btn::after{ content:"→"; font-size:1.05em; line-height:1; transition:transform .45s var(--ease); }
.btn:hover::after{ transform:translateX(5px); }

.btn-ghost{ color:var(--paper); border:1px solid rgba(240,235,225,.4); }
.btn-ghost:hover{ background:rgba(255,255,255,.08); border-color:var(--gold-lt); color:#fff; }

.btn-outline{ color:var(--navy); border:1px solid var(--line-gold); background:transparent; }
.btn-outline:hover{ background:var(--navy); color:var(--paper); border-color:var(--navy); }
.btn-outline.sage-btn:hover{ background:var(--sage); border-color:var(--sage); }

/* ============ 5. HEADER / NAV ============ */
.topbar{
  background:var(--navy-3); color:var(--on-dark-mut);
  display:flex; gap:.7rem; justify-content:center; align-items:center; flex-wrap:wrap;
  font-size:.66rem; letter-spacing:.24em; text-transform:uppercase; padding:.55rem 1rem;
}
.topbar i{ color:var(--gold); font-style:normal; opacity:.7; }
.topbar span{ opacity:.9; }

.site-header{
  position:sticky; top:0; z-index:90; transition:background .5s var(--ease), box-shadow .5s var(--ease), backdrop-filter .5s, transform .55s var(--ease);
  /* El hero se desliza debajo del header transparente para que las letras claras
     siempre queden sobre el fondo azul (JS mide la altura real en --header-h). */
  margin-bottom:calc(-1 * var(--header-h, 82px));
}
/* el header se esconde al bajar y reaparece al subir */
.site-header.hidden-nav{ transform:translateY(-110%); }
.nav-inner{
  max-width:var(--maxw); margin-inline:auto; padding:1.15rem var(--pad);
  display:flex; align-items:center; justify-content:space-between; gap:1rem;
}
.brand{ display:flex; align-items:center; gap:.7rem; }
.brand-mark{ width:38px; height:38px; color:var(--gold); flex:0 0 auto; display:grid; place-items:center;
  border:1px solid var(--line-gold); border-radius:50%; }
.brand-mark svg{ width:24px; height:24px; }
.brand-word{ font-family:var(--serif); font-weight:600; font-size:1.4rem; line-height:1; color:var(--navy); letter-spacing:.02em; display:flex; flex-direction:column; }
.brand-word small{ font-family:var(--sans); font-size:.53rem; letter-spacing:.3em; color:var(--ink-mute); margin-top:4px; font-weight:500; white-space:nowrap; }
.brand-word.big{ font-size:2rem; color:var(--paper); }
.brand-word.big small{ color:var(--on-dark-mut); }

/* header sobre hero (transparente) */
.site-header.over{ background:transparent; }
.site-header.over .brand-word{ color:var(--paper); }
.site-header.over .brand-word small{ color:var(--on-dark-mut); }
.site-header.over .nav-links a{ color:var(--on-dark); }
.site-header.over .nav-toggle span{ background:var(--paper); }

/* header al hacer scroll */
.site-header.scrolled{
  background:rgba(250,244,236,.86); backdrop-filter:blur(14px) saturate(120%);
  box-shadow:0 1px 0 var(--line), 0 20px 40px -34px rgba(40,30,25,.5);
}

.nav-links{ display:flex; align-items:center; gap:2rem; }
.nav-links a{ font-size:.72rem; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:var(--ink); position:relative; padding:4px 0; transition:color .4s; white-space:nowrap; }
.nav-links a:not(.nav-cta)::after{ content:""; position:absolute; left:0; bottom:-2px; width:100%; height:1px; background:var(--gold); transform:scaleX(0); transform-origin:right; transition:transform .45s var(--ease); }
.nav-links a:not(.nav-cta):hover::after{ transform:scaleX(1); transform-origin:left; }
.nav-links a:hover{ color:var(--gold-dp); }
.nav-cta{ border:1px solid var(--line-gold); border-radius:50px; padding:.6rem 1.3rem !important; color:var(--gold-dp) !important; }
.nav-cta:hover{ background:var(--gold-grad); color:#3a2b12 !important; }
.site-header.over .nav-cta{ color:var(--gold-lt) !important; border-color:var(--line-dark); }

/* submenú de colecciones */
.nav-sub{ position:relative; }
.nav-sub-menu{
  position:absolute; top:calc(100% + 10px); left:50%; transform:translateX(-50%) translateY(6px);
  min-width:210px; background:var(--paper); border:1px solid var(--line-gold); border-radius:12px;
  box-shadow:var(--shadow-md); padding:.55rem 0; opacity:0; visibility:hidden;
  transition:opacity .35s var(--ease), transform .35s var(--ease), visibility .35s; z-index:95;
}
.nav-sub:hover .nav-sub-menu, .nav-sub:focus-within .nav-sub-menu{ opacity:1; visibility:visible; transform:translateX(-50%) translateY(0); }
.nav-sub-menu a{ display:block; padding:.55rem 1.25rem; font-size:.7rem; color:var(--ink) !important; }
.nav-sub-menu a::after{ display:none !important; }
.nav-sub-menu a:hover{ background:var(--rosa-1); color:var(--gold-dp) !important; }

.nav-toggle{ display:none; flex-direction:column; gap:5px; padding:8px; }
.nav-toggle span{ width:24px; height:1.6px; background:var(--navy); transition:.4s var(--ease); display:block; }

/* ============ 6. HERO ============ */
.hero{
  position:relative; min-height:100svh; display:flex; align-items:center;
  background:
    radial-gradient(120% 90% at 80% 10%, #1c2c50 0%, transparent 55%),
    radial-gradient(90% 80% at 10% 90%, #1a2647 0%, transparent 60%),
    linear-gradient(160deg,#0e1830 0%,#15213c 50%,#0d1426 100%);
  overflow:hidden; margin-top:-1px;
}
.hero::before{ /* textura botánica sutil */
  content:""; position:absolute; inset:0;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140' viewBox='0 0 140 140'%3E%3Cg fill='none' stroke='%23c9a563' stroke-opacity='0.06' stroke-width='1'%3E%3Cpath d='M20 120 C40 90 40 60 30 30 M30 60 C15 55 8 62 6 74 M30 66 C45 60 52 68 54 80'/%3E%3Cpath d='M110 20 C90 50 92 82 104 112 M100 74 C118 70 124 78 126 90 M100 68 C86 62 80 70 78 82'/%3E%3C/g%3E%3C/svg%3E");
  opacity:.9;
}
.hero-glow{ position:absolute; width:60vw; height:60vw; max-width:720px; max-height:720px; right:-10%; top:-10%;
  background:radial-gradient(circle, rgba(201,138,130,.28), transparent 62%); filter:blur(30px); pointer-events:none;
  animation:glowFloat 14s ease-in-out infinite; }
@keyframes glowFloat{ 0%,100%{ transform:translate3d(0,0,0) scale(1) } 50%{ transform:translate3d(-4%,6%,0) scale(1.09) } }
.hero-petals{ position:absolute; inset:0; pointer-events:none;
  background-image:radial-gradient(circle at 18% 30%, rgba(230,203,146,.5) 0 2px, transparent 3px),
                   radial-gradient(circle at 72% 62%, rgba(234,211,206,.5) 0 2px, transparent 3px),
                   radial-gradient(circle at 40% 82%, rgba(230,203,146,.4) 0 1.5px, transparent 3px),
                   radial-gradient(circle at 88% 24%, rgba(234,211,206,.4) 0 1.5px, transparent 3px);
  opacity:.7; }

.hero-inner{
  position:relative; z-index:2; max-width:var(--maxw); margin-inline:auto; width:100%;
  padding:6rem var(--pad) 7rem; display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(2rem,5vw,5rem); align-items:center;
}
.hero-text .eyebrow{ color:var(--gold-lt); }
.hero-title{ color:var(--paper); margin-bottom:1.6rem; }
.hero-title em{ color:var(--blush); }
.hero-sub{ color:var(--on-dark-mut); font-size:clamp(1rem,1.4vw,1.15rem); max-width:33ch; line-height:1.8; }
.hero-actions{ display:flex; flex-wrap:wrap; gap:1rem; margin-top:2.4rem; }

.hero-visual{ position:relative; justify-self:center; }
.hero-frame{ position:relative; border-radius:200px 200px 14px 14px; overflow:hidden; padding:0;
  box-shadow:var(--shadow-lg); border:1px solid var(--line-dark); max-width:420px; }
.hero-frame::after{ content:""; position:absolute; inset:9px; border:1px solid rgba(230,203,146,.4); border-radius:190px 190px 8px 8px; pointer-events:none; z-index:3; }
.hero-frame img{ width:100%; aspect-ratio:1/1.28; object-fit:cover; transform:scale(1.02); }

/* el titular se superpone al arco de la foto (overlap editorial) */
@media (min-width:1081px){
  .hero-text{ position:relative; z-index:2; margin-right:-4.5rem; }
}

/* coreografía de entrada del hero (se anima sola al cargar) */
.hero .reveal{ opacity:1; transform:none; transition:none; }
.hero-text .eyebrow{ animation:riseIn .9s var(--ease) .15s both; }
.hero-text .hero-title{ animation:riseIn 1s var(--ease) .32s both; }
.hero-text .hero-sub{ animation:riseIn 1s var(--ease) .52s both; }
.hero-text .hero-actions{ animation:riseIn 1s var(--ease) .68s both; }
.hero-frame{ animation:frameIn 1.25s var(--ease) .4s both; }
.hero-frame img{ animation:slowZoom 7s var(--ease) .4s both; }
@keyframes riseInCentered{ from{ opacity:0; transform:translate(-50%,20px) } to{ opacity:1; transform:translate(-50%,0) } }
.hero-badge{ animation:riseInCentered .9s var(--ease) 1.05s both; }
.scroll-cue{ animation:riseInCentered 1.1s var(--ease) 1.3s both; }
.hero-badge{ position:absolute; bottom:16px; left:50%; transform:translateX(-50%); z-index:4;
  background:rgba(17,27,51,.72); backdrop-filter:blur(6px); color:var(--gold-lt);
  font-size:.62rem; letter-spacing:.24em; text-transform:uppercase; padding:.5rem 1.1rem; border-radius:40px; border:1px solid var(--line-dark); white-space:nowrap; }

.scroll-cue{ position:absolute; bottom:2rem; left:50%; transform:translateX(-50%); z-index:3;
  display:flex; flex-direction:column; align-items:center; gap:.6rem; color:var(--on-dark-mut);
  font-size:.6rem; letter-spacing:.3em; text-transform:uppercase; }
.scroll-cue i{ width:1px; height:42px; background:linear-gradient(var(--gold-lt),transparent); position:relative; overflow:hidden; }
.scroll-cue i::after{ content:""; position:absolute; top:-50%; left:0; width:1px; height:50%; background:var(--gold-lt); animation:cue 2.4s var(--ease) infinite; }
@keyframes cue{ 0%{ top:-50% } 60%,100%{ top:100% } }

/* ============ 6a. PORTADA DE PÁGINA (subpáginas) ============ */
.page-hero{
  position:relative; min-height:46vh; display:flex; align-items:flex-end; overflow:hidden;
  padding:9.5rem var(--pad) 3.4rem;
  background:
    radial-gradient(110% 80% at 85% 0%, #1c2c50 0%, transparent 55%),
    linear-gradient(160deg,#0e1830 0%,#15213c 55%,#0d1426 100%);
}
.page-hero::before{ content:""; position:absolute; inset:0; opacity:.9;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140' viewBox='0 0 140 140'%3E%3Cg fill='none' stroke='%23c9a563' stroke-opacity='0.06' stroke-width='1'%3E%3Cpath d='M20 120 C40 90 40 60 30 30 M30 60 C15 55 8 62 6 74 M30 66 C45 60 52 68 54 80'/%3E%3Cpath d='M110 20 C90 50 92 82 104 112 M100 74 C118 70 124 78 126 90 M100 68 C86 62 80 70 78 82'/%3E%3C/g%3E%3C/svg%3E"); }
.ph-inner{ position:relative; z-index:2; max-width:var(--maxw); margin-inline:auto; width:100%; }
.page-hero .section-title{ color:var(--paper); }
.page-hero .section-title em{ color:var(--gold-lt); }
.page-hero .lead{ color:var(--on-dark-mut); max-width:54ch; margin-top:.8rem; }
.page-hero .eyebrow{ animation:riseIn .9s var(--ease) .1s both; }
.page-hero .section-title{ animation:riseIn 1s var(--ease) .25s both; }
.page-hero .lead{ animation:riseIn 1s var(--ease) .45s both; }

/* ============ 6b. CINTA EDITORIAL (marquee) ============ */
.marquee{ overflow:hidden; background:linear-gradient(90deg,var(--rosa-2),var(--lila-1),var(--rosa-2)); border-top:1px solid var(--line-gold); border-bottom:1px solid var(--line-gold); padding:1.25rem 0; }
.marquee-track{ display:flex; width:max-content; animation:marquee 38s linear infinite; will-change:transform; }
.marquee:hover .marquee-track{ animation-play-state:paused; }
.marquee-group{ display:flex; align-items:center; gap:3rem; padding-right:3rem; }
.marquee-group span{ font-family:var(--serif); font-style:italic; font-size:clamp(1.5rem,2.6vw,2.3rem); color:var(--navy); letter-spacing:.04em; white-space:nowrap; }
.marquee-group span:nth-of-type(even){ color:transparent; -webkit-text-stroke:1px var(--gold-dp); }
.marquee-group i{ color:var(--gold); font-style:normal; font-size:.95rem; }
@keyframes marquee{ to{ transform:translateX(-50%) } }

/* ============ 7. BIENVENIDA ============ */
.welcome{ background:radial-gradient(60% 55% at 92% 8%, rgba(230,218,239,.55), transparent 62%), linear-gradient(180deg,var(--rosa-1),var(--rosa-2)); }
.welcome-grid{ max-width:var(--maxw); margin-inline:auto; display:grid; grid-template-columns:.92fr 1.08fr; gap:clamp(2rem,6vw,5.5rem); align-items:center; }
.welcome-media{ position:relative; }
.welcome-media img{ width:100%; aspect-ratio:4/4.4; object-fit:cover; border-radius:175px 175px var(--radius) var(--radius); box-shadow:var(--shadow-md); }
.welcome-media::before{ content:""; position:absolute; inset:-14px -14px 22px 22px; border:1px solid var(--line-gold); border-radius:185px 185px var(--radius) var(--radius); z-index:-1; }
.welcome-copy .lead{ margin:1.2rem 0; }
.welcome-points{ list-style:none; margin:1.9rem 0 .5rem; display:grid; gap:.9rem; }
.welcome-points li{ display:flex; align-items:baseline; gap:1rem; font-size:.98rem; color:var(--ink-soft); padding-bottom:.9rem; border-bottom:1px solid var(--line); }
.welcome-points span{ font-family:var(--serif); font-style:italic; font-size:1.1rem; color:var(--gold-dp); letter-spacing:.05em; }

/* ============ 8. COLECCIONES ============ */
.collections{ background:radial-gradient(70% 50% at 6% 6%, rgba(234,211,206,.5), transparent 60%), linear-gradient(180deg,var(--lila-1),var(--rosa-2)); }
.collection-grid{ max-width:var(--maxw); margin:clamp(2.5rem,5vw,4rem) auto 0; display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(1rem,2.4vw,2rem); align-items:start; }
/* ritmo bento: la 1ª y la 4ª tarjeta son más altas */
.collection-grid .col-card:nth-child(3n+1) .col-img{ aspect-ratio:4/5.7; }
.col-card{ position:relative; border-radius:var(--radius); overflow:hidden; background:var(--paper); box-shadow:var(--shadow-sm);
  transition:transform .6s var(--ease), box-shadow .6s var(--ease); }
.col-card:hover{ transform:translateY(-8px); box-shadow:var(--shadow-md); }
.col-img{ overflow:hidden; aspect-ratio:4/4.9; position:relative; }
.col-img img{ width:100%; height:100%; object-fit:cover; transition:transform 1.2s var(--ease); }
.col-card:hover .col-img img{ transform:scale(1.07); }
/* marco interior delicado que aparece al pasar el cursor */
.col-img::after{ content:""; position:absolute; inset:12px; border:1px solid transparent; border-radius:6px;
  pointer-events:none; transition:border-color .6s var(--ease); z-index:2; }
.col-card:hover .col-img::after{ border-color:rgba(255,253,249,.6); }
/* flecha circular de "entrar" */
.col-img::before{ content:"→"; position:absolute; right:14px; top:14px; width:44px; height:44px; z-index:3;
  display:grid; place-items:center; border-radius:50%; font-size:1.1rem; color:var(--navy);
  background:rgba(255,253,249,.85); backdrop-filter:blur(6px);
  opacity:0; transform:translateY(8px); transition:.45s var(--ease); }
.col-card:hover .col-img::before{ opacity:1; transform:none; }
/* chip de vidrio sobre la imagen */
.chip{ position:absolute; top:14px; left:14px; z-index:3; padding:.42rem .95rem; border-radius:40px;
  background:rgba(255,253,249,.62); backdrop-filter:blur(8px); border:1px solid rgba(255,255,255,.65);
  font-size:.58rem; letter-spacing:.18em; text-transform:uppercase; font-weight:600; color:var(--navy); }
.col-body{ position:absolute; left:0; right:0; bottom:0; z-index:2; padding:2.6rem 1.5rem 1.45rem;
  background:linear-gradient(transparent, rgba(17,27,51,.16) 30%, rgba(17,27,51,.82)); }
.col-body h3{ font-size:1.55rem; color:var(--paper); margin-bottom:.15rem; }
.col-body p{ font-size:.86rem; color:var(--on-dark-mut); }
.col-more{ display:inline-block; margin-top:.8rem; font-size:.64rem; letter-spacing:.24em; text-transform:uppercase; color:var(--gold-lt); font-weight:600; }
.col-more::after{ content:" →"; transition:margin .4s var(--ease); }
.col-card:hover .col-more::after{ margin-left:.4rem; }
.col-card::before{ content:""; position:absolute; inset:0; border:1px solid transparent; border-radius:var(--radius); pointer-events:none; transition:border-color .5s; z-index:2; }
.col-card:hover::before{ border-color:var(--line-gold); }

/* ============ 9. EDITORIAL (Ramos / Arreglos) ============ */
.editorial{ background:radial-gradient(55% 45% at 94% 90%, rgba(234,211,206,.45), transparent 60%), linear-gradient(180deg,var(--rosa-2),var(--lila-1)); }
.editorial.alt{ background:radial-gradient(55% 45% at 6% 90%, rgba(230,218,239,.5), transparent 60%), linear-gradient(180deg,var(--champan),var(--rosa-2)); }
.editorial-grid{ max-width:var(--maxw); margin-inline:auto; display:grid; grid-template-columns:1fr 1.12fr; gap:clamp(2rem,5vw,5rem); align-items:center; }
.editorial-grid.reverse .editorial-copy{ order:2; }
.editorial-copy .lead{ margin:1.2rem 0; }
.editorial-copy .btn{ margin-top:1.9rem; }

.editorial-gallery{ display:grid; gap:1rem; }
.gallery-3{ grid-template-columns:1fr 1fr; grid-template-rows:auto auto; }
.gallery-3 .gx-tall{ grid-row:span 2; }
.editorial-gallery figure{ margin:0; overflow:hidden; border-radius:var(--radius); box-shadow:var(--shadow-sm); position:relative; }
.editorial-gallery img{ width:100%; height:100%; object-fit:cover; transition:transform 1.1s var(--ease); cursor:zoom-in; }
.gallery-3 figure:not(.gx-tall) img{ aspect-ratio:4/3.2; }
.gallery-3 .gx-tall img{ height:100%; min-height:100%; }
.editorial-gallery figure:hover img{ transform:scale(1.06); }

.gallery-arr{ grid-template-columns:1fr 1fr; }
.gallery-arr .gx-tall{ grid-row:span 2; }
.gallery-arr img{ aspect-ratio:4/3.4; }
.gallery-arr .gx-tall img{ aspect-ratio:auto; height:100%; }

/* ============ 10. BUCHONES (oscuro) ============ */
.buchones{ background:
    radial-gradient(90% 70% at 15% 10%, #1b2a4d 0, transparent 55%),
    linear-gradient(170deg,#0e1830,#131f39); }
.buchones-inner{ max-width:var(--maxw); margin-inline:auto; }
.buchones .center-lead{ margin-inline:auto; max-width:640px; }
.buchones-feature{ display:grid; grid-template-columns:1.35fr 1fr; gap:1.4rem; margin:clamp(2.5rem,5vw,4rem) 0 1.4rem; }
.buchones-feature figure{ margin:0; overflow:hidden; border-radius:var(--radius); position:relative; box-shadow:var(--shadow-lg); border:1px solid var(--line-dark); }
.buchones-feature img{ width:100%; height:100%; object-fit:cover; cursor:zoom-in; transition:transform 1.1s var(--ease); }
.bf-main img{ aspect-ratio:4/4.2; }
.buchones-feature figure:hover img{ transform:scale(1.05); }
.bf-side{ display:grid; grid-template-rows:1.3fr 1fr; gap:1.4rem; }
.bf-side figure img{ aspect-ratio:16/9; }
.bf-note{ background:var(--navy-2); border:1px solid var(--line-dark); border-radius:var(--radius); padding:1.7rem; display:flex; flex-direction:column; justify-content:center; gap:.4rem; }
.bf-note .btn{ margin-top:1rem; align-self:flex-start; }

.buchones-row{ display:grid; grid-template-columns:repeat(4,1fr); gap:1.2rem; margin-top:1.4rem; }
.buchones-row figure{ margin:0; overflow:hidden; border-radius:var(--radius); box-shadow:var(--shadow-md); border:1px solid var(--line-dark); }
.buchones-row img{ width:100%; aspect-ratio:3/3.6; object-fit:cover; cursor:zoom-in; transition:transform 1.1s var(--ease); }
.buchones-row figure:hover img{ transform:scale(1.06); }

/* ============ 10b. FLORES PREMIUM ============ */
.premium{ background:radial-gradient(50% 40% at 8% 10%, rgba(230,218,239,.45), transparent 60%), linear-gradient(180deg,var(--rosa-1),var(--champan)); }
.premium-showcase{ max-width:var(--maxw); margin:clamp(2.5rem,5vw,3.5rem) auto 1.6rem;
  display:grid; grid-template-columns:1.32fr 1fr 1fr; grid-auto-rows:1fr; gap:1.2rem; }
.ps-item{ margin:0; position:relative; overflow:hidden; border-radius:var(--radius); box-shadow:var(--shadow-md); }
.ps-item img{ width:100%; height:100%; object-fit:cover; min-height:260px; cursor:zoom-in; transition:transform 1.2s var(--ease); }
.ps-item:hover img{ transform:scale(1.05); }
.ps-lg{ grid-row:span 2; }
.ps-item figcaption{ position:absolute; left:0; right:0; bottom:0; padding:2rem 1.4rem 1.3rem;
  background:linear-gradient(transparent, rgba(17,27,51,.8)); color:var(--paper); }
.ps-item figcaption h3{ font-size:1.7rem; color:#fff; }
.ps-item figcaption span{ font-size:.82rem; color:var(--gold-lt); letter-spacing:.04em; }
.premium-strip{ max-width:var(--maxw); margin:0 auto 2.6rem; display:grid; grid-template-columns:repeat(4,1fr); gap:1.2rem; }
.premium-strip figure{ margin:0; overflow:hidden; border-radius:var(--radius); box-shadow:var(--shadow-sm); }
.premium-strip img{ width:100%; aspect-ratio:3/3.6; object-fit:cover; cursor:zoom-in; transition:transform 1.1s var(--ease); }
.premium-strip figure:hover img{ transform:scale(1.06); }
@media (max-width:820px){
  .premium-showcase{ grid-template-columns:1fr 1fr; }
  .ps-lg{ grid-column:span 2; grid-row:span 1; }
  .ps-item img{ min-height:220px; }
  .premium-strip{ grid-template-columns:repeat(2,1fr); }
}

/* ============ 11. FÚNEBRES (sobrio) ============ */
.funebres{ background:linear-gradient(180deg,var(--sage-soft),var(--ivory)); }
.funebres-grid{ max-width:var(--maxw); margin-inline:auto; display:grid; grid-template-columns:1fr 1.08fr; gap:clamp(2rem,5vw,4.5rem); align-items:center; }
.funebres-copy .lead{ margin:1.2rem 0; }
.funebres-gallery{ display:grid; grid-template-columns:1.3fr 1fr; grid-template-rows:1fr 1fr; gap:1rem; }
.funebres-gallery figure{ margin:0; overflow:hidden; border-radius:var(--radius); box-shadow:var(--shadow-sm); }
.funebres-gallery figure:first-child{ grid-row:span 2; }
.funebres-gallery img{ width:100%; height:100%; object-fit:cover; min-height:180px; cursor:zoom-in; transition:transform 1.1s var(--ease); }
.funebres-gallery figure:hover img{ transform:scale(1.05); }

/* ============ 12. EVENTOS (oscuro / masonry) ============ */
.eventos{ background:
    radial-gradient(80% 60% at 85% 5%, #20335c 0, transparent 55%),
    linear-gradient(160deg,#0d1628,#141f3a); }
.eventos-inner{ max-width:var(--maxw); margin-inline:auto; }
.eventos .center-lead{ margin-inline:auto; max-width:660px; }
.eventos-masonry{ display:grid; grid-template-columns:repeat(4,1fr); grid-auto-rows:130px; gap:1.1rem; margin:clamp(2.5rem,5vw,4rem) 0; }
.eventos-masonry figure{ margin:0; overflow:hidden; border-radius:var(--radius); position:relative; box-shadow:var(--shadow-lg); border:1px solid var(--line-dark); }
.eventos-masonry img{ width:100%; height:100%; object-fit:cover; cursor:zoom-in; transition:transform 1.2s var(--ease); }
.eventos-masonry figure:hover img{ transform:scale(1.06); }
.ev-a{ grid-column:span 2; grid-row:span 3; }
.ev-b{ grid-column:span 2; grid-row:span 2; }
.ev-c{ grid-column:span 1; grid-row:span 2; }
.ev-d{ grid-column:span 1; grid-row:span 2; }
.ev-e{ grid-column:span 2; grid-row:span 2; }
.ev-f{ grid-column:span 2; grid-row:span 2; }

/* ============ 13. PERSONALIZADOS ============ */
.custom{ background:radial-gradient(120% 100% at 50% 0%, var(--lila-2), var(--rosa-1) 75%); text-align:center; }
.custom-inner{ max-width:900px; margin-inline:auto; }
.custom-orn{ display:block; font-size:2rem; color:var(--gold); margin-bottom:1rem; }
.custom .lead{ margin:1.2rem auto 0; max-width:620px; }
.steps{ display:grid; grid-template-columns:repeat(4,1fr); gap:1.4rem; margin:3rem 0; text-align:left; }
.step{ padding:1.6rem 1.3rem; background:var(--paper); border-radius:var(--radius); border:1px solid var(--line); box-shadow:var(--shadow-sm); position:relative; }
.step span{ font-family:var(--serif); font-style:italic; font-size:2rem; color:var(--gold); opacity:.55; position:absolute; top:1rem; right:1.2rem; line-height:1; }
.step h4{ font-size:1.28rem; color:var(--navy); margin-bottom:.4rem; }
.step p{ font-size:.86rem; color:var(--ink-mute); }

/* ============ 14. GALERÍA ============ */
.filters{ display:flex; flex-wrap:wrap; justify-content:center; gap:.6rem; margin:2.5rem auto clamp(2rem,4vw,3rem); }
.filter{ font-size:.7rem; letter-spacing:.18em; text-transform:uppercase; color:var(--ink-soft);
  padding:.7rem 1.5rem; border-radius:50px; border:1px solid var(--line); transition:.45s var(--ease); }
.filter:hover{ border-color:var(--line-gold); color:var(--navy); }
.filter.is-active{ background:var(--gold-grad); color:#3a2b12; border-color:transparent; font-weight:600; box-shadow:0 10px 24px -14px rgba(169,130,63,.8); }

.grid-gallery{ max-width:var(--maxw); margin-inline:auto; columns:4; column-gap:1rem; }
.grid-gallery .g-item{ break-inside:avoid; margin-bottom:1rem; border-radius:var(--radius); overflow:hidden; position:relative;
  box-shadow:var(--shadow-sm); animation:fadeIn .7s var(--ease) both; }
.grid-gallery .g-item img{ width:100%; display:block; cursor:zoom-in; transition:transform 1.1s var(--ease); }
.grid-gallery .g-item:hover img{ transform:scale(1.06); }
.g-cap{ position:absolute; left:0; right:0; bottom:0; padding:1.4rem 1rem .9rem;
  background:linear-gradient(transparent, rgba(17,27,51,.82)); color:var(--paper);
  font-family:var(--serif); font-size:1.05rem; opacity:0; transform:translateY(8px); transition:.5s var(--ease); }
.g-item:hover .g-cap{ opacity:1; transform:none; }
.g-cap small{ display:block; font-family:var(--sans); font-size:.6rem; letter-spacing:.2em; text-transform:uppercase; color:var(--gold-lt); margin-top:2px; }
@keyframes fadeIn{ from{ opacity:0; transform:translateY(16px) } to{ opacity:1; transform:none } }

/* ============ 14a. INTERLUDIOS DE VIDEO (tipo hero) ============ */
.video-hero{
  position:relative; height:clamp(420px,72vh,660px); overflow:hidden;
  display:flex; align-items:flex-end;
}
.video-hero video{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.video-hero::after{ content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(11,17,34,.15), rgba(11,17,34,.28) 55%, rgba(11,17,34,.72)); }
.vh-text{
  position:relative; z-index:2; width:100%; max-width:var(--maxw); margin-inline:auto;
  padding:0 var(--pad) clamp(2.2rem,5vw,3.6rem); color:var(--paper);
}
.vh-text .section-title{ color:var(--paper); }
.vh-text .section-title em{ color:var(--gold-lt); }
.video-hero.vh-right .vh-text{ text-align:right; }
.video-hero.vh-right .vh-text .eyebrow{ flex-direction:row-reverse; }

/* ============ 14b. VIDEOS INTEGRADOS EN SECCIONES ============ */
.vid-card{ position:relative; cursor:pointer; }
.vid-card video{ width:100%; height:100%; object-fit:cover; display:block; background:#0b1122; }
/* el video adopta la proporción de las fotos de su propia galería */
.gallery-3 .vid-card video{ aspect-ratio:4/3.2; }
.buchones-row .vid-card video{ aspect-ratio:3/3.6; }
.premium-strip .vid-card video{ aspect-ratio:3/3.6; }
.reel-play{
  position:absolute; inset:0; margin:auto; width:58px; height:58px; z-index:3; pointer-events:none;
  border-radius:50%; background:rgba(17,27,51,.55); backdrop-filter:blur(6px);
  border:1px solid var(--line-dark); transition:opacity .45s var(--ease), transform .45s var(--ease);
}
.reel-play::after{
  content:""; position:absolute; left:53%; top:50%; transform:translate(-50%,-50%);
  border-style:solid; border-width:10px 0 10px 16px; border-color:transparent transparent transparent var(--gold-lt);
}
.vid-card.playing .reel-play{ opacity:0; transform:scale(.7); }
.vid-card:hover .reel-play{ background:rgba(17,27,51,.75); }

/* video de entrega real (personalizados) */
.deliv-strip{ max-width:300px; margin:0 auto 2.6rem; }
.deliv-strip .vid-card{ margin:0; border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow-md); border:1px solid var(--line-gold); }
.deliv-strip .vid-card video{ aspect-ratio:9/14; }
.deliv-strip figcaption{
  position:absolute; left:0; right:0; bottom:0; padding:1.8rem .9rem .7rem; z-index:2; pointer-events:none;
  background:linear-gradient(transparent, rgba(11,17,34,.8));
  font-family:var(--serif); font-style:italic; font-size:.98rem; color:var(--paper); letter-spacing:.03em;
}

/* botón ver más de la galería */
.gallery-more-wrap{ margin-top:2.2rem; }

/* ============ 15. CTA FINAL / FOOTER / UI ============ */
.final-cta{ text-align:center; overflow:hidden;
  background:radial-gradient(90% 120% at 50% 0%, #1d2c50 0, #101a33 60%, #0b1122 100%); }
.final-inner{ max-width:760px; margin-inline:auto; position:relative; z-index:2; }
.final-glow{ position:absolute; width:70vw; max-width:760px; height:70vw; max-height:760px; left:50%; top:-30%; transform:translateX(-50%);
  background:radial-gradient(circle, rgba(201,138,130,.22), transparent 60%); filter:blur(30px); }
.final-cta .lead{ margin:1.3rem auto 0; max-width:540px; }
.final-actions{ display:flex; flex-wrap:wrap; gap:1rem; justify-content:center; margin-top:2.6rem; }

.site-footer{ background:var(--navy-3); color:var(--on-dark-mut); padding:clamp(3.5rem,7vw,5.5rem) var(--pad) 2rem; position:relative; overflow:hidden; }
.site-footer::before{ content:""; position:absolute; top:0; left:0; right:0; height:1px;
  background:linear-gradient(90deg,transparent, var(--gold) 50%, transparent); opacity:.45; }
/* mega-CTA del footer */
.footer-cta{ max-width:var(--maxw); margin:0 auto 3rem; padding-bottom:2.4rem; border-bottom:1px solid var(--line-dark); position:relative; z-index:2; }
.footer-cta a{ font-family:var(--serif); font-style:italic; font-weight:600;
  font-size:clamp(1.7rem,4.4vw,3.1rem); line-height:1.2; color:var(--paper);
  display:inline-flex; align-items:center; gap:1.1rem; transition:color .45s var(--ease); }
.footer-cta a::after{ content:"→"; font-style:normal; color:var(--gold-lt); transition:transform .45s var(--ease); }
.footer-cta a:hover{ color:var(--gold-lt); }
.footer-cta a:hover::after{ transform:translateX(10px); }

/* marca de agua editorial */
.site-footer::after{ content:"Gori Blooms"; position:absolute; right:-1%; bottom:-4rem; pointer-events:none;
  font-family:var(--serif); font-style:italic; font-weight:600; font-size:clamp(6rem,16vw,13rem);
  line-height:1; color:rgba(230,203,146,.07); white-space:nowrap; }
.footer-grid{ max-width:var(--maxw); margin-inline:auto; display:grid; grid-template-columns:1.6fr 1fr 1fr 1fr; gap:2.5rem; }
.footer-brand p{ color:var(--on-dark-mut); margin:1.1rem 0 1.5rem; max-width:34ch; font-size:.92rem; }
.footer-brand .brand-word{ margin-bottom:0; }
.socials{ display:flex; gap:1.4rem; }
.socials a{ font-size:.7rem; letter-spacing:.16em; text-transform:uppercase; color:var(--on-dark); position:relative; }
.socials a::after{ content:""; position:absolute; left:0; bottom:-3px; width:100%; height:1px; background:var(--gold); transform:scaleX(0); transform-origin:right; transition:transform .4s var(--ease); }
.socials a:hover::after{ transform:scaleX(1); transform-origin:left; }
.footer-col h5{ font-family:var(--sans); font-size:.68rem; letter-spacing:.24em; text-transform:uppercase; color:var(--gold-lt); margin-bottom:1.3rem; font-weight:500; }
.footer-col a{ display:block; font-size:.9rem; color:var(--on-dark-mut); padding:.4rem 0; transition:color .4s, padding-left .4s var(--ease); }
.footer-col a:hover{ color:var(--gold-lt); padding-left:.4rem; }
.footer-note{ display:block; font-size:.78rem; color:var(--ink-mute); margin-top:.8rem; line-height:1.6; }
.footer-bottom{ max-width:var(--maxw); margin:3rem auto 0; padding-top:1.6rem; border-top:1px solid var(--line-dark);
  display:flex; justify-content:space-between; gap:1rem; flex-wrap:wrap; font-size:.7rem; letter-spacing:.1em; color:var(--ink-mute); }

/* WhatsApp flotante */
.wa-float{ position:fixed; right:clamp(1rem,3vw,2rem); bottom:clamp(1rem,3vw,2rem); z-index:80;
  width:58px; height:58px; border-radius:50%; display:grid; place-items:center; color:#fff;
  background:linear-gradient(145deg,#25D366,#128C7E); box-shadow:0 16px 34px -12px rgba(18,140,126,.7);
  transition:transform .5s var(--ease); animation:wapulse 3s ease-in-out infinite; }
.wa-float svg{ width:30px; height:30px; }
.wa-float:hover{ transform:scale(1.08) translateY(-2px); }
@keyframes wapulse{ 0%,100%{ box-shadow:0 16px 34px -12px rgba(18,140,126,.7) } 50%{ box-shadow:0 16px 44px -8px rgba(37,211,102,.85) } }

/* Lightbox */
.lightbox{ position:fixed; inset:0; z-index:100; background:rgba(11,17,34,.94); backdrop-filter:blur(6px);
  display:flex; align-items:center; justify-content:center; opacity:0; visibility:hidden; transition:opacity .4s var(--ease), visibility .4s; }
.lightbox.open{ opacity:1; visibility:visible; }
.lb-figure{ margin:0; max-width:min(88vw,820px); max-height:86vh; display:flex; flex-direction:column; align-items:center; gap:1rem; }
.lb-figure img{ max-width:100%; max-height:78vh; object-fit:contain; border-radius:8px; box-shadow:var(--shadow-lg); border:1px solid var(--line-dark);
  animation:lbin .5s var(--ease); }
@keyframes lbin{ from{ opacity:0; transform:scale(.96) } to{ opacity:1; transform:none } }
.lb-figure figcaption{ color:var(--gold-lt); font-family:var(--serif); font-size:1.2rem; letter-spacing:.04em; }
.lb-close{ position:absolute; top:1.4rem; right:1.8rem; font-size:2.4rem; color:var(--on-dark); line-height:1; transition:color .3s, transform .4s; }
.lb-close:hover{ color:var(--gold-lt); transform:rotate(90deg); }
.lb-nav{ position:absolute; top:50%; transform:translateY(-50%); font-size:3rem; color:var(--on-dark-mut); padding:1rem; transition:color .3s; }
.lb-nav:hover{ color:var(--gold-lt); }
.lb-prev{ left:clamp(.5rem,3vw,2.5rem); } .lb-next{ right:clamp(.5rem,3vw,2.5rem); }

/* ============ RESPONSIVE ============ */
@media (max-width:1080px){
  .hero-inner{ grid-template-columns:1fr; padding-top:5rem; padding-bottom:6rem; gap:3rem; }
  .hero-visual{ order:-1; } .hero-frame{ max-width:330px; }
  .hero-sub{ max-width:46ch; }
  .collection-grid{ grid-template-columns:repeat(2,1fr); }
  .grid-gallery{ columns:3; }
  .steps{ grid-template-columns:repeat(2,1fr); }
  .eventos-masonry{ grid-template-columns:repeat(2,1fr); }
  .ev-a{ grid-column:span 2; grid-row:span 3; }
  .ev-b,.ev-e,.ev-f{ grid-column:span 2; grid-row:span 2; }
  .ev-c,.ev-d{ grid-column:span 1; grid-row:span 2; }
}
@media (max-width:820px){
  .nav-links{ position:fixed; inset:0 0 0 auto; width:min(80vw,340px); flex-direction:column; justify-content:center; align-items:flex-start;
    gap:1.6rem; padding:2.5rem; background:var(--navy); transform:translateX(100%); transition:transform .55s var(--ease); z-index:95; }
  .nav-links.open{ transform:none; box-shadow:var(--shadow-lg); }
  .nav-links a{ color:var(--on-dark) !important; font-size:.9rem; }
  .nav-links a::after{ display:none; }
  /* submenú siempre visible en el panel móvil */
  .nav-sub-menu{ position:static; transform:none; opacity:1; visibility:visible; background:transparent;
    border:none; box-shadow:none; padding:.3rem 0 0 1rem; min-width:0; }
  .nav-sub-menu a{ color:var(--on-dark-mut) !important; padding:.35rem 0; font-size:.78rem; }
  .nav-sub-menu a:hover{ background:transparent; }
  .nav-sub-toggle{ pointer-events:none; }
  .nav-cta{ margin-top:.5rem; }
  .nav-toggle{ display:flex; z-index:96; }
  .nav-toggle.open span:nth-child(1){ transform:translateY(6.6px) rotate(45deg); background:var(--paper); }
  .nav-toggle.open span:nth-child(2){ opacity:0; }
  .nav-toggle.open span:nth-child(3){ transform:translateY(-6.6px) rotate(-45deg); background:var(--paper); }
  .welcome-grid, .editorial-grid, .editorial-grid.reverse, .funebres-grid{ grid-template-columns:1fr; gap:2.5rem; }
  .editorial-grid.reverse .editorial-copy{ order:0; }
  .buchones-feature{ grid-template-columns:1fr; }
  .bf-side{ grid-template-rows:auto auto; }
  .bf-side figure img{ aspect-ratio:16/8; }
  .footer-grid{ grid-template-columns:1fr 1fr; gap:2rem; }
  .footer-brand{ grid-column:1/-1; }
  .buchones-row{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:560px){
  :root{ --sect:clamp(3.5rem,13vw,5rem); }
  .topbar span:nth-child(n+5), .topbar i:nth-child(n+5){ display:none; }
  .collection-grid, .steps{ grid-template-columns:1fr; }
  .grid-gallery{ columns:2; column-gap:.7rem; }
  .grid-gallery .g-item{ margin-bottom:.7rem; }
  .funebres-gallery{ grid-template-columns:1fr 1fr; }
  .hero-actions .btn, .final-actions .btn{ width:100%; }
  .footer-bottom{ justify-content:center; text-align:center; }
  .gallery-arr{ grid-template-columns:1fr 1fr; }
}

/* accesibilidad: menos movimiento */
@media (prefers-reduced-motion:reduce){
  *{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important; }
  .reveal{ opacity:1; transform:none; }
  .stagger > *{ opacity:1; }
  .marquee-track{ animation:none; }
}
