.elementor-kit-4{--e-global-color-primary:#B3001B;--e-global-color-secondary:#2A000F;--e-global-color-text:#F2E9EE;--e-global-color-accent:#E0002A;--e-global-color-b5aeb33:#050004;--e-global-color-c58817e:#1A0B13;--e-global-color-5420d44:#000000;--e-global-color-58be983:#ffffff;--e-global-color-09cc561:#0d141a;--e-global-color-a495fd4:#B8C0CC;--e-global-color-dff8941:#F8E6E6;--e-global-typography-primary-font-family:"Cinzel";--e-global-typography-primary-font-weight:500;--e-global-typography-primary-text-transform:uppercase;--e-global-typography-primary-letter-spacing:0.2px;--e-global-typography-secondary-font-family:"IM Fell English SC";--e-global-typography-secondary-font-weight:500;--e-global-typography-secondary-text-transform:uppercase;--e-global-typography-text-font-family:"Cormorant Garamond";--e-global-typography-text-font-weight:500;--e-global-typography-text-line-height:1.5px;--e-global-typography-accent-font-family:"Cinzel";--e-global-typography-accent-font-weight:500;--e-global-typography-accent-text-transform:uppercase;--e-global-typography-accent-letter-spacing:0.2px;background-color:#050004;}.elementor-kit-4 button,.elementor-kit-4 input[type="button"],.elementor-kit-4 input[type="submit"],.elementor-kit-4 .elementor-button{background-color:#050004;font-family:"Cinzel", Sans-serif;font-size:15px;font-weight:normal;text-transform:uppercase;letter-spacing:0.2px;color:#C02C32;border-style:solid;border-color:#B3001B;border-radius:4px 4px 4px 4px;}.elementor-kit-4 e-page-transition{background-color:#050004;}.elementor-kit-4 a{color:#C02C32;font-family:"Helvetica", Sans-serif;}.elementor-kit-4 h1{color:#EDEDED;font-family:"Cinzel", Sans-serif;font-weight:normal;letter-spacing:0px;word-spacing:0px;}.elementor-kit-4 h2{color:#C02C32;font-family:"IM Fell English SC", Sans-serif;font-weight:normal;}.elementor-kit-4 h3{color:#E6E1DC;font-family:"Cormorant Garamond", Sans-serif;}.elementor-kit-4 img{border-radius:18px 18px 18px 18px;opacity:0.6;box-shadow:0px 12px 40px 0px rgba(0,0,0,0.5);transition-duration:0.35s;}.elementor-kit-4 img:hover{opacity:0.92;box-shadow:18px 50px 75px 0px #000000;}.elementor-kit-4 label{color:#F2E9E4;font-family:"Cormorant Garamond", Sans-serif;font-size:16px;font-weight:normal;line-height:1.4px;}.elementor-kit-4 input:not([type="button"]):not([type="submit"]),.elementor-kit-4 textarea,.elementor-kit-4 .elementor-field-textual{font-family:"Cormorant Garamond", Sans-serif;font-size:16px;font-weight:normal;line-height:1.4px;color:#F2E9E4;accent-color:#E0002A;background-color:#050004;box-shadow:0px 0px 10px 0px #B3001B;border-style:solid;border-width:1px 1px 1px 1px;border-color:#B3001B;border-radius:8px 8px 8px 8px;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1240px;}.e-con{--container-max-width:1240px;--container-default-padding-top:0px;--container-default-padding-right:0px;--container-default-padding-bottom:0px;--container-default-padding-left:0px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}.elementor-lightbox{background-color:#000000;--lightbox-ui-color:#E0002A;--lightbox-text-color:#F2E9E4;}.site-header .site-branding{flex-direction:column;align-items:stretch;}.site-header{padding-inline-end:0px;padding-inline-start:0px;}.site-footer .site-branding{flex-direction:column;align-items:stretch;}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS *//* ===== BOOKINGS HERO — INFERNAL PORTAL / INVOCATION ===== */

.bookings-hero{
  position: relative;
  overflow: hidden;
  border-radius: 26px;
  border: 1px solid rgba(255,40,90,.75);
  background:
    radial-gradient(1400px 620px at 50% 14%, rgba(255,0,70,.45), transparent 58%),
    radial-gradient(900px 700px at 82% 88%, rgba(90,0,0,.65), transparent 68%),
    radial-gradient(600px 420px at 18% 82%, rgba(140,0,90,.35), transparent 65%),
    linear-gradient(180deg, #000000 0%, #050007 52%, #000000 100%);
  box-shadow:
    0 0 0 1px rgba(255,40,90,.35) inset,
    0 60px 180px rgba(0,0,0,.95);
}

/* ===== OCCULT GRAIN / BLOOD NOISE ===== */

.bookings-hero::before{
  content:"";
  position:absolute;
  inset:-35%;
  background:
    repeating-linear-gradient(
      0deg,
      rgba(255,255,255,.08) 0px,
      rgba(255,255,255,.08) 1px,
      transparent 2px,
      transparent 4px
    ),
    repeating-linear-gradient(
      90deg,
      rgba(255,0,70,.09) 0px,
      rgba(255,0,70,.09) 1px,
      transparent 2px,
      transparent 6px
    );
  opacity:.6;
  mix-blend-mode: overlay;
  animation: grainMove 6s steps(2) infinite;
  pointer-events:none;
}

@keyframes grainMove{
  0%{transform:translate(0,0)}
  20%{transform:translate(-2%,1%)}
  40%{transform:translate(2%,-2%)}
  60%{transform:translate(-1%,2%)}
  80%{transform:translate(2%,2%)}
  100%{transform:translate(0,0)}
}

/* ===== INFERNAL VIGNETTE / PORTAL MOUTH ===== */

.bookings-hero::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 50% 30%, rgba(0,0,0,.0) 0 28%, rgba(0,0,0,.92) 78%);
  pointer-events:none;
}

