:root {
    --azul: #0f4c81;
    --dorado: #d4af37;
    --marfil: #f8f6f2;
    --borde: #eae5dc;
    --som: 0 5px 15px rgba(0,0,0,0.1);
    --maxw: 1200px;
  }
  
  /* RESET */
  * { margin:0; padding:0; box-sizing:border-box; font-family: Georgia, serif; }
  
  /* Material Symbols */
  .material-symbols-outlined {
    font-variation-settings: 'FILL' 0,'wght' 400,'GRAD' 0,'opsz' 24;
    font-size: 2rem;
    cursor: pointer;
    color: black;
    transition: color .2s ease;
  }
  .material-symbols-outlined.active { color: var(--dorado); }
  
  /* Container */
  .container { max-width: var(--maxw); margin:0 auto; padding:0 20px; }
  a { color: inherit; text-decoration: none; }
  
  /* Header */
  .header-row { background:#fff; border-bottom:1px solid var(--borde); }
  .header-grid { display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:20px; padding:16px 0; }
  .logo-text { display:inline-flex; align-items:center; gap:16px; justify-self:center; min-width:0; }
  .logo { width:80px; height:80px; flex-shrink:0; border-radius:50%; overflow:hidden; }
  .logo img { width:100%; height:100%; object-fit:cover; }
  .text-logo {
    font-family:"Miss Fajardose", cursive;
    font-weight:400; font-style:normal;
    line-height:1; white-space:nowrap;
    font-size:clamp(1.6rem,5vw,3.5rem);
    letter-spacing:clamp(0.02em,0.6vw,0.06em);
    transition: font-size .25s ease, letter-spacing .25s ease, opacity .25s ease;
  }
  .text-logo span:nth-child(1){ color:var(--azul);}
  .text-logo span:nth-child(2){ color:var(--dorado);}
  @media(max-width:900px){ .text-logo { opacity: clamp(0, calc((100vw - 560px)/200),1); } }
  @media(max-width:560px){ .text-logo{ display:none; } }
  
  /* Redes sociales */
  .socials { justify-self:end; display:flex; gap:12px; }
  .social-icon {
    width:clamp(28px,3vw,40px);
    height:clamp(28px,3vw,40px);
    border-radius:50%;
    background:var(--azul);
    color:#fff;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    font-size:clamp(14px,1.8vw,18px);
    transition: all .2s ease;
  }
  .social-icon:hover { background: var(--dorado); transform: translateY(-2px); }
  @media(max-width:768px){ .socials{ display:none; } }
  
  /* Navegación */
  .nav-row{ background:#fff; }
  .nav-inner{ display:flex; align-items:center; justify-content:space-between; gap:16px; position:relative; padding:8px 0; }
  
  /* Menú Desktop */
  .main-menu{ list-style:none; display:flex; gap:28px; flex:1; justify-content:center; }
  .main-menu>li{ position:relative; }
  .main-menu a{ display:block; padding:14px 8px; font-weight:600; font-size:1.06rem; color:var(--azul); transition: color .2s ease; }
  .main-menu a:hover{ color:var(--dorado); }
  .sub-menu { position:absolute; top:100%; left:0; min-width:220px; background:#fff; border-radius:6px; box-shadow:var(--som); list-style:none; padding:10px 0; display:none; z-index:10; }
  .sub-menu .sub-menu{ left:100%; top:0; }
  .main-menu li:hover>.sub-menu{ display:block; }
  .sub-menu a{ padding:12px 18px; white-space:nowrap; }
  .has-submenu > a::after{ content:"▾"; margin-left:6px; font-size:.92rem; }
  
  /* Área Privada Desktop */
  .desktop-private{ display:flex; justify-content:center; align-items:center; margin-left:20px; }
  .private-area{
    background:var(--azul);
    color:#fff;
    border:none;
    padding:12px 22px;
    border-radius:8px;
    font-weight:700;
    cursor:pointer;
    transition:background .2s ease, transform .1s ease;
    font-size:1rem; white-space:nowrap;
  }
  .private-area:hover{ background:var(--dorado); }
  .private-area:active{ transform: translateY(1px); }
  @media(max-width:768px){ .desktop-private{ display:none; } }
  
  /* Móvil */
  .mobile-nav{ display:none; width:100%; align-items:center; gap:16px; }
  .half{ width:50%; display:flex; }
  .half--left{ justify-content:center; }
  .half--right{ justify-content:center; }
  @media(max-width:768px){
    .mobile-nav{ display:flex; }
    .main-menu{
      position:absolute; top:100%; left:0; width:100%; flex-direction:column; gap:0; background:#fff; border-radius:0 0 10px 10px;
      box-shadow:var(--som); padding:8px 0; z-index:999; opacity:0; visibility:hidden; pointer-events:none;
      transform:translateY(-8px);
      transition: opacity .22s ease, transform .22s ease, visibility 0s linear .22s;
    }
    .main-menu.active{ opacity:1; visibility:visible; pointer-events:auto; transform:translateY(0); transition: opacity .22s ease, transform .22s ease, visibility 0s; }
    .main-menu>li{ width:100%; border-bottom:1px solid #eee; }
    .main-menu a{ padding:14px 18px; font-size:clamp(0.9rem,3vw,1rem); }
    .sub-menu{ position:static; box-shadow:none; padding:0; max-height:0; overflow:hidden; transition:max-height .25s ease; }
    .sub-menu.active{ max-height:1000px; }
    .sub-menu .sub-menu{ padding-left:14px; }
    .has-submenu > a::after{ content:"▸"; float:right; }
    .private-area{ font-size:clamp(0.8rem,3vw,1rem); padding:10px 16px; }
  }