/*
Theme Name: Mell d'Figueira - Oráculos e Magias
Theme URI: https://melldfigueira.com.br
Author: BR&CO
Author URI: https://brco.com.br
Description: Tema de página única para Mell d'Figueira - Oráculos e Magias. Layout elegante e minimalista com regras de atendimento, catálogo de preços e catálogo de feitiços. Cores em preto, dourado e lilás, tipografia serifada, totalmente responsivo.
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: mell-dfigueira
*/

/* ===================== RESET ===================== */
*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0;
  background:#040504;
  background:linear-gradient(180deg,
    #030402 0%,
    #0a100a 12%,
    #182015 28%,
    #263524 46%,
    #2c3d27 58%,
    #1c2818 74%,
    #0a0f08 90%,
    #030402 100%
  );
  color:#e9e3d3;
  font-family:"Cormorant Garamond","EB Garamond",Georgia,serif;
  font-size:18px;
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
ul{ list-style:none; margin:0; padding:0; }
h1,h2,h3,h4{ margin:0; font-weight:500; }
.container{ max-width:1080px; margin:0 auto; padding:0 24px; }

/* ===================== TOKENS ===================== */
:root{
  --bg:#040504;
  --bg2:#070a08;
  --panel-line:rgba(201,162,55,0.32);
  --gold:#c9a24a;
  --gold-soft:#a9873c;
  --lilac:#b6a0d8;
  --ink:#e9e3d3;
  --ink-dim:#b9b3a2;
  --serif-title:"Cinzel", Georgia, serif;
  --serif-body:"Cormorant Garamond","EB Garamond",Georgia,serif;
  --sans:"Josefin Sans","Helvetica Neue",Helvetica,Arial,sans-serif;
}

/* ===================== BACKGROUND TEXTURE ===================== */
.mell-site{
  position:relative;
  background:
    radial-gradient(ellipse at 15% 0%, rgba(182,160,216,0.08), transparent 40%),
    radial-gradient(ellipse at 90% 8%, rgba(201,162,55,0.07), transparent 40%),
    linear-gradient(180deg,
      #030402 0%,
      #0a100a 12%,
      #182015 28%,
      #263524 46%,
      #2c3d27 58%,
      #1c2818 74%,
      #0a0f08 90%,
      #030402 100%
    );
}
.mell-site::before{
  content:"";
  position:fixed; inset:0; pointer-events:none; z-index:0;
  background-image:
    radial-gradient(1px 1px at 6% 10%, rgba(233,227,211,0.35), transparent 60%),
    radial-gradient(1px 1px at 24% 4%, rgba(233,227,211,0.25), transparent 60%),
    radial-gradient(1px 1px at 76% 8%, rgba(233,227,211,0.3), transparent 60%),
    radial-gradient(1px 1px at 92% 22%, rgba(233,227,211,0.2), transparent 60%),
    radial-gradient(1px 1px at 58% 2%, rgba(233,227,211,0.22), transparent 60%),
    radial-gradient(1px 1px at 10% 70%, rgba(233,227,211,0.2), transparent 60%),
    radial-gradient(1px 1px at 88% 60%, rgba(233,227,211,0.22), transparent 60%),
    radial-gradient(1px 1px at 96% 90%, rgba(233,227,211,0.18), transparent 60%);
}

/* ===================== ORNAMENTS ===================== */
.ornament{ display:flex; align-items:center; justify-content:center; gap:10px; color:var(--gold); margin-bottom:14px; }
.ornament .line{ height:1px; width:60px; background:linear-gradient(90deg, transparent, var(--gold-soft)); }
.ornament .line.r{ background:linear-gradient(90deg, var(--gold-soft), transparent); }
.ornament .ornament-sym{ font-size:14px; letter-spacing:2px; transform:translateY(-1px); }
.mell-svg-icon{ display:inline-block; vertical-align:middle; fill:none; stroke:currentColor; }
.panel-title .ic{ display:inline-flex; }
.price-icon{ display:flex; align-items:center; justify-content:center; }
.mell-footer .moon{ display:flex; justify-content:center; }
.footer-mark{ width:34px; height:34px; object-fit:contain; opacity:.9; filter:drop-shadow(0 0 5px rgba(182,160,216,0.25)); }