/* ===== CONTENT WRAPPER ===== */

.hero-altar{
  position: relative;
  z-index: 3;
  max-width: 980px;
  margin: 0 auto;
  text-align: center;
}

/* ===== SIGIL / INVOCATION MARK ===== */

.hero-sigil{
  color:#f7f1e8; /* BLANCO HUESO */
  font-size:13px;
  letter-spacing:.6em;
  margin-bottom:24px;
  text-shadow:
    0 0 14px rgba(255,0,70,.75),
    0 0 38px rgba(255,0,70,.55);
}

/* ===== TITLE — BONES / FLAME ===== */

.hero-title{
  margin:0 0 22px 0;
  font-size:clamp(56px,6.2vw,102px);
  letter-spacing:.24em;
  text-transform:uppercase;
  color:#f7f1e8; /* BLANCO HUESO */
  text-shadow:
    0 0 2px rgba(255,255,255,.85),
    0 0 30px rgba(255,0,70,.8),
    0 0 90px rgba(255,0,70,.6);
}

/* ===== SUBTEXT — OATH / DECLARATION ===== */

.hero-sub{
  margin:0 auto 30px;
  max-width:760px;
  font-size:clamp(16px,1.35vw,20px);
  line-height:1.9;
  color:#f7f1e8; /* BLANCO HUESO */
  text-shadow:
    0 0 22px rgba(0,0,0,.95);
}

/* ===== RITUAL DIVIDER / SEAL ===== */

.hero-seal{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:20px;
  margin:26px 0 40px;
  color:#f7f1e8; /* BLANCO HUESO */
  letter-spacing:.4em;
  font-size:12px;
}

.seal-line{
  width:160px;
  height:1px;
  background:linear-gradient(
    90deg,
    transparent,
    rgba(255,0,70,1),
    transparent
  );
  box-shadow:
    0 0 26px rgba(255,0,70,.9);
}

/* ===== BUTTON — PORTAL SEAL ===== */

.hero-btn{
  display:inline-flex;
  align-items:center;
  gap:14px;
  padding:20px 38px;
  border-radius:999px;
  border:1px solid rgba(255,0,70,.95);
  background:
    radial-gradient(circle at 30% 30%, rgba(255,0,70,.5), transparent 62%),
    rgba(0,0,0,.75);
  color:#f7f1e8; /* BLANCO HUESO */
  letter-spacing:.35em;
  text-transform:uppercase;
  text-decoration:none;
  box-shadow:
    0 0 0 1px rgba(255,0,70,.55) inset,
    0 28px 110px rgba(0,0,0,1);
  transition:all .28s ease;
}

.hero-btn:hover{
  transform:translateY(-4px);
  box-shadow:
    0 0 0 1px rgba(255,0,70,.9) inset,
    0 0 60px rgba(255,0,70,.9),
    0 40px 160px rgba(0,0,0,1);
}

