<!DOCTYPE html>
<html lang="es">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover">
  <title>Pablo Atchugarry — Próximamente</title>
  <meta name="robots" content="noindex, nofollow">
  <meta name="theme-color" content="#F5F2EC">
  <meta name="color-scheme" content="light">
  <meta name="description" content="Estamos trabajando en el nuevo sitio web oficial de Pablo Atchugarry.">

  <link rel="preconnect" href="https://fonts.googleapis.com">
  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
  <link href="https://fonts.googleapis.com/css2?family=Manrope:wght@200;300;400;500;600;700&display=swap" rel="stylesheet">

  <style>
    :root{
      --bg:#F5F2EC; --ink:#1A1815; --soft:#6E675C; --muted:#9A9286;
      --accent:#B58B5A; --line:rgba(26,24,21,.12);
    }
    *{box-sizing:border-box;margin:0;padding:0}
    html{height:100%}
    body{
      background:var(--bg);color:var(--ink);
      font-family:"Manrope",system-ui,sans-serif;font-weight:300;
      -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
      overflow-x:hidden;line-height:1.5;
      display:flex;align-items:center;justify-content:center;
      min-height:100svh;
      padding:clamp(1.75rem,6vw,4rem);
      padding-left:max(1.25rem,env(safe-area-inset-left));
      padding-right:max(1.25rem,env(safe-area-inset-right));
      padding-top:max(1.75rem,env(safe-area-inset-top));
      padding-bottom:max(1.75rem,env(safe-area-inset-bottom));
    }
    main{width:100%;max-width:600px;margin:auto;text-align:center;
      animation:rise .9s cubic-bezier(.16,1,.3,1) both}
    @keyframes rise{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}

    /* Marca */
    .brand{
      font-size:clamp(.8rem,3.6vw,.95rem);font-weight:600;
      letter-spacing:.18em;text-transform:uppercase;color:var(--ink);
      margin-left:.18em;
    }
    .rule{width:36px;height:1px;background:var(--ink);opacity:.45;
      margin:clamp(1.3rem,4vw,2.1rem) auto}

    /* Estado: en construcción (envuelve por frase, nunca se corta) */
    .status{
      display:flex;flex-wrap:wrap;align-items:center;justify-content:center;
      gap:.35em .55em;max-width:34ch;margin:0 auto;
      font-size:clamp(.62rem,2.8vw,.7rem);font-weight:600;letter-spacing:.12em;
      text-transform:uppercase;color:var(--soft);
    }
    .status .ph{white-space:nowrap}
    .status .sep{color:var(--muted);opacity:.7}
    .dot{flex:0 0 auto;width:7px;height:7px;border-radius:50%;background:var(--accent);
      box-shadow:0 0 0 0 rgba(181,139,90,.5);animation:pulse 2.4s ease-out infinite}
    @keyframes pulse{0%{box-shadow:0 0 0 0 rgba(181,139,90,.45)}70%{box-shadow:0 0 0 7px rgba(181,139,90,0)}100%{box-shadow:0 0 0 0 rgba(181,139,90,0)}}

    /* Mensaje principal (ES) */
    h1{
      font-weight:300;letter-spacing:-.01em;line-height:1.34;
      font-size:clamp(1.45rem,6.2vw,2.3rem);max-width:22ch;
      margin:clamp(1.4rem,4.5vw,2.2rem) auto 0;text-wrap:balance;
    }
    h1 strong{font-weight:600}

    /* Traducciones EN / IT */
    .langs{
      margin:clamp(1.5rem,4.5vw,2.2rem) auto 0;max-width:44ch;
      display:flex;flex-direction:column;gap:.65em;
    }
    .langs p{
      display:flex;gap:.7em;align-items:baseline;text-align:left;
      font-size:clamp(.92rem,3.8vw,1.05rem);color:var(--soft);line-height:1.55;
    }
    .langs .tag{
      flex:0 0 auto;font-size:.62rem;font-weight:700;letter-spacing:.12em;
      color:var(--muted);text-transform:uppercase;padding-top:.28em;min-width:1.7em;
    }

    /* Pie */
    .place{
      margin-top:clamp(2.2rem,7vw,3.6rem);
      font-size:clamp(.62rem,2.8vw,.68rem);font-weight:600;letter-spacing:.2em;
      text-transform:uppercase;color:var(--muted);margin-left:.2em;
    }
    .access{margin-top:clamp(1.5rem,4.5vw,2.1rem)}
    .access a{
      display:inline-block;font-size:clamp(.64rem,2.8vw,.68rem);font-weight:600;
      letter-spacing:.18em;text-transform:uppercase;color:var(--soft);text-decoration:none;
      padding:.95em 1.7em;border:1px solid var(--line);border-radius:100px;
      -webkit-tap-highlight-color:transparent;
      transition:color .25s ease,border-color .25s ease,background .25s ease;
    }
    .access a:hover,.access a:focus-visible{color:var(--ink);border-color:var(--ink);background:rgba(26,24,21,.03)}
    .copy{margin-top:1.3rem;font-size:clamp(.7rem,2.8vw,.74rem);color:var(--muted);opacity:.85;
      padding:0 .5rem}

    /* Refuerzo de spacing en pantallas amplias */
    @media (min-width:640px){
      .brand{letter-spacing:.26em;margin-left:.26em}
      .place{letter-spacing:.28em}
    }
    @media (prefers-reduced-motion:reduce){main{animation:none}.dot{animation:none}}
  </style>
</head>
<body>
  <main>
    <p class="brand">Pablo Atchugarry</p>
    <div class="rule"></div>

    <p class="status">
      <span class="dot" aria-hidden="true"></span>
      <span class="ph">Sitio en construcción</span><span class="sep" aria-hidden="true">·</span>
      <span class="ph">Under construction</span><span class="sep" aria-hidden="true">·</span>
      <span class="ph">Sito in costruzione</span>
    </p>

    <h1>Estamos preparando el nuevo <strong>sitio web oficial</strong> de Pablo Atchugarry. Estará disponible muy pronto.</h1>

    <div class="langs">
      <p><span class="tag">EN</span> <span>We’re building the new official website of Pablo Atchugarry. It will be online soon.</span></p>
      <p><span class="tag">IT</span> <span>Stiamo preparando il nuovo sito ufficiale di Pablo Atchugarry. Sarà online a breve.</span></p>
    </div>

    <p class="place">Lecco · Manantiales</p>

    <p class="access"><a href="/acceso">Acceso · Access</a></p>
    <p class="copy">© Pablo Atchugarry 2026. Todos los derechos reservados.</p>
  </main>
</body>
</html>