.divider-wave{ width:100%; max-width:220px; margin:0 auto; opacity:.65; }

.section-eyebrow{
  font-family:var(--sans); font-size:11px; letter-spacing:4px; color:var(--lilac);
  text-align:center; margin-bottom:10px; text-transform:uppercase;
}
.section-title{
  text-align:center; font-family:var(--serif-title); font-weight:500; letter-spacing:3px;
  font-size:clamp(24px,4vw,34px); color:var(--ink); margin-bottom:6px;
}
.section-title .accent{ color:var(--gold); }
.title-rule{
  width:120px; height:1px; margin:14px auto 46px auto;
  background:linear-gradient(90deg, transparent, var(--gold), transparent);
  position:relative;
}
.title-rule::before{
  content:"✦"; position:absolute; left:50%; top:50%; transform:translate(-50%,-52%);
  font-size:12px; color:var(--gold); background:var(--bg); padding:0 8px;
}

/* ===================== HEADER / NAV ===================== */
.mell-header{
  position:sticky; top:0; z-index:50;
  background:rgba(10,15,12,0.86);
  backdrop-filter:blur(6px);
  border-bottom:1px solid var(--panel-line);
}
.mell-header .container{
  display:flex; align-items:center; justify-content:space-between;
  height:76px;
}
.mell-logo{ display:flex; align-items:center; gap:12px; }
.mell-logo-mark{ width:44px; height:44px; object-fit:contain; filter:drop-shadow(0 0 6px rgba(201,162,55,0.35)); }
.mell-logo-text{ font-family:var(--serif-title); font-size:16px; letter-spacing:3px; color:var(--gold); line-height:1.3; }
.mell-logo-text span{ display:block; font-size:8px; letter-spacing:3px; color:var(--lilac); margin-top:3px; font-family:var(--sans); }

.mell-nav ul{ display:flex; gap:26px; flex-wrap:nowrap; }
.mell-nav a{
  font-family:var(--sans); font-size:11px; letter-spacing:1.6px; color:var(--ink-dim);
  text-transform:uppercase; transition:color .25s ease; position:relative;
}
.mell-nav a:hover{ color:var(--gold); }

.mell-cta-btn{
  display:inline-block; font-family:var(--sans); font-size:11px; letter-spacing:1.8px;
  color:#0a0f0c !important; background:linear-gradient(180deg,#dab958,var(--gold));
  padding:12px 22px; border-radius:2px; text-transform:uppercase;
  box-shadow:0 4px 18px rgba(201,162,55,0.25);
  transition:transform .2s ease, box-shadow .2s ease;
}
.mell-cta-btn:hover{ transform:translateY(-1px); box-shadow:0 6px 22px rgba(201,162,55,0.4); }
.mell-cta-btn.ghost{
  background:transparent; color:var(--gold) !important; border:1px solid var(--gold);
  box-shadow:none;
}

/* mobile nav toggle (pure CSS, no JS dependency) */
.nav-toggle{ display:none; }
.nav-toggle-label{ display:none; cursor:pointer; color:var(--gold); font-size:26px; line-height:1; z-index:2; padding:9px; margin:-9px; }
.nav-backdrop{
  display:none; position:fixed; inset:0; z-index:45;
  background:rgba(2,3,2,0.55); backdrop-filter:blur(2px);
  opacity:0; visibility:hidden; transition:opacity .3s ease, visibility .3s ease;
}