/* ===== SIGIL ICON ===== */

.btn-sigil{
  color:#f7f1e8; /* BLANCO HUESO */
  text-shadow:
    0 0 30px rgba(255,0,70,1);
}

/* ===== HINT / FINAL WARNING ===== */

.hero-hint{
  margin-top:20px;
  font-size:11px;
  letter-spacing:.35em;
  text-transform:uppercase;
  color:#f7f1e8; /* BLANCO HUESO */
  opacity:.95;
}



/* ===== FILMOGRAPHY HERO — ARCHIVAL PORTAL ===== */

.film-hero{
  position:relative;
  overflow:hidden;
  border-radius:28px;
  border:1px solid rgba(255,0,70,.55);
  background:
    radial-gradient(1200px 520px at 50% 18%, rgba(255,0,70,.40), transparent 60%),
    radial-gradient(900px 680px at 82% 88%, rgba(90,0,0,.65), transparent 68%),
    radial-gradient(520px 420px at 18% 78%, rgba(140,0,90,.30), transparent 70%),
    linear-gradient(180deg, #000000 0%, #050007 52%, #000000 100%);
  box-shadow:
    0 0 0 1px rgba(255,0,70,.22) inset,
    0 60px 180px rgba(0,0,0,.95);
}

/* grain / film noise */
.film-hero::before{
  content:"";
  position:absolute;
  inset:-35%;
  background:
    repeating-linear-gradient(
      0deg,
      rgba(255,255,255,.08) 0px,
      rgba(255,255,255,.08) 1px,
      transparent 2px,
      transparent 4px
    ),
    repeating-linear-gradient(
      90deg,
      rgba(255,0,70,.10) 0px,
      rgba(255,0,70,.10) 1px,
      transparent 2px,
      transparent 6px
    );
  opacity:.55;
  mix-blend-mode: overlay;
  animation: filmGrain 6s steps(2) infinite;
  pointer-events:none;
}

@keyframes filmGrain{
  0%{transform:translate(0,0)}
  20%{transform:translate(-2%,1%)}
  40%{transform:translate(2%,-2%)}
  60%{transform:translate(-1%,2%)}
  80%{transform:translate(2%,2%)}
  100%{transform:translate(0,0)}
}

/* vignette mouth */
.film-hero::after{
  content:"";
  position:absolute;
  inset:0;
  background: radial-gradient(circle at 50% 32%, rgba(0,0,0,0) 0 30%, rgba(0,0,0,.93) 78%);
  pointer-events:none;
}

/* inner content wrapper */
.film-hero-inner{
  position:relative;
  z-index:2;
  max-width:980px;
  margin:0 auto;
  text-align:center;
}

/* sigil line */
.film-hero-sigil{
  color:#f7f1e8;
  font-size:12px;
  letter-spacing:.65em;
  text-transform:uppercase;
  text-shadow:
    0 0 14px rgba(255,0,70,.75),
    0 0 38px rgba(255,0,70,.55);
}

/* title */
.film-hero-title{
  margin:18px 0 18px;
  color:#f7f1e8;
  font-size:clamp(56px,6.2vw,104px);
  letter-spacing:.26em;
  text-transform:uppercase;
  text-shadow:
    0 0 2px rgba(255,255,255,.85),
    0 0 34px rgba(255,0,70,.85),
    0 0 90px rgba(255,0,70,.60);
}

/* subtitle */
.film-hero-sub{
  margin:0 auto 22px;
  max-width:760px;
  color:#f7f1e8;
  opacity:.92;
  font-size:clamp(15px,1.25vw,20px);
  line-height:1.9;
  text-shadow:0 0 22px rgba(0,0,0,.95);
}

/* ritual divider */
.film-hero-divider{
  width:170px;
  height:1px;
  margin:22px auto 18px;
  background:linear-gradient(90deg, transparent, rgba(255,0,70,1), transparent);
  box-shadow:0 0 26px rgba(255,0,70,.9);
}

/* footnote */
.film-hero-note{
  margin:0;
  color:#f7f1e8;
  opacity:.72;
  font-size:11px;
  letter-spacing:.35em;
  text-transform:uppercase;
}

/* sizing for the container */
.film-hero-pad{
  padding:96px 22px;
  min-height:78vh;
  display:flex;
  align-items:center;
  justify-content:center;
}

@media(max-width:767px){
  .film-hero-pad{ padding:76px 18px; min-height:70vh; }
  .film-hero-title{ letter-spacing:.18em; }
}


/* ===== FILMOGRAPHY SIGIL IMAGE ===== */

.film-sigil-img img{
  display:block;
  margin:0 auto;
  width:min(140px, 32vw);
  height:auto;
  filter:
    drop-shadow(0 0 14px rgba(255,0,70,.85))
    drop-shadow(0 0 38px rgba(255,0,70,.55));
  transform: translateZ(0);
  opacity:.95;
}

.film-sigil-img{
  animation: sigilHover 6.5s ease-in-out infinite;
}

@keyframes sigilHover{
  0%{ transform: translateY(0); }
  50%{ transform: translateY(-6px); }
  100%{ transform: translateY(0); }
}



/* ===== ROUND SIGIL SEAL ===== */

.film-sigil-img{
  width:140px;
  aspect-ratio:1/1;
  border-radius:50%;
  overflow:hidden;
  display:flex;
  align-items:center;
  justify-content:center;
}

.film-sigil-img img{
  width:100%;
  height:100%;
  object-fit:cover;
  border-radius:50%;
}





/* ===== FILMOGRAPHY — 1ON1 SECTION (ELEMENTOR GRID + CLEAN CSS) ===== */

/* section spacing */
.fg-section{
  max-width: 1200px;
  margin: 0 auto;
  padding: 60px 20px;
}

/* title look */
.fg-section h2{
  color:#f7f1e8;
  letter-spacing:.28em;
  text-transform:uppercase;
  margin:0 0 22px;
  text-shadow:
    0 0 16px rgba(255,0,70,.45),
    0 0 44px rgba(0,0,0,.95);
}

/* grid polish (still uses Elementor grid columns=3) */
.fg-grid{
  gap: 22px;
}

/* card */
.fg-card{
  position: relative;
  border-radius: 18px;
  overflow: hidden;
  border: 1px solid rgba(255,0,70,.45);
  background: #040008;
  box-shadow: 0 24px 80px rgba(0,0,0,.92);
  transition: .25s ease;
}

.fg-card:hover{
  transform: translateY(-3px);
  box-shadow:
    0 0 44px rgba(255,0,70,.35),
    0 34px 120px rgba(0,0,0,1);
}

/* make image square without fiddling with element sizes */
.fg-card .fg-img img{
  width:100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  display:block;
  filter: contrast(1.08) saturate(1.06) brightness(.92);
}

/* overlay sits on image, no margins/padding games */
.fg-overlay{
  position:absolute;
  inset:0;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  padding:16px 16px 14px;
  background:
    radial-gradient(circle at 50% 18%, rgba(255,0,70,.18), transparent 55%),
    linear-gradient(180deg, rgba(0,0,0,.05) 40%, rgba(0,0,0,.92) 100%);
}

/* text inside overlay */
.fg-overlay h1, .fg-overlay h2, .fg-overlay h3, .fg-overlay h4, .fg-overlay h5, .fg-overlay h6,
.fg-overlay p{
  color:#f7f1e8;
  margin:0;
}

.fg-overlay h6{
  color:#ff1e3c;
  text-shadow:0 0 18px rgba(255,0,70,.75);
  margin-bottom:8px;
}

.fg-overlay h3, .fg-overlay h4{
  text-transform:uppercase;
  letter-spacing:.18em;
  text-shadow: 0 0 18px rgba(255,0,70,.35);
  margin-bottom:6px;
}

.fg-overlay p{
  opacity:.78;
  letter-spacing:.14em;
  text-transform:uppercase;
  font-size:11px;
  margin-bottom:10px;
}

/* button ritual */
.fg-btn .elementor-button{
  border-radius:999px;
  border:1px solid rgba(255,0,70,.85);
  background: rgba(0,0,0,.58);
  color:#f7f1e8;
  letter-spacing:.22em;
  text-transform:uppercase;
  font-size:11px;
  padding:10px 12px;
  transition:.25s ease;
}

.fg-btn .elementor-button:hover{
  background: rgba(255,0,70,.12);
  box-shadow: 0 0 26px rgba(255,0,70,.45);
}




/* ===== GALLERY HEADING — OCCULT TITLING ===== */
.gallery-heading{
  position: relative;
  display: inline-block;
  padding: 10px 18px;
  color:#f7f1e8 !important;
  text-shadow:
    0 0 2px rgba(255,255,255,.85),
    0 0 22px rgba(255,0,60,.75),
    0 0 70px rgba(255,0,60,.45);
}

/* subtle blood underline rune */
.gallery-heading::after{
  content:"⛧";
  position:absolute;
  left:50%;
  bottom:-22px;
  transform:translateX(-50%);
  font-size:18px;
  color:#ff003c;
  text-shadow:
    0 0 14px rgba(255,0,60,1),
    0 0 34px rgba(255,0,60,.7);
  opacity:.95;
}


/* ===== GALLERY GRID — 3x RITUAL (NO FRAME ON GRID) ===== */
.gallery-grid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 26px;
  align-items: stretch;
}

