Develop #1
+11
@@ -32,6 +32,12 @@
|
||||
<link rel="preload" href="fonts/material-symbols-outlined.woff2" as="font" type="font/woff2" crossorigin />
|
||||
<link rel="preload" href="fonts/space/space-grotesk-v22-latin-regular.woff2" as="font" type="font/woff2" crossorigin />
|
||||
<link rel="stylesheet" href="css/styles.css?v=1.1" />
|
||||
<script
|
||||
defer
|
||||
src="https://stats.itziarzameza.dev/script.js"
|
||||
data-website-id="8d8d648f-4a0c-4315-b287-5983ffedc8c4"
|
||||
data-domains="www.itziarzameza.dev"
|
||||
></script>
|
||||
</head>
|
||||
<body
|
||||
class="bg-background-light dark:bg-background-dark font-display text-slate-900 dark:text-slate-100 selection:bg-primary/30 transition-colors duration-300"
|
||||
@@ -324,6 +330,11 @@
|
||||
href="https://github.com/itziarZG"
|
||||
>GitHub</a
|
||||
>
|
||||
<a
|
||||
class="hover:text-primary transition-colors text-slate-600 dark:text-slate-400"
|
||||
href="privacidad.html"
|
||||
>Privacidad</a
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
+412
-208
File diff suppressed because it is too large
Load Diff
+404
-224
File diff suppressed because it is too large
Load Diff
+241
-56
@@ -29,12 +29,42 @@
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<link rel="alternate" hreflang="es" href="https://www.itziarzameza.dev/index.html" />
|
||||
<link rel="alternate" hreflang="ca" href="https://www.itziarzameza.dev/index-ca.html" />
|
||||
<link rel="alternate" hreflang="en" href="https://www.itziarzameza.dev/index-en.html" />
|
||||
<link rel="preload" href="fonts/material-symbols-outlined.woff2" as="font" type="font/woff2" crossorigin />
|
||||
<link rel="preload" href="fonts/space/space-grotesk-v22-latin-regular.woff2" as="font" type="font/woff2" crossorigin />
|
||||
<link
|
||||
rel="alternate"
|
||||
hreflang="es"
|
||||
href="https://www.itziarzameza.dev/index.html"
|
||||
/>
|
||||
<link
|
||||
rel="alternate"
|
||||
hreflang="ca"
|
||||
href="https://www.itziarzameza.dev/index-ca.html"
|
||||
/>
|
||||
<link
|
||||
rel="alternate"
|
||||
hreflang="en"
|
||||
href="https://www.itziarzameza.dev/index-en.html"
|
||||
/>
|
||||
<link
|
||||
rel="preload"
|
||||
href="fonts/material-symbols-outlined.woff2"
|
||||
as="font"
|
||||
type="font/woff2"
|
||||
crossorigin
|
||||
/>
|
||||
<link
|
||||
rel="preload"
|
||||
href="fonts/space/space-grotesk-v22-latin-regular.woff2"
|
||||
as="font"
|
||||
type="font/woff2"
|
||||
crossorigin
|
||||
/>
|
||||
<link rel="stylesheet" href="css/styles.css?v=1.1" />
|
||||
<script
|
||||
defer
|
||||
src="https://stats.itziarzameza.dev/script.js"
|
||||
data-website-id="8d8d648f-4a0c-4315-b287-5983ffedc8c4"
|
||||
data-domains="www.itziarzameza.dev"
|
||||
></script>
|
||||
</head>
|
||||
<body
|
||||
class="bg-background-light dark:bg-background-dark font-display text-slate-900 dark:text-slate-100 selection:bg-primary/30 transition-colors duration-300"
|
||||
@@ -97,12 +127,24 @@
|
||||
</nav>
|
||||
<div class="flex items-center gap-3">
|
||||
<!-- Language Switcher -->
|
||||
<div class="flex items-center gap-1.5 glass px-3 py-1.5 rounded-full text-xs font-bold">
|
||||
<div
|
||||
class="flex items-center gap-1.5 glass px-3 py-1.5 rounded-full text-xs font-bold"
|
||||
>
|
||||
<span class="text-primary">ES</span>
|
||||
<span class="text-slate-300 dark:text-slate-700">|</span>
|
||||
<a href="index-ca.html" class="text-slate-600 dark:text-slate-400 hover:text-primary transition-colors" title="Català">CA</a>
|
||||
<a
|
||||
href="index-ca.html"
|
||||
class="text-slate-600 dark:text-slate-400 hover:text-primary transition-colors"
|
||||
title="Català"
|
||||
>CA</a
|
||||
>
|
||||
<span class="text-slate-300 dark:text-slate-700">|</span>
|
||||
<a href="index-en.html" class="text-slate-600 dark:text-slate-400 hover:text-primary transition-colors" title="English">EN</a>
|
||||
<a
|
||||
href="index-en.html"
|
||||
class="text-slate-600 dark:text-slate-400 hover:text-primary transition-colors"
|
||||
title="English"
|
||||
>EN</a
|
||||
>
|
||||
</div>
|
||||
<button
|
||||
class="size-10 flex items-center justify-center rounded-full glass hover:bg-white/60 dark:hover:bg-white/10 transition-colors"
|
||||
@@ -268,9 +310,9 @@
|
||||
<p
|
||||
class="text-sm text-slate-600 dark:text-slate-400 leading-relaxed mb-4"
|
||||
>
|
||||
Optimizar el consumo de recursos, minimizando la transferencia
|
||||
de datos y la huella de carbono de las aplicaciones web que
|
||||
desarrollo.
|
||||
Optimizar el consumo de recursos, minimizando la
|
||||
transferencia de datos y la huella de carbono de las
|
||||
aplicaciones web que desarrollo.
|
||||
</p>
|
||||
</div>
|
||||
<a
|
||||
@@ -279,9 +321,13 @@
|
||||
rel="noopener noreferrer"
|
||||
class="inline-flex items-center gap-2 px-3.5 py-2.5 bg-emerald-500/10 border border-emerald-500/20 text-emerald-600 dark:text-emerald-400 rounded-xl text-xs font-bold hover:bg-emerald-500/20 transition-colors mt-2"
|
||||
>
|
||||
<span class="material-symbols-outlined text-base">verified</span>
|
||||
<span class="material-symbols-outlined text-base"
|
||||
>verified</span
|
||||
>
|
||||
<span>Green Software Practitioner</span>
|
||||
<span class="material-symbols-outlined text-xs ml-auto">open_in_new</span>
|
||||
<span class="material-symbols-outlined text-xs ml-auto"
|
||||
>open_in_new</span
|
||||
>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
@@ -645,18 +691,11 @@
|
||||
Servidor Navidrome
|
||||
</h4>
|
||||
</div>
|
||||
<p
|
||||
class="text-sm text-slate-600 dark:text-slate-400 leading-relaxed mb-4"
|
||||
>
|
||||
Instancia personal autohospedada de música en Hetzner
|
||||
para recuperar la soberanía sobre mis archivos de
|
||||
audio y evitar algoritmos corporativos de streaming.
|
||||
</p>
|
||||
</div>
|
||||
<div class="flex items-center justify-between mt-4">
|
||||
<span
|
||||
class="text-[10px] uppercase font-bold tracking-wider text-emerald-500 bg-emerald-500/10 px-2 py-1 rounded"
|
||||
>Operativo</span
|
||||
class="text-[10px] uppercase font-bold tracking-wider text-amber-500 bg-amber-500/10 px-2 py-1 rounded"
|
||||
>En el roadmap</span
|
||||
>
|
||||
<span class="text-xs text-slate-400"
|
||||
>Docker • Hetzner</span
|
||||
@@ -688,8 +727,8 @@
|
||||
</div>
|
||||
<div class="flex items-center justify-between mt-4">
|
||||
<span
|
||||
class="text-[10px] uppercase font-bold tracking-wider text-emerald-500 bg-emerald-500/10 px-2 py-1 rounded"
|
||||
>Operativo</span
|
||||
class="text-[10px] uppercase font-bold tracking-wider text-amber-500 bg-amber-500/10 px-2 py-1 rounded"
|
||||
>En el roadmap</span
|
||||
>
|
||||
<span class="text-xs text-slate-400"
|
||||
>n8n • Ollama • Whisper</span
|
||||
@@ -711,18 +750,11 @@
|
||||
Contribución Open Source
|
||||
</h4>
|
||||
</div>
|
||||
<p
|
||||
class="text-sm text-slate-600 dark:text-slate-400 leading-relaxed mb-4"
|
||||
>
|
||||
Colaboración activa y corrección de bugs en
|
||||
herramientas y frameworks de código abierto que
|
||||
utilizamos en el día a día.
|
||||
</p>
|
||||
</div>
|
||||
<div class="flex items-center justify-between mt-4">
|
||||
<span
|
||||
class="text-[10px] uppercase font-bold tracking-wider text-primary bg-primary/10 px-2 py-1 rounded"
|
||||
>Constante</span
|
||||
class="text-[10px] uppercase font-bold tracking-wider text-slate-500 bg-slate-500/10 px-2 py-1 rounded"
|
||||
>Sin iniciar</span
|
||||
>
|
||||
<span class="text-xs text-slate-400"
|
||||
>Forgejo • GitHub</span
|
||||
@@ -755,13 +787,47 @@
|
||||
<div class="flex items-center justify-between mt-4">
|
||||
<span
|
||||
class="text-[10px] uppercase font-bold tracking-wider text-amber-500 bg-amber-500/10 px-2 py-1 rounded"
|
||||
>En Desarrollo</span
|
||||
>Migración pendiente (actualmente en Vercel)</span
|
||||
>
|
||||
<span class="text-xs text-slate-400"
|
||||
>HTML5 • JS • D3.js</span
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Cases Tancades -->
|
||||
<div
|
||||
class="p-6 glass rounded-3xl border border-white/20 flex flex-col justify-between"
|
||||
>
|
||||
<div>
|
||||
<div class="flex items-center gap-3 mb-3">
|
||||
<span
|
||||
class="material-symbols-outlined text-primary text-2xl"
|
||||
>query_stats</span
|
||||
>
|
||||
<h4 class="font-bold text-lg dark:text-white">
|
||||
Cases Tancades
|
||||
</h4>
|
||||
</div>
|
||||
<p
|
||||
class="text-sm text-slate-600 dark:text-slate-400 leading-relaxed mb-4"
|
||||
>
|
||||
Diagnóstico abierto de la vivienda en Balears: cruza
|
||||
datos oficiales del INE, Airbnb y registros HUT del
|
||||
Govern para mostrar cuántos pisos están vacíos frente
|
||||
a la presión del alquiler turístico.
|
||||
</p>
|
||||
</div>
|
||||
<div class="flex items-center justify-between mt-4">
|
||||
<span
|
||||
class="text-[10px] uppercase font-bold tracking-wider text-emerald-500 bg-emerald-500/10 px-2 py-1 rounded"
|
||||
>Operativo</span
|
||||
>
|
||||
<span class="text-xs text-slate-400"
|
||||
>Next.js · Datos abiertos INE/Govern Balear</span
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -855,6 +921,135 @@
|
||||
digital sin pretensiones de sentar cátedra.
|
||||
</p>
|
||||
|
||||
<!-- Nota 1: Green Software Practitioner -->
|
||||
<article
|
||||
class="p-6 glass rounded-2xl border border-white/10 space-y-4"
|
||||
>
|
||||
<div class="flex items-center justify-between">
|
||||
<span
|
||||
class="text-xs text-slate-400 dark:text-slate-500 font-mono"
|
||||
>20 de Julio, 2026</span
|
||||
>
|
||||
<span
|
||||
class="px-2.5 py-0.5 bg-emerald-500/10 text-emerald-500 text-xs font-bold rounded-full flex items-center gap-1"
|
||||
>
|
||||
<span class="material-symbols-outlined text-xs"
|
||||
>verified</span
|
||||
>
|
||||
Green Software
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<h4 class="font-bold dark:text-white text-xl text-primary">
|
||||
Green Software Practitioner — 5 ideas que me llevo
|
||||
</h4>
|
||||
|
||||
<div
|
||||
class="space-y-4 text-sm text-slate-700 dark:text-slate-300 leading-relaxed"
|
||||
>
|
||||
<div>
|
||||
<h5
|
||||
class="font-bold text-slate-900 dark:text-white mb-1"
|
||||
>
|
||||
¿Por qué hice esta certificación?
|
||||
</h5>
|
||||
<p>
|
||||
Porque quiero construir tecnología que tenga en cuenta
|
||||
su impacto ambiental y social.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<h5
|
||||
class="font-bold text-slate-900 dark:text-white mb-2"
|
||||
>
|
||||
Cinco ideas que me llevo:
|
||||
</h5>
|
||||
<ol class="list-decimal list-inside space-y-2.5 pl-1">
|
||||
<li>
|
||||
<strong class="text-slate-900 dark:text-white"
|
||||
>La mejor energía es la que no se consume.</strong
|
||||
>
|
||||
<p
|
||||
class="text-xs text-slate-600 dark:text-slate-400 mt-0.5 pl-5"
|
||||
>
|
||||
Optimizar no es solo hacer la web más rápida.
|
||||
También significa consumir menos recursos.
|
||||
</p>
|
||||
</li>
|
||||
<li>
|
||||
<strong class="text-slate-900 dark:text-white"
|
||||
>La eficiencia empieza en el diseño.</strong
|
||||
>
|
||||
<p
|
||||
class="text-xs text-slate-600 dark:text-slate-400 mt-0.5 pl-5"
|
||||
>
|
||||
Elegir una arquitectura sencilla suele ser mejor
|
||||
que optimizar después.
|
||||
</p>
|
||||
</li>
|
||||
<li>
|
||||
<strong class="text-slate-900 dark:text-white"
|
||||
>Medir antes de mejorar.</strong
|
||||
>
|
||||
<p
|
||||
class="text-xs text-slate-600 dark:text-slate-400 mt-0.5 pl-5"
|
||||
>
|
||||
No podemos reducir aquello que no medimos.
|
||||
</p>
|
||||
</li>
|
||||
<li>
|
||||
<strong class="text-slate-900 dark:text-white"
|
||||
>El software también tiene huella de
|
||||
carbono.</strong
|
||||
>
|
||||
<p
|
||||
class="text-xs text-slate-600 dark:text-slate-400 mt-0.5 pl-5"
|
||||
>
|
||||
Cada transferencia de datos, proceso o
|
||||
almacenamiento tiene un coste.
|
||||
</p>
|
||||
</li>
|
||||
<li>
|
||||
<strong class="text-slate-900 dark:text-white"
|
||||
>Green Software no consiste solo en consumir
|
||||
menos.</strong
|
||||
>
|
||||
<p
|
||||
class="text-xs text-slate-600 dark:text-slate-400 mt-0.5 pl-5"
|
||||
>
|
||||
También implica diseñar productos que ayuden a
|
||||
reducir el impacto ambiental de las personas y las
|
||||
organizaciones.
|
||||
</p>
|
||||
</li>
|
||||
</ol>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<h5
|
||||
class="font-bold text-slate-900 dark:text-white mb-1"
|
||||
>
|
||||
¿Y ahora qué?
|
||||
</h5>
|
||||
<p>
|
||||
Estoy leyendo <em>Soberanía Tecnológica</em> porque
|
||||
creo que la sostenibilidad no depende solo del consumo
|
||||
energético, sino también de quién controla la
|
||||
infraestructura y el software que utilizamos.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Frase fija al final de la nota -->
|
||||
<div
|
||||
class="pt-3 border-t border-slate-200 dark:border-slate-800 text-xs italic text-slate-500 dark:text-slate-400"
|
||||
>
|
||||
Estas son notas de aprendizaje, no guías definitivas. Si
|
||||
ves algo que se pueda mejorar, me encantará escucharte.
|
||||
</div>
|
||||
</article>
|
||||
|
||||
<article class="p-6 glass rounded-2xl border border-white/10">
|
||||
<span
|
||||
class="text-xs text-slate-400 dark:text-slate-500 font-mono"
|
||||
@@ -883,29 +1078,14 @@
|
||||
>arrow_right_alt</span
|
||||
>
|
||||
</a>
|
||||
<div
|
||||
class="pt-3 border-t border-slate-200 dark:border-slate-800 text-xs italic text-slate-500 dark:text-slate-400 mt-4"
|
||||
>
|
||||
Estas son notas de aprendizaje, no guías definitivas. Si
|
||||
ves algo que se pueda mejorar, me encantará escucharte.
|
||||
</div>
|
||||
</article>
|
||||
|
||||
<article class="p-6 glass rounded-2xl border border-white/10">
|
||||
<span
|
||||
class="text-xs text-slate-400 dark:text-slate-500 font-mono"
|
||||
>2 de Junio, 2026</span
|
||||
>
|
||||
<h4
|
||||
class="font-bold dark:text-white text-lg mt-1 mb-2 hover:text-primary transition-colors cursor-pointer"
|
||||
>
|
||||
Migrando mi código: De GitHub a Forgejo en mi propio VPS
|
||||
</h4>
|
||||
<p
|
||||
class="text-sm text-slate-600 dark:text-slate-400 leading-relaxed"
|
||||
>
|
||||
Primeros pasos configurando Forgejo mediante Docker.
|
||||
Detalle de consumo de memoria RAM (spoiler: consume menos
|
||||
de 100MB en repositorios medianos) y facilidad de uso...
|
||||
</p>
|
||||
<span class="text-xs text-slate-400 mt-4 block"
|
||||
>Próximamente</span
|
||||
>
|
||||
</article>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -941,7 +1121,7 @@
|
||||
>
|
||||
<a
|
||||
class="bg-slate-900 dark:bg-slate-800 text-white px-10 py-5 rounded-2xl font-bold flex items-center justify-center gap-3 hover:bg-slate-800 dark:hover:bg-slate-700 transition-colors shadow-2xl"
|
||||
href="mailto:itziar.zameza@gmail.com"
|
||||
href="mailto:itziar.zameza.dev@gmail.com"
|
||||
>
|
||||
<span class="material-symbols-outlined">mail</span>
|
||||
Enviar un Email
|
||||
@@ -976,6 +1156,11 @@
|
||||
href="https://www.linkedin.com/in/itziarzamezagarcia"
|
||||
>LinkedIn</a
|
||||
>
|
||||
<a
|
||||
class="hover:text-primary transition-colors text-slate-600 dark:text-slate-400"
|
||||
href="privacidad.html"
|
||||
>Privacidad</a
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -0,0 +1,229 @@
|
||||
<!doctype html>
|
||||
<html lang="ca">
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<meta content="width=device-width, initial-scale=1.0" name="viewport" />
|
||||
<title>Política de Privacitat | Itziar ZG</title>
|
||||
<script src="https://cdn.tailwindcss.com?plugins=forms,container-queries"></script>
|
||||
<script id="tailwind-config">
|
||||
tailwind.config = {
|
||||
darkMode: "class",
|
||||
theme: {
|
||||
extend: {
|
||||
colors: {
|
||||
primary: "#8c2bee",
|
||||
"background-light": "#f7f6f8",
|
||||
"background-dark": "#191022",
|
||||
},
|
||||
fontFamily: {
|
||||
display: ["Space Grotesk", "sans-serif"],
|
||||
serif: ["Instrument Serif", "serif"],
|
||||
},
|
||||
borderRadius: {
|
||||
DEFAULT: "0.5rem",
|
||||
lg: "1rem",
|
||||
xl: "1.5rem",
|
||||
full: "9999px",
|
||||
},
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<link rel="alternate" hreflang="es" href="https://www.itziarzameza.dev/privacidad.html" />
|
||||
<link rel="alternate" hreflang="ca" href="https://www.itziarzameza.dev/privacidad-ca.html" />
|
||||
<link rel="alternate" hreflang="en" href="https://www.itziarzameza.dev/privacidad-en.html" />
|
||||
<link rel="preload" href="fonts/material-symbols-outlined.woff2" as="font" type="font/woff2" crossorigin />
|
||||
<link rel="preload" href="fonts/space/space-grotesk-v22-latin-regular.woff2" as="font" type="font/woff2" crossorigin />
|
||||
<link rel="stylesheet" href="css/styles.css?v=1.1" />
|
||||
<script
|
||||
defer
|
||||
src="https://stats.itziarzameza.dev/script.js"
|
||||
data-website-id="8d8d648f-4a0c-4315-b287-5983ffedc8c4"
|
||||
data-domains="www.itziarzameza.dev"
|
||||
></script>
|
||||
</head>
|
||||
<body class="bg-background-light dark:bg-background-dark font-display text-slate-900 dark:text-slate-100 selection:bg-primary/30 transition-colors duration-300">
|
||||
<div class="relative min-h-screen overflow-hidden iridescent-bg flex flex-col justify-between">
|
||||
<div class="absolute -top-24 -left-24 w-96 h-96 bg-primary/10 fluid-shape blur-3xl opacity-50 pointer-events-none"></div>
|
||||
<div class="absolute top-1/2 -right-24 w-80 h-80 bg-pink-300/10 fluid-shape blur-3xl opacity-40 pointer-events-none"></div>
|
||||
|
||||
<div class="layout-container flex h-full grow flex-col relative z-10">
|
||||
<header class="mx-auto w-full max-w-6xl px-6 py-6 flex items-center justify-between">
|
||||
<a href="index-ca.html" class="flex items-center gap-2 group cursor-pointer">
|
||||
<div class="size-10 bg-primary rounded-full flex items-center justify-center text-white shadow-lg shadow-primary/20">
|
||||
<span class="material-symbols-outlined text-2xl">auto_awesome</span>
|
||||
</div>
|
||||
<h2 class="text-xl font-bold tracking-tight font-serif italic text-slate-900 dark:text-white">Itziar ZG</h2>
|
||||
</a>
|
||||
<nav class="hidden md:flex items-center gap-10 glass px-8 py-3 rounded-full">
|
||||
<a class="text-sm font-medium hover:text-primary transition-colors text-slate-700 dark:text-slate-300" href="index-ca.html">Inici</a>
|
||||
<a class="text-sm font-medium hover:text-primary transition-colors text-slate-700 dark:text-slate-300" href="index-ca.html#manifiesto">Manifest</a>
|
||||
<a class="text-sm font-medium hover:text-primary transition-colors text-slate-700 dark:text-slate-300" href="index-ca.html#laboratori">Laboratori</a>
|
||||
<a class="text-sm font-medium hover:text-primary transition-colors text-slate-700 dark:text-slate-300" href="huella.html">Emprenta</a>
|
||||
<a class="text-sm font-medium hover:text-primary transition-colors text-slate-700 dark:text-slate-300" href="#contact">Contacte</a>
|
||||
</nav>
|
||||
<div class="flex items-center gap-3">
|
||||
<div class="flex items-center gap-1.5 glass px-3 py-1.5 rounded-full text-xs font-bold">
|
||||
<a href="privacidad.html" class="text-slate-600 dark:text-slate-400 hover:text-primary transition-colors" title="Castellano">ES</a>
|
||||
<span class="text-slate-300 dark:text-slate-700">|</span>
|
||||
<span class="text-primary">CA</span>
|
||||
<span class="text-slate-300 dark:text-slate-700">|</span>
|
||||
<a href="privacidad-en.html" class="text-slate-600 dark:text-slate-400 hover:text-primary transition-colors" title="English">EN</a>
|
||||
</div>
|
||||
<button class="size-10 flex items-center justify-center rounded-full glass hover:bg-white/60 dark:hover:bg-white/10 transition-colors" id="theme-toggle" onclick="toggleTheme()" aria-label="Toggle theme">
|
||||
<span class="material-symbols-outlined text-xl dark:hidden">dark_mode</span>
|
||||
<span class="material-symbols-outlined text-xl hidden dark:block text-yellow-200">light_mode</span>
|
||||
</button>
|
||||
<a class="bg-primary hover:bg-primary/90 text-white px-6 py-2.5 rounded-full text-sm font-bold transition-all shadow-md shadow-primary/25 flex items-center justify-center" href="index-ca.html#contact">
|
||||
Parlem
|
||||
</a>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<main class="mx-auto max-w-4xl px-6 py-12 md:py-20 grow">
|
||||
<div class="mb-8">
|
||||
<a href="index-ca.html" class="inline-flex items-center gap-2 text-sm text-slate-500 dark:text-slate-400 hover:text-primary transition-colors">
|
||||
<span class="material-symbols-outlined text-sm">arrow_back</span>
|
||||
Tornar a l'inici
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="mb-16">
|
||||
<h1 class="text-4xl md:text-6xl font-serif italic mb-6 text-slate-900 dark:text-white leading-tight">
|
||||
Política de<br />
|
||||
<span class="text-primary not-italic font-display font-black tracking-tighter">Privacitat</span>
|
||||
</h1>
|
||||
<p class="text-lg md:text-xl text-slate-600 dark:text-slate-400 leading-relaxed max-w-2xl">
|
||||
Com es recullen, emmagatzemen i utilitzen les dades en aquest lloc web, en compliment del Reglament General de Protecció de Dades (RGPD).
|
||||
</p>
|
||||
<p class="text-xs text-slate-500 dark:text-slate-500 mt-4 italic">
|
||||
Última actualització: 21 de Juliol, 2026
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<section class="space-y-8 mb-16">
|
||||
<article>
|
||||
<div class="border-l-4 border-primary pl-6 mb-4">
|
||||
<h2 class="text-2xl md:text-3xl font-serif italic dark:text-white">1. Responsable del tractament</h2>
|
||||
</div>
|
||||
<div class="p-6 glass rounded-2xl border border-white/10 space-y-2 text-slate-700 dark:text-slate-300 leading-relaxed">
|
||||
<p><strong>Identitat:</strong> Itziar Zameza García</p>
|
||||
<p><strong>Correu de contacte:</strong> <a href="mailto:itziar.zameza.dev@gmail.com" class="text-primary hover:underline">itziar.zameza.dev@gmail.com</a></p>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
<article>
|
||||
<div class="border-l-4 border-primary pl-6 mb-4">
|
||||
<h2 class="text-2xl md:text-3xl font-serif italic dark:text-white">2. Quines dades tractem?</h2>
|
||||
</div>
|
||||
<div class="p-6 glass rounded-2xl border border-white/10 space-y-3 text-slate-700 dark:text-slate-300 leading-relaxed">
|
||||
<p>Aquest lloc utilitza <strong>Umami</strong>, una eina d'analítica web de codi obert allotjada al meu propi servidor. Les dades que es recullen són:</p>
|
||||
<ul class="list-disc list-inside space-y-1 ml-4">
|
||||
<li>Pàgines visitades i temps de permanència</li>
|
||||
<li>Adreça IP (anonimitzada i truncada per Umami)</li>
|
||||
<li>Tipus de navegador i sistema operatiu (User-Agent)</li>
|
||||
<li>Lloc web de procedència (referrer)</li>
|
||||
<li>País d'origen (derivat de la IP, no a nivell de ciutat)</li>
|
||||
</ul>
|
||||
<p class="pt-2"><strong>No es recullen:</strong> dades identificatives personals (nom, correu, telèfon), ni es realitza fingerprinting, ni s'utilitzen cookies.</p>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
<article>
|
||||
<div class="border-l-4 border-primary pl-6 mb-4">
|
||||
<h2 class="text-2xl md:text-3xl font-serif italic dark:text-white">3. Finalitat</h2>
|
||||
</div>
|
||||
<div class="p-6 glass rounded-2xl border border-white/10 text-slate-700 dark:text-slate-300 leading-relaxed">
|
||||
<p>Les dades s'utilitzen exclusivament per analitzar de forma agregada l'ús del lloc web i orientar millores de contingut i rendiment. <strong>No s'elaboren perfils comercials</strong> i les dades no es cedeixen ni es venen a tercers.</p>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
<article>
|
||||
<div class="border-l-4 border-primary pl-6 mb-4">
|
||||
<h2 class="text-2xl md:text-3xl font-serif italic dark:text-white">4. Base jurídica</h2>
|
||||
</div>
|
||||
<div class="p-6 glass rounded-2xl border border-white/10 text-slate-700 dark:text-slate-300 leading-relaxed">
|
||||
<p>El tractament es basa en l'<strong>interès legítim</strong> de la responsable (article 6.1.f del RGPD): conèixer l'ús real del lloc per millorar-lo. En no utilitzar cookies ni identificadors persistents, no es requereix consentiment previ segons la normativa espanyola (LSSI-CE).</p>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
<article>
|
||||
<div class="border-l-4 border-primary pl-6 mb-4">
|
||||
<h2 class="text-2xl md:text-3xl font-serif italic dark:text-white">5. Destinataris i transferències</h2>
|
||||
</div>
|
||||
<div class="p-6 glass rounded-2xl border border-white/10 text-slate-700 dark:text-slate-300 leading-relaxed">
|
||||
<p>Les dades <strong>no es comuniquen a tercers</strong>. Tot el processament passa al servidor privat (VPS) de la responsable, ubicat a la Unió Europea. No es realitzen transferències internacionals.</p>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
<article>
|
||||
<div class="border-l-4 border-primary pl-6 mb-4">
|
||||
<h2 class="text-2xl md:text-3xl font-serif italic dark:text-white">6. Conservació</h2>
|
||||
</div>
|
||||
<div class="p-6 glass rounded-2xl border border-white/10 text-slate-700 dark:text-slate-300 leading-relaxed">
|
||||
<p>Les dades agregades es conserven durant un màxim de <strong>12 mesos</strong> i s'eliminen automàticament. No s'elaboren perfils d'usuari.</p>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
<article>
|
||||
<div class="border-l-4 border-primary pl-6 mb-4">
|
||||
<h2 class="text-2xl md:text-3xl font-serif italic dark:text-white">7. Els teus drets</h2>
|
||||
</div>
|
||||
<div class="p-6 glass rounded-2xl border border-white/10 space-y-3 text-slate-700 dark:text-slate-300 leading-relaxed">
|
||||
<p>Pots exercir en qualsevol moment els drets RGPD:</p>
|
||||
<ul class="list-disc list-inside space-y-1 ml-4">
|
||||
<li><strong>Accés</strong> — saber quines dades tinc teves</li>
|
||||
<li><strong>Rectificació</strong> — corregir dades inexactes</li>
|
||||
<li><strong>Supressió</strong> — sol·licitar l'eliminació</li>
|
||||
<li><strong>Oposició</strong> — oposar-te al tractament</li>
|
||||
<li><strong>Limitació</strong> — restringir el processament</li>
|
||||
<li><strong>Portabilitat</strong> — rebre les teves dades en format estàndard</li>
|
||||
</ul>
|
||||
<p>Per exercir-los, escriu a <a href="mailto:itziar.zameza.dev@gmail.com" class="text-primary hover:underline">itziar.zameza.dev@gmail.com</a>.</p>
|
||||
<p class="pt-2">També pots presentar una reclamació davant l'autoritat de control:</p>
|
||||
<ul class="list-disc list-inside space-y-1 ml-4">
|
||||
<li>Espanya — <a href="https://www.aepd.es" target="_blank" rel="noopener noreferrer" class="text-primary hover:underline">Agència Espanyola de Protecció de Dades (AEPD)</a></li>
|
||||
<li>Catalunya — <a href="https://apdcat.gencat.cat" target="_blank" rel="noopener noreferrer" class="text-primary hover:underline">Autoritat Catalana de Protecció de Dades (APDCAT)</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
<article>
|
||||
<div class="border-l-4 border-emerald-500 pl-6 mb-4">
|
||||
<h2 class="text-2xl md:text-3xl font-serif italic dark:text-white">8. Cookies</h2>
|
||||
</div>
|
||||
<div class="p-6 bg-emerald-500/10 border border-emerald-500/20 rounded-2xl text-slate-700 dark:text-slate-300 leading-relaxed flex items-start gap-3">
|
||||
<span class="material-symbols-outlined text-emerald-500 mt-1 shrink-0">verified</span>
|
||||
<p><strong>Aquest lloc web no utilitza cookies</strong> de cap mena (ni pròpies ni de tercers). El sistema d'analítica (Umami) és cookieless per disseny.</p>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
<article>
|
||||
<div class="border-l-4 border-primary pl-6 mb-4">
|
||||
<h2 class="text-2xl md:text-3xl font-serif italic dark:text-white">9. Canvis en aquesta política</h2>
|
||||
</div>
|
||||
<div class="p-6 glass rounded-2xl border border-white/10 text-slate-700 dark:text-slate-300 leading-relaxed">
|
||||
<p>Aquesta política pot actualitzar-se per reflectir canvis legals o tècnics. La data de l'última actualització s'indica a l'inici del document.</p>
|
||||
</div>
|
||||
</article>
|
||||
</section>
|
||||
</main>
|
||||
|
||||
<footer class="pb-12" id="contact">
|
||||
<div class="mx-auto max-w-6xl px-6">
|
||||
<div class="mt-16 flex flex-col md:flex-row justify-between items-center gap-6 text-slate-400 dark:text-slate-500 text-sm">
|
||||
<p>© 2026 Itziar ZG.</p>
|
||||
<div class="flex gap-8">
|
||||
<a class="hover:text-primary transition-colors text-slate-600 dark:text-slate-400" href="https://www.linkedin.com/in/itziarzamezagarcia">LinkedIn</a>
|
||||
<a class="hover:text-primary transition-colors text-slate-600 dark:text-slate-400" href="https://github.com/itziarZG">GitHub</a>
|
||||
<a class="hover:text-primary transition-colors text-slate-600 dark:text-slate-400" href="privacidad-ca.html">Privacitat</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script src="js/main.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,229 @@
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<meta content="width=device-width, initial-scale=1.0" name="viewport" />
|
||||
<title>Privacy Policy | Itziar ZG</title>
|
||||
<script src="https://cdn.tailwindcss.com?plugins=forms,container-queries"></script>
|
||||
<script id="tailwind-config">
|
||||
tailwind.config = {
|
||||
darkMode: "class",
|
||||
theme: {
|
||||
extend: {
|
||||
colors: {
|
||||
primary: "#8c2bee",
|
||||
"background-light": "#f7f6f8",
|
||||
"background-dark": "#191022",
|
||||
},
|
||||
fontFamily: {
|
||||
display: ["Space Grotesk", "sans-serif"],
|
||||
serif: ["Instrument Serif", "serif"],
|
||||
},
|
||||
borderRadius: {
|
||||
DEFAULT: "0.5rem",
|
||||
lg: "1rem",
|
||||
xl: "1.5rem",
|
||||
full: "9999px",
|
||||
},
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<link rel="alternate" hreflang="es" href="https://www.itziarzameza.dev/privacidad.html" />
|
||||
<link rel="alternate" hreflang="ca" href="https://www.itziarzameza.dev/privacidad-ca.html" />
|
||||
<link rel="alternate" hreflang="en" href="https://www.itziarzameza.dev/privacidad-en.html" />
|
||||
<link rel="preload" href="fonts/material-symbols-outlined.woff2" as="font" type="font/woff2" crossorigin />
|
||||
<link rel="preload" href="fonts/space/space-grotesk-v22-latin-regular.woff2" as="font" type="font/woff2" crossorigin />
|
||||
<link rel="stylesheet" href="css/styles.css?v=1.1" />
|
||||
<script
|
||||
defer
|
||||
src="https://stats.itziarzameza.dev/script.js"
|
||||
data-website-id="8d8d648f-4a0c-4315-b287-5983ffedc8c4"
|
||||
data-domains="www.itziarzameza.dev"
|
||||
></script>
|
||||
</head>
|
||||
<body class="bg-background-light dark:bg-background-dark font-display text-slate-900 dark:text-slate-100 selection:bg-primary/30 transition-colors duration-300">
|
||||
<div class="relative min-h-screen overflow-hidden iridescent-bg flex flex-col justify-between">
|
||||
<div class="absolute -top-24 -left-24 w-96 h-96 bg-primary/10 fluid-shape blur-3xl opacity-50 pointer-events-none"></div>
|
||||
<div class="absolute top-1/2 -right-24 w-80 h-80 bg-pink-300/10 fluid-shape blur-3xl opacity-40 pointer-events-none"></div>
|
||||
|
||||
<div class="layout-container flex h-full grow flex-col relative z-10">
|
||||
<header class="mx-auto w-full max-w-6xl px-6 py-6 flex items-center justify-between">
|
||||
<a href="index-en.html" class="flex items-center gap-2 group cursor-pointer">
|
||||
<div class="size-10 bg-primary rounded-full flex items-center justify-center text-white shadow-lg shadow-primary/20">
|
||||
<span class="material-symbols-outlined text-2xl">auto_awesome</span>
|
||||
</div>
|
||||
<h2 class="text-xl font-bold tracking-tight font-serif italic text-slate-900 dark:text-white">Itziar ZG</h2>
|
||||
</a>
|
||||
<nav class="hidden md:flex items-center gap-10 glass px-8 py-3 rounded-full">
|
||||
<a class="text-sm font-medium hover:text-primary transition-colors text-slate-700 dark:text-slate-300" href="index-en.html">Home</a>
|
||||
<a class="text-sm font-medium hover:text-primary transition-colors text-slate-700 dark:text-slate-300" href="index-en.html#manifiesto">Manifesto</a>
|
||||
<a class="text-sm font-medium hover:text-primary transition-colors text-slate-700 dark:text-slate-300" href="index-en.html#laboratorio">Lab</a>
|
||||
<a class="text-sm font-medium hover:text-primary transition-colors text-slate-700 dark:text-slate-300" href="huella.html">Footprint</a>
|
||||
<a class="text-sm font-medium hover:text-primary transition-colors text-slate-700 dark:text-slate-300" href="#contact">Contact</a>
|
||||
</nav>
|
||||
<div class="flex items-center gap-3">
|
||||
<div class="flex items-center gap-1.5 glass px-3 py-1.5 rounded-full text-xs font-bold">
|
||||
<a href="privacidad.html" class="text-slate-600 dark:text-slate-400 hover:text-primary transition-colors" title="Español">ES</a>
|
||||
<span class="text-slate-300 dark:text-slate-700">|</span>
|
||||
<a href="privacidad-ca.html" class="text-slate-600 dark:text-slate-400 hover:text-primary transition-colors" title="Català">CA</a>
|
||||
<span class="text-slate-300 dark:text-slate-700">|</span>
|
||||
<span class="text-primary">EN</span>
|
||||
</div>
|
||||
<button class="size-10 flex items-center justify-center rounded-full glass hover:bg-white/60 dark:hover:bg-white/10 transition-colors" id="theme-toggle" onclick="toggleTheme()" aria-label="Toggle theme">
|
||||
<span class="material-symbols-outlined text-xl dark:hidden">dark_mode</span>
|
||||
<span class="material-symbols-outlined text-xl hidden dark:block text-yellow-200">light_mode</span>
|
||||
</button>
|
||||
<a class="bg-primary hover:bg-primary/90 text-white px-6 py-2.5 rounded-full text-sm font-bold transition-all shadow-md shadow-primary/25 flex items-center justify-center" href="index-en.html#contact">
|
||||
Let's talk
|
||||
</a>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<main class="mx-auto max-w-4xl px-6 py-12 md:py-20 grow">
|
||||
<div class="mb-8">
|
||||
<a href="index-en.html" class="inline-flex items-center gap-2 text-sm text-slate-500 dark:text-slate-400 hover:text-primary transition-colors">
|
||||
<span class="material-symbols-outlined text-sm">arrow_back</span>
|
||||
Back to home
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="mb-16">
|
||||
<h1 class="text-4xl md:text-6xl font-serif italic mb-6 text-slate-900 dark:text-white leading-tight">
|
||||
Privacy<br />
|
||||
<span class="text-primary not-italic font-display font-black tracking-tighter">Policy</span>
|
||||
</h1>
|
||||
<p class="text-lg md:text-xl text-slate-600 dark:text-slate-400 leading-relaxed max-w-2xl">
|
||||
How data is collected, stored and used on this website, in compliance with the General Data Protection Regulation (GDPR).
|
||||
</p>
|
||||
<p class="text-xs text-slate-500 dark:text-slate-500 mt-4 italic">
|
||||
Last updated: July 21, 2026
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<section class="space-y-8 mb-16">
|
||||
<article>
|
||||
<div class="border-l-4 border-primary pl-6 mb-4">
|
||||
<h2 class="text-2xl md:text-3xl font-serif italic dark:text-white">1. Data Controller</h2>
|
||||
</div>
|
||||
<div class="p-6 glass rounded-2xl border border-white/10 space-y-2 text-slate-700 dark:text-slate-300 leading-relaxed">
|
||||
<p><strong>Identity:</strong> Itziar Zameza García</p>
|
||||
<p><strong>Contact email:</strong> <a href="mailto:itziar.zameza.dev@gmail.com" class="text-primary hover:underline">itziar.zameza.dev@gmail.com</a></p>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
<article>
|
||||
<div class="border-l-4 border-primary pl-6 mb-4">
|
||||
<h2 class="text-2xl md:text-3xl font-serif italic dark:text-white">2. What data do we process?</h2>
|
||||
</div>
|
||||
<div class="p-6 glass rounded-2xl border border-white/10 space-y-3 text-slate-700 dark:text-slate-300 leading-relaxed">
|
||||
<p>This site uses <strong>Umami</strong>, an open-source web analytics tool self-hosted on my own server. Data collected includes:</p>
|
||||
<ul class="list-disc list-inside space-y-1 ml-4">
|
||||
<li>Pages visited and time spent</li>
|
||||
<li>IP address (anonymized and truncated by Umami)</li>
|
||||
<li>Browser type and operating system (User-Agent)</li>
|
||||
<li>Referring website (referrer)</li>
|
||||
<li>Country of origin (derived from IP, not at city level)</li>
|
||||
</ul>
|
||||
<p class="pt-2"><strong>Not collected:</strong> personally identifying data (name, email, phone), no fingerprinting, no cookies of any kind.</p>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
<article>
|
||||
<div class="border-l-4 border-primary pl-6 mb-4">
|
||||
<h2 class="text-2xl md:text-3xl font-serif italic dark:text-white">3. Purpose</h2>
|
||||
</div>
|
||||
<div class="p-6 glass rounded-2xl border border-white/10 text-slate-700 dark:text-slate-300 leading-relaxed">
|
||||
<p>Data is used exclusively to analyze aggregate website usage and guide content and performance improvements. <strong>No commercial profiles are built</strong> and data is not shared with or sold to third parties.</p>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
<article>
|
||||
<div class="border-l-4 border-primary pl-6 mb-4">
|
||||
<h2 class="text-2xl md:text-3xl font-serif italic dark:text-white">4. Legal basis</h2>
|
||||
</div>
|
||||
<div class="p-6 glass rounded-2xl border border-white/10 text-slate-700 dark:text-slate-300 leading-relaxed">
|
||||
<p>Processing is based on the <strong>legitimate interest</strong> of the data controller (Article 6.1.f GDPR): understanding actual site usage to improve it. Since no cookies or persistent identifiers are used, prior consent is not required under Spanish law (LSSI-CE).</p>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
<article>
|
||||
<div class="border-l-4 border-primary pl-6 mb-4">
|
||||
<h2 class="text-2xl md:text-3xl font-serif italic dark:text-white">5. Recipients and transfers</h2>
|
||||
</div>
|
||||
<div class="p-6 glass rounded-2xl border border-white/10 text-slate-700 dark:text-slate-300 leading-relaxed">
|
||||
<p>Data is <strong>not shared with third parties</strong>. All processing occurs on the controller's private server (VPS), located in the European Union. No international transfers are performed.</p>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
<article>
|
||||
<div class="border-l-4 border-primary pl-6 mb-4">
|
||||
<h2 class="text-2xl md:text-3xl font-serif italic dark:text-white">6. Retention</h2>
|
||||
</div>
|
||||
<div class="p-6 glass rounded-2xl border border-white/10 text-slate-700 dark:text-slate-300 leading-relaxed">
|
||||
<p>Aggregated data is retained for a maximum of <strong>12 months</strong> and then automatically deleted. No user profiles are built.</p>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
<article>
|
||||
<div class="border-l-4 border-primary pl-6 mb-4">
|
||||
<h2 class="text-2xl md:text-3xl font-serif italic dark:text-white">7. Your rights</h2>
|
||||
</div>
|
||||
<div class="p-6 glass rounded-2xl border border-white/10 space-y-3 text-slate-700 dark:text-slate-300 leading-relaxed">
|
||||
<p>You can exercise your GDPR rights at any time:</p>
|
||||
<ul class="list-disc list-inside space-y-1 ml-4">
|
||||
<li><strong>Access</strong> — know what data I have about you</li>
|
||||
<li><strong>Rectification</strong> — correct inaccurate data</li>
|
||||
<li><strong>Erasure</strong> — request deletion</li>
|
||||
<li><strong>Objection</strong> — object to processing</li>
|
||||
<li><strong>Restriction</strong> — restrict processing</li>
|
||||
<li><strong>Portability</strong> — receive your data in a standard format</li>
|
||||
</ul>
|
||||
<p>To exercise them, write to <a href="mailto:itziar.zameza.dev@gmail.com" class="text-primary hover:underline">itziar.zameza.dev@gmail.com</a>.</p>
|
||||
<p class="pt-2">You may also lodge a complaint with the supervisory authority:</p>
|
||||
<ul class="list-disc list-inside space-y-1 ml-4">
|
||||
<li>Spain — <a href="https://www.aepd.es" target="_blank" rel="noopener noreferrer" class="text-primary hover:underline">Spanish Data Protection Agency (AEPD)</a></li>
|
||||
<li>Catalonia — <a href="https://apdcat.gencat.cat" target="_blank" rel="noopener noreferrer" class="text-primary hover:underline">Catalan Data Protection Authority (APDCAT)</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
<article>
|
||||
<div class="border-l-4 border-emerald-500 pl-6 mb-4">
|
||||
<h2 class="text-2xl md:text-3xl font-serif italic dark:text-white">8. Cookies</h2>
|
||||
</div>
|
||||
<div class="p-6 bg-emerald-500/10 border border-emerald-500/20 rounded-2xl text-slate-700 dark:text-slate-300 leading-relaxed flex items-start gap-3">
|
||||
<span class="material-symbols-outlined text-emerald-500 mt-1 shrink-0">verified</span>
|
||||
<p><strong>This website does not use any cookies</strong> (neither first-party nor third-party). The analytics system (Umami) is cookieless by design.</p>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
<article>
|
||||
<div class="border-l-4 border-primary pl-6 mb-4">
|
||||
<h2 class="text-2xl md:text-3xl font-serif italic dark:text-white">9. Changes to this policy</h2>
|
||||
</div>
|
||||
<div class="p-6 glass rounded-2xl border border-white/10 text-slate-700 dark:text-slate-300 leading-relaxed">
|
||||
<p>This policy may be updated to reflect legal or technical changes. The date of the last update is shown at the top of the document.</p>
|
||||
</div>
|
||||
</article>
|
||||
</section>
|
||||
</main>
|
||||
|
||||
<footer class="pb-12" id="contact">
|
||||
<div class="mx-auto max-w-6xl px-6">
|
||||
<div class="mt-16 flex flex-col md:flex-row justify-between items-center gap-6 text-slate-400 dark:text-slate-500 text-sm">
|
||||
<p>© 2026 Itziar ZG.</p>
|
||||
<div class="flex gap-8">
|
||||
<a class="hover:text-primary transition-colors text-slate-600 dark:text-slate-400" href="https://www.linkedin.com/in/itziarzamezagarcia">LinkedIn</a>
|
||||
<a class="hover:text-primary transition-colors text-slate-600 dark:text-slate-400" href="https://github.com/itziarZG">GitHub</a>
|
||||
<a class="hover:text-primary transition-colors text-slate-600 dark:text-slate-400" href="privacidad-en.html">Privacy</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script src="js/main.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
+229
@@ -0,0 +1,229 @@
|
||||
<!doctype html>
|
||||
<html lang="es">
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<meta content="width=device-width, initial-scale=1.0" name="viewport" />
|
||||
<title>Política de Privacidad | Itziar ZG</title>
|
||||
<script src="https://cdn.tailwindcss.com?plugins=forms,container-queries"></script>
|
||||
<script id="tailwind-config">
|
||||
tailwind.config = {
|
||||
darkMode: "class",
|
||||
theme: {
|
||||
extend: {
|
||||
colors: {
|
||||
primary: "#8c2bee",
|
||||
"background-light": "#f7f6f8",
|
||||
"background-dark": "#191022",
|
||||
},
|
||||
fontFamily: {
|
||||
display: ["Space Grotesk", "sans-serif"],
|
||||
serif: ["Instrument Serif", "serif"],
|
||||
},
|
||||
borderRadius: {
|
||||
DEFAULT: "0.5rem",
|
||||
lg: "1rem",
|
||||
xl: "1.5rem",
|
||||
full: "9999px",
|
||||
},
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<link rel="alternate" hreflang="es" href="https://www.itziarzameza.dev/privacidad.html" />
|
||||
<link rel="alternate" hreflang="ca" href="https://www.itziarzameza.dev/privacidad-ca.html" />
|
||||
<link rel="alternate" hreflang="en" href="https://www.itziarzameza.dev/privacidad-en.html" />
|
||||
<link rel="preload" href="fonts/material-symbols-outlined.woff2" as="font" type="font/woff2" crossorigin />
|
||||
<link rel="preload" href="fonts/space/space-grotesk-v22-latin-regular.woff2" as="font" type="font/woff2" crossorigin />
|
||||
<link rel="stylesheet" href="css/styles.css?v=1.1" />
|
||||
<script
|
||||
defer
|
||||
src="https://stats.itziarzameza.dev/script.js"
|
||||
data-website-id="8d8d648f-4a0c-4315-b287-5983ffedc8c4"
|
||||
data-domains="www.itziarzameza.dev"
|
||||
></script>
|
||||
</head>
|
||||
<body class="bg-background-light dark:bg-background-dark font-display text-slate-900 dark:text-slate-100 selection:bg-primary/30 transition-colors duration-300">
|
||||
<div class="relative min-h-screen overflow-hidden iridescent-bg flex flex-col justify-between">
|
||||
<div class="absolute -top-24 -left-24 w-96 h-96 bg-primary/10 fluid-shape blur-3xl opacity-50 pointer-events-none"></div>
|
||||
<div class="absolute top-1/2 -right-24 w-80 h-80 bg-pink-300/10 fluid-shape blur-3xl opacity-40 pointer-events-none"></div>
|
||||
|
||||
<div class="layout-container flex h-full grow flex-col relative z-10">
|
||||
<header class="mx-auto w-full max-w-6xl px-6 py-6 flex items-center justify-between">
|
||||
<a href="index.html" class="flex items-center gap-2 group cursor-pointer">
|
||||
<div class="size-10 bg-primary rounded-full flex items-center justify-center text-white shadow-lg shadow-primary/20">
|
||||
<span class="material-symbols-outlined text-2xl">auto_awesome</span>
|
||||
</div>
|
||||
<h2 class="text-xl font-bold tracking-tight font-serif italic text-slate-900 dark:text-white">Itziar ZG</h2>
|
||||
</a>
|
||||
<nav class="hidden md:flex items-center gap-10 glass px-8 py-3 rounded-full">
|
||||
<a class="text-sm font-medium hover:text-primary transition-colors text-slate-700 dark:text-slate-300" href="index.html">Inicio</a>
|
||||
<a class="text-sm font-medium hover:text-primary transition-colors text-slate-700 dark:text-slate-300" href="index.html#manifiesto">Manifiesto</a>
|
||||
<a class="text-sm font-medium hover:text-primary transition-colors text-slate-700 dark:text-slate-300" href="index.html#laboratorio">Laboratorio</a>
|
||||
<a class="text-sm font-medium hover:text-primary transition-colors text-slate-700 dark:text-slate-300" href="huella.html">Huella</a>
|
||||
<a class="text-sm font-medium hover:text-primary transition-colors text-slate-700 dark:text-slate-300" href="#contact">Contacto</a>
|
||||
</nav>
|
||||
<div class="flex items-center gap-3">
|
||||
<div class="flex items-center gap-1.5 glass px-3 py-1.5 rounded-full text-xs font-bold">
|
||||
<span class="text-primary">ES</span>
|
||||
<span class="text-slate-300 dark:text-slate-700">|</span>
|
||||
<a href="privacidad-ca.html" class="text-slate-600 dark:text-slate-400 hover:text-primary transition-colors" title="Català">CA</a>
|
||||
<span class="text-slate-300 dark:text-slate-700">|</span>
|
||||
<a href="privacidad-en.html" class="text-slate-600 dark:text-slate-400 hover:text-primary transition-colors" title="English">EN</a>
|
||||
</div>
|
||||
<button class="size-10 flex items-center justify-center rounded-full glass hover:bg-white/60 dark:hover:bg-white/10 transition-colors" id="theme-toggle" onclick="toggleTheme()" aria-label="Toggle theme">
|
||||
<span class="material-symbols-outlined text-xl dark:hidden">dark_mode</span>
|
||||
<span class="material-symbols-outlined text-xl hidden dark:block text-yellow-200">light_mode</span>
|
||||
</button>
|
||||
<a class="bg-primary hover:bg-primary/90 text-white px-6 py-2.5 rounded-full text-sm font-bold transition-all shadow-md shadow-primary/25 flex items-center justify-center" href="index.html#contact">
|
||||
Hablemos
|
||||
</a>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<main class="mx-auto max-w-4xl px-6 py-12 md:py-20 grow">
|
||||
<div class="mb-8">
|
||||
<a href="index.html" class="inline-flex items-center gap-2 text-sm text-slate-500 dark:text-slate-400 hover:text-primary transition-colors">
|
||||
<span class="material-symbols-outlined text-sm">arrow_back</span>
|
||||
Volver al inicio
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="mb-16">
|
||||
<h1 class="text-4xl md:text-6xl font-serif italic mb-6 text-slate-900 dark:text-white leading-tight">
|
||||
Política de<br />
|
||||
<span class="text-primary not-italic font-display font-black tracking-tighter">Privacidad</span>
|
||||
</h1>
|
||||
<p class="text-lg md:text-xl text-slate-600 dark:text-slate-400 leading-relaxed max-w-2xl">
|
||||
Cómo se recogen, almacenan y utilizan los datos en este sitio web, en cumplimiento del Reglamento General de Protección de Datos (RGPD).
|
||||
</p>
|
||||
<p class="text-xs text-slate-500 dark:text-slate-500 mt-4 italic">
|
||||
Última actualización: 21 de Julio, 2026
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<section class="space-y-8 mb-16">
|
||||
<article>
|
||||
<div class="border-l-4 border-primary pl-6 mb-4">
|
||||
<h2 class="text-2xl md:text-3xl font-serif italic dark:text-white">1. Responsable del tratamiento</h2>
|
||||
</div>
|
||||
<div class="p-6 glass rounded-2xl border border-white/10 space-y-2 text-slate-700 dark:text-slate-300 leading-relaxed">
|
||||
<p><strong>Identidad:</strong> Itziar Zameza García</p>
|
||||
<p><strong>Correo de contacto:</strong> <a href="mailto:itziar.zameza.dev@gmail.com" class="text-primary hover:underline">itziar.zameza.dev@gmail.com</a></p>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
<article>
|
||||
<div class="border-l-4 border-primary pl-6 mb-4">
|
||||
<h2 class="text-2xl md:text-3xl font-serif italic dark:text-white">2. ¿Qué datos tratamos?</h2>
|
||||
</div>
|
||||
<div class="p-6 glass rounded-2xl border border-white/10 space-y-3 text-slate-700 dark:text-slate-300 leading-relaxed">
|
||||
<p>Este sitio utiliza <strong>Umami</strong>, una herramienta de analítica web de código abierto autoalojada en mi propio servidor. Los datos que se recogen son:</p>
|
||||
<ul class="list-disc list-inside space-y-1 ml-4">
|
||||
<li>Páginas visitadas y tiempo de permanencia</li>
|
||||
<li>Dirección IP (anonimizada y truncada por Umami)</li>
|
||||
<li>Tipo de navegador y sistema operativo (User-Agent)</li>
|
||||
<li>Sitio web de procedencia (referrer)</li>
|
||||
<li>País de origen (derivado de la IP, no a nivel de ciudad)</li>
|
||||
</ul>
|
||||
<p class="pt-2"><strong>No se recogen:</strong> datos identificativos personales (nombre, email, teléfono), ni se realiza fingerprinting, ni se utilizan cookies.</p>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
<article>
|
||||
<div class="border-l-4 border-primary pl-6 mb-4">
|
||||
<h2 class="text-2xl md:text-3xl font-serif italic dark:text-white">3. Finalidad</h2>
|
||||
</div>
|
||||
<div class="p-6 glass rounded-2xl border border-white/10 text-slate-700 dark:text-slate-300 leading-relaxed">
|
||||
<p>Los datos se utilizan exclusivamente para analizar de forma agregada el uso del sitio web y orientar mejoras de contenido y rendimiento. <strong>No se elaboran perfiles comerciales</strong> y los datos no se ceden ni venden a terceros.</p>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
<article>
|
||||
<div class="border-l-4 border-primary pl-6 mb-4">
|
||||
<h2 class="text-2xl md:text-3xl font-serif italic dark:text-white">4. Base jurídica</h2>
|
||||
</div>
|
||||
<div class="p-6 glass rounded-2xl border border-white/10 text-slate-700 dark:text-slate-300 leading-relaxed">
|
||||
<p>El tratamiento se basa en el <strong>interés legítimo</strong> del responsable (artículo 6.1.f del RGPD): conocer el uso real del sitio para mejorarlo. Al no utilizar cookies ni identificadores persistentes, no se requiere consentimiento previo según la normativa española (LSSI-CE).</p>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
<article>
|
||||
<div class="border-l-4 border-primary pl-6 mb-4">
|
||||
<h2 class="text-2xl md:text-3xl font-serif italic dark:text-white">5. Destinatarios y transferencias</h2>
|
||||
</div>
|
||||
<div class="p-6 glass rounded-2xl border border-white/10 text-slate-700 dark:text-slate-300 leading-relaxed">
|
||||
<p>Los datos <strong>no se comunican a terceros</strong>. Todo el procesamiento ocurre en el servidor privado (VPS) de la responsable, ubicado en la Unión Europea. No se realizan transferencias internacionales.</p>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
<article>
|
||||
<div class="border-l-4 border-primary pl-6 mb-4">
|
||||
<h2 class="text-2xl md:text-3xl font-serif italic dark:text-white">6. Conservación</h2>
|
||||
</div>
|
||||
<div class="p-6 glass rounded-2xl border border-white/10 text-slate-700 dark:text-slate-300 leading-relaxed">
|
||||
<p>Los datos agregados se conservan durante un máximo de <strong>12 meses</strong> y se eliminan automáticamente. No se elaboran perfiles de usuario.</p>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
<article>
|
||||
<div class="border-l-4 border-primary pl-6 mb-4">
|
||||
<h2 class="text-2xl md:text-3xl font-serif italic dark:text-white">7. Tus derechos</h2>
|
||||
</div>
|
||||
<div class="p-6 glass rounded-2xl border border-white/10 space-y-3 text-slate-700 dark:text-slate-300 leading-relaxed">
|
||||
<p>Puedes ejercer en cualquier momento los derechos RGPD:</p>
|
||||
<ul class="list-disc list-inside space-y-1 ml-4">
|
||||
<li><strong>Acceso</strong> — saber qué datos tengo tuyos</li>
|
||||
<li><strong>Rectificación</strong> — corregir datos inexactos</li>
|
||||
<li><strong>Supresión</strong> — solicitar eliminación</li>
|
||||
<li><strong>Oposición</strong> — oponerte al tratamiento</li>
|
||||
<li><strong>Limitación</strong> — restringir el procesamiento</li>
|
||||
<li><strong>Portabilidad</strong> — recibir tus datos en formato estándar</li>
|
||||
</ul>
|
||||
<p>Para ejercerlos, escribe a <a href="mailto:itziar.zameza.dev@gmail.com" class="text-primary hover:underline">itziar.zameza.dev@gmail.com</a>.</p>
|
||||
<p class="pt-2">También puedes presentar una reclamación ante la autoridad de control:</p>
|
||||
<ul class="list-disc list-inside space-y-1 ml-4">
|
||||
<li>España — <a href="https://www.aepd.es" target="_blank" rel="noopener noreferrer" class="text-primary hover:underline">Agencia Española de Protección de Datos (AEPD)</a></li>
|
||||
<li>Cataluña — <a href="https://apdcat.gencat.cat" target="_blank" rel="noopener noreferrer" class="text-primary hover:underline">Autoritat Catalana de Protecció de Dades (APDCAT)</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
<article>
|
||||
<div class="border-l-4 border-emerald-500 pl-6 mb-4">
|
||||
<h2 class="text-2xl md:text-3xl font-serif italic dark:text-white">8. Cookies</h2>
|
||||
</div>
|
||||
<div class="p-6 bg-emerald-500/10 border border-emerald-500/20 rounded-2xl text-slate-700 dark:text-slate-300 leading-relaxed flex items-start gap-3">
|
||||
<span class="material-symbols-outlined text-emerald-500 mt-1 shrink-0">verified</span>
|
||||
<p><strong>Este sitio web no utiliza cookies</strong> de ningún tipo (ni propias ni de terceros). El sistema de analítica (Umami) es cookieless por diseño.</p>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
<article>
|
||||
<div class="border-l-4 border-primary pl-6 mb-4">
|
||||
<h2 class="text-2xl md:text-3xl font-serif italic dark:text-white">9. Cambios en esta política</h2>
|
||||
</div>
|
||||
<div class="p-6 glass rounded-2xl border border-white/10 text-slate-700 dark:text-slate-300 leading-relaxed">
|
||||
<p>Esta política puede actualizarse para reflejar cambios legales o técnicos. La fecha de la última actualización se indica al inicio del documento.</p>
|
||||
</div>
|
||||
</article>
|
||||
</section>
|
||||
</main>
|
||||
|
||||
<footer class="pb-12" id="contact">
|
||||
<div class="mx-auto max-w-6xl px-6">
|
||||
<div class="mt-16 flex flex-col md:flex-row justify-between items-center gap-6 text-slate-400 dark:text-slate-500 text-sm">
|
||||
<p>© 2026 Itziar ZG.</p>
|
||||
<div class="flex gap-8">
|
||||
<a class="hover:text-primary transition-colors text-slate-600 dark:text-slate-400" href="https://www.linkedin.com/in/itziarzamezagarcia">LinkedIn</a>
|
||||
<a class="hover:text-primary transition-colors text-slate-600 dark:text-slate-400" href="https://github.com/itziarZG">GitHub</a>
|
||||
<a class="hover:text-primary transition-colors text-slate-600 dark:text-slate-400" href="privacidad.html">Privacidad</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script src="js/main.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user