@media (max-width:860px){
  .mell-nav{
    position:absolute; top:100%; left:0; right:0; z-index:46;
    background:rgba(8,12,9,0.98); border-bottom:1px solid var(--panel-line);
    max-height:0; overflow:hidden; opacity:0;
    transition:max-height .4s cubic-bezier(.2,.7,.3,1), opacity .3s ease;
  }
  .mell-nav ul{ flex-direction:column; gap:0; padding:6px 24px 18px 24px; }
  .mell-nav ul li{ border-bottom:1px solid rgba(201,162,55,0.12); }
  .mell-nav a{ display:block; padding:16px 2px; font-size:12px; }
  .nav-toggle:checked ~ .mell-nav{ max-height:420px; opacity:1; }
  .nav-toggle:checked ~ .nav-backdrop{ display:block; opacity:1; visibility:visible; }
  .nav-toggle-label{ display:block; }
  .header-cta{ display:none; }
}

/* ===================== HERO ===================== */
.hero{
  position:relative; z-index:1;
  padding:70px 24px 90px 24px; text-align:center;
  overflow:hidden;
}
.hero-stars{ position:absolute; inset:0; pointer-events:none; z-index:0; }
.hero-stars .tw{
  position:absolute; width:3px; height:3px; border-radius:50%;
  background:var(--gold); opacity:0;
  box-shadow:0 0 6px 1px rgba(201,162,55,0.6);
  animation:twinkle 4.5s ease-in-out infinite;
}
.hero-stars .tw.lilac{ background:var(--lilac); box-shadow:0 0 6px 1px rgba(182,160,216,0.6); }
@keyframes twinkle{
  0%,100%{ opacity:0; transform:scale(.4); }
  50%{ opacity:1; transform:scale(1); }
}

.hero-emblem-wrap{
  position:relative; width:min(78vw, 300px); margin:0 auto 18px auto;
}
.hero-emblem-wrap::before{
  content:""; position:absolute; inset:-10%;
  background:radial-gradient(circle, rgba(201,162,55,0.16) 0%, rgba(201,162,55,0.06) 45%, transparent 72%);
  filter:blur(22px);
  animation:glowPulse 5s ease-in-out infinite;
  z-index:0;
}
.hero-emblem{
  position:relative; z-index:1;
  width:100%; display:block;
  filter:drop-shadow(0 6px 26px rgba(0,0,0,0.55));
  animation:floatY 6s ease-in-out infinite;
}
@keyframes floatY{
  0%,100%{ transform:translateY(0); }
  50%{ transform:translateY(-10px); }
}
@keyframes glowPulse{
  0%,100%{ opacity:.75; transform:scale(1); }
  50%{ opacity:1; transform:scale(1.06); }
}
@media (prefers-reduced-motion: reduce){
  .hero-emblem, .hero-emblem-wrap::before, .hero-stars .tw{ animation:none !important; }
}
.hero .brand-name{
  font-family:var(--serif-title); font-weight:600; letter-spacing:6px; color:var(--gold);
  font-size:clamp(30px,6vw,52px);
}
.hero .brand-sub{
  font-family:var(--sans); font-size:clamp(10px,1.6vw,13px); letter-spacing:6px; color:var(--lilac);
  margin-top:12px;
}
.hero .lede{
  max-width:560px; margin:34px auto 10px auto; font-style:italic; color:var(--ink);
  font-size:clamp(17px,2.4vw,21px); line-height:1.6;
}
.hero .tagline{
  font-family:var(--sans); font-size:11px; letter-spacing:5px; color:var(--gold-soft);
  margin-top:22px;
}
.hero-cta{ margin-top:40px; display:flex; gap:16px; justify-content:center; flex-wrap:wrap; }

/* ===================== GENERIC SECTION ===================== */
.section{ position:relative; z-index:1; padding:90px 0; }
.section.alt{ background:rgba(255,255,255,0.012); border-top:1px solid var(--panel-line); border-bottom:1px solid var(--panel-line); }

/* ===================== PANEL ===================== */
.panel{
  border:1px solid var(--panel-line);
  background:rgba(201,162,55,0.025);
  border-radius:3px;
  padding:34px 32px;
}
.panel-title{
  font-family:var(--sans); font-weight:500; font-size:14px; letter-spacing:2px;
  color:var(--gold); margin-bottom:18px; display:flex; align-items:center; gap:10px;
}
.panel-title .ic{ color:var(--lilac); font-size:14px; }

