/* =====================================================
   L'ISOLA DEGLI AMMUTINATI - CSS completo
   Palette: Legno #2c1a0a / Sabbia #f0dca0 / Oro #d4a017
   NOTA: nessuna variabile CSS, tutti valori hex diretti
   per massima compatibilita browser
===================================================== */

*, *::before, *::after { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; }

body {
  font-family:'Lora',Georgia,serif;
  color:#1a0a00;
  background:#fdf8ee;
  overflow-x:hidden;
  min-height:100vh;
}

/* ── TOP BAR ──────────────────────────── */
.ocean-top {
  height:6px;
  background:repeating-linear-gradient(
    90deg,
    #2c1a0a 0px, #2c1a0a 18px,
    #4a2c0e 18px,#4a2c0e 20px,
    #2c1a0a 20px,#2c1a0a 38px,
    #8b4513 38px,#8b4513 40px
  );
}

/* ── HEADER ───────────────────────────── */
.site-header {
  background:linear-gradient(180deg,#2c1a0a 0%,#4a2c0e 100%);
  border-bottom:4px solid #d4a017;
  position:sticky; top:0; z-index:100;
  box-shadow:0 4px 20px rgba(0,0,0,.6);
}
.header-inner {
  max-width:1280px; margin:0 auto;
  padding:0 20px;
  display:flex; align-items:center; justify-content:space-between; gap:20px;
  min-height:68px;
}
.logo-link { display:flex; align-items:center; gap:14px; text-decoration:none; }
.logo-emblem {
  font-size:2rem; line-height:1;
  filter:drop-shadow(0 0 8px #d4a017);
  animation:bob 3s ease-in-out infinite;
}
@keyframes bob { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-4px)} }
.logo-text  { display:flex; flex-direction:column; }
.logo-title { font-family:'Cinzel Decorative',serif; color:#f0c040; font-size:clamp(.9rem,2vw,1.25rem); text-shadow:0 2px 8px rgba(0,0,0,.7); line-height:1.1; }
.logo-sub   { font-family:'Cinzel',serif; color:#e8c97a; font-size:clamp(.58rem,1.1vw,.76rem); font-style:italic; letter-spacing:.05em; }

.main-nav { display:flex; align-items:center; gap:4px; flex-wrap:wrap; }
.nav-link  {
  font-family:'Cinzel',serif; font-size:.78rem; font-weight:600;
  color:#f5e4b0; text-decoration:none;
  padding:8px 11px; border-radius:6px;
  border:1px solid transparent; transition:all .2s; white-space:nowrap;
}
.nav-link:hover, .nav-link.active {
  background:rgba(212,160,23,.18); border-color:#d4a017;
  color:#f0c040; text-shadow:0 0 8px rgba(240,192,64,.4);
}
.cart-count {
  background:#8b1a1a; color:#fff;
  border-radius:50%; font-size:.65rem; font-weight:700;
  padding:1px 5px; margin-left:4px; vertical-align:middle;
}
.nav-toggle { display:none; flex-direction:column; gap:5px; background:none; border:none; cursor:pointer; padding:8px; }
.nav-toggle span { display:block; width:24px; height:2px; background:#d4a017; border-radius:2px; transition:.3s; }

/* ── ROPE DIVIDER ─────────────────────── */
.rope-divider {
  height:10px;
  background:repeating-linear-gradient(90deg,#9a7040 0px,#9a7040 8px,#2c1a0a 8px,#2c1a0a 10px,#9a7040 10px,#9a7040 18px,#a07010 18px,#a07010 20px);
  opacity:.7;
}

/* ── MAIN ─────────────────────────────── */
.site-main { min-height:60vh; }

/* ── HERO (copertina sfondo) ──────────── */
.hero {
  position:relative;
  min-height:clamp(380px,75vh,700px);
  display:flex; flex-direction:column;
  align-items:center; justify-content:flex-end;
  text-align:center;
  padding:0 20px 80px;
  overflow:hidden;
}
.hero-cover-bg {
  position:absolute; inset:0;
  background-size:cover; background-position:center top; background-repeat:no-repeat;
  background-color:#2c1a0a; z-index:0;
}
.hero-cover-overlay {
  position:absolute; inset:0;
  background:linear-gradient(180deg,rgba(0,0,0,.05) 0%,rgba(0,0,0,.08) 40%,rgba(0,0,0,.60) 68%,rgba(0,0,0,.85) 85%,rgba(0,0,0,.93) 100%);
  z-index:1;
}
.hero-content { position:relative; z-index:2; max-width:700px; width:100%; }
.hero-title {
  font-family:'Cinzel Decorative',serif; color:#f0c040;
  font-size:clamp(1.8rem,5vw,3.6rem);
  text-shadow:0 2px 6px rgba(0,0,0,.95),0 0 40px rgba(212,160,23,.4);
  line-height:1.2; margin-bottom:12px;
}
.hero-sub {
  font-family:'Lora',serif; color:#f5e4b0;
  font-size:clamp(.95rem,2vw,1.2rem); font-style:italic;
  text-shadow:0 2px 6px rgba(0,0,0,.9);
  margin-bottom:32px; max-width:520px; margin-left:auto; margin-right:auto;
}
.hero-wave-top { position:absolute; bottom:0; left:0; right:0; z-index:3; line-height:0; }
.hero-wave     { position:absolute; bottom:0; left:0; right:0; z-index:3; line-height:0; }

/* Hero pagine interne (senza copertina) */
.hero-inner {
  background:linear-gradient(135deg,#2c1a0a 0%,#4a2c0e 100%);
  padding:60px 20px 40px; text-align:center; position:relative; overflow:hidden;
}

/* ── PARCHMENT ────────────────────────── */
.parchment-section { max-width:980px; margin:40px auto; padding:0 20px; }
.parchment-card {
  background:linear-gradient(145deg,#fdf8ee,#f0dca0);
  border:2px solid #d4b870; border-radius:10px;
  padding:40px 50px;
  box-shadow:0 6px 24px rgba(44,26,10,.5),inset 0 1px 0 rgba(255,255,255,.8);
  position:relative;
}
.parchment-card::before {
  content:''; position:absolute; inset:6px;
  border:1px solid rgba(180,140,60,.3); border-radius:6px; pointer-events:none;
}
.compass-deco { width:60px; float:right; opacity:.2; margin:-10px -10px 10px 20px; }
.section-title { font-family:'Cinzel Decorative',serif; color:#2c1a0a; font-size:clamp(1.3rem,3vw,2rem); text-align:center; margin-bottom:24px; }

/* ── EDITABLE ZONE ────────────────────── */
#editableZone { outline:none; min-height:80px; }
#editableZone.editing { outline:2px dashed #a07010; border-radius:4px; padding:8px; background:rgba(212,160,23,.05); }
#editableZone h2 { font-family:'Cinzel',serif; color:#2c1a0a; margin-bottom:16px; font-size:1.5rem; }
#editableZone h3 { font-family:'Cinzel',serif; color:#8b4513; margin:20px 0 10px; }
#editableZone p  { line-height:1.75; margin-bottom:14px; color:#4a2c0e; }
#editableZone strong { color:#2c1a0a; }

/* ── ADMIN TOOLBAR ────────────────────── */
.admin-toolbar {
  position:fixed; bottom:0; left:0; right:0; z-index:999;
  background:rgba(44,26,10,.96); border-top:2px solid #d4a017;
  padding:10px 20px; display:flex; align-items:center; gap:12px;
  font-family:'Cinzel',serif; color:#d4a017; font-size:.85rem;
  backdrop-filter:blur(8px);
}
.btn-edit   { padding:8px 20px; border-radius:6px; cursor:pointer; font-family:'Cinzel',serif; font-size:.8rem; font-weight:600; border:none; display:inline-flex; align-items:center; gap:6px; background:#d4a017; color:#2c1a0a; transition:.2s; }
.btn-save   { padding:8px 20px; border-radius:6px; cursor:pointer; font-family:'Cinzel',serif; font-size:.8rem; font-weight:600; border:none; display:inline-flex; align-items:center; gap:6px; background:#2a7a2a; color:#fff; }
.btn-cancel { padding:8px 20px; border-radius:6px; cursor:pointer; font-family:'Cinzel',serif; font-size:.8rem; font-weight:600; border:none; display:inline-flex; align-items:center; gap:6px; background:#8b1a1a; color:#fff; }

/* ── BUTTONS ──────────────────────────── */
.btn {
  display:inline-flex; align-items:center; gap:8px;
  padding:12px 28px; border-radius:8px; border:none; cursor:pointer;
  font-family:'Cinzel',serif; font-weight:700; font-size:.9rem;
  text-decoration:none; transition:all .2s; letter-spacing:.03em;
}
.btn-primary { background:linear-gradient(135deg,#a07010,#d4a017); color:#2c1a0a; box-shadow:0 4px 16px rgba(160,112,16,.5); }
.btn-primary:hover { transform:translateY(-2px); box-shadow:0 6px 24px rgba(160,112,16,.6); }
.btn-ocean   { background:linear-gradient(135deg,#2c1a0a,#4a2c0e); color:#f0c040; border:1px solid #a07010; }
.btn-ocean:hover { background:#4a2c0e; }
.btn-danger  { background:#8b1a1a; color:#fff; }
.btn-sm      { padding:7px 16px; font-size:.78rem; }

/* ── CHAR CARDS (Ciurma) ──────────────── */
.char-card  { border:2px solid #a07010; border-radius:10px; padding:20px; text-align:center; color:#fff; box-shadow:0 4px 16px rgba(0,0,0,.4); }
.char-icon  { font-size:2.5rem; margin-bottom:10px; }
.char-name  { font-family:'Cinzel Decorative',serif; font-size:.9rem; color:#f0c040; margin-bottom:8px; }
.char-desc  { font-size:.82rem; color:#f5e4b0; font-style:italic; }

/* ── CTA STRIP ────────────────────────── */
.cta-strip {
  background:linear-gradient(135deg,#2c1a0a 0%,#4a2c0e 50%,#3a1a08 100%);
  padding:50px 20px; text-align:center; position:relative;
  border-top:3px solid #a07010; border-bottom:3px solid #a07010;
}

/* ── SHOP ─────────────────────────────── */
.shop-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:28px; }
.product-card {
  background:#fdf8ee; border:2px solid #d4b870; border-radius:10px;
  overflow:hidden; box-shadow:0 4px 16px rgba(0,0,0,.15);
  transition:transform .25s,box-shadow .25s; display:flex; flex-direction:column;
}
.product-card:hover { transform:translateY(-6px); box-shadow:0 12px 32px rgba(0,0,0,.3); border-color:#a07010; }
.product-img { height:200px; background:linear-gradient(145deg,#2c1a0a,#4a2c0e); display:flex; align-items:center; justify-content:center; font-size:4rem; overflow:hidden; }
.product-img img { width:100%; height:100%; object-fit:cover; }
.product-body { padding:20px; flex:1; display:flex; flex-direction:column; }
.product-name     { font-family:'Cinzel',serif; font-size:1rem; color:#2c1a0a; margin-bottom:8px; }
.product-desc     { font-size:.88rem; color:#4a2c0e; line-height:1.6; flex:1; margin-bottom:14px; }
.product-price    { font-family:'Cinzel Decorative',serif; color:#a07010; font-size:1.3rem; margin-bottom:14px; }
.product-category { display:inline-block; background:rgba(44,26,10,.1); color:#2c1a0a; padding:3px 10px; border-radius:20px; font-size:.75rem; font-family:'Cinzel',serif; margin-bottom:10px; }

/* Disclaimer shop */
.shop-disclaimer {
  background:#fdf8ee; border:1px solid #d4b870; border-radius:8px;
  padding:14px 20px; margin:20px 0;
  font-size:.82rem; color:#4a2c0e; font-style:italic; line-height:1.6;
  text-align:center;
}

/* ── DETAIL ───────────────────────────── */
.detail-grid { display:grid; grid-template-columns:1fr 1fr; gap:40px; align-items:start; }
.product-img-large { aspect-ratio:1; background:linear-gradient(145deg,#2c1a0a,#4a2c0e); border:3px solid #d4a017; border-radius:12px; display:flex; align-items:center; justify-content:center; font-size:6rem; box-shadow:0 6px 24px rgba(44,26,10,.5); overflow:hidden; }

/* ── CARRELLO ─────────────────────────── */
.cart-table { width:100%; border-collapse:collapse; }
.cart-table th { background:#2c1a0a; color:#f0c040; font-family:'Cinzel',serif; padding:12px 16px; text-align:left; }
.cart-table td { padding:14px 16px; border-bottom:1px solid #d4b870; vertical-align:middle; }
.cart-table tr:hover td { background:rgba(212,160,23,.06); }
.cart-total { font-family:'Cinzel Decorative',serif; color:#a07010; font-size:1.4rem; text-align:right; padding:16px 0; }

/* ── CHECKOUT ─────────────────────────── */
.checkout-grid { display:grid; grid-template-columns:1fr 380px; gap:32px; align-items:start; }
.form-group { margin-bottom:20px; }
.form-group label { display:block; font-family:'Cinzel',serif; font-size:.85rem; color:#2c1a0a; margin-bottom:6px; font-weight:600; }
.form-group input, .form-group select, .form-group textarea {
  width:100%; padding:10px 14px; border:2px solid #d4b870; border-radius:6px;
  background:#fffef8; font-family:'Lora',serif; font-size:.95rem; color:#1a0a00; transition:border .2s;
}
.form-group input:focus, .form-group select:focus, .form-group textarea:focus { outline:none; border-color:#7a4a1e; box-shadow:0 0 0 3px rgba(122,74,30,.15); }
.form-row { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.pay-option { background:#fdf8ee; border:2px solid #d4b870; border-radius:8px; padding:16px; margin-top:6px; }

/* ── GIOCHI ───────────────────────────── */
.games-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:28px; }
.game-card  {
  background:linear-gradient(145deg,#2c1a0a,#4a2c0e);
  border:2px solid #a07010; border-radius:10px;
  padding:32px 24px; text-align:center; cursor:pointer;
  text-decoration:none; color:#f0c040;
  transition:transform .25s,box-shadow .25s; box-shadow:0 6px 24px rgba(0,0,0,.4);
}
.game-card:hover { transform:translateY(-8px) rotate(-1deg); box-shadow:0 16px 40px rgba(0,0,0,.5); }
.game-icon  { font-size:3.5rem; display:block; margin-bottom:14px; }
.game-title { font-family:'Cinzel Decorative',serif; font-size:1.2rem; margin-bottom:10px; }
.game-desc  { font-family:'Lora',serif; font-size:.9rem; color:#e8c97a; }

/* ── MEMORY ───────────────────────────── */
.memory-board { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; max-width:520px; margin:0 auto; }
.memory-card  { aspect-ratio:1; perspective:600px; cursor:pointer; }
.memory-card-inner { width:100%; height:100%; position:relative; transform-style:preserve-3d; transition:transform .4s; border-radius:10px; }
.memory-card.flipped .memory-card-inner { transform:rotateY(180deg); }
.memory-card-front, .memory-card-back { position:absolute; inset:0; backface-visibility:hidden; border-radius:10px; display:flex; align-items:center; justify-content:center; font-size:2.5rem; border:3px solid #a07010; }
.memory-card-front { background:linear-gradient(135deg,#2c1a0a,#4a2c0e); color:#f0c040; font-size:2rem; }
.memory-card-back  { background:#f0dca0; transform:rotateY(180deg); }
.memory-card.matched .memory-card-back { background:#d4edda; border-color:#28a745; }

/* ── DOBLONI / PROGETTI ───────────────── */
.dobloni-card { border:2px solid #a07010; border-radius:12px; padding:28px 22px; color:#fff; box-shadow:0 6px 20px rgba(0,0,0,.35); }
.dobl-icon    { font-size:2.5rem; margin-bottom:10px; }
.dobl-title   { font-family:'Cinzel',serif; font-size:1rem; color:#f0c040; margin-bottom:8px; }
.dobl-pts     { background:#d4a017; color:#2c1a0a; font-family:'Cinzel Decorative',serif; font-size:.8rem; display:inline-block; padding:3px 12px; border-radius:20px; margin-bottom:12px; }
.dobl-desc    { font-size:.85rem; color:#f5e4b0; line-height:1.6; font-style:italic; }

/* ── VALORE / ASSOCIAZIONE ────────────── */
.value-card  { background:#fdf8ee; border:2px solid #d4b870; border-radius:10px; padding:24px; text-align:center; box-shadow:0 3px 12px rgba(0,0,0,.1); }
.value-icon  { font-size:2.5rem; margin-bottom:10px; }
.value-title { font-family:'Cinzel',serif; color:#2c1a0a; font-size:1rem; margin-bottom:8px; }
.value-desc  { font-size:.85rem; color:#4a2c0e; font-style:italic; }

/* ── LIBRO ────────────────────────────── */
.libro-grid { display:grid; grid-template-columns:auto 1fr; gap:40px; align-items:start; margin-bottom:40px; }
.book-cover { width:220px; height:300px; background:linear-gradient(145deg,#2c1a0a,#4a2c0e); border:4px solid #d4a017; border-radius:12px; box-shadow:8px 8px 24px rgba(0,0,0,.5); display:flex; align-items:center; justify-content:center; flex-direction:column; color:#f0c040; font-family:'Cinzel Decorative',serif; font-size:.85rem; padding:16px; text-align:center; line-height:1.4; }
.chap-card  { background:rgba(255,255,255,.08); border:1px solid rgba(212,160,23,.3); border-radius:10px; padding:20px; }
.chap-icon  { font-size:2rem; margin-bottom:8px; }
.chap-title { font-family:'Cinzel',serif; color:#f0c040; font-size:.95rem; margin-bottom:8px; }
.chap-desc  { font-size:.85rem; color:#f5e4b0; font-style:italic; }

/* ── ADMIN ────────────────────────────── */
.admin-wrapper { max-width:1100px; margin:0 auto; padding:40px 20px; }
.admin-header  { font-family:'Cinzel Decorative',serif; color:#2c1a0a; font-size:2rem; margin-bottom:30px; border-bottom:3px solid #d4a017; padding-bottom:12px; }
.admin-table   { width:100%; border-collapse:collapse; background:#fdf8ee; border-radius:10px; overflow:hidden; box-shadow:0 6px 24px rgba(44,26,10,.5); }
.admin-table th { background:#2c1a0a; color:#f0c040; font-family:'Cinzel',serif; padding:12px 16px; text-align:left; }
.admin-table td { padding:12px 16px; border-bottom:1px solid #d4b870; font-size:.9rem; }
.admin-table tr:hover td { background:rgba(212,160,23,.05); }
.admin-tabs  { display:flex; gap:8px; margin-bottom:24px; flex-wrap:wrap; }
.admin-tab   { padding:10px 22px; border:2px solid #d4b870; border-radius:6px; background:#fdf8ee; font-family:'Cinzel',serif; font-size:.85rem; cursor:pointer; text-decoration:none; color:#1a0a00; transition:.2s; }
.admin-tab:hover, .admin-tab.active { background:#2c1a0a; color:#f0c040; border-color:#2c1a0a; }
.stat-card   { border:2px solid #a07010; border-radius:10px; padding:24px; text-align:center; box-shadow:0 4px 16px rgba(0,0,0,.2); color:#fff; }
.badge       { display:inline-block; padding:3px 10px; border-radius:20px; font-size:.75rem; font-weight:600; }
.badge-pending  { background:#fff3cd; color:#856404; }
.badge-paid     { background:#d1e7dd; color:#0a3622; }
.badge-shipped  { background:#cfe2ff; color:#084298; }

/* ── LOGIN ────────────────────────────── */
.login-wrap  { min-height:80vh; display:flex; align-items:center; justify-content:center; padding:40px 20px; }
.login-card  { background:linear-gradient(145deg,#f0dca0,#fdf8ee); border:2px solid #a07010; border-radius:12px; padding:50px 44px; max-width:440px; width:100%; box-shadow:0 6px 24px rgba(44,26,10,.5); text-align:center; }
.login-icon  { font-size:3rem; margin-bottom:12px; }
.login-title { font-family:'Cinzel Decorative',serif; color:#2c1a0a; font-size:1.4rem; margin-bottom:30px; }

/* ── FOOTER ───────────────────────────── */
.site-footer  { background:#2c1a0a; color:#e8c97a; margin-top:60px; }
.waves-footer { line-height:0; }
.waves-footer svg { display:block; }
.footer-inner { max-width:1100px; margin:0 auto; display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:32px; padding:40px 20px 32px; }
.footer-col h4   { font-family:'Cinzel',serif; color:#f0c040; margin-bottom:14px; font-size:1rem; }
.footer-col p    { font-size:.88rem; line-height:1.7; color:#e8c97a; }
.footer-link     { display:block; color:#c8a84a; text-decoration:none; font-size:.88rem; margin-bottom:6px; transition:color .2s; }
.footer-link:hover { color:#f0c040; }
.footer-bottom   { border-top:1px solid rgba(255,255,255,.1); padding:16px 20px; text-align:center; font-size:.82rem; color:#c8a84a; }

/* ── UTILITIES ────────────────────────── */
.text-center { text-align:center; }
.mt-4  { margin-top:24px; }
.mb-4  { margin-bottom:24px; }
.flex-gap { display:flex; gap:12px; flex-wrap:wrap; }
.alert { padding:14px 20px; border-radius:8px; margin-bottom:16px; font-family:'Cinzel',serif; font-size:.9rem; }
.alert-success { background:#d1e7dd; color:#0a3622; border:1px solid #a3cfbb; }
.alert-danger  { background:#f8d7da; color:#58151c; border:1px solid #f1aeb5; }

/* ── RESPONSIVE ───────────────────────── */
@media (max-width:768px) {
  .nav-toggle { display:flex; }
  .main-nav   { display:none; flex-direction:column; align-items:stretch; position:absolute; top:100%; left:0; right:0; background:#2c1a0a; border-bottom:2px solid #d4a017; padding:12px 16px; gap:4px; }
  .main-nav.open { display:flex; }
  .site-header { position:relative; }
  .header-inner { flex-wrap:wrap; }
  .parchment-card { padding:24px 20px; }
  .form-row   { grid-template-columns:1fr; }
  .memory-board { gap:8px; }
  .libro-grid { grid-template-columns:1fr; }
  .detail-grid { grid-template-columns:1fr; }
  .checkout-grid { grid-template-columns:1fr; }
  .hero { min-height:380px; padding:0 16px 70px; }
  .admin-wrapper { padding:20px 12px; }
  .admin-tabs { overflow-x:auto; flex-wrap:nowrap; padding-bottom:4px; }
  .admin-tab  { white-space:nowrap; }
}
@media (max-width:480px) {
  .memory-board { gap:6px; }
  .memory-card-front, .memory-card-back { font-size:1.5rem; }
  .hero-title { font-size:1.6rem; }
}

/* ── ANIMAZIONI ───────────────────────── */
.fade-in   { animation:fadeIn .6s ease both; }
@keyframes fadeIn { from{opacity:0;transform:translateY(16px)} to{opacity:1;transform:translateY(0)} }
.fade-in-1 { animation-delay:.1s; }
.fade-in-2 { animation-delay:.2s; }
.fade-in-3 { animation-delay:.35s; }

/* ═══════════════════════════════════════════════
   HOME WOOD THEME  –  layout "pirate ship"
═══════════════════════════════════════════════ */

/* ── Sfondo legno globale per la home ──────── */
body.page-home {
  background-color: #4a2c0e;
  background-image:
    /* venature orizzontali filo del legno */
    repeating-linear-gradient(
      180deg,
      transparent            0px,
      transparent            3px,
      rgba(0,0,0,.04)        3px,
      rgba(0,0,0,.04)        4px,
      transparent            4px,
      transparent            7px,
      rgba(255,255,255,.025) 7px,
      rgba(255,255,255,.025) 8px,
      transparent            8px,
      transparent            14px,
      rgba(0,0,0,.06)        14px,
      rgba(0,0,0,.06)        15px,
      transparent            15px,
      transparent            22px,
      rgba(0,0,0,.03)        22px,
      rgba(0,0,0,.03)        23px
    ),
    /* giunture tra tavole orizzontali */
    repeating-linear-gradient(
      180deg,
      rgba(0,0,0,.0)    0px,
      rgba(0,0,0,.0)    118px,
      rgba(0,0,0,.40)   118px,
      rgba(0,0,0,.40)   122px,
      rgba(0,0,0,.0)    122px,
      rgba(0,0,0,.0)    242px,
      rgba(0,0,0,.35)   242px,
      rgba(0,0,0,.35)   246px
    ),
    /* variazione di tono per tavola */
    repeating-linear-gradient(
      180deg,
      rgba(0,0,0,.1)         0px,
      rgba(0,0,0,.0)         60px,
      rgba(255,255,255,.04)  120px,
      rgba(0,0,0,.1)         180px
    ),
    /* nodi del legno */
    radial-gradient(ellipse 28px 18px at 12% 8%,  rgba(0,0,0,.6)  0%, rgba(20,8,2,.4) 45%, transparent 70%),
    radial-gradient(ellipse 22px 14px at 11% 8%,  rgba(90,45,10,.5) 0%, transparent 60%),
    radial-gradient(ellipse 20px 13px at 78% 33%, rgba(0,0,0,.55) 0%, rgba(20,8,2,.35) 45%, transparent 70%),
    radial-gradient(ellipse 16px 10px at 77% 33%, rgba(90,45,10,.45) 0%, transparent 60%),
    radial-gradient(ellipse 32px 20px at 45% 58%, rgba(0,0,0,.52) 0%, rgba(20,8,2,.3) 45%, transparent 70%),
    radial-gradient(ellipse 24px 15px at 44% 58%, rgba(90,45,10,.4) 0%, transparent 60%),
    radial-gradient(ellipse 18px 12px at 88% 75%, rgba(0,0,0,.48) 0%, transparent 65%),
    radial-gradient(ellipse 14px  9px at 25% 88%, rgba(0,0,0,.42) 0%, transparent 65%),
    /* gradiente base */
    linear-gradient(180deg, #6b3d1a 0%, #4a2c0e 20%, #3d2010 50%, #4a2c0e 80%, #3a1e0e 100%);
}

/* Background immagine personalizzata */
body.page-home.bg-custom {
  background-image: var(--bg-custom-url) !important;
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
}

/* ── HERO sezione ───────────────────────────── */
.wood-hero {
  display:grid;
  grid-template-columns:120px 1fr 120px;
  align-items:center;
  padding:28px 24px 0;
  gap:16px;
  max-width:1200px;
  margin:0 auto;
}

.wood-hero-deco { text-align:center; }
.pirate-flag-deco {
  font-size:5rem;
  line-height:1;
  filter:drop-shadow(0 0 12px rgba(0,0,0,.8));
  animation:bob 4s ease-in-out infinite;
}
.compass-deco-hero {
  font-size:4.5rem;
  color:#d4a017;
  line-height:1;
  filter:drop-shadow(0 0 10px rgba(212,160,23,.6));
  animation:spin-slow 20s linear infinite;
}
@keyframes spin-slow { from{transform:rotate(0deg)} to{transform:rotate(360deg)} }

.wood-hero-center { text-align:center; }

.wood-title-frame {
  display:inline-block;
  border:4px solid #d4a017;
  border-radius:4px;
  padding:6px;
  margin-bottom:20px;
  box-shadow:0 0 0 2px #8b5e3c, 0 0 0 6px #d4a017, 0 0 0 8px #8b5e3c,
             inset 0 0 40px rgba(0,0,0,.5);
  position:relative;
}
.wood-title-frame::before,
.wood-title-frame::after {
  content:'';
  position:absolute;
  width:24px; height:24px;
  border:3px solid #d4a017;
}
.wood-title-frame::before { top:-10px; left:-10px; border-right:none; border-bottom:none; }
.wood-title-frame::after  { bottom:-10px; right:-10px; border-left:none; border-top:none; }

.wood-title-inner {
  border:2px solid rgba(212,160,23,.4);
  padding:18px 40px;
  background:linear-gradient(180deg,rgba(44,26,10,.7),rgba(30,16,8,.9));
}
.wood-hero-title {
  font-family:'Cinzel Decorative',serif;
  color:#f0c040;
  font-size:clamp(1.6rem,4vw,3rem);
  text-shadow:0 2px 4px #000, 0 0 30px rgba(212,160,23,.5);
  line-height:1.15;
  margin-bottom:8px;
}
.wood-hero-sub {
  font-family:'Cinzel',serif;
  color:#e8c97a;
  font-size:clamp(.75rem,1.4vw,1rem);
  font-style:italic;
  letter-spacing:.06em;
}

/* sub-nav orizzontale sotto il titolo */
.wood-subnav {
  display:flex; flex-wrap:wrap; justify-content:center; gap:0;
  border-top:1px solid rgba(212,160,23,.3);
  padding-top:14px;
}
.wood-nav-item {
  font-family:'Cinzel',serif; font-size:.72rem; font-weight:600;
  color:#e8c97a; text-decoration:none; text-transform:uppercase;
  letter-spacing:.08em;
  padding:6px 14px;
  border-right:1px solid rgba(212,160,23,.25);
  transition:color .2s;
}
.wood-nav-item:last-child { border-right:none; }
.wood-nav-item:hover, .wood-nav-active { color:#f0c040; text-decoration:underline; }

/* ── CIURMA SECTION ─────────────────────────── */
.wood-ciurma-section {
  max-width:1100px;
  margin:40px auto 0;
  padding:0 20px 40px;
  display:flex;
  flex-direction:column;
  gap:0;
}

.crew-row {
  display:grid;
  grid-template-columns:1fr 1fr;
  align-items:center;
  gap:40px;
  padding:40px 0;
  border-bottom:1px solid rgba(212,160,23,.15);
}
.crew-row:last-child { border-bottom:none; }

/* alternanza: righe pari → foto sinistra, righe dispari → foto destra */
.crew-row-right { direction:rtl; }
.crew-row-right > * { direction:ltr; }

/* ── Cornice ornamentale ────────────────────── */
.crew-frame-wrap { position:relative; }
.crew-frame {
  position:relative;
  border:6px solid #a07010;
  box-shadow:
    0 0 0 3px #2c1a0a,
    0 0 0 6px #d4a017,
    0 0 0 9px #6b4810,
    0 0 40px rgba(0,0,0,.8),
    inset 0 0 20px rgba(0,0,0,.4);
  border-radius:4px;
  overflow:hidden;
  background:#1a0a00;
  aspect-ratio:3/4;
  max-height:420px;
}
.crew-photo {
  width:100%; height:100%;
  object-fit:cover; object-position:center top;
  display:block;
  filter:sepia(10%) contrast(105%);
}
.crew-emoji-big {
  width:100%; height:100%;
  display:flex; align-items:center; justify-content:center;
  font-size:8rem;
  background:linear-gradient(145deg,#2c1a0a,#1a0a00);
}

/* angoli decorativi */
.crew-frame-corner {
  position:absolute; z-index:4;
  width:32px; height:32px;
  border:3px solid #d4a017;
}
.crew-frame-corner.tl { top:-3px; left:-3px; border-right:none; border-bottom:none; }
.crew-frame-corner.tr { top:-3px; right:-3px; border-left:none; border-bottom:none; }
.crew-frame-corner.bl { bottom:-3px; left:-3px; border-right:none; border-top:none; }
.crew-frame-corner.br { bottom:-3px; right:-3px; border-left:none; border-top:none; }

.crew-anchor {
  position:absolute; z-index:5;
  font-size:1.6rem; color:#d4a017;
  line-height:1;
  filter:drop-shadow(0 0 6px rgba(212,160,23,.8));
}
.crew-anchor.tl { top:6px; left:6px; }
.crew-anchor.br { bottom:6px; right:6px; }

/* ── Pergamena testo ────────────────────────── */
.crew-parchment {
  background:
    linear-gradient(135deg,#f5e6c0 0%,#ede0b0 30%,#e8d89e 60%,#f0e4b8 100%);
  border:3px solid #a07010;
  border-radius:6px;
  box-shadow:
    0 0 0 1px #d4a017,
    4px 6px 20px rgba(0,0,0,.6),
    inset 0 0 40px rgba(180,140,60,.15);
  position:relative;
  overflow:hidden;
}
.crew-parchment::before {
  content:'';
  position:absolute; inset:0;
  background:
    radial-gradient(ellipse at 20% 20%, rgba(255,255,255,.15) 0%, transparent 60%),
    radial-gradient(ellipse at 80% 80%, rgba(160,120,40,.1) 0%, transparent 60%);
  pointer-events:none;
}
/* bordo interno decorativo */
.crew-parchment::after {
  content:'';
  position:absolute; inset:8px;
  border:1px solid rgba(160,112,16,.35);
  border-radius:3px;
  pointer-events:none;
}

.crew-parchment-inner {
  padding:32px 36px;
  position:relative; z-index:1;
}

.crew-name {
  font-family:'Cinzel Decorative',serif;
  color:#2c1a0a;
  font-size:clamp(1.1rem,2vw,1.55rem);
  margin-bottom:16px;
  text-align:center;
  text-shadow:1px 1px 0 rgba(255,255,255,.4);
}

.crew-desc {
  font-family:'Lora',serif;
  font-size:clamp(.82rem,1.3vw,.98rem);
  color:#1a0a00;
  font-style:italic;
  font-weight:600;
  line-height:1.75;
  margin-bottom:20px;
}
.crew-desc p { margin-bottom:6px; }

/* ── Pulsante stile cartapecora ─────────────── */
.crew-btn {
  display:inline-block;
  background:linear-gradient(135deg,#6b2020,#9b2a2a);
  color:#f5e4b0;
  font-family:'Cinzel',serif;
  font-size:.8rem;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
  text-decoration:none;
  padding:10px 24px;
  border:2px solid #d4a017;
  border-radius:4px;
  box-shadow:2px 3px 10px rgba(0,0,0,.5), inset 0 1px 0 rgba(255,255,255,.1);
  transition:all .2s;
  cursor:pointer;
}
.crew-btn:hover {
  background:linear-gradient(135deg,#8b2020,#b83030);
  box-shadow:2px 3px 16px rgba(0,0,0,.7), 0 0 12px rgba(212,160,23,.3);
  transform:translateY(-1px);
  color:#fff;
}
.crew-btn-alt {
  background:linear-gradient(135deg,#1a3a5c,#2a5a8c);
}
.crew-btn-alt:hover {
  background:linear-gradient(135deg,#2a4a7c,#3a6aac);
}

/* ── CTA strip ──────────────────────────────── */
.wood-cta {
  background:linear-gradient(135deg,#1a0a00,#2c1a0a,#1a0a00);
  border-top:3px solid #d4a017;
  border-bottom:3px solid #d4a017;
  padding:50px 20px;
  text-align:center;
  margin-top:20px;
}
.wood-cta-inner { max-width:700px; margin:0 auto; }
.wood-cta-title {
  font-family:'Cinzel Decorative',serif;
  color:#f0c040;
  font-size:clamp(1.1rem,2.5vw,1.7rem);
  margin-bottom:12px;
  text-shadow:0 2px 8px rgba(0,0,0,.8);
}
.wood-cta-sub {
  color:#f5e4b0;
  font-style:italic;
  margin-bottom:28px;
}

/* ── Responsive ─────────────────────────────── */
@media(max-width:700px) {
  .wood-hero { grid-template-columns:60px 1fr 60px; padding:16px 12px 0; }
  .pirate-flag-deco { font-size:3rem; }
  .compass-deco-hero { font-size:2.8rem; }
  .wood-title-inner { padding:14px 16px; }
  .crew-row, .crew-row-right {
    grid-template-columns:1fr;
    direction:ltr;
    gap:20px;
  }
  .crew-frame { aspect-ratio:4/3; max-height:280px; }
  .crew-parchment-inner { padding:20px 18px; }
}