/* Almaris Hospitality — estilos compartidos de las páginas del blog.
   Los colores y tipografías se editan en :root (igual que en index.html). */
  /* ============================================================
     CONFIGURACIÓN CENTRAL — edita aquí nombre, colores y contacto
     ============================================================ */
  :root{
    --marfil:      #F5F0E6;
    --blanco:       #FBF8F1;
    --chocolate:    #2D211A;
    --arena:        #D8C9B5;
    --terracota:    #B96F52;
    --terracota-osc:#9c5940;

    --font-serif: 'Bodoni Moda', 'Times New Roman', serif;
    --font-sans:  'Montserrat', -apple-system, BlinkMacSystemFont, sans-serif;

    --maxw: 1180px;
    --logo-indent: 2.75rem; /* separación del logo respecto al borde izquierdo del texto */
    --gutter: clamp(1.25rem, 4vw, 3.5rem);
  }

  *{box-sizing:border-box;}
  html{scroll-behavior:smooth; scroll-padding-top:5.6rem;}
  body{
    margin:0;
    background:var(--marfil);
    color:var(--chocolate);
    font-family:var(--font-sans);
    font-size:16px;
    line-height:1.6;
    -webkit-font-smoothing:antialiased;
  }
  img{max-width:100%;display:block;}
  a{color:inherit;}
  h1,h2,h3{
    font-family:var(--font-serif);
    font-weight:600;
    margin:0;
    letter-spacing:-0.008em;
  }
  h2::before{
    content:"";
    display:block;
    width:44px;
    height:2px;
    background:var(--terracota);
    margin-bottom:1.1rem;
  }
  p{margin:0;}
  .wrap{max-width:var(--maxw); margin:0 auto; padding-left:var(--gutter); padding-right:var(--gutter);}
  section{position:relative;}

  .reveal{
    opacity:0;
    transform:translateY(28px);
    transition:opacity 0.8s ease, transform 0.8s ease;
  }
  .reveal.is-visible{
    opacity:1;
    transform:translateY(0);
  }

  /* Reduced motion */
  @media (prefers-reduced-motion: reduce){
    html{scroll-behavior:auto;}
    *{animation-duration:0.001ms !important; transition-duration:0.001ms !important;}
  }

  /* Skip link */
  .skip-link{
    position:absolute; left:-9999px; top:0;
    background:var(--chocolate); color:var(--blanco);
    padding:0.8rem 1.2rem; z-index:200; font-size:0.9rem;
  }
  .skip-link:focus{ left:1rem; top:1rem; }

  :focus-visible{
    outline:2px solid var(--terracota);
    outline-offset:3px;
  }

  /* ---------------- Header ---------------- */
  header.site{
    position:sticky; top:0; z-index:100;
    background:rgba(245,240,230,0.92);
    backdrop-filter:blur(6px);
    border-bottom:1px solid var(--arena);
  }
  .nav-row{
    display:flex; align-items:center;
    gap:1.5rem;
    padding:0.7rem 0;
  }
  .brand{
    display:flex;
    align-items:center;
    flex:none;
    margin-right:auto;
    margin-left:var(--logo-indent);
    text-decoration:none;
  }
  .header-actions{ display:flex; align-items:center; gap:0.5rem; flex:none; }
  .brand img{
    height:64px;
    width:auto;
    display:block;
  }
  nav.primary-nav{ display:flex; align-items:center; gap:2.1rem; margin-right:0.8rem; }
  nav.primary-nav a{
    text-decoration:none;
    font-size:0.92rem;
    color:var(--chocolate);
    position:relative;
    padding:0.2rem 0;
    white-space:nowrap;
  }
  nav.primary-nav a[aria-current="page"]{ color:var(--terracota); }
  nav.primary-nav a:not(.cta)::after{
    content:"";
    position:absolute; left:0; bottom:-2px;
    width:0%; height:1px; background:var(--terracota);
    transition:width 0.25s ease;
  }
  nav.primary-nav a:not(.cta):hover::after{ width:100%; }
  .cta-btn{
    background:var(--terracota);
    color:var(--blanco) !important;
    padding:0.65rem 1.3rem;
    border-radius:2px;
    font-size:0.88rem;
    font-weight:500;
    text-decoration:none !important;
    white-space:nowrap;
    border:1px solid var(--terracota);
    transition:background 0.2s ease, color 0.2s ease;
  }
  .cta-btn:hover{ background:transparent; color:var(--terracota) !important; }
  .menu-toggle{
    display:none;
    background:none; border:none; cursor:pointer;
    padding:0.4rem; color:var(--chocolate);
  }
  .menu-toggle svg{ width:26px; height:26px; }

  /* ---------------- Footer ---------------- */
  footer.site{
    background:var(--chocolate); color:#e9ddca;
    padding:3rem 0 2rem;
    font-size:0.88rem;
  }
  .footer-grid{
    display:flex; justify-content:space-between; align-items:center; gap:2rem; flex-wrap:wrap;
    padding-bottom:2rem; border-bottom:1px solid #4a3a2e;
  }
  .footer-brand{ display:block; }
  .footer-brand img{ height:56px; width:auto; display:block; filter:brightness(0) invert(1); opacity:0.95; }
  .footer-nav{ display:flex; gap:1.6rem; flex-wrap:wrap; }
  .footer-nav a{ text-decoration:none; color:#e9ddca; }
  .footer-nav a:hover{ color:var(--terracota); }
  .footer-bottom{
    padding-top:1.6rem;
    display:flex; justify-content:space-between; gap:1rem; flex-wrap:wrap;
    color:#a7947e;
  }
  .footer-bottom a{ color:#a7947e; text-decoration:underline; }


  /* ---------------- Cabecera responsive ---------------- */
  @media (max-width: 900px){ .brand img{ height:56px; } }
  @media (max-width: 1080px){
    nav.primary-nav{
      position:absolute; top:100%; left:0; right:0;
      background:var(--marfil);
      flex-direction:column; align-items:flex-start; gap:0; margin-right:0;
      padding:1rem var(--gutter) 1.4rem;
      border-bottom:1px solid var(--arena);
      transform:translateY(-8px);
      opacity:0; pointer-events:none; visibility:hidden;
      transition:opacity 0.2s ease, transform 0.2s ease, visibility 0.2s;
    }
    nav.primary-nav.open{ opacity:1; transform:none; pointer-events:auto; visibility:visible; }
    nav.primary-nav a{ padding:0.65rem 0; width:100%; }
    .menu-toggle{ display:block; }
  }
  @media (max-width: 720px){
    html{ scroll-padding-top:4.6rem; }
    :root{ --logo-indent:1.1rem; }
    .nav-row{ gap:0.6rem; padding:0.55rem 0; }
    .brand img{ height:46px; }
    .header-cta{ padding:0.55rem 0.85rem; font-size:0.78rem; }
  }
  @media (max-width: 380px){
    .brand img{ height:40px; }
    .header-cta{ padding:0.5rem 0.65rem; font-size:0.72rem; }
  }

  /* ============================================================
     BLOG
     ============================================================ */
  .blog-hero{ padding:clamp(3rem,7vw,5.5rem) 0 clamp(1.5rem,4vw,2.5rem); }
  .blog-hero h1{ font-size:clamp(2.3rem,4.6vw,3.6rem); line-height:1.12; }
  .blog-hero p{ margin-top:1.2rem; max-width:52ch; font-size:1.06rem; color:#4a3a2e; }

  .post-list{ border-top:1px solid var(--arena); margin-bottom:clamp(3rem,7vw,5rem); }
  .post-row{
    display:grid; grid-template-columns:170px 1fr; gap:2rem;
    padding:2.2rem 0;
    border-bottom:1px solid var(--arena);
    text-decoration:none;
  }
  .post-date{ font-size:0.8rem; color:#5c4b3d; text-transform:uppercase; letter-spacing:0.07em; padding-top:0.5rem; }
  .post-row h2{ font-size:clamp(1.4rem,2.6vw,1.9rem); line-height:1.25; transition:color 0.2s ease; }
  .post-row h2::before{ display:none; }
  .post-row:hover h2{ color:var(--terracota); }
  .post-row p{ margin-top:0.8rem; color:#4a3a2e; max-width:62ch; }
  .post-more{ display:inline-block; margin-top:1rem; font-size:0.9rem; font-weight:500; color:var(--terracota); border-bottom:1px solid var(--terracota); padding-bottom:2px; }

  .article{ padding:clamp(2.5rem,6vw,4.5rem) 0 clamp(3rem,6vw,5rem); }
  .article-inner{ max-width:720px; margin:0 auto; padding:0 var(--gutter); }
  .crumbs{ font-size:0.85rem; color:#5c4b3d; }
  .crumbs a{ text-decoration:none; border-bottom:1px solid var(--arena); }
  .crumbs a:hover{ color:var(--terracota); border-bottom-color:var(--terracota); }
  .article h1{ font-size:clamp(2rem,4.2vw,3.1rem); line-height:1.15; margin-top:1.4rem; }
  .article-meta{ margin-top:1.2rem; font-size:0.85rem; color:#5c4b3d; }
  .article-body{ margin-top:2.4rem; font-size:1.06rem; line-height:1.85; color:#3c2f26; }
  .article-body p{ margin:0 0 1.35rem; }
  .article-body .lead{ font-size:1.25rem; line-height:1.7; color:var(--chocolate); }
  .article-body h2{ font-size:1.6rem; line-height:1.25; margin:2.8rem 0 1.1rem; }
  .article-body .stack{ font-family:var(--font-serif); font-size:1.3rem; line-height:1.5; margin:0 0 1.6rem; padding-left:1.2rem; border-left:2px solid var(--terracota); }
  .article-body .stack span{ display:block; }
  .article-body ul{ list-style:none; margin:0 0 1.8rem; padding:0; }
  .article-body li{ position:relative; padding:0.75rem 0 0.75rem 1.4rem; border-top:1px solid var(--arena); }
  .article-body li:last-child{ border-bottom:1px solid var(--arena); }
  .article-body li::before{ content:""; position:absolute; left:0; top:1.55rem; width:8px; height:1px; background:var(--terracota); }
  .article-body strong{ font-weight:600; color:var(--chocolate); }
  .article-body .pull{ font-family:var(--font-serif); font-size:clamp(1.6rem,3.4vw,2.2rem); line-height:1.3; font-weight:600; margin:2.4rem 0 0; }
  .article-tags{ display:flex; flex-wrap:wrap; gap:0.5rem; margin-top:2.4rem; padding:0; list-style:none; }
  .article-tags li{ font-size:0.78rem; color:#5c4b3d; border:1px solid var(--arena); padding:0.3rem 0.75rem; border-radius:2px; }
  .article-share{ margin-top:1.8rem; font-size:0.9rem; }
  .article-share a{ color:var(--terracota); border-bottom:1px solid var(--terracota); text-decoration:none; padding-bottom:2px; }
  .article-cta{ background:var(--chocolate); color:var(--blanco); padding:clamp(1.6rem,4vw,2.4rem); margin-top:3rem; border-radius:3px; }
  .article-cta p{ font-family:var(--font-serif); font-size:clamp(1.3rem,2.6vw,1.7rem); line-height:1.35; margin:0 0 1.4rem; }
  .article-back{ display:inline-block; margin-top:2rem; font-size:0.9rem; text-decoration:none; border-bottom:1px solid var(--chocolate); padding-bottom:2px; }
  @media (max-width:720px){
    .post-row{ grid-template-columns:1fr; gap:0.4rem; }
    .post-date{ padding-top:0; }
  }

  /* ---------------- Publicación programada y artículos ---------------- */
  .post-row[hidden]{ display:none; }
  .article-body h3{ font-size:1.25rem; line-height:1.3; margin:2rem 0 0.8rem; }
  .article-body .next-article{
    margin-top:2.6rem; padding:1.2rem 1.4rem;
    background:var(--blanco); border:1px solid var(--arena); border-left:3px solid var(--terracota);
    border-radius:3px; font-size:1rem; line-height:1.6;
  }

  /* ---------------- Selector de idioma ---------------- */
  .lang-switch{ display:flex; align-items:center; gap:0.1rem; margin-right:0.5rem; }
  .lang-switch a{
    font-size:0.8rem; font-weight:500; letter-spacing:0.05em; text-decoration:none;
    color:var(--chocolate); padding:0.4rem 0.5rem; border-bottom:1px solid transparent;
  }
  .lang-switch a:hover{ color:var(--terracota); }
  .lang-switch a[aria-current="true"]{ color:var(--terracota); border-bottom-color:var(--terracota); }
  .lang-switch a + a::before{ content:none; }
  @media (max-width: 720px){
    .lang-switch{ margin-right:0.1rem; }
    .lang-switch a{ font-size:0.74rem; padding:0.35rem 0.3rem; }
  }
  @media (max-width: 380px){
    .lang-switch a{ font-size:0.68rem; padding:0.3rem 0.22rem; }
  }