/* ---- regras grid ---- */
.grid-2{ display:grid; grid-template-columns:1fr 1fr; gap:28px; margin-bottom:28px; }
.rule-item{ margin-bottom:20px; }
.rule-item:last-child{ margin-bottom:0; }
.rule-label{ font-family:var(--sans); font-weight:600; font-size:13px; letter-spacing:.6px; text-transform:uppercase; margin-bottom:6px; }
.rule-text{ color:var(--ink-dim); font-size:17px; line-height:1.55; }

.fee-value{
  font-family:var(--serif-title); font-size:34px; color:var(--gold); font-weight:500;
  border:1px solid var(--panel-line); border-radius:3px; text-align:center;
  padding:16px 0; margin:16px 0 18px 0; background:rgba(201,162,55,0.05);
}
.fee-value sup{ font-size:15px; margin-right:4px; color:var(--lilac); }

.checklist{ counter-reset:steps; }
.checklist li{
  counter-increment:steps; display:flex; align-items:flex-start; gap:16px;
  margin-bottom:20px; color:var(--ink-dim); font-size:17px; line-height:1.5;
}
.checklist li:last-child{ margin-bottom:0; }
.checklist li::before{
  content:counter(steps); flex:0 0 auto; width:30px; height:30px; border-radius:50%;
  border:1px solid var(--gold); color:var(--gold); font-family:var(--sans); font-size:12px;
  display:flex; align-items:center; justify-content:center; margin-top:1px;
}

.quote-box{
  text-align:center; margin-top:44px; padding:26px 20px;
  border-top:1px solid var(--panel-line); border-bottom:1px solid var(--panel-line);
}
.quote-box p{ font-style:italic; font-size:19px; color:var(--lilac); }

/* ---- preços list ---- */
.price-list{ max-width:760px; margin:0 auto; }
.price-row{
  display:flex; align-items:center; gap:16px; padding:20px 4px;
  border-bottom:1px solid rgba(201,162,55,0.2);
}
.price-row:first-child{ border-top:1px solid rgba(201,162,55,0.2); }
.price-icon{ flex:0 0 auto; width:30px; text-align:center; color:var(--gold); font-size:16px; }
.price-name{ font-family:var(--sans); font-weight:500; font-size:15px; letter-spacing:1.4px; color:var(--ink); white-space:nowrap; }
.price-dots{ flex:1 1 auto; border-bottom:1px dotted rgba(185,179,162,0.4); transform:translateY(-4px); min-width:20px; }
.price-amount{ font-family:var(--serif-title); font-weight:600; font-size:19px; color:var(--gold); white-space:nowrap; }
.price-amount .rs{ font-size:12px; color:var(--gold-soft); margin-right:2px; }

.mell-quote{
  margin-top:56px; text-align:center; padding:30px 40px; max-width:640px; margin-left:auto; margin-right:auto;
  border:1px solid var(--panel-line); border-radius:3px; background:rgba(182,160,216,0.03);
}
.mell-quote p{ font-style:italic; font-size:19px; line-height:1.6; color:var(--ink); }
.mell-quote .sign{ display:block; margin-top:14px; font-family:var(--sans); font-style:normal; font-size:11px; letter-spacing:3px; color:var(--gold-soft); }

/* ---- feitiços ---- */
.three-col{ display:grid; grid-template-columns:1fr 1fr 1fr; gap:24px; margin-bottom:56px; }
.simple-list li{
  display:flex; justify-content:space-between; align-items:baseline; font-size:16px; color:var(--ink-dim);
  padding:8px 0; border-bottom:1px dotted rgba(185,179,162,0.25); font-family:var(--sans);
}
.simple-list li:last-child{ border-bottom:none; }
.simple-list li .v{ color:var(--gold); font-family:var(--serif-title); font-size:14px; }
.oils-note{ font-family:var(--sans); font-size:11px; letter-spacing:1.4px; color:var(--lilac); margin-bottom:10px; }