/* Tablet */
@media (max-width: 1024px){
  .gallery-grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Mobile */
@media (max-width: 640px){
  .gallery-grid{ grid-template-columns: 1fr; }
}

/* ===== CARD — IPHONE VERTICAL RATIO / CURSED FRAME ===== */
.gallery-grid .gallery-card{
  position: relative;
  overflow: hidden;

  /* iPhone vertical photo ratio (REAL) */
  aspect-ratio: 3 / 4;

  /* natural desktop cap (no absurd height) */
  max-height: 720px;

  border-radius: 18px;
  border: 1px solid rgba(255,0,60,.42);

  background:
    radial-gradient(circle at 50% 0%, rgba(255,0,60,.22), transparent 60%),
    radial-gradient(circle at 18% 86%, rgba(90,0,0,.30), transparent 62%),
    linear-gradient(180deg, #020004 0%, #07000b 55%, #020004 100%);

  box-shadow:
    0 0 0 1px rgba(255,0,60,.18) inset,
    0 26px 90px rgba(0,0,0,.9);

  transform: translateZ(0);
  transition: transform .35s ease, box-shadow .35s ease, border-color .35s ease;
}

/* aura + vignette */
.gallery-grid .gallery-card::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 50% 50%, rgba(0,0,0,0) 52%, rgba(0,0,0,.86) 100%),
    radial-gradient(circle at 22% 18%, rgba(255,0,60,.26), transparent 56%),
    radial-gradient(circle at 86% 84%, rgba(120,0,0,.28), transparent 62%);
  pointer-events:none;
  opacity:.98;
}

