/* Tira de islas — portada de la sección #islands del diseño. */
.dpm-islands{position:relative;overflow:hidden;padding:clamp(52px,7vw,96px) clamp(20px,4vw,40px)}
.dpm-islands--dark{background:var(--wp--preset--color--primary);color:var(--wp--preset--color--white)}
.dpm-islands--light{background:var(--wp--preset--color--surface);color:var(--wp--preset--color--text-strong)}

.dpm-islands__inner{position:relative;z-index:2;max-width:1240px;margin:0 auto;display:flex;flex-direction:column;gap:clamp(28px,3.4vw,44px)}
.dpm-islands__intro{display:flex;flex-direction:column;gap:12px}

.dpm-islands__eyebrow{margin:0;font-size:var(--wp--preset--font-size--eyebrow);font-weight:500;letter-spacing:.14em;text-transform:uppercase}
.dpm-islands--dark .dpm-islands__eyebrow{color:rgba(255,255,255,.72)}
.dpm-islands--light .dpm-islands__eyebrow{color:var(--wp--preset--color--primary)}

.dpm-islands__heading{margin:0;font-size:var(--wp--preset--font-size--h-2);line-height:1.2;letter-spacing:-.01em}
.dpm-islands--dark .dpm-islands__heading{color:var(--wp--preset--color--white)}
.dpm-islands--light .dpm-islands__heading{color:var(--wp--preset--color--text-strong)}

.dpm-islands__list{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin:0;padding:0;list-style:none}
.dpm-islands__cell{margin:0;padding:0;list-style:none}

.dpm-islands__item{display:flex;flex-direction:column;align-items:center;gap:12px;height:100%;padding:18px 10px;border-radius:var(--wp--custom--radius--lg);text-align:center;text-decoration:none;transition:background-color .2s}
.dpm-islands--dark .dpm-islands__item{color:var(--wp--preset--color--white)}
.dpm-islands--dark .dpm-islands__item:hover,.dpm-islands--dark .dpm-islands__item:focus-visible{background:rgba(255,255,255,.12);color:var(--wp--preset--color--white)}
.dpm-islands--light .dpm-islands__item{color:var(--wp--preset--color--primary)}
.dpm-islands--light .dpm-islands__item:hover,.dpm-islands--light .dpm-islands__item:focus-visible{background:var(--wp--preset--color--white);color:var(--wp--preset--color--primary)}

.dpm-islands__item svg{flex:0 0 auto;width:64px;height:64px;transition:transform .3s cubic-bezier(.2,.8,.3,1)}
.dpm-islands__item:hover svg,.dpm-islands__item:focus-visible svg{transform:translateY(-3px) scale(1.04)}

.dpm-islands__label{display:flex;flex-direction:column;align-items:center;gap:2px}
.dpm-islands__name{font-size:var(--wp--preset--font-size--body);font-weight:600;line-height:1.25;letter-spacing:-.01em}
.dpm-islands__country{font-size:var(--wp--preset--font-size--small);font-weight:400;letter-spacing:.08em;text-transform:uppercase}
.dpm-islands--dark .dpm-islands__country{color:rgba(255,255,255,.7)}
.dpm-islands--light .dpm-islands__country{color:var(--wp--preset--color--text-muted)}

/* Por debajo de 1200px la tira se recorre en horizontal con snap. */
@media (max-width:1199px){
	/* 118px + 8px de hueco: en 360px (Moto G4) se ven 2,5 islas y se intuye el scroll. */
	.dpm-islands__list{display:flex;flex-wrap:nowrap;gap:8px;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:thin;padding-bottom:10px;margin-inline:calc(-1 * clamp(20px,4vw,40px));padding-inline:clamp(20px,4vw,40px)}
	.dpm-islands__cell{flex:0 0 118px;width:118px;min-width:0;scroll-snap-align:center}
	.dpm-islands__item{min-width:0;width:100%;padding:16px 6px}
	.dpm-islands__name{font-size:15px;line-height:1.2}
}

@media (prefers-reduced-motion:reduce){
	.dpm-islands__item,.dpm-islands__item svg{transition:none}
	.dpm-islands__item:hover svg,.dpm-islands__item:focus-visible svg{transform:none}
}

/* Variante hero (portada): la tira va dentro del cover, sobre el vídeo, sin fondo ni padding. */
.dpm-islands--hero{background:transparent;color:var(--wp--preset--color--white);padding:0;overflow:visible}
.dpm-islands--hero .dpm-islands__inner{max-width:none;gap:16px}
.dpm-islands--hero .dpm-islands__eyebrow{font-size:14px;color:rgba(255,255,255,.72)}
.dpm-islands--hero .dpm-islands__heading{color:var(--wp--preset--color--white)}
.dpm-islands--hero .dpm-islands__item{color:var(--wp--preset--color--white);border-radius:20px}
.dpm-islands--hero .dpm-islands__item:hover,.dpm-islands--hero .dpm-islands__item:focus-visible{background:rgba(255,255,255,.1);color:var(--wp--preset--color--white)}
.dpm-islands--hero .dpm-islands__item svg{width:74px;height:74px}
.dpm-islands--hero .dpm-islands__name{font-size:clamp(17px,1.5vw,20px)}
.dpm-islands--hero .dpm-islands__country{font-size:13px;color:rgba(255,255,255,.7)}
@media (max-width:1199px){
	.dpm-islands--hero .dpm-islands__list{gap:8px;margin-inline:-20px;padding-inline:20px;padding-bottom:6px;scrollbar-width:none}
}