.combo-box{
  margin-top:18px; text-align:center; padding:16px; border-radius:3px;
  border:1px solid var(--panel-line); background:rgba(201,162,55,0.05);
}
.combo-box .lbl{ font-family:var(--sans); font-size:13px; color:var(--ink-dim); letter-spacing:.4px; }
.combo-box .val{ font-family:var(--serif-title); font-size:22px; color:var(--gold); margin-top:6px; }

.important-panel p{ font-size:15.5px; line-height:1.6; color:var(--ink-dim); margin-bottom:14px; }
.important-panel p:last-child{ margin-bottom:0; }
.important-panel .em{ color:var(--gold); font-weight:600; font-family:"EB Garamond",serif; }

.spells-heading{
  text-align:center; font-family:var(--serif-title); font-weight:500; font-size:19px;
  letter-spacing:3px; color:var(--gold); margin:0 0 34px 0;
}
.spell-grid{ display:grid; grid-template-columns:1fr 1fr 1fr; gap:32px; }
.spell-col{ overflow:hidden; }
.spell-row{
  display:flex; justify-content:space-between; align-items:center; gap:12px;
  padding:10px 0; border-bottom:1px solid rgba(201,162,55,0.16); font-size:15.5px;
}
.spell-row .n{ color:var(--ink); font-family:var(--sans); }
.spell-row .p{ font-family:var(--serif-title); font-size:14.5px; color:var(--gold); white-space:nowrap; flex:0 0 auto; }
.spell-row.extra-row{
  max-height:0; opacity:0; padding-top:0; padding-bottom:0; border-bottom-color:transparent;
  overflow:hidden; transition:max-height .5s ease, opacity .4s ease, padding .5s ease;
}
.spell-grid.expanded .spell-row.extra-row{
  max-height:60px; opacity:1; padding:10px 0; border-bottom-color:rgba(201,162,55,0.16);
}
.spell-toggle-wrap{ text-align:center; margin-top:26px; }
.spell-toggle-btn{
  font-family:var(--sans); font-size:11px; letter-spacing:1.6px; color:var(--gold);
  background:transparent; border:1px solid var(--panel-line); border-radius:20px;
  padding:11px 26px; cursor:pointer; text-transform:uppercase;
  transition:border-color .3s ease, color .3s ease, background .3s ease;
}
.spell-toggle-btn:hover{ border-color:var(--gold); background:rgba(201,162,55,0.06); }
.spell-toggle-btn:active{ transform:scale(.97); }
.spell-toggle-btn .arrow{ display:inline-block; margin-left:6px; transition:transform .3s ease; }
.spell-toggle-wrap.is-expanded .spell-toggle-btn .arrow{ transform:rotate(180deg); }

.abuse-box{
  margin-top:36px; text-align:center; padding:26px 28px; max-width:640px; margin-left:auto; margin-right:auto;
  border:1px solid var(--lilac); border-radius:3px; background:rgba(182,160,216,0.06);
}
.abuse-box .t{ font-size:16px; font-family:var(--sans); color:var(--ink); line-height:1.5; }
.abuse-box .p{ font-family:var(--serif-title); font-size:25px; color:var(--lilac); margin-top:8px; }

/* ---- contato ---- */
.contact-wrap{ text-align:center; max-width:620px; margin:0 auto; }
.contact-wrap p{ color:var(--ink-dim); font-size:18px; margin-bottom:34px; line-height:1.6; }
.contact-buttons{ display:flex; gap:18px; justify-content:center; flex-wrap:wrap; margin-bottom:30px; }
.social-line{ font-family:var(--sans); font-size:12px; letter-spacing:2px; color:var(--lilac); }
.social-line a{ color:var(--lilac); border-bottom:1px solid rgba(182,160,216,0.4); padding-bottom:2px; }

/* ===================== FOOTER ===================== */
.mell-footer{
  position:relative; z-index:1; text-align:center; padding:50px 24px 40px 24px;
  border-top:1px solid var(--panel-line);
}
.mell-footer .rule{ width:160px; height:1px; margin:0 auto 18px auto; background:linear-gradient(90deg, transparent, rgba(201,162,55,0.6), transparent); }
.mell-footer .tagline{ font-family:var(--sans); font-size:11px; letter-spacing:4px; color:var(--gold-soft); }
.mell-footer .moon{ color:var(--lilac); font-size:16px; margin-top:12px; }
.mell-footer .credit{ margin-top:22px; font-size:12px; font-family:var(--sans); color:rgba(185,179,162,0.5); letter-spacing:.4px; }