/* subtle sigil */
.gallery-grid .gallery-card::before{
  content:"⛧";
  position:absolute;
  top: 12px;
  left: 12px;
  font-size: 14px;
  color: rgba(247,241,232,.94);
  text-shadow:
    0 0 12px rgba(255,0,60,.75),
    0 0 2px rgba(0,0,0,1);
  opacity:.9;
  pointer-events:none;
}

/* ===== IMAGE FIT (NO DEFORM) ===== */
.gallery-grid .gallery-card img{
  width:100% !important;
  height:100% !important;
  object-fit: cover !important;
  object-position: center center;
  display:block;
  filter: contrast(1.06) saturate(1.06);
  transform: scale(1.01);
  transition: transform .6s ease, filter .6s ease;
}

/* ===== HOVER — INVOCATION BREATH ===== */
.gallery-grid .gallery-card:hover{
  transform: translateY(-6px);
  border-color: rgba(255,0,60,.85);
  box-shadow:
    0 0 0 1px rgba(255,0,60,.35) inset,
    0 0 54px rgba(255,0,60,.42),
    0 34px 120px rgba(0,0,0,1);
}

.gallery-grid .gallery-card:hover img{
  transform: scale(1.075);
  filter: contrast(1.14) saturate(1.14);
}




/* ===== CALENDAR HERO — CLEAN + SIGNATURE ===== */
.calendar-hero{
  border-radius: 22px;
  border: 1px solid rgba(255,0,70,.35);
  background:
    radial-gradient(1100px 420px at 50% 18%, rgba(255,0,70,.22), transparent 60%),
    linear-gradient(180deg, #000000 0%, #060009 55%, #000000 100%);
  box-shadow:
    0 0 0 1px rgba(255,0,70,.14) inset,
    0 40px 140px rgba(0,0,0,.9);
}
.calendar-hero h1,
.calendar-hero h2,
.calendar-hero h3{
  color:#f7f1e8 !important;
  text-shadow:
    0 0 2px rgba(255,255,255,.65),
    0 0 24px rgba(255,0,70,.45);
  letter-spacing:.22em;
  text-transform:uppercase;
}
.calendar-hero p{
  color:#f7f1e8 !important;
  opacity:.92;
  line-height:1.9;
}



/* ===== CALENDAR SIGIL — FLOATING CIRCLE ===== */
.calendar-sigil img{
  width: 220px;
  height: 220px;
  object-fit: cover;
  border-radius: 50%;
  background: #000;
  box-shadow:
    0 0 0 1px rgba(255,0,70,.45),
    0 0 40px rgba(255,0,70,.55),
    0 30px 90px rgba(0,0,0,.95);
  animation: sigilFloat 7s ease-in-out infinite;
}

/* flotación suave */
@keyframes sigilFloat{
  0%{ transform: translateY(0) }
  50%{ transform: translateY(-12px) }
  100%{ transform: translateY(0) }
}



/* ===== ABOUT SIGIL — CURSED FLOATING SEAL ===== */

.about-sigil img{
  /* forma */
  border-radius: 50% !important;
  border: none !important;
  outline: none !important;

  /* tamaño adaptable */
  width: 220px;
  max-width: 70vw;
  height: auto;

  /* aspecto ritual */
  background: transparent;
  filter:
    contrast(1.15)
    saturate(1.2)
    brightness(0.95);

  /* aura maldita (SIN borde visible) */
  box-shadow:
    0 0 40px rgba(255,0,70,.55),
    0 0 90px rgba(120,0,30,.45),
    0 60px 160px rgba(0,0,0,.95);

  /* flotación */
  animation: sigilFloat 7.5s ease-in-out infinite;

  display: block;
  margin: 0 auto;
  transform-origin: center;
}

/* aura interna oscura */
.about-sigil{
  position: relative;
}

.about-sigil::after{
  content:"";
  position:absolute;
  inset:-18%;
  border-radius:50%;
  background:
    radial-gradient(circle at center,
      rgba(255,0,70,.25) 0%,
      rgba(120,0,40,.18) 35%,
      rgba(0,0,0,.85) 70%,
      rgba(0,0,0,1) 100%
    );
  opacity:.85;
  mix-blend-mode: screen;
  pointer-events:none;
  animation: sigilPulse 6.5s ease-in-out infinite;
}

/* ===== FLOAT ===== */
@keyframes sigilFloat{
  0%{
    transform: translateY(0) scale(1);
  }
  50%{
    transform: translateY(-14px) scale(1.03);
  }
  100%{
    transform: translateY(0) scale(1);
  }
}

/* ===== BLOOD PULSE ===== */
@keyframes sigilPulse{
  0%{
    opacity:.55;
    transform: scale(1);
  }
  50%{
    opacity:.85;
    transform: scale(1.06);
  }
  100%{
    opacity:.55;
    transform: scale(1);
  }
}

/* ===== MOBILE ADJUST ===== */
@media (max-width: 640px){
  .about-sigil img{
    width: 180px;
  }
}



/* ================================
   SPOIL ME HERO — ALTAR OF OFFERING
   ================================ */

.spoil-hero{
  position:relative;
  overflow:hidden;
  border-radius:28px;
  padding: clamp(44px, 5vw, 78px) clamp(18px, 4vw, 56px);
  background:
    radial-gradient(1200px 520px at 50% 12%, rgba(255,0,70,.42), transparent 60%),
    radial-gradient(900px 640px at 78% 86%, rgba(70,0,0,.62), transparent 68%),
    radial-gradient(700px 520px at 18% 82%, rgba(140,0,90,.28), transparent 66%),
    linear-gradient(180deg, #000000 0%, #040008 52%, #000000 100%);
  box-shadow:
    0 0 0 1px rgba(255,0,70,.18) inset,
    0 60px 180px rgba(0,0,0,.95);
}

/* grain + occult scratches */
.spoil-hero::before{
  content:"";
  position:absolute;
  inset:-35%;
  background:
    repeating-linear-gradient(
      0deg,
      rgba(255,255,255,.06) 0px,
      rgba(255,255,255,.06) 1px,
      transparent 2px,
      transparent 5px
    ),
    repeating-linear-gradient(
      90deg,
      rgba(255,0,70,.08) 0px,
      rgba(255,0,70,.08) 1px,
      transparent 2px,
      transparent 7px
    );
  opacity:.55;
  mix-blend-mode:overlay;
  animation: spoilGrain 6.2s steps(2) infinite;
  pointer-events:none;
}

@keyframes spoilGrain{
  0%{transform:translate(0,0)}
  25%{transform:translate(-2%,1%)}
  50%{transform:translate(2%,-2%)}
  75%{transform:translate(-1%,2%)}
  100%{transform:translate(0,0)}
}

/* portal mouth vignette */
.spoil-hero::after{
  content:"";
  position:absolute;
  inset:0;
  background: radial-gradient(circle at 50% 26%, rgba(0,0,0,0) 0 28%, rgba(0,0,0,.92) 78%);
  pointer-events:none;
}

/* layout inside */
.spoil-altar{
  position:relative;
  z-index:2;
  max-width: 980px;
  margin: 0 auto;
  text-align:center;
}

.spoil-paths{
  position:relative;
  z-index:2;
  max-width: 1100px;
  margin: clamp(26px, 3vw, 40px) auto 0;
}

/* ================================
   SIGIL (image)
   ================================ */

.spoil-sigil img{
  width: clamp(120px, 14vw, 200px) !important;
  height: clamp(120px, 14vw, 200px) !important;
  object-fit: cover !important;
  border-radius: 999px !important;
  display:block;
  margin: 0 auto 18px !important;
  filter: contrast(1.06) saturate(1.06);
  box-shadow:
    0 0 0 1px rgba(255,0,70,.22) inset,
    0 0 40px rgba(255,0,70,.22),
    0 24px 90px rgba(0,0,0,.95);
  animation: sigilFloat 7.5s ease-in-out infinite;
  transform: translateZ(0);
}

@keyframes sigilFloat{
  0%{ transform: translateY(0); }
  50%{ transform: translateY(-10px); }
  100%{ transform: translateY(0); }
}

/* ================================
   TEXT (invocation)
   ================================ */

.spoil-invocation{ color:#f7f1e8; }

.spoil-eyebrow{
  font-size: 12px;
  letter-spacing: .55em;
  text-transform: uppercase;
  opacity: .92;
  text-shadow: 0 0 20px rgba(255,0,70,.35);
  margin-bottom: 12px;
}

.spoil-title{
  margin: 0 0 16px 0;
  font-size: clamp(44px, 5.5vw, 82px);
  letter-spacing: .24em;
  text-transform: uppercase;
  color:#f7f1e8;
  text-shadow:
    0 0 2px rgba(255,255,255,.85),
    0 0 28px rgba(255,0,70,.75),
    0 0 86px rgba(255,0,70,.55);
}

.spoil-ritual-divider{
  display:flex;
  align-items:center;
  justify-content:center;
  gap: 18px;
  margin: 18px 0 22px;
}

.spoil-ritual-divider .line{
  width: 150px;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255,0,70,1), transparent);
  box-shadow: 0 0 26px rgba(255,0,70,.85);
}

.spoil-ritual-divider .sigil{
  color:#f7f1e8;
  text-shadow: 0 0 28px rgba(255,0,70,1);
  letter-spacing:.2em;
}

.spoil-sub{
  margin: 0 auto 14px;
  max-width: 760px;
  font-size: clamp(15px, 1.2vw, 18px);
  line-height: 1.9;
  color:#f7f1e8;
  text-shadow: 0 0 22px rgba(0,0,0,.95);
}

.spoil-micro{
  margin: 0;
  font-size: 11px;
  letter-spacing: .34em;
  text-transform: uppercase;
  opacity: .86;
}




/* =========================
   SPOIL ME — RUNES GRID (4)
   ========================= */

.spoil-rune-grid{
  display:grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 22px;
  align-items: stretch;
  max-width: 1200px;
  margin: 0 auto;
}

/* Tablet */
@media (max-width: 1024px){
  .spoil-rune-grid{ grid-template-columns: repeat(2, minmax(0,1fr)); }
}

/* Mobile */
@media (max-width: 640px){
  .spoil-rune-grid{ grid-template-columns: 1fr; }
}

/* =========================
   RUNE SLOT — TAROT SIZE
   ========================= */

.rune-slot{
  position:relative;
  overflow:hidden;
  border-radius: 18px;

  /* 🔮 TAROT / CARTA VERTICAL */
  aspect-ratio: 2.75 / 4.75;

  border: 1px solid rgba(255,0,70,.22);
  background:
    radial-gradient(circle at 50% 10%, rgba(255,0,70,.14), transparent 60%),
    linear-gradient(180deg, rgba(0,0,0,.82), rgba(0,0,0,.55));
  box-shadow:
    0 0 0 1px rgba(255,0,70,.10) inset,
    0 26px 90px rgba(0,0,0,.9);
  transform: translateZ(0);
}

/* aura/vignette */
.rune-slot::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 50% 50%, rgba(0,0,0,0) 45%, rgba(0,0,0,.90) 100%),
    radial-gradient(circle at 20% 20%, rgba(255,0,70,.20), transparent 55%),
    radial-gradient(circle at 85% 85%, rgba(90,0,0,.28), transparent 62%);
  opacity:.95;
  pointer-events:none;
}

