/* ============================================================
   Mallorcapigs — hoja de estilos compartida (ES / EN / DE)
   ============================================================ */

:root{
  --honey-dark:   #5c1620;
  --honey:        #7a1f2b;
  --honey-light:  #b3576a;
  --honey-pale:   #f1e4e6;

  /* superficies "papel" claras: cards, logo, ilustraciones */
  --paper:        #f7f4ee;
  --paper-2:      #ece9e3;
  --paper-line:   rgba(20,20,20,.10);
  --dark-text:    #17130f;
  --dark-text-soft:#5b564c;

  /* base de la web: gris muy oscuro (no negro puro) con texto claro */
  --bg:           #232221;
  --bg-alt:       #2c2a28;
  --text:         #eeebe5;
  --text-soft:    #aca79f;
  --line:         rgba(255,255,255,.11);

  --shadow:       0 16px 36px rgba(0,0,0,.35);
  --radius:       18px;
  --maxw:         1180px;
  --serif: Georgia, 'Times New Roman', Times, 'Liberation Serif', serif;
  --sans:  'Times New Roman', Times, Georgia, 'Liberation Serif', serif;
}

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0;
  font-family:var(--sans);
  color:var(--text);
  background:var(--bg);
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
img,svg{ max-width:100%; display:block; }
img{
  -webkit-user-drag:none; user-drag:none;
  -webkit-touch-callout:none;
  -webkit-user-select:none; -moz-user-select:none; user-select:none;
  pointer-events:auto;
}
a{ color:inherit; text-decoration:none; }
h1,h2,h3,h4{
  font-family:var(--serif);
  font-weight:600;
  color:var(--text);
  margin:0 0 .5em;
  line-height:1.15;
}
p{
  margin:0 0 1.1em;
  text-align:justify;
  text-align-last:left;
  hyphens:none;
  -webkit-hyphens:none;
  overflow-wrap:normal;
  word-break:normal;
}
.contact-box p,
.value p{ text-align:center; text-align-last:center; }
.contact-box .lede{ text-align:justify; text-align-last:center; }
ul{ margin:0; padding:0; list-style:none; }
.container{
  max-width:var(--maxw);
  margin:0 auto;
  padding:0 28px;
}
.eyebrow{
  display:inline-block;
  font-family:var(--sans);
  font-size:.78rem;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--honey-light);
  font-weight:600;
  margin-bottom:.9em;
}
.section{ padding:96px 0; }
.section--tight{ padding:72px 0; }
.section--alt{ background:var(--bg-alt); }
.section--dark{
  background:linear-gradient(160deg,#2c1b1f,#382026 130%);
  color:#e6e4e0;
}
.section--dark h2, .section--dark h3{ color:#fff; }
.section--dark .eyebrow{ color:var(--honey-light); }
.section-head{
  max-width:720px;
  margin:0 auto 56px;
  text-align:center;
}
.section-head h2{ font-size:clamp(1.7rem,3.4vw,2.5rem); }
.lede{ font-size:1.08rem; color:var(--text-soft); }
.lede a{ color:var(--honey-light); text-decoration:underline; }
.lede a:hover{ color:var(--honey); }
.section--dark .lede{ color:#cfcbc4; }

/* ---------- Header ---------- */
.site-header{
  position:sticky; top:0; z-index:100;
  background:rgba(35,34,33,.88);
  backdrop-filter:blur(8px);
  border-bottom:1px solid var(--line);
}
.site-header .container{
  display:flex; align-items:center; justify-content:space-between;
  height:84px;
}
.brand{ display:flex; align-items:center; gap:12px; }

.img-guard{ position:relative; display:inline-block; line-height:0; }
.img-guard-overlay{ position:absolute; inset:0; width:100%; height:100%; max-width:none; }
.brand-name{ font-family:var(--serif); font-size:1.3rem; color:var(--text); }
.brand-name b{ color:var(--honey-light); font-weight:700; }

.main-nav{ display:flex; align-items:center; gap:34px; }
.main-nav a{
  font-size:.92rem; font-weight:500; color:var(--text-soft);
  position:relative; padding:4px 0;
}
.main-nav a:hover{ color:var(--honey-light); }
.main-nav a::after{
  content:''; position:absolute; left:0; right:0; bottom:-3px; height:2px;
  background:var(--honey-light); transform:scaleX(0); transition:transform .25s ease;
}
.main-nav a:hover::after{ transform:scaleX(1); }

.lang-switch{ display:flex; gap:6px; margin-left:8px; }
.lang-switch a{
  font-size:.76rem; font-weight:600; letter-spacing:.04em;
  padding:5px 9px; border-radius:20px; border:1px solid var(--line);
  color:var(--text-soft);
}
.lang-switch a.is-active{ background:var(--honey); border-color:var(--honey); color:#fff; }
.lang-switch a:hover:not(.is-active){ border-color:var(--honey-light); color:var(--honey-light); }

.nav-toggle{ display:none; }

/* ---------- Hero ---------- */
.hero{
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(ellipse at 15% -10%, rgba(122,31,43,.20), transparent 55%),
    linear-gradient(180deg,var(--bg), var(--bg-alt) 70%);
  padding:100px 0 70px;
}
.hero-comb{
  position:absolute; inset:0; z-index:0; opacity:.5;
  background-image:
    repeating-linear-gradient(60deg, transparent 0 46px, rgba(255,255,255,.05) 47px 48px, transparent 49px 92px),
    repeating-linear-gradient(-60deg, transparent 0 46px, rgba(255,255,255,.05) 47px 48px, transparent 49px 92px),
    repeating-linear-gradient(0deg, transparent 0 46px, rgba(255,255,255,.05) 47px 48px, transparent 49px 92px);
  mask-image:linear-gradient(180deg, black, transparent 88%);
}
.hero .container{
  position:relative; z-index:1;
  display:grid; grid-template-columns:1.1fr .9fr; gap:56px; align-items:center;
}
.hero h1{
  font-size:clamp(2.4rem,5vw,3.6rem);
  margin-bottom:.35em;
}
.hero h1 span{ color:var(--honey-light); font-style:italic; }
.hero p.lede{ max-width:520px; }
.hero-actions{ display:flex; gap:16px; margin-top:34px; flex-wrap:wrap; }

.btn{
  display:inline-flex; align-items:center; gap:8px;
  padding:14px 28px; border-radius:999px;
  font-weight:600; font-size:.94rem; letter-spacing:.01em;
  border:1px solid transparent; cursor:pointer;
  transition:transform .2s ease, box-shadow .2s ease, background .2s ease;
}
.btn:hover{ transform:translateY(-2px); }
.btn-primary{ background:var(--honey-dark); color:#fff; box-shadow:0 8px 22px rgba(92,22,32,.30); }
.btn-primary:hover{ background:#3d0f17; }
.btn-outline{ border-color:rgba(255,255,255,.4); color:var(--text); background:transparent; }
.btn-outline:hover{ background:rgba(255,255,255,.08); color:var(--text); }
.btn-light{ background:#fff; color:var(--dark-text); }
.btn-light:hover{ background:var(--honey-pale); }

.hero-badge{
  position:relative; justify-self:center;
  width:min(360px,90%); aspect-ratio:1/1;
  display:grid; place-items:center;
}
.hero-badge .ring{
  position:absolute; inset:0; border-radius:50%;
  background:conic-gradient(from -40deg, var(--honey-light), var(--honey), var(--honey-dark), var(--honey-light));
  animation:spin 26s linear infinite;
}
.hero-badge .ring::after{
  content:''; position:absolute; inset:14px; border-radius:50%; background:var(--paper);
}
.hero-badge .mark{ position:relative; width:62%; aspect-ratio:1/1; }
.hero-badge .mark img{ position:absolute; inset:0; width:100%; height:100%; }
@keyframes spin{ to{ transform:rotate(360deg); } }

.stat-row{
  display:grid; grid-template-columns:repeat(3,1fr); gap:18px;
  margin-top:64px; padding-top:40px; border-top:1px solid var(--line);
  position:relative; z-index:1;
}
.stat{ text-align:center; }
.stat b{ display:block; font-family:var(--serif); font-size:2rem; color:var(--text); }
.stat span{ font-size:.84rem; color:var(--text-soft); letter-spacing:.03em; }

/* ---------- About / grid with side art ---------- */
.split{
  display:grid; grid-template-columns:.95fr 1.05fr; gap:64px; align-items:center;
}
.split.reverse .split-art{ order:2; }
.split-art{
  border-radius:var(--radius);
  background:linear-gradient(150deg,var(--honey-pale),var(--paper) 60%);
  border:1px solid var(--paper-line);
  box-shadow:var(--shadow);
  aspect-ratio:4/3.1;
  display:grid; place-items:center;
  padding:30px;
}
.split-art svg{ width:100%; height:100%; }
.split h2{ font-size:clamp(1.6rem,3vw,2.2rem); }
.split .lede{ margin-bottom:1.3em; }

.check-list{ display:grid; gap:14px; margin-top:24px; }
.check-list li{
  display:flex; gap:12px; align-items:flex-start;
  font-size:.98rem; color:var(--text-soft);
}
.check-list li b{ color:var(--text); }
.check-list .dot{
  flex:none; width:22px; height:22px; border-radius:50%;
  background:var(--honey); color:#fff; display:grid; place-items:center;
  font-size:.7rem; margin-top:2px;
}

/* ---------- Porc Negre / cards ---------- */
.card-grid{
  display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:26px;
}
.card{
  background:var(--paper); border:1px solid var(--paper-line); border-radius:var(--radius);
  padding:30px 26px; box-shadow:var(--shadow);
  transition:transform .25s ease, box-shadow .25s ease;
}
.card:hover{ transform:translateY(-5px); box-shadow:0 20px 42px rgba(0,0,0,.4); }
.card .icon{
  width:52px; height:52px; border-radius:14px;
  background:var(--honey-pale); display:grid; place-items:center; margin-bottom:18px;
}
.card .icon svg{ width:28px; height:28px; }
.card h3{ font-size:1.15rem; margin-bottom:.4em; color:var(--dark-text); }
.card p{ font-size:.94rem; color:var(--dark-text-soft); margin-bottom:0; }

/* ---------- Values ---------- */
.values-grid{
  display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:34px;
  margin-top:10px;
}
.value{ text-align:center; }
.value .icon{
  width:64px; height:64px; margin:0 auto 16px; border-radius:50%;
  background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.25);
  display:grid; place-items:center;
}
.section--dark .value .icon{ background:rgba(255,255,255,.10); }
.value .icon svg{ width:30px; height:30px; }
.value h3{ font-size:1.05rem; margin-bottom:.35em; }
.value p{ font-size:.9rem; color:#cfcbc4; margin-bottom:0; }

/* ---------- Expansion ---------- */
.expansion{
  display:grid; grid-template-columns:1fr 1fr; gap:28px;
}
.expansion-card{
  background:var(--paper); border:1px solid var(--paper-line); border-radius:var(--radius);
  padding:38px 34px; box-shadow:var(--shadow); position:relative; overflow:hidden;
}
.expansion-card::before{
  content:''; position:absolute; top:-40px; right:-40px; width:140px; height:140px;
  border-radius:50%; background:var(--honey-pale); z-index:0;
}
.expansion-card > *{ position:relative; z-index:1; }
.expansion-card .icon{
  width:56px; height:56px; border-radius:16px; background:var(--bg);
  display:grid; place-items:center; margin-bottom:20px;
}
.expansion-card .icon svg{ width:30px; height:30px; }
.expansion-card h3{ font-size:1.3rem; color:var(--dark-text); }
.expansion-card p{ color:var(--dark-text-soft); }

.expansion-note{
  grid-column:1/-1;
  background:var(--paper-2); border:1px dashed var(--honey);
  border-radius:var(--radius); padding:26px 30px; margin-top:6px;
  display:flex; gap:18px; align-items:center; flex-wrap:wrap; justify-content:space-between;
}
.expansion-note p{ margin:0; max-width:640px; color:var(--dark-text-soft); }

/* ---------- Contact / CTA ---------- */
.contact-box{
  background:linear-gradient(150deg,var(--honey-dark),var(--honey) 120%);
  border-radius:24px; padding:60px 50px; text-align:center; color:#fff;
  box-shadow:0 20px 50px rgba(0,0,0,.45);
}
.contact-box h2{ color:#fff; }
.contact-box .lede{ color:#f3e3e6; max-width:560px; margin-left:auto; margin-right:auto; }
.contact-email{
  display:inline-block; margin-top:22px; font-family:var(--serif);
  font-size:1.5rem; font-weight:600; color:#fff;
  border-bottom:2px solid rgba(255,255,255,.6); padding-bottom:4px;
}
.contact-email:hover{ border-color:#fff; }

/* ---------- Footer ---------- */
.site-footer{ background:var(--bg-alt); color:#c9c6c0; padding:50px 0 26px; }
.footer-top{
  display:flex; justify-content:space-between; align-items:flex-start; gap:30px;
  flex-wrap:wrap; padding-bottom:30px; border-bottom:1px solid rgba(255,255,255,.10);
}
.footer-brand{ display:flex; align-items:center; gap:12px; }
.footer-brand span{ font-family:var(--serif); font-size:1.15rem; color:#fff; }
.footer-cols{ display:flex; gap:60px; flex-wrap:wrap; }
.footer-col h4{ color:#fff; font-family:var(--sans); font-size:.85rem; letter-spacing:.08em; text-transform:uppercase; margin-bottom:14px; }
.footer-col a, .footer-col p{ display:block; font-size:.92rem; color:#c9c6c0; margin-bottom:8px; }
.footer-col a:hover{ color:var(--honey-light); }
.footer-bottom{
  display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:10px;
  padding-top:22px; font-size:.82rem; color:#9a9994;
}
.footer-bottom .lang-switch a{ border-color:rgba(255,255,255,.18); color:#c9c6c0; }
.footer-bottom .lang-switch a.is-active{ background:var(--honey); border-color:var(--honey); color:#fff; }

/* ---------- Contact form ---------- */
.contact-form{ display:grid; gap:16px; text-align:left; margin-top:30px; }
.contact-form .row{ display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.contact-form label{ display:block; font-size:.8rem; font-weight:600; margin-bottom:6px; color:#f3e3e6; }
.contact-form input,
.contact-form select,
.contact-form textarea{
  width:100%; padding:12px 14px; border-radius:10px;
  border:1px solid rgba(255,255,255,.35); background:rgba(255,255,255,.12);
  color:#fff; font-family:var(--sans); font-size:.94rem;
}
.contact-form select{ appearance:auto; }
.contact-form select option{ color:var(--dark-text); }
.contact-form input::placeholder,
.contact-form textarea::placeholder{ color:rgba(255,255,255,.62); }
.contact-form textarea{ min-height:130px; resize:vertical; }
.contact-form .hp-field{ position:absolute; left:-9999px; top:-9999px; }
.contact-form input.field-invalid,
.contact-form textarea.field-invalid{
  border-color:#f3a9a0; background:rgba(178,58,44,.14);
}
.field-error{
  display:block; min-height:1.1em; margin-top:5px;
  font-size:.78rem; color:#ffd7cf;
}
.form-actions{ display:flex; justify-content:center; margin-top:6px; }
.form-alert{
  border-radius:12px; padding:14px 20px; margin:0 auto 24px; max-width:560px;
  font-size:.92rem; text-align:center;
}
.form-alert--ok{ background:rgba(75,109,58,.35); border:1px solid #cfe3c2; color:#fff; }
.form-alert--error{ background:rgba(178,58,44,.30); border:1px solid #f3c9c2; color:#fff; }
.form-note{ font-size:.85rem; color:#f3e3e6; opacity:.9; margin-top:-6px; }

.captcha-widget{
  display:flex; align-items:center; gap:10px; text-align:left;
  border:1px solid rgba(255,255,255,.35); background:rgba(255,255,255,.12);
  border-radius:10px; padding:12px 14px;
}
.captcha-spinner{
  width:16px; height:16px; border-radius:50%; flex:none;
  border:2px solid rgba(255,255,255,.35); border-top-color:#fff;
  animation:captcha-spin .8s linear infinite;
}
@keyframes captcha-spin{ to{ transform:rotate(360deg); } }
.captcha-widget.is-verified .captcha-spinner{ display:none; }
.captcha-status{ font-size:.85rem; color:#f3e3e6; }

/* ---------- Cookie banner ---------- */
.cookie-banner{
  position:fixed; left:0; right:0; bottom:0; z-index:300;
  background:var(--bg-alt); color:#e6e4e0;
  box-shadow:0 -10px 26px rgba(0,0,0,.4);
}
.cookie-banner[hidden]{ display:none; }
.cookie-banner-inner{
  max-width:var(--maxw); margin:0 auto; padding:20px 28px;
  display:flex; align-items:center; justify-content:space-between; gap:24px; flex-wrap:wrap;
}
.cookie-banner-inner p{ margin:0; font-size:.88rem; color:#cbc8c2; max-width:720px; }
.cookie-banner-inner a{ color:var(--honey-light); text-decoration:underline; }
.cookie-banner-actions{ display:flex; gap:12px; flex:none; }
.cookie-banner-actions .btn{ padding:10px 20px; font-size:.85rem; }
@media (max-width:640px){
  .cookie-banner-inner{ flex-direction:column; align-items:stretch; text-align:center; }
  .cookie-banner-actions{ justify-content:center; }
  .contact-form .row{ grid-template-columns:1fr; }
}

/* ---------- Legal pages ---------- */
.legal{ max-width:800px; margin:0 auto; }
.legal h1{ font-size:clamp(1.9rem,3.6vw,2.6rem); margin-bottom:.2em; }
.legal .updated{ color:var(--text-soft); font-size:.88rem; margin-bottom:2.4em; }
.legal h2{ font-size:1.35rem; margin-top:1.8em; }
.legal h2:first-of-type{ margin-top:0; }
.legal p{ color:var(--text-soft); }
.legal ul{ list-style:disc; padding-left:1.4em; margin:0 0 1.2em; }
.legal li{ margin-bottom:.5em; color:var(--text-soft); }
.legal a{ color:var(--honey-light); text-decoration:underline; }

/* ---------- Responsive ---------- */
@media (max-width:920px){
  .hero .container{ grid-template-columns:1fr; }
  .hero-badge{ width:220px; order:-1; margin:0 auto; }
  .split, .split.reverse{ grid-template-columns:1fr; }
  .split-art{ order:-1 !important; max-width:420px; margin:0 auto; }
  .expansion{ grid-template-columns:1fr; }
  .stat-row{ grid-template-columns:1fr; gap:26px; }
}
@media (max-width:800px){
  .main-nav{
    position:fixed; inset:84px 0 0 0; height:calc(100vh - 84px);
    background:var(--bg); flex-direction:column; align-items:flex-start;
    padding:34px 28px; gap:22px; transform:translateX(100%);
    transition:transform .3s ease; overflow-y:auto;
  }
  .main-nav.is-open{ transform:translateX(0); }
  .main-nav a{ font-size:1.15rem; }
  .lang-switch{ margin-left:0; margin-top:10px; }
  .nav-toggle{
    display:block; background:none; border:none; cursor:pointer; padding:6px;
  }
  .nav-toggle span{
    display:block; width:24px; height:2px; background:var(--text); margin:5px 0; transition:.25s;
  }
  .nav-toggle.is-open span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
  .nav-toggle.is-open span:nth-child(2){ opacity:0; }
  .nav-toggle.is-open span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }
}
@media (max-width:640px){
  .section{ padding:70px 0; }
  .contact-box{ padding:44px 24px; }
  .footer-cols{ gap:34px; }
}