/* ===================== SCROLL REVEAL ===================== */
.reveal{
  opacity:0; transform:translateY(28px);
  transition:opacity .8s cubic-bezier(.2,.7,.3,1), transform .8s cubic-bezier(.2,.7,.3,1);
}
.reveal.in-view{ opacity:1; transform:translateY(0); }
.reveal-stagger.in-view .stagger-item{ opacity:1; transform:translateY(0); }
.stagger-item{
  opacity:0; transform:translateY(16px);
  transition:opacity .6s ease, transform .6s ease;
}
.stagger-item:nth-child(1){ transition-delay:.02s; }
.stagger-item:nth-child(2){ transition-delay:.08s; }
.stagger-item:nth-child(3){ transition-delay:.14s; }
.stagger-item:nth-child(4){ transition-delay:.2s; }
.stagger-item:nth-child(5){ transition-delay:.26s; }
.stagger-item:nth-child(6){ transition-delay:.32s; }
.stagger-item:nth-child(7){ transition-delay:.38s; }
.stagger-item:nth-child(8){ transition-delay:.44s; }
@media (prefers-reduced-motion: reduce){
  .reveal, .stagger-item{ opacity:1 !important; transform:none !important; transition:none !important; }
}

/* ===================== BACK TO TOP / WHATSAPP FLOAT ===================== */
.back-to-top{
  position:fixed; right:22px; bottom:22px; z-index:60;
  width:46px; height:46px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background:rgba(10,15,12,0.85); border:1px solid var(--panel-line);
  color:var(--gold); opacity:0; visibility:hidden; transform:translateY(10px);
  transition:opacity .3s ease, transform .3s ease, visibility .3s, border-color .3s ease, bottom .3s ease;
  backdrop-filter:blur(6px);
  bottom:calc(22px + env(safe-area-inset-bottom, 0px));
  right:calc(22px + env(safe-area-inset-right, 0px));
}
.back-to-top.show{ opacity:1; visibility:visible; transform:translateY(0); }
.back-to-top.stacked{ bottom:calc(84px + env(safe-area-inset-bottom, 0px)); }
.back-to-top:hover{ border-color:var(--gold); }
.back-to-top:active{ transform:scale(.92); }
.back-to-top svg{ width:16px; height:16px; }

.whatsapp-float{
  position:fixed; right:22px; bottom:22px; z-index:59;
  width:52px; height:52px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background:#25D366; color:#0a0f0c;
  box-shadow:0 6px 20px rgba(0,0,0,0.4);
  opacity:0; visibility:hidden; transform:scale(.7);
  transition:opacity .3s ease, transform .3s ease, visibility .3s;
  right:calc(22px + env(safe-area-inset-right, 0px));
  bottom:calc(22px + env(safe-area-inset-bottom, 0px));
}
.whatsapp-float.show{ opacity:1; visibility:visible; transform:scale(1); }
.whatsapp-float:active{ transform:scale(.92); }
.whatsapp-float svg{ width:24px; height:24px; }
.whatsapp-float::before{
  content:""; position:absolute; inset:0; border-radius:50%;
  box-shadow:0 0 0 0 rgba(37,211,102,0.55);
  animation:waPulse 2.6s ease-out infinite;
}
@keyframes waPulse{
  0%{ box-shadow:0 0 0 0 rgba(37,211,102,0.5); }
  70%{ box-shadow:0 0 0 14px rgba(37,211,102,0); }
  100%{ box-shadow:0 0 0 0 rgba(37,211,102,0); }
}
@media (prefers-reduced-motion: reduce){
  .whatsapp-float::before{ animation:none; }
}