/* tiny corner sigils */
.rune-slot::before{
  content:"⛧";
  position:absolute;
  top:12px;
  left:12px;
  font-size:12px;
  color: rgba(247,241,232,.92);
  text-shadow: 0 0 16px rgba(255,0,70,.75);
  opacity:.8;
  pointer-events:none;
}

/* =========================
   IMAGE behavior
   ========================= */

.rune-slot .rune-img img{
  width:100% !important;
  height:100% !important;
  object-fit: cover !important;
  object-position: center center;
  display:block;
  filter: contrast(1.08) saturate(1.10);
  transform: scale(1.01);
  transition: transform .55s ease, filter .55s ease;
}

.rune-slot .rune-img{
  cursor: pointer;
}

/* =========================
   HOVER — runes ignite
   ========================= */

.rune-slot:hover{
  border-color: rgba(255,0,70,.65);
  box-shadow:
    0 0 0 1px rgba(255,0,70,.22) inset,
    0 0 46px rgba(255,0,70,.28),
    0 34px 120px rgba(0,0,0,1);
  transform: translateY(-6px);
  transition: transform .28s ease, box-shadow .28s ease, border-color .28s ease;
}

.rune-slot:hover .rune-img img{
  transform: scale(1.07);
  filter: contrast(1.18) saturate(1.18);
}

