/* --- Palette Verde sobria (no bling) --- */
    :root{
      --paper:#f4f7f5;        /* avorio-verde tenue */
      --ink:#0e1412;          /* testo */
      --g1:#0f5a44;           /* verde principale */
      --g2:#0c4534;           /* verde scuro */
      --g3:#2d6f5b;           /* verde medio per titoli secondari */
      --mint:#e6f2ed;         /* luce fredda */
      --brass:#9a8656;        /* ottone spento (non oro lucido) */
      --shadow:0 6px 14px rgba(0,0,0,.06);
    }
    @media (prefers-color-scheme: dark){
      :root{ --paper:#0b0f0e; --ink:#e5ece9; --shadow:0 10px 24px rgba(0,0,0,.45); }
    }

    html,body{height:100%}
    body{ background:var(--paper); color:var(--ink); font-family:'Merriweather',serif; }
    .arabic{ font-family:'Amiri Quran','Amiri','Noto Naskh Arabic',serif; }
    a{ text-decoration:none; }

    /* --- Background immersivo solo verdi, ma discreto --- */
/* Copri sempre l'intera viewport */
.paper-texture{
  position: relative;
  min-height: 100svh; /* più affidabile di 100vh su mobile */
}

.paper-texture::before{
  content:"";
  position: fixed;      /* <-- da absolute a fixed */
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background:
    /* wash a sinistra più largo per evitare il "taglio" */
    radial-gradient(120vw 70vh at 8% 8%, rgba(230,242,237,.92), transparent 65%),
    /* riflesso alto-dx */
    radial-gradient(80vw 60vh at 90% 6%, rgba(15,90,68,.12), transparent 60%),
    /* profondità basso-sx */
    radial-gradient(100vw 80vh at 30% 100%, rgba(12,69,52,.10), transparent 62%),
    
    /* base */
    linear-gradient(180deg, #f6f9f7 0%, #eef6f2 100%);
  background-repeat: no-repeat;
  background-attachment: fixed, fixed, fixed, fixed; /* uniformità durante lo scroll */
  filter: saturate(108%);
}


    /* --- Header --- */
    .site-header{ position:relative; border-bottom:1px solid rgba(15,90,68,.25); }
    .logo-medallion{ width:42px; height:42px; border-radius:50%;
      background:conic-gradient(from 90deg, var(--g1), var(--g2));
      box-shadow:inset 0 1px 0 rgba(0,0,0,.04);
      border:1px solid rgba(154,134,86,.45);
    }
    .brand-title{ font-family:'Cormorant Garamond',serif; font-weight:700; letter-spacing:.3px; color:var(--g2); }
    .nav-link{ color:var(--ink); font-weight:700; }
    .nav-link:hover{ color:var(--g1); }

    /* --- Bottoni --- */
    .btn-sigil{ border:1px solid rgba(154,134,86,.55); color:var(--g1); font-weight:700; border-radius:999px; padding:.55rem 1rem; background:transparent; }
    .btn-sigil:hover{ background:var(--g1); color:#fff; border-color:var(--g2); box-shadow:none; }
    .btn-brand{ background:var(--g1); color:#fff; border:1px solid rgba(154,134,86,.45); font-weight:700; border-radius:999px; box-shadow:none; }
    .btn-brand:hover{ background:var(--g2); }

    /* --- Hero: cornice unica sottile in ottone spento --- */
    .hero{ backdrop-filter: blur(12px) saturate(130%); background: rgba(255,255,255,0.64); border:1px solid rgba(154,134,86,.55); border-radius:1.8rem; box-shadow: var(--shadow); overflow:hidden; }
    .hero .frame{ position:relative; padding:2.1rem; }
    .frame:before, .frame:after{ content:none; }
    .bismillah{ font-size:2.1rem; color:var(--g1); letter-spacing:.2px; }
    .subtitle{ color:var(--g3); font-weight:600; letter-spacing:.3px; }

    /* --- Cards --- */
    .card-ornate{ backdrop-filter: blur(8px); background: rgba(255,255,255,0.72); border:1px solid rgba(15,90,68,.22); border-radius:1rem; box-shadow: var(--shadow); transition:transform .2s ease; }
    .card-ornate:hover{ transform:translateY(-3px); box-shadow:0 10px 22px rgba(0,0,0,.10); }

    /* --- Divider sobrio (hairline con puntini in ottone) --- */
    .divider{ height:10px; border-radius:999px; background:
      repeating-linear-gradient(90deg,
        transparent 0 12px,
        rgba(154,134,86,.65) 12px 13px,
        transparent 13px 24px,
        rgba(15,90,68,.35) 24px 25px,
        transparent 25px 36px);
      opacity:.55; }

    /* --- Badge e micro-typography --- */
    .badge-free{ background:transparent; color:var(--g2); font-weight:800; border-radius:.5rem; border:1px solid rgba(154,134,86,.55); padding:.15rem .45rem; }
    .mini{ font-size:.92rem; color:#2b3a35; }

    /* --- Footer --- */
    footer{ border-top:1px solid rgba(15,90,68,.25); }
     .about strong { color: var(--gold); font-weight: 700; }
    .about .brand-title { color: var(--gold); letter-spacing: .5px; }
    .about .mini { opacity: .9; }
    .about .lead { font-size: 1.05rem; line-height: 1.7; }
    .about .sep { border: 0; border-top: 1px solid var(--gold); opacity: .35; margin: .75rem 0 1.25rem; }
    mark{
      background-color:transparent;
      color: rgb(154,134,86);
      font-weight:bold;
    }