/* ===================== HEADER SHRINK ON SCROLL ===================== */
.mell-header{ transition:height .3s ease, background .3s ease; }
.mell-header.is-scrolled .container{ height:60px; }
.mell-header.is-scrolled{ box-shadow:0 8px 24px rgba(0,0,0,0.35); }

/* ===================== NAV LINK UNDERLINE ===================== */
.mell-nav a{ position:relative; }
.mell-nav a::after{
  content:""; position:absolute; left:0; bottom:6px; width:0; height:1px;
  background:var(--gold); transition:width .3s ease;
}
.mell-nav a:hover::after{ width:100%; }
.mell-nav a.active{ color:var(--gold); }
.mell-nav a.active::after{ width:100%; }

/* ===================== BUTTON SHINE ===================== */
.mell-cta-btn{ position:relative; overflow:hidden; }
.mell-cta-btn::before{
  content:""; position:absolute; top:0; left:-60%; width:40%; height:100%;
  background:linear-gradient(120deg, transparent, rgba(255,255,255,0.45), transparent);
  transform:skewX(-20deg);
  transition:left .6s ease;
}
.mell-cta-btn:hover::before{ left:130%; }

/* ===================== CARD / ROW HOVER ===================== */
.panel{ transition:transform .35s ease, border-color .35s ease, box-shadow .35s ease; }
.panel:hover{ transform:translateY(-4px); border-color:rgba(201,162,55,0.6); box-shadow:0 14px 34px rgba(0,0,0,0.35); }
.panel:active{ transform:translateY(-1px) scale(.99); }