/* breathing glow */
.rune-slot{
  animation: runeBreath 6.8s ease-in-out infinite;
}
@keyframes runeBreath{
  0%{ box-shadow: 0 0 0 1px rgba(255,0,70,.10) inset, 0 26px 90px rgba(0,0,0,.9); }
  50%{ box-shadow: 0 0 0 1px rgba(255,0,70,.18) inset, 0 0 34px rgba(255,0,70,.14), 0 30px 110px rgba(0,0,0,1); }
  100%{ box-shadow: 0 0 0 1px rgba(255,0,70,.10) inset, 0 26px 90px rgba(0,0,0,.9); }
}

/* =========================
   RUNE LABEL — BONE TEXT
   ========================= */

.rune-slot .rune-label{
  position:absolute;
  left: 14px;
  right: 14px;
  bottom: 18px;
  margin:0 !important;
  padding:0 !important;

  background: transparent !important;
  border: none !important;

  text-align:center;
  text-transform: uppercase;

  font-family: "Cinzel", "Cormorant Garamond", serif;
  font-weight: 700;
  font-size: 14px;
  letter-spacing: .42em;
  line-height: 1.1;

  /* 🦴 BLANCO HUESO */
  color: #f7f1e8 !important;

  -webkit-text-stroke: 0.6px rgba(0,0,0,.75);

  text-shadow:
    0 0 2px rgba(0,0,0,1),
    0 0 14px rgba(255,0,70,.45),
    0 0 32px rgba(255,0,70,.30),
    0 12px 30px rgba(0,0,0,.9);

  pointer-events:none;
}

/* sigils flanking text */
.rune-slot .rune-label::before,
.rune-slot .rune-label::after{
  content:"⛧";
  display:inline-block;
  transform: translateY(-1px);
  font-size: 12px;
  margin: 0 12px;
  color: #f7f1e8;
  text-shadow:
    0 0 14px rgba(255,0,70,.75),
    0 0 2px rgba(0,0,0,1);
  opacity: .95;
}

/* hover: text bleeds aura, stays bone */
.rune-slot:hover .rune-label{
  text-shadow:
    0 0 2px rgba(0,0,0,1),
    0 0 18px rgba(255,0,70,.75),
    0 0 46px rgba(255,0,70,.45),
    0 16px 36px rgba(0,0,0,.95);
}/* End custom CSS */