.price-row{ transition:background .3s ease, padding-left .3s ease; cursor:default; }
.price-row:hover{ background:rgba(201,162,55,0.045); padding-left:8px; }
.price-row:active{ background:rgba(201,162,55,0.09); }
.price-row:hover .price-amount{ color:#e2c26f; }
.price-amount{ transition:color .3s ease; }

.spell-row{ transition:background .3s ease, padding-left .3s ease; }
.spell-row:hover{ background:rgba(201,162,55,0.045); padding-left:6px; }
.spell-row:active{ background:rgba(201,162,55,0.09); }

.simple-list li{ transition:padding-left .3s ease, color .3s ease; }
.simple-list li:hover{ padding-left:6px; color:var(--ink); }

.mell-cta-btn:active{ transform:scale(.97); }
.about-photo:active{ transform:translateY(-1px) scale(.99); }

/* ===================== TITLE RULE SPARKLE ===================== */
.title-rule::before{ animation:sparklePulse 2.6s ease-in-out infinite; }
@keyframes sparklePulse{
  0%,100%{ opacity:.6; transform:translate(-50%,-52%) scale(.9); }
  50%{ opacity:1; transform:translate(-50%,-52%) scale(1.15); }
}

/* ===================== FOOTER MARK GLOW ===================== */
.footer-mark{ animation:footerGlow 5s ease-in-out infinite; }
@keyframes footerGlow{
  0%,100%{ filter:drop-shadow(0 0 5px rgba(182,160,216,0.25)); }
  50%{ filter:drop-shadow(0 0 12px rgba(182,160,216,0.55)); }
}

/* ===================== ZOOM / LIGHTBOX ===================== */
.zoomable{ cursor:zoom-in; }
.lightbox{
  position:fixed; inset:0; z-index:100;
  display:flex; align-items:center; justify-content:center;
  padding:32px;
  background:rgba(2,3,2,0.9); backdrop-filter:blur(4px);
  opacity:0; visibility:hidden;
  transition:opacity .3s ease, visibility .3s ease;
}
.lightbox.show{ opacity:1; visibility:visible; }
.lightbox img{
  max-width:min(92vw, 560px); max-height:86vh; width:auto;
  border:1px solid var(--panel-line);
  box-shadow:0 20px 60px rgba(0,0,0,0.6);
  transform:scale(.96); transition:transform .35s cubic-bezier(.2,.7,.3,1);
}
.lightbox.show img{ transform:scale(1); }
.lightbox-close{
  position:absolute; top:20px; right:20px; z-index:2;
  width:42px; height:42px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background:rgba(10,15,12,0.7); border:1px solid var(--panel-line); color:var(--ink);
  cursor:pointer;
}
.lightbox-close svg{ width:16px; height:16px; }
.lightbox-close:active{ transform:scale(.92); }

/* ---- sobre / bio ---- */
.about-grid{
  display:grid; grid-template-columns:300px 1fr; gap:56px; align-items:center;
  margin-bottom:52px;
}
.about-photo{
  position:relative; padding:12px;
  border:1px solid var(--panel-line); background:rgba(201,162,55,0.025);
  transition:transform .4s ease, border-color .4s ease;
}
.about-photo:hover{ transform:translateY(-4px); border-color:rgba(201,162,55,0.55); }
.about-photo::before,.about-photo::after{
  content:""; position:absolute; width:16px; height:16px; border:1px solid var(--gold);
}
.about-photo::before{ top:4px; left:4px; border-right:none; border-bottom:none; }
.about-photo::after{ bottom:4px; right:4px; border-left:none; border-top:none; }
.about-photo img{
  width:100%; display:block; filter:saturate(1.05) contrast(1.03);
}
.about-role{
  font-family:var(--sans); font-size:15px; letter-spacing:2.4px; color:var(--gold);
  margin-bottom:18px;
}
.about-text{ color:var(--ink-dim); font-size:17px; line-height:1.65; margin-bottom:18px; }
.about-text:last-child{ margin-bottom:0; }
.about-text strong{ color:var(--ink); font-weight:600; font-family:"EB Garamond",serif; }
.about-tags{ display:flex; flex-wrap:wrap; gap:10px; margin-bottom:18px; }
.about-tags span{
  font-family:var(--sans); font-size:10.5px; letter-spacing:1.4px; color:var(--lilac);
  border:1px solid rgba(182,160,216,0.4); border-radius:20px; padding:7px 16px;
  transition:border-color .3s ease, color .3s ease;
}
.about-tags span:hover{ border-color:var(--lilac); color:#cdb9e8; }

/* ===================== RESPONSIVE ===================== */
@media (max-width:900px){
  .grid-2, .three-col, .spell-grid{ grid-template-columns:1fr; }
  .about-grid{ grid-template-columns:1fr; gap:32px; }
  .about-photo{ max-width:280px; margin:0 auto; }
  .spell-col.stagger-item + .spell-col.stagger-item{ margin-top:6px; }
}
@media (max-width:600px){
  .container{ padding:0 18px; }
  .section{ padding:56px 0; }
  .panel{ padding:24px 20px; }
  .price-row{ flex-wrap:nowrap; padding:16px 0; gap:10px; }
  .price-name{ font-size:12.5px; letter-spacing:1px; }
  .price-icon{ width:22px; }
  .hero{ padding:56px 20px 70px 20px; }
  .hero-cta{ flex-direction:column; align-items:stretch; gap:12px; }
  .hero-cta .mell-cta-btn{ text-align:center; }
  .contact-buttons{ flex-direction:column; align-items:stretch; }
  .contact-buttons .mell-cta-btn{ text-align:center; }
  .about-tags{ justify-content:center; }
  .spells-heading{ font-size:16px; letter-spacing:2px; }
  .mell-quote, .quote-box, .abuse-box{ padding-left:22px; padding-right:22px; }
}
@media (max-width:400px){
  .brand-name{ letter-spacing:3px; }
  .mell-logo-text{ font-size:13px; }
  .mell-logo-mark{ width:36px; height:36px; }
  .section-title{ letter-spacing:2px; }
  .price-dots{ display:none; }
  .price-row{ justify-content:space-between; }
  .spell-row{ font-size:14px; }
}

/* Touch devices: skip hover-lift, rely on :active feedback instead */
@media (hover:none){
  .panel:hover{ transform:none; box-shadow:none; }
  .price-row:hover{ background:transparent; padding-left:0; }
  .price-row:hover .price-amount{ color:var(--gold); }
  .spell-row:hover{ background:transparent; padding-left:0; }
  .about-photo:hover{ transform:none